Reword the BugReportDialog.js as per @lampholder

See https://github.com/matrix-org/matrix-react-sdk/pull/1740#issuecomment-369597662
This commit is contained in:
Luke Barnard 2018-03-20 10:52:50 +00:00
parent 8853496b1b
commit 324774ec2f
3 changed files with 110 additions and 42 deletions

View file

@ -27,6 +27,7 @@ export default class BugReportDialog extends React.Component {
sendLogs: true,
busy: false,
err: null,
issueUrl: "",
text: "",
progress: null,
};
@ -34,6 +35,7 @@ export default class BugReportDialog extends React.Component {
this._onSubmit = this._onSubmit.bind(this);
this._onCancel = this._onCancel.bind(this);
this._onTextChange = this._onTextChange.bind(this);
this._onIssueUrlChange = this._onIssueUrlChange.bind(this);
this._onSendLogsChange = this._onSendLogsChange.bind(this);
this._sendProgressCallback = this._sendProgressCallback.bind(this);
}
@ -47,28 +49,24 @@ export default class BugReportDialog extends React.Component {
}
_onSubmit(ev) {
const sendLogs = this.state.sendLogs;
const userText = this.state.text;
if (!sendLogs && userText.trim().length === 0) {
this.setState({
err: _t("Please describe the bug and/or send logs."),
});
return;
}
const userText =
(this.state.text.length > 0 ? this.state.text + '\n\n': '') + 'Issue: ' +
(this.state.issueUrl.length > 0 ? this.state.issueUrl : 'No issue link given');
this.setState({ busy: true, progress: null, err: null });
this._sendProgressCallback(_t("Loading bug report module"));
this._sendProgressCallback(_t("Preparing to send logs"));
require(['../../../vector/submit-rageshake'], (s) => {
s(SdkConfig.get().bug_report_endpoint_url, {
userText: userText,
sendLogs: sendLogs,
userText,
sendLogs: true,
progressCallback: this._sendProgressCallback,
}).then(() => {
if (!this._unmounted) {
this.props.onFinished(false);
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
Modal.createTrackedDialog('Bug report sent', '', QuestionDialog, {
title: _t('Bug report sent'),
title: _t('Logs sent'),
description: _t('Thank you!'),
hasCancelButton: false,
});
@ -78,7 +76,7 @@ export default class BugReportDialog extends React.Component {
this.setState({
busy: false,
progress: null,
err: _t("Failed to send report: ") + `${err.message}`,
err: _t("Failed to send logs: ") + `${err.message}`,
});
}
});
@ -89,7 +87,11 @@ export default class BugReportDialog extends React.Component {
this.setState({ text: ev.target.value });
}
_onSendLogsChange(ev) {
_onIssueUrlChange(ev) {
this.setState({ issueUrl: ev.target.value });
}
_onSendLogsChange(ev) {
this.setState({ sendLogs: ev.target.checked });
}
@ -130,27 +132,61 @@ export default class BugReportDialog extends React.Component {
return (
<div className="mx_BugReportDialog">
<div className="mx_Dialog_title">
{ _t("Report a bug") }
{ _t("Submit debug logs") }
</div>
<div className="mx_Dialog_content">
<p>
{ _t("Please describe the bug. What did you do? What did you expect to happen? What actually happened?") }
{ _t(
"Debug logs contain application usage data including your " +
"username, the IDs or aliases of the rooms or groups you " +
"have visited and the usernames of other users. They do " +
"not contain messages.",
) }
</p>
<textarea
className="mx_BugReportDialog_input"
rows={5}
onChange={this._onTextChange}
value={this.state.text}
placeholder={_t("Describe your problem here.")}
/>
<p>
{ _t("In order to diagnose problems, logs from this client will be sent with this bug report. If you would prefer to only send the text above, please untick:") }
{ _t(
"<a>Click here</a> to create a GitHub issue.",
{},
{
a: (sub) => <a
target="_blank"
href="https://github.com/vector-im/riot-web/issues/new"
>
{ sub }
</a>,
},
) }
</p>
<input type="checkbox" checked={this.state.sendLogs}
onChange={this._onSendLogsChange} id="mx_BugReportDialog_logs"/>
<label htmlFor="mx_BugReportDialog_logs">
{ _t("Send logs") }
</label>
<div className="mx_BugReportDialog_field_container">
<label
htmlFor="mx_BugReportDialog_issueUrl"
className="mx_BugReportDialog_field_label"
>
{ _t("GitHub issue link:") }
</label>
<input
id="mx_BugReportDialog_issueUrl"
type="text"
className="mx_BugReportDialog_field_input"
onChange={this._onIssueUrlChange}
value={this.state.issueUrl}
placeholder="https://github.com/vector-im/riot-web/issues/1337"
/>
</div>
<div className="mx_BugReportDialog_field_container">
<label
htmlFor="mx_BugReportDialog_notes_label"
className="mx_BugReportDialog_field_label"
>
{ _t("Notes:") }
</label>
<textarea
className="mx_BugReportDialog_field_input"
rows={5}
onChange={this._onTextChange}
value={this.state.text}
/>
</div>
{progress}
{error}
</div>
@ -161,7 +197,7 @@ export default class BugReportDialog extends React.Component {
autoFocus={true}
disabled={this.state.busy}
>
{ _t("Send") }
{ _t("Send logs") }
</button>
{cancelButton}