remove the use of dialogbox from recovery key modal

This commit is contained in:
Abhinav 2022-06-25 20:14:21 +05:30
parent 3286cb0e24
commit 3eadacb00a

View file

@ -2,13 +2,18 @@ import React, { useContext, useEffect, useState } from 'react';
import { downloadAsFile } from 'utils/file'; import { downloadAsFile } from 'utils/file';
import { getRecoveryKey } from 'utils/crypto'; import { getRecoveryKey } from 'utils/crypto';
import constants from 'utils/strings/constants'; import constants from 'utils/strings/constants';
import DialogBox from '../DialogBox';
import CodeBlock from '../CodeBlock'; 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 * as bip39 from 'bip39';
import { DashedBorderWrapper } from './styledComponents'; import { DashedBorderWrapper } from './styledComponents';
import { DialogBoxAttributes } from 'types/dialogBox';
import { AppContext } from 'pages/_app'; import { AppContext } from 'pages/_app';
import DialogTitleWithCloseButton from 'components/DialogBox/titleWithCloseButton';
// mobile client library only supports english. // mobile client library only supports english.
bip39.setDefaultWordlist('english'); bip39.setDefaultWordlist('english');
@ -46,36 +51,35 @@ function RecoveryKey({ somethingWentWrong, ...props }: Props) {
props.onHide(); 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 ( return (
<DialogBox <Dialog
titleCloseButton
fullScreen={appContext.isMobile} fullScreen={appContext.isMobile}
open={props.show} open={props.show}
onClose={props.onHide} onClose={props.onHide}
size="sm" maxWidth="xs">
attributes={recoveryKeyDialogAttributes}> <DialogTitleWithCloseButton onClose={props.onHide}>
<Typography mb={3}>{constants.RECOVERY_KEY_DESCRIPTION}</Typography> {constants.RECOVERY_KEY}
</DialogTitleWithCloseButton>
<DialogContent>
<Typography mb={3}>
{constants.RECOVERY_KEY_DESCRIPTION}
</Typography>
<DashedBorderWrapper> <DashedBorderWrapper>
<CodeBlock code={recoveryKey} /> <CodeBlock code={recoveryKey} />
<Typography m={2}> <Typography m={2}>
{constants.KEY_NOT_STORED_DISCLAIMER} {constants.KEY_NOT_STORED_DISCLAIMER}
</Typography> </Typography>
</DashedBorderWrapper> </DashedBorderWrapper>
</DialogBox> </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; export default RecoveryKey;