Convert SetEmailDialog to TS

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
pull/21833/head
Šimon Brandner 2021-09-05 12:42:18 +02:00
parent 02f672570a
commit 5bf64c2075
No known key found for this signature in database
GPG Key ID: 55C211A1226CB17D
1 changed files with 34 additions and 28 deletions

View File

@ -16,13 +16,26 @@ limitations under the License.
*/ */
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types';
import * as sdk from '../../../index';
import * as Email from '../../../email'; import * as Email from '../../../email';
import AddThreepid from '../../../AddThreepid'; import AddThreepid from '../../../AddThreepid';
import { _t } from '../../../languageHandler'; import { _t } from '../../../languageHandler';
import Modal from '../../../Modal'; import Modal from '../../../Modal';
import { replaceableComponent } from "../../../utils/replaceableComponent"; import { replaceableComponent } from "../../../utils/replaceableComponent";
import Spinner from "../elements/Spinner";
import ErrorDialog from "./ErrorDialog";
import QuestionDialog from "./QuestionDialog";
import BaseDialog from "./BaseDialog";
import EditableText from "../elements/EditableText";
interface IProps {
title: string;
onFinished: (confirmed: boolean) => void;
}
interface IState {
emailAddress: string;
emailBusy: boolean;
}
/* /*
* Prompt the user to set an email address. * Prompt the user to set an email address.
@ -30,26 +43,25 @@ import { replaceableComponent } from "../../../utils/replaceableComponent";
* On success, `onFinished(true)` is called. * On success, `onFinished(true)` is called.
*/ */
@replaceableComponent("views.dialogs.SetEmailDialog") @replaceableComponent("views.dialogs.SetEmailDialog")
export default class SetEmailDialog extends React.Component { export default class SetEmailDialog extends React.Component<IProps, IState> {
static propTypes = { private addThreepid: AddThreepid;
onFinished: PropTypes.func.isRequired,
};
state = { constructor(props: IProps) {
super(props);
this.state = {
emailAddress: '', emailAddress: '',
emailBusy: false, emailBusy: false,
}; };
}
onEmailAddressChanged = value => { private onEmailAddressChanged = (value: string): void => {
this.setState({ this.setState({
emailAddress: value, emailAddress: value,
}); });
}; };
onSubmit = () => { private onSubmit = (): void => {
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
const emailAddress = this.state.emailAddress; const emailAddress = this.state.emailAddress;
if (!Email.looksValid(emailAddress)) { if (!Email.looksValid(emailAddress)) {
Modal.createTrackedDialog('Invalid Email Address', '', ErrorDialog, { Modal.createTrackedDialog('Invalid Email Address', '', ErrorDialog, {
@ -58,8 +70,8 @@ export default class SetEmailDialog extends React.Component {
}); });
return; return;
} }
this._addThreepid = new AddThreepid(); this.addThreepid = new AddThreepid();
this._addThreepid.addEmailAddress(emailAddress).then(() => { this.addThreepid.addEmailAddress(emailAddress).then(() => {
Modal.createTrackedDialog('Verification Pending', '', QuestionDialog, { Modal.createTrackedDialog('Verification Pending', '', QuestionDialog, {
title: _t("Verification Pending"), title: _t("Verification Pending"),
description: _t( description: _t(
@ -80,11 +92,11 @@ export default class SetEmailDialog extends React.Component {
this.setState({ emailBusy: true }); this.setState({ emailBusy: true });
}; };
onCancelled = () => { private onCancelled = (): void => {
this.props.onFinished(false); this.props.onFinished(false);
}; };
onEmailDialogFinished = ok => { private onEmailDialogFinished = (ok: boolean): void => {
if (ok) { if (ok) {
this.verifyEmailAddress(); this.verifyEmailAddress();
} else { } else {
@ -92,13 +104,12 @@ export default class SetEmailDialog extends React.Component {
} }
}; };
verifyEmailAddress() { private verifyEmailAddress(): void {
this._addThreepid.checkEmailLinkClicked().then(() => { this.addThreepid.checkEmailLinkClicked().then(() => {
this.props.onFinished(true); this.props.onFinished(true);
}, (err) => { }, (err) => {
this.setState({ emailBusy: false }); this.setState({ emailBusy: false });
if (err.errcode == 'M_THREEPID_AUTH_FAILED') { if (err.errcode == 'M_THREEPID_AUTH_FAILED') {
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
const message = _t("Unable to verify email address.") + " " + const message = _t("Unable to verify email address.") + " " +
_t("Please check your email and click on the link it contains. Once this is done, click continue."); _t("Please check your email and click on the link it contains. Once this is done, click continue.");
Modal.createTrackedDialog('Verification Pending', '3pid Auth Failed', QuestionDialog, { Modal.createTrackedDialog('Verification Pending', '3pid Auth Failed', QuestionDialog, {
@ -108,7 +119,6 @@ export default class SetEmailDialog extends React.Component {
onFinished: this.onEmailDialogFinished, onFinished: this.onEmailDialogFinished,
}); });
} else { } else {
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
console.error("Unable to verify email address: " + err); console.error("Unable to verify email address: " + err);
Modal.createTrackedDialog('Unable to verify email address', '', ErrorDialog, { Modal.createTrackedDialog('Unable to verify email address', '', ErrorDialog, {
title: _t("Unable to verify email address."), title: _t("Unable to verify email address."),
@ -118,11 +128,7 @@ export default class SetEmailDialog extends React.Component {
}); });
} }
render() { public render(): JSX.Element {
const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog');
const Spinner = sdk.getComponent('elements.Spinner');
const EditableText = sdk.getComponent('elements.EditableText');
const emailInput = this.state.emailBusy ? <Spinner /> : <EditableText const emailInput = this.state.emailBusy ? <Spinner /> : <EditableText
initialValue={this.state.emailAddress} initialValue={this.state.emailAddress}
className="mx_SetEmailDialog_email_input" className="mx_SetEmailDialog_email_input"