accounts-frontend/packages/app/components/profile/multiFactorAuth/status/MfaStatus.tsx

46 lines
1.3 KiB
TypeScript
Raw Normal View History

2017-09-09 19:52:19 +05:30
import React from 'react';
import { FormattedMessage as Message } from 'react-intl';
import { ScrollIntoView } from 'app/components/ui/scroll';
import styles from 'app/components/profile/profileForm.scss';
import icons from 'app/components/ui/icons.scss';
2017-09-09 19:52:19 +05:30
import messages from '../MultiFactorAuth.intl.json';
import mfaStyles from '../mfa.scss';
2019-12-07 16:58:52 +05:30
export default function MfaStatus({ onProceed }: { onProceed: () => void }) {
return (
<div className={styles.formBody}>
<ScrollIntoView />
<div className={styles.formRow}>
<div className={mfaStyles.bigIcon}>
<span className={icons.lock} />
</div>
<p className={`${styles.description} ${mfaStyles.mfaTitle}`}>
<Message {...messages.mfaEnabledForYourAcc} />
</p>
</div>
2017-09-09 19:52:19 +05:30
<div className={styles.formRow}>
<p className={styles.description}>
<Message {...messages.mfaLoginFlowDesc} />
</p>
</div>
2017-09-09 19:52:19 +05:30
<div className={`${styles.formRow} ${mfaStyles.disableMfa}`}>
<p className={styles.description}>
<a
href="#"
onClick={(event) => {
event.preventDefault();
onProceed();
}}
>
<Message {...messages.disable} />
</a>
</p>
</div>
</div>
);
2017-09-09 19:52:19 +05:30
}