diff --git a/src/ui/FRWComponent/LLNotFound.tsx b/src/ui/FRWComponent/LLNotFound.tsx index af57046f..23fedea9 100644 --- a/src/ui/FRWComponent/LLNotFound.tsx +++ b/src/ui/FRWComponent/LLNotFound.tsx @@ -51,7 +51,7 @@ export const LLNotFound = ({ setShowDialog }) => { - - - - - - ); -}; - -export default RecoveryPhrase; diff --git a/src/ui/views/LandingPages/RecoverRegister/SetPassword.tsx b/src/ui/views/LandingPages/RecoverRegister/SetPassword.tsx deleted file mode 100644 index c724be05..00000000 --- a/src/ui/views/LandingPages/RecoverRegister/SetPassword.tsx +++ /dev/null @@ -1,385 +0,0 @@ -import VisibilityIcon from '@mui/icons-material/Visibility'; -import VisibilityOffIcon from '@mui/icons-material/VisibilityOff'; -import { - Button, - Typography, - IconButton, - Alert, - Snackbar, - Link, - Input, - InputAdornment, - FormGroup, - LinearProgress, -} from '@mui/material'; -import Checkbox from '@mui/material/Checkbox'; -import FormControlLabel from '@mui/material/FormControlLabel'; -import { makeStyles, styled } from '@mui/styles'; -import { Box } from '@mui/system'; -import HDWallet from 'ethereum-hdwallet'; -import React, { useEffect, useState } from 'react'; -import zxcvbn from 'zxcvbn'; - -import { storage } from '@/background/webapi'; -import { LLSpinner } from '@/ui/FRWComponent'; -import SlideRelative from '@/ui/FRWComponent/SlideRelative'; -import { type AccountKey } from 'background/service/networkModel'; -import { useWallet } from 'ui/utils'; - -import CheckCircleIcon from '../../../../components/iconfont/IconCheckmark'; -import CancelIcon from '../../../../components/iconfont/IconClose'; -import { BpUncheked, BpCheckedIcon } from '../../../FRWAssets/icons/CustomCheckboxIcons'; - -const useStyles = makeStyles(() => ({ - customInputLabel: { - '& legend': { - visibility: 'visible', - }, - }, - inputBox: { - height: '64px', - padding: '16px', - zIndex: '999', - backgroundColor: '#282828', - border: '2px solid #4C4C4C', - borderRadius: '12px', - boxSizing: 'border-box', - '&.Mui-focused': { - border: '2px solid #FAFAFA', - boxShadow: '0px 8px 12px 4px rgba(76, 76, 76, 0.24)', - }, - }, - inputBox2: { - height: '64px', - padding: '16px', - zIndex: '999', - backgroundColor: '#282828', - border: '2px solid #4C4C4C', - borderRadius: '12px', - boxSizing: 'border-box', - '&.Mui-focused': { - border: '2px solid #FAFAFA', - boxShadow: '0px 8px 12px 4px rgba(76, 76, 76, 0.24)', - }, - }, -})); - -const PasswordIndicator = (props) => { - const score = zxcvbn(props.value).score; - const precentage = ((score + 1) / 5) * 100; - - const level = (score) => { - switch (score) { - case 0: - case 1: - return { text: chrome.i18n.getMessage('Weak'), color: 'error' }; - case 2: - return { text: chrome.i18n.getMessage('Good'), color: 'testnet' }; - case 3: - return { text: chrome.i18n.getMessage('Great'), color: 'success' }; - case 4: - return { text: chrome.i18n.getMessage('Strong'), color: 'success' }; - default: - return { text: chrome.i18n.getMessage('Unknown'), color: 'error' }; - } - }; - - return ( - - - - - - - {level(score).text} - - - - ); -}; - -const SetPassword = ({ handleSwitchTab, mnemonic, username }) => { - const classes = useStyles(); - const usewallet = useWallet(); - - const [isPasswordVisible, setPasswordVisible] = useState(false); - const [isConfirmPasswordVisible, setConfirmPasswordVisible] = useState(false); - - const [password, setPassword] = useState(''); - const [confirmPassword, setConfirmPassword] = useState(''); - const [isCharacters, setCharacters] = useState(false); - const [isMatch, setMatch] = useState(false); - const [isCheck, setCheck] = useState(false); - const [isLoading, setLoading] = useState(false); - - const [errMessage, setErrorMessage] = useState('Something went wrong, please try again.'); - const [showError, setShowError] = useState(false); - - const handleErrorClose = (event?: React.SyntheticEvent | Event, reason?: string) => { - if (reason === 'clickaway') { - return; - } - setShowError(false); - }; - - const getAccountKey = (mnemonic) => { - const hdwallet = HDWallet.fromMnemonic(mnemonic); - const publicKey = hdwallet.derive("m/44'/539'/0'/0/0").getPublicKey().toString('hex'); - const key: AccountKey = { - hash_algo: 1, - sign_algo: 2, - weight: 1000, - public_key: publicKey, - }; - return key; - }; - - const successInfo = (message) => { - return ( - - - - {message} - - - ); - }; - - const errorInfo = (message) => { - return ( - - - - {message} - - - ); - }; - - const [helperText, setHelperText] = useState(
); - const [helperMatch, setHelperMatch] = useState(
); - - const register = async () => { - setLoading(true); - - await usewallet.saveIndex(username); - const accountKey = getAccountKey(mnemonic); - - usewallet.openapi - .register(accountKey, username) - .then((response) => { - setLoading(false); - return usewallet.boot(password); - }) - .then((response) => { - const formatted = mnemonic.trim().split(/\s+/g).join(' '); - storage.remove('premnemonic'); - return usewallet.createKeyringWithMnemonics(formatted); - }) - .then((accounts) => { - handleSwitchTab(); - return usewallet.openapi.createFlowAddress(); - }) - .then((address) => { - // console.log('address -->', address); - }) - .catch((error) => { - console.log('error -->', error); - setLoading(false); - }); - }; - - useEffect(() => { - if (password.length > 7) { - setHelperText(successInfo(chrome.i18n.getMessage('At__least__8__characters'))); - setCharacters(true); - } else { - setHelperText(errorInfo(chrome.i18n.getMessage('At__least__8__characters'))); - setCharacters(false); - } - }, [password]); - - useEffect(() => { - if (confirmPassword === password) { - setHelperMatch(successInfo(chrome.i18n.getMessage('Passwords__match'))); - setMatch(true); - } else { - setMatch(false); - setHelperMatch(errorInfo(chrome.i18n.getMessage('Your__passwords__do__not__match'))); - } - }, [confirmPassword, password]); - - return ( - <> - - - {chrome.i18n.getMessage('Create') + ' '} - - {' ' + chrome.i18n.getMessage('Password')} - {' '} - - - {chrome.i18n.getMessage( - 'Lilico__uses__this__password__to__protect__your__recovery__phrase' - )} - - - - - { - setPassword(event.target.value); - }} - endAdornment={ - - {password && } - setPasswordVisible(!isPasswordVisible)}> - {isPasswordVisible ? : } - - - } - /> - - {helperText} - - { - setConfirmPassword(event.target.value); - }} - endAdornment={ - - setConfirmPasswordVisible(!isConfirmPasswordVisible)}> - {isConfirmPasswordVisible ? : } - - - } - /> - - {helperMatch} - - - - - } - checkedIcon={} - onChange={(event) => setCheck(event.target.checked)} - /> - } - label={ - - {chrome.i18n.getMessage('I__agree__to__Lilico') + ' '} - - {chrome.i18n.getMessage('Privacy__Policy')} - {' '} - {chrome.i18n.getMessage('and') + ' '} - - {chrome.i18n.getMessage('Terms__of__Service')} - {' '} - . - - } - /> - - - - {errMessage} - - - - - ); -}; - -export default SetPassword; diff --git a/src/ui/views/LandingPages/RecoverRegister/index.tsx b/src/ui/views/LandingPages/RecoverRegister/index.tsx deleted file mode 100644 index 0d609375..00000000 --- a/src/ui/views/LandingPages/RecoverRegister/index.tsx +++ /dev/null @@ -1,210 +0,0 @@ -import ExtensionRoundedIcon from '@mui/icons-material/ExtensionRounded'; -import PushPinOutlinedIcon from '@mui/icons-material/PushPinOutlined'; -import { IconButton, Typography, Snackbar, SnackbarContent } from '@mui/material'; -import { Box } from '@mui/system'; -import React, { useState, useEffect, useRef } from 'react'; -import { useHistory } from 'react-router-dom'; - -import { storage } from '@/background/webapi'; -import Confetti from '@/ui/FRWComponent/Confetti'; -import AllSet from '@/ui/FRWComponent/LandingPages/AllSet'; -import PickUsername from '@/ui/FRWComponent/LandingPages/PickUsername'; -import SlideLeftRight from '@/ui/FRWComponent/SlideLeftRight'; - -import lilicoIcon from '../../../../../_raw/images/icon-48.png'; -import BackButtonIcon from '../../../../components/iconfont/IconBackButton'; - -import RecoveryPhrase from './RecoveryPhrase'; -import SetPassword from './SetPassword'; - -enum Direction { - Right, - Left, -} -const RecoverRegister = () => { - const history = useHistory(); - const [activeIndex, onChange] = useState(0); - const [direction, setDirection] = useState(Direction.Right); - const [username, setUsername] = useState(''); - const [mnemonic, setMnemonic] = useState(''); - - const pageRef = useRef(null); - const getUsername = (username: string) => { - setUsername(username.toLowerCase()); - }; - - const getPhrase = async () => { - const phrase = await storage.get('premnemonic'); - if (phrase) { - setMnemonic(phrase); - } - storage.remove('premnemonic'); - }; - - useEffect(() => { - getPhrase(); - }, []); - - const goNext = () => { - setDirection(Direction.Right); - if (activeIndex < 3) { - onChange(activeIndex + 1); - } else { - window.close(); - } - }; - - const goBack = () => { - setDirection(Direction.Left); - if (activeIndex >= 1) { - onChange(activeIndex - 1); - } else { - history.goBack(); - } - }; - - const Page = React.forwardRef(({ index }: { index: number }, pageRef) => { - switch (index) { - case 0: - return ( - - ); - case 1: - return ; - case 2: - return ; - case 3: - return ; - default: - return ; - } - }); - - return ( - <> - - {activeIndex === 3 && } - - - - - - - - {chrome.i18n.getMessage('Put__your__wallet__within__reach')} -
-
- - - {chrome.i18n.getMessage('Click__Extension')} - - - - {chrome.i18n.getMessage('and__Pin')} - - - - {chrome.i18n.getMessage('Flow_Core')} - - -
-
- } - /> - - - - - - - - - - -
- - - {chrome.i18n.getMessage('STEP')} {activeIndex + 1}/4 - -
- - - - -
- - - - - ); -}; - -export default RecoverRegister; diff --git a/src/ui/views/LandingPages/Reset/RecoverPassword.tsx b/src/ui/views/LandingPages/Reset/RecoverPassword.tsx deleted file mode 100644 index c416382f..00000000 --- a/src/ui/views/LandingPages/Reset/RecoverPassword.tsx +++ /dev/null @@ -1,390 +0,0 @@ -import VisibilityIcon from '@mui/icons-material/Visibility'; -import VisibilityOffIcon from '@mui/icons-material/VisibilityOff'; -import { - Button, - Typography, - IconButton, - Snackbar, - Alert, - Link, - Input, - InputAdornment, - FormGroup, - LinearProgress, -} from '@mui/material'; -import Checkbox from '@mui/material/Checkbox'; -import FormControlLabel from '@mui/material/FormControlLabel'; -import { makeStyles, styled } from '@mui/styles'; -import { Box } from '@mui/system'; -import React, { useEffect, useState } from 'react'; -import zxcvbn from 'zxcvbn'; - -import { storage } from '@/background/webapi'; -import SlideRelative from '@/ui/FRWComponent/SlideRelative'; -import { LLSpinner } from 'ui/FRWComponent'; -import { useWallet } from 'ui/utils'; - -import CheckCircleIcon from '../../../../components/iconfont/IconCheckmark'; -import CancelIcon from '../../../../components/iconfont/IconClose'; - -// const helperTextStyles = makeStyles(() => ({ -// root: { -// size: '16px', -// color: '#BABABA', -// }, -// })); - -const useStyles = makeStyles(() => ({ - customInputLabel: { - '& legend': { - visibility: 'visible', - }, - }, - inputBox: { - height: '64px', - padding: '16px', - zIndex: '999', - backgroundColor: '#282828', - border: '2px solid #4C4C4C', - borderRadius: '12px', - boxSizing: 'border-box', - '&.Mui-focused': { - border: '2px solid #FAFAFA', - boxShadow: '0px 8px 12px 4px rgba(76, 76, 76, 0.24)', - }, - }, - inputBox2: { - height: '64px', - padding: '16px', - zIndex: '999', - backgroundColor: '#282828', - border: '2px solid #4C4C4C', - borderRadius: '12px', - boxSizing: 'border-box', - '&.Mui-focused': { - border: '2px solid #FAFAFA', - boxShadow: '0px 8px 12px 4px rgba(76, 76, 76, 0.24)', - }, - }, -})); - -const BpIcon = styled('span')(() => ({ - borderRadius: 8, - width: 24, - height: 24, - border: '1px solid #41CC5D', - backgroundColor: 'transparent', -})); - -const BpCheckedIcon = styled(BpIcon)({ - backgroundColor: '#41CC5D', - backgroundImage: 'linear-gradient(180deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,0))', - '&:before': { - display: 'block', - width: 21, - height: 21, - backgroundImage: - "url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath" + - " fill-rule='evenodd' clip-rule='evenodd' d='M12 5c-.28 0-.53.11-.71.29L7 9.59l-2.29-2.3a1.003 " + - "1.003 0 00-1.42 1.42l3 3c.18.18.43.29.71.29s.53-.11.71-.29l5-5A1.003 1.003 0 0012 5z' fill='%23fff'/%3E%3C/svg%3E\")", - content: '""', - }, - 'input:hover ~ &': { - backgroundColor: '#41CC5D', - }, -}); - -const PasswordIndicator = (props) => { - const score = zxcvbn(props.value).score; - const precentage = ((score + 1) / 5) * 100; - - const level = (score) => { - switch (score) { - case 0: - case 1: - return { text: chrome.i18n.getMessage('Weak'), color: 'error' }; - case 2: - return { text: chrome.i18n.getMessage('Good'), color: 'testnet' }; - case 3: - return { text: chrome.i18n.getMessage('Great'), color: 'success' }; - case 4: - return { text: chrome.i18n.getMessage('Strong'), color: 'success' }; - default: - return { text: chrome.i18n.getMessage('Unknown'), color: 'error' }; - } - }; - return ( - - - - - - - {level(score).text} - - - - ); -}; - -const SetPassword = ({ handleSwitchTab, mnemonic, username }) => { - const classes = useStyles(); - const usewallet = useWallet(); - const [isPasswordVisible, setPasswordVisible] = useState(false); - const [isConfirmPasswordVisible, setConfirmPasswordVisible] = useState(false); - const [showError, setShowError] = useState(false); - const [password, setPassword] = useState(''); - const [confirmPassword, setConfirmPassword] = useState(''); - const [isCharacters, setCharacters] = useState(false); - const [isMatch, setMatch] = useState(false); - const [isCheck, setCheck] = useState(false); - const [isLoading, setLoading] = useState(false); - - const successInfo = (message) => { - return ( - - - - {message} - - - ); - }; - - const errorInfo = (message) => { - return ( - - - - {message} - - - ); - }; - - const [helperText, setHelperText] = useState(
); - const [helperMatch, setHelperMatch] = useState(
); - - const signIn = async () => { - setLoading(true); - - await usewallet.saveIndex(username); - try { - await usewallet.boot(password); - const formatted = mnemonic.trim().split(/\s+/g).join(' '); - await usewallet.createKeyringWithMnemonics(formatted); - setLoading(false); - handleSwitchTab(); - } catch (e) { - setLoading(false); - setShowError(true); - } - }; - - useEffect(() => { - if (password.length > 7) { - setHelperText(successInfo('At least 8 characters')); - setCharacters(true); - } else { - setHelperText(errorInfo('At least 8 characters')); - setCharacters(false); - } - }, [password]); - - useEffect(() => { - if (confirmPassword === password) { - setHelperMatch(successInfo('Passwords match')); - setMatch(true); - } else { - setMatch(false); - setHelperMatch(errorInfo('Your passwords do not match, please check again')); - } - }, [confirmPassword, password]); - - const renderSnackBar = () => { - return ( - setShowError(false)} - > - { - setShowError(false); - }} - > - Something went wrong, please try again later - - - ); - }; - - return ( - <> - - - {chrome.i18n.getMessage('Create')} - - {' '} - {chrome.i18n.getMessage('Password')} - {' '} - - - {chrome.i18n.getMessage( - 'Lilico__uses__this__password__to__protect__your__recovery__phrases' - )} - - - - - { - setPassword(event.target.value); - }} - endAdornment={ - - {password && } - setPasswordVisible(!isPasswordVisible)}> - {isPasswordVisible ? : } - - - } - /> - - {helperText} - - { - setConfirmPassword(event.target.value); - }} - endAdornment={ - - setConfirmPasswordVisible(!isConfirmPasswordVisible)}> - {isConfirmPasswordVisible ? : } - - - } - /> - - {helperMatch} - - - - - } - checkedIcon={} - onChange={(event) => setCheck(event.target.checked)} - /> - } - label={ - - {chrome.i18n.getMessage('I__agree__to__Lilico') + ' '} - - {chrome.i18n.getMessage('Privacy__Policy')} - {' '} - {chrome.i18n.getMessage('and') + ' '} - - {chrome.i18n.getMessage('Terms__of__Service')} - {' '} - . - - } - /> - - - {renderSnackBar()} - - - ); -}; - -export default SetPassword; diff --git a/src/ui/views/LandingPages/Reset/ResetRecoveryPhrase.tsx b/src/ui/views/LandingPages/Reset/ResetRecoveryPhrase.tsx deleted file mode 100644 index b9f9333a..00000000 --- a/src/ui/views/LandingPages/Reset/ResetRecoveryPhrase.tsx +++ /dev/null @@ -1,264 +0,0 @@ -import { - Typography, - FormControl, - Input, - CircularProgress, - Snackbar, - Alert, - Button, -} from '@mui/material'; -import { makeStyles } from '@mui/styles'; -import { Box } from '@mui/system'; -import * as bip39 from 'bip39'; -import React, { useCallback, useEffect, useState } from 'react'; - -import { storage } from '@/background/webapi'; -import SlideRelative from '@/ui/FRWComponent/SlideRelative'; -import { LLNotFound, LLSpinner } from 'ui/FRWComponent'; -import { useWallet } from 'ui/utils'; - -import CheckCircleIcon from '../../../../components/iconfont/IconCheckmark'; -import CancelIcon from '../../../../components/iconfont/IconClose'; - -const useStyles = makeStyles((theme) => ({ - customInputLabel: { - '& legend': { - visibility: 'visible', - }, - }, - inputBox: { - height: '128px', - padding: '16px', - paddingTop: '0px', - zIndex: '999', - overflow: 'scroll', - backgroundColor: '#282828', - border: '2px solid #4C4C4C', - borderRadius: '12px', - boxSizing: 'border-box', - '&.Mui-focused': { - border: '2px solid #FAFAFA', - boxShadow: '0px 8px 12px 4px rgba(76, 76, 76, 0.24)', - }, - }, -})); - -const MnemonicError = (errorMsg) => ( - - - - {errorMsg} - - -); - -const MnemonicCorrect = ( - - - - {chrome.i18n.getMessage('Recovery__phrase__valid')} - - -); - -const MnemonicLoading = () => ( - - - {chrome.i18n.getMessage('Checking')} - -); - -const ResetRecoveryPhrase = ({ handleSwitchTab, confirmMnemonic, setUsername }) => { - const classes = useStyles(); - const wallet = useWallet(); - - const [mnemonicValid, setMnemonicValid] = useState(true); - - const [mnemonic, setMnemonic] = useState(''); - - const [isLoading, setLoading] = useState(false); - const [showDialog, setShowDialog] = useState(false); - const [showError, setShowError] = useState(false); - const [helperText, setHelperText] = useState(
); - const [isSignLoading, setSignLoading] = useState(false); - - const signIn = async () => { - setSignLoading(true); - try { - const result = await wallet.signInWithMnemonic(mnemonic); - setSignLoading(false); - await wallet.reset(); - confirmMnemonic(mnemonic); - const userInfo = await wallet.getUserInfo(false); - setUsername(userInfo.username); - handleSwitchTab(); - } catch (error) { - setSignLoading(false); - if (error.message === 'NoUserFound') { - setShowDialog(true); - } else { - setShowError(true); - } - } - }; - - const renderSnackBar = () => { - return ( - setShowError(false)} - > - { - setShowError(false); - }} - > - Something went wrong, please try again later - - - ); - }; - const setErrorMessage = useCallback( - (message: string) => { - setLoading(false); - setMnemonicValid(false); - setHelperText(MnemonicError(message)); - }, - [setLoading, setMnemonicValid, setHelperText] - ); - - useEffect(() => { - setMnemonicValid(false); - setHelperText(MnemonicLoading); - setLoading(true); - const delayDebounceFn = setTimeout(() => { - setLoading(false); - const length = mnemonic.trim().split(/\s+/g).length; - if (!(length === 12 || length === 24)) { - setErrorMessage( - chrome.i18n.getMessage('Recovery_phrases_word_count_must_be_12_or_24_words') - ); - return; - } - - const formatted = mnemonic.trim().split(/\s+/g).join(' '); - if (!bip39.validateMnemonic(formatted)) { - setErrorMessage(chrome.i18n.getMessage('Mnemonic__phrase__is__invalid')); - return; - } - - setMnemonicValid(true); - setHelperText(MnemonicCorrect); - storage.set('premnemonic', formatted); - setMnemonic(formatted); - }, 500); - - return () => clearTimeout(delayDebounceFn); - }, [mnemonic, setErrorMessage]); - - const msgBgColor = () => { - if (isLoading) { - return 'neutral.light'; - } - return mnemonicValid ? 'success.light' : 'error.light'; - }; - - return ( - <> - {!showDialog ? ( - - - {chrome.i18n.getMessage('Reset_Your')}{' '} - - {chrome.i18n.getMessage('Wallet')} - - - - {chrome.i18n.getMessage( - 'Enter_the_12_or_24_word_recovery_phrase_given_when_you_first_created_your_wallet' - )} - - - - - { - setMnemonic(event.target.value); - }} - /> - - - {helperText} - - - - - - - - - - {renderSnackBar()} - - ) : ( - - )} - - ); -}; - -export default ResetRecoveryPhrase; diff --git a/src/ui/views/LandingPages/Reset/index.tsx b/src/ui/views/LandingPages/Reset/index.tsx deleted file mode 100644 index 877bee92..00000000 --- a/src/ui/views/LandingPages/Reset/index.tsx +++ /dev/null @@ -1,201 +0,0 @@ -import { IconButton, Typography, Button, Snackbar, Alert } from '@mui/material'; -import { Box } from '@mui/system'; -import React, { useState } from 'react'; -import { useHistory } from 'react-router-dom'; - -import Confetti from '@/ui/FRWComponent/Confetti'; -import AllSet from '@/ui/FRWComponent/LandingPages/AllSet'; -import RegisterHeader from '@/ui/FRWComponent/LandingPages/RegisterHeader'; -import SlideLeftRight from '@/ui/FRWComponent/SlideLeftRight'; -import SlideRelative from '@/ui/FRWComponent/SlideRelative'; -import { LLSpinner } from 'ui/FRWComponent'; -import { useWallet } from 'ui/utils'; - -import BackButtonIcon from '../../../../components/iconfont/IconBackButton'; -import IconGoogleDrive from '../../../../components/iconfont/IconGoogleDrive'; - -import RecoverPassword from './RecoverPassword'; -import ResetRecoveryPhrase from './ResetRecoveryPhrase'; - -enum Direction { - Right, - Left, -} - -const Reset = () => { - const history = useHistory(); - const [activeIndex, onChange] = useState(0); - const [mnemonic, setMnemonic] = useState(''); - const [username, setUsername] = useState(''); - const [direction, setDirection] = useState(Direction.Right); - const [loading, setLoading] = useState(false); - const [showError, setShowError] = useState(false); - const wallets = useWallet(); - - const goNext = () => { - setDirection(Direction.Right); - if (activeIndex < 2) { - onChange(activeIndex + 1); - } else { - window.close(); - } - }; - - const goBack = () => { - setDirection(Direction.Left); - if (activeIndex >= 1) { - onChange(activeIndex - 1); - } else { - history.goBack(); - } - }; - - const getGoogle = async () => { - setLoading(true); - const accounts = await wallets.loadBackupAccounts(); - if (accounts.length > 0) { - history.push({ - pathname: '/welcome/accountimport/google', - state: { - accounts: accounts, - }, - }); - } else { - setShowError(true); - } - setLoading(false); - }; - - const handleErrorClose = (event?: React.SyntheticEvent | Event, reason?: string) => { - if (reason === 'clickaway') { - return; - } - - setShowError(false); - }; - - const page = (index) => { - switch (index) { - case 0: - return ( - - ); - case 1: - return ; - case 2: - return ; - default: - return
; - } - }; - - return ( - <> - - {activeIndex === 2 && } - - - - - - - - - -
- - - {chrome.i18n.getMessage('STEP')} {activeIndex + 1}/3 - -
- - - {page(activeIndex)} - -
- - {activeIndex === 0 && ( - - )} - - - - {chrome.i18n.getMessage('No__backup__found')} - - - - - - - ); -}; - -export default Reset; diff --git a/src/ui/views/index.tsx b/src/ui/views/index.tsx index 5c10ffb7..19722c12 100644 --- a/src/ui/views/index.tsx +++ b/src/ui/views/index.tsx @@ -11,7 +11,7 @@ import { WalletProvider, useWallet } from 'ui/utils'; import Approval from './Approval'; import InnerRoute from './InnerRoute'; -import { MainRoute } from './MainRoute'; +import { Landing } from './Landing'; import RetrievePK from './RetrievePK'; import SortHat from './SortHat'; import SwitchUnlock from './SwitchUnlock'; @@ -35,7 +35,7 @@ const Routes = () => { - +