mirror of
https://github.com/elyby/accounts-frontend.git
synced 2024-12-13 08:49:01 +05:30
69 lines
1.8 KiB
TypeScript
69 lines
1.8 KiB
TypeScript
import React from 'react';
|
|
import { Helmet } from 'react-helmet-async';
|
|
import { FormattedMessage as Message } from 'react-intl';
|
|
import styles from 'app/components/profile/profileForm.scss';
|
|
import { BackButton } from 'app/components/profile/ProfileForm';
|
|
import { FormModel } from 'app/components/ui/form';
|
|
|
|
import MfaEnable, { MfaStep } from './MfaEnable';
|
|
import MfaDisable from './MfaDisable';
|
|
import messages from './MultiFactorAuth.intl.json';
|
|
|
|
class MultiFactorAuth extends React.Component<{
|
|
step: MfaStep;
|
|
isMfaEnabled: boolean;
|
|
onSubmit: (form: FormModel, sendData: () => Promise<void>) => Promise<void>;
|
|
onComplete: () => void;
|
|
onChangeStep: (nextStep: number) => void;
|
|
}> {
|
|
render() {
|
|
const {
|
|
step,
|
|
onSubmit,
|
|
onComplete,
|
|
onChangeStep,
|
|
isMfaEnabled,
|
|
} = this.props;
|
|
|
|
return (
|
|
<div className={styles.contentWithBackButton}>
|
|
<BackButton />
|
|
|
|
<div className={styles.form}>
|
|
<div className={styles.formBody}>
|
|
<Message {...messages.mfaTitle}>
|
|
{(pageTitle) => (
|
|
<h3 className={styles.title}>
|
|
<Helmet title={pageTitle as string} />
|
|
{pageTitle}
|
|
</h3>
|
|
)}
|
|
</Message>
|
|
|
|
<div className={styles.formRow}>
|
|
<p className={styles.description}>
|
|
<Message {...messages.mfaDescription} />
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
{isMfaEnabled && (
|
|
<MfaDisable onSubmit={onSubmit} onComplete={onComplete} />
|
|
)}
|
|
</div>
|
|
|
|
{isMfaEnabled || (
|
|
<MfaEnable
|
|
step={step}
|
|
onSubmit={onSubmit}
|
|
onChangeStep={onChangeStep}
|
|
onComplete={onComplete}
|
|
/>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default MultiFactorAuth;
|