Cleanup logic for asModal
to make it a little easier to use dynamically
This commit is contained in:
parent
69ac2ca40b
commit
6b16b9bc2a
12 changed files with 210 additions and 203 deletions
|
@ -7,53 +7,29 @@ import tw from 'twin.macro';
|
|||
import Button from '@/components/elements/Button';
|
||||
|
||||
export default () => {
|
||||
const user = useStoreState((state: ApplicationStore) => state.user.data!);
|
||||
const [ visible, setVisible ] = useState(false);
|
||||
const isEnabled = useStoreState((state: ApplicationStore) => state.user.data!.useTotp);
|
||||
|
||||
return user.useTotp ?
|
||||
return (
|
||||
<div>
|
||||
{visible &&
|
||||
<DisableTwoFactorModal
|
||||
appear
|
||||
visible={visible}
|
||||
onDismissed={() => setVisible(false)}
|
||||
/>
|
||||
}
|
||||
{visible && (
|
||||
isEnabled ?
|
||||
<DisableTwoFactorModal visible={visible} onModalDismissed={() => setVisible(false)}/>
|
||||
:
|
||||
<SetupTwoFactorModal visible={visible} onModalDismissed={() => setVisible(false)}/>
|
||||
)}
|
||||
<p css={tw`text-sm`}>
|
||||
Two-factor authentication is currently enabled on your account.
|
||||
{isEnabled ?
|
||||
'Two-factor authentication is currently enabled on your account.'
|
||||
:
|
||||
'You do not currently have two-factor authentication enabled on your account. Click the button below to begin configuring it.'
|
||||
}
|
||||
</p>
|
||||
<div css={tw`mt-6`}>
|
||||
<Button
|
||||
color={'red'}
|
||||
isSecondary
|
||||
onClick={() => setVisible(true)}
|
||||
>
|
||||
Disable
|
||||
<Button color={'red'} isSecondary onClick={() => setVisible(true)}>
|
||||
{isEnabled ? 'Disable' : 'Enable'}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
:
|
||||
<div>
|
||||
{visible &&
|
||||
<SetupTwoFactorModal
|
||||
appear
|
||||
visible={visible}
|
||||
onDismissed={() => setVisible(false)}
|
||||
/>
|
||||
}
|
||||
<p css={tw`text-sm`}>
|
||||
You do not currently have two-factor authentication enabled on your account. Click
|
||||
the button below to begin configuring it.
|
||||
</p>
|
||||
<div css={tw`mt-6`}>
|
||||
<Button
|
||||
color={'green'}
|
||||
isSecondary
|
||||
onClick={() => setVisible(true)}
|
||||
>
|
||||
Begin Setup
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
;
|
||||
);
|
||||
};
|
||||
|
|
Reference in a new issue