beenull/ente
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

remove the use of dialogbox from recovery key modal

Browse source
This commit is contained in:
Abhinav 2022-06-25 20:14:21 +05:30
parent 3286cb0e24
commit 3eadacb00a
1 changed files with 32 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

60
src/components/RecoveryKey/index.tsx
View file

@ -2,13 +2,18 @@ import React, { useContext, useEffect, useState } from 'react';
import { downloadAsFile } from 'utils/file';
import { getRecoveryKey } from 'utils/crypto';
import constants from 'utils/strings/constants';
import DialogBox from '../DialogBox';
import CodeBlock from '../CodeBlock';
import { ButtonProps, Typography } from '@mui/material';
import {
Button,
Dialog,
DialogActions,
DialogContent,
Typography,
} from '@mui/material';
import * as bip39 from 'bip39';
import { DashedBorderWrapper } from './styledComponents';
import { DialogBoxAttributes } from 'types/dialogBox';
import { AppContext } from 'pages/_app';
import DialogTitleWithCloseButton from 'components/DialogBox/titleWithCloseButton';
// mobile client library only supports english.
bip39.setDefaultWordlist('english');
@ -46,36 +51,35 @@ function RecoveryKey({ somethingWentWrong, ...props }: Props) {
props.onHide();
}
const recoveryKeyDialogAttributes: DialogBoxAttributes = {
title: constants.RECOVERY_KEY,
close: {
text: constants.SAVE_LATER,
variant: 'secondary' as ButtonProps['color'],
},
proceed: {
text: constants.SAVE,
action: onSaveClick,
disabled: !recoveryKey,
variant: 'accent' as ButtonProps['color'],
},
};
return (
<DialogBox
titleCloseButton
<Dialog
fullScreen={appContext.isMobile}
open={props.show}
onClose={props.onHide}
size="sm"
attributes={recoveryKeyDialogAttributes}>
<Typography mb={3}>{constants.RECOVERY_KEY_DESCRIPTION}</Typography>
<DashedBorderWrapper>
<CodeBlock code={recoveryKey} />
<Typography m={2}>
{constants.KEY_NOT_STORED_DISCLAIMER}
maxWidth="xs">
<DialogTitleWithCloseButton onClose={props.onHide}>
{constants.RECOVERY_KEY}
</DialogTitleWithCloseButton>
<DialogContent>
<Typography mb={3}>
{constants.RECOVERY_KEY_DESCRIPTION}
</Typography>
</DashedBorderWrapper>
</DialogBox>
<DashedBorderWrapper>
<CodeBlock code={recoveryKey} />
<Typography m={2}>
{constants.KEY_NOT_STORED_DISCLAIMER}
</Typography>
</DashedBorderWrapper>
</DialogContent>
<DialogActions>
<Button color="secondary" size="large" onClick={props.onHide}>
{constants.SAVE_LATER}
</Button>
<Button color="accent" size="large" onClick={onSaveClick}>
{constants.SAVE}
</Button>
</DialogActions>
</Dialog>
);
}
export default RecoveryKey;