Skip to content

Commit

Permalink
Merge pull request #253 from Outblock/dev
Browse files Browse the repository at this point in the history 
[Release] 2.6.1
  • Loading branch information
@lmcmz
lmcmz authored Dec 6, 2024
2 parents b3fff40 + 2ac1d31 commit cf91513
Show file tree
Hide file tree
Showing 5 changed files with 110 additions and 89 deletions.
2 changes: 1 addition & 1 deletion _raw/manifest/manifest.dev.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"manifest_version": 3,
"name": "FlowWallet-dev",
"short_name": "__MSG_appName__",
"version": "2.6.0",
"version": "2.6.1",
"default_locale": "en",
"description": "__MSG_appDescription__",
"icons": {
Expand Down
2 changes: 1 addition & 1 deletion _raw/manifest/manifest.pro.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"manifest_version": 3,
"name": "__MSG_appName__",
"short_name": "__MSG_appName__",
"version": "2.6.0",
"version": "2.6.1",
"default_locale": "en",
"description": "__MSG_appDescription__",
"icons": {
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "flow-reference-wallet",
"version": "2.6.0",
"version": "2.6.1",
"description": "Digital wallet created for everyone.",
"scripts": {
"prepare:dev": "node ./build/prepareManifest.js dev",
Expand Down
163 changes: 92 additions & 71 deletions src/ui/views/Register/PickUsername.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import {
} from '@mui/material';
import { makeStyles } from '@mui/styles';
import { Box } from '@mui/system';
import React, { useCallback, useEffect, useState } from 'react';
import React, { useCallback, useEffect, useMemo, useState } from 'react';

import SlideRelative from '@/ui/FRWComponent/SlideRelative';
import { useWallet } from 'ui/utils';
Expand Down Expand Up @@ -39,87 +39,77 @@ const useStyles = makeStyles((_theme) => ({
},
}));

const UsernameError = (errorMsg) => (
<Box
sx={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
}}
>
<CancelIcon size={24} color="#E54040" style={{ margin: '8px' }} />
<Typography variant="body1" color="error.main">
{errorMsg}
{errorMsg.startsWith('This username is reserved') && (
<span>
<a href="mailto: [email protected]">[email protected]</a>
{chrome.i18n.getMessage('for__any__inquiry')}
</span>
)}
</Typography>
</Box>
);
const UsernameCorrect = (
<Box
sx={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
}}
>
<CheckCircleIcon size={24} color="#41CC5D" style={{ margin: '8px' }} />
<Typography variant="body1" color="success.main">
{chrome.i18n.getMessage('Sounds_good')}
</Typography>
</Box>
);
const UsernameLoading = () => (
<Typography variant="body1" color="text.secondary" sx={{ display: 'flex', alignItems: 'center' }}>
<CircularProgress color="primary" size={22} style={{ fontSize: '22px', margin: '8px' }} />
{chrome.i18n.getMessage('Checking')}
</Typography>
);

const PickUsername = ({ handleClick, savedUsername, getUsername }) => {
const classes = useStyles();
const wallet = useWallet();
const [isLoading, setLoading] = useState(false);
const [usernameValid, setUsernameValid] = useState(false);

const usernameError = (errorMsg) => (
<Box
sx={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
}}
>
<CancelIcon size={24} color="#E54040" style={{ margin: '8px' }} />
<Typography variant="body1" color="error.main">
{errorMsg}
{errorMsg.startsWith('This username is reserved') && (
<span>
<a href="mailto: [email protected]">[email protected]</a>
{chrome.i18n.getMessage('for__any__inquiry')}
</span>
)}
</Typography>
</Box>
);
const usernameCorrect = useMemo(
() => (
<Box
sx={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
}}
>
<CheckCircleIcon size={24} color="#41CC5D" style={{ margin: '8px' }} />
<Typography variant="body1" color="success.main">
{chrome.i18n.getMessage('Sounds_good')}
</Typography>
</Box>
),
[]
);
const usernameLoading = useMemo(
() => (
<Typography
variant="body1"
color="text.secondary"
sx={{ display: 'flex', alignItems: 'center' }}
>
<CircularProgress color="primary" size={22} style={{ fontSize: '22px', margin: '8px' }} />
{chrome.i18n.getMessage('Checking')}
</Typography>
),
[]
);

const [username, setUsername] = useState(savedUsername || '');
const [helperText, setHelperText] = useState(<div />);

const setErrorMessage = useCallback(
(message: string) => {
setLoading(false);
setUsernameValid(false);
setHelperText(UsernameError(message));
setHelperText(usernameError(message));
},
[setLoading, setUsernameValid, setHelperText]
);

useEffect(() => {
setUsernameValid(false);
setHelperText(UsernameLoading);
setLoading(true);
const delayDebounceFn = setTimeout(() => {
if (username.length < 3) {
setErrorMessage(chrome.i18n.getMessage('Too__short'));
return;
}

if (username.length > 15) {
setErrorMessage(chrome.i18n.getMessage('Too__long'));
return;
}
const regex = /^[A-Za-z0-9]{3,15}$/;

if (!regex.test(username)) {
setErrorMessage(
chrome.i18n.getMessage('Your__username__can__only__contain__letters__and__numbers')
);
return;
}
const runCheckUsername = useCallback(
(username) => {
wallet.openapi
.checkUsername(username.toLowerCase())
.then((response) => {
Expand All @@ -130,7 +120,7 @@ const PickUsername = ({ handleClick, savedUsername, getUsername }) => {
}
if (response.data.unique) {
setUsernameValid(true);
setHelperText(UsernameCorrect);
setHelperText(usernameCorrect);
} else {
if (response.message === 'Username is reserved') {
setErrorMessage(
Expand All @@ -141,20 +131,51 @@ const PickUsername = ({ handleClick, savedUsername, getUsername }) => {
}
}
})
.catch((error) => {
.catch(() => {
setErrorMessage(chrome.i18n.getMessage('Oops__unexpected__error'));
});
},
[setErrorMessage, setUsernameValid, setHelperText, usernameCorrect, wallet.openapi]
);

useEffect(() => {
setUsernameValid(false);
setHelperText(usernameLoading);
setLoading(true);
const delayDebounceFn = setTimeout(() => {
if (username.length < 3) {
setErrorMessage(chrome.i18n.getMessage('Too__short'));
setLoading(false);
return;
}

if (username.length > 15) {
setErrorMessage(chrome.i18n.getMessage('Too__long'));
setLoading(false);
return;
}

const regex = /^[A-Za-z0-9]{3,15}$/;
if (!regex.test(username)) {
setErrorMessage(
chrome.i18n.getMessage('Your__username__can__only__contain__letters__and__numbers')
);
setLoading(false);
return;
}

runCheckUsername(username);
}, 500);

return () => clearTimeout(delayDebounceFn);
}, [setErrorMessage, username, wallet.openapi]);
}, [username]);

const msgBgColor = () => {
const msgBgColor = useCallback(() => {
if (isLoading) {
return 'neutral.light';
}
return usernameValid ? 'success.light' : 'error.light';
};
}, [isLoading, usernameValid]);

return (
<>
Expand Down Expand Up @@ -201,7 +222,7 @@ const PickUsername = ({ handleClick, savedUsername, getUsername }) => {
</InputAdornment>
}
/>
<SlideRelative direction="down" show={username}>
<SlideRelative direction="down" show={!!username}>
<Box
sx={{
width: '95%',
Expand Down
30 changes: 15 additions & 15 deletions src/ui/views/Register/RepeatPhrase.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,10 @@
import InfoIcon from '@mui/icons-material/Info';
import LockOpenRoundedIcon from '@mui/icons-material/LockOpenRounded';
import LockRoundedIcon from '@mui/icons-material/LockRounded';
import { Button, Typography } from '@mui/material';
import { Box } from '@mui/system';
import React, { useState, useEffect, useCallback } from 'react';
import React, { useState, useEffect, useCallback, useMemo } from 'react';

import SlideRelative from '@/ui/FRWComponent/SlideRelative';

import IconCopy from '../../../components/iconfont/IconCopy';

const randomElement = (list: any[]) => {
return list[Math.floor(Math.random() * list.length)];
};
Expand All @@ -27,16 +23,21 @@ const RepeatPhrase = ({ handleClick, mnemonic }) => {
const [selectedPhrase, setSelect] = useState<any[]>([]);
const [repeatArray, setRepeat] = useState<string[][]>([[], [], []]);

const mnemonicArray = mnemonic.split(' ');
const fullIndex = [...Array(mnemonicArray.length).keys()];
const positionList: number[][] = chunkArray(fullIndex, Math.floor(mnemonicArray.length / 3));
const mnemonicArray = useMemo(() => mnemonic.split(' '), [mnemonic]);
const fullIndex = useMemo(() => [...Array(mnemonicArray.length).keys()], [mnemonicArray]);
const positionList = useMemo(
() => chunkArray(fullIndex, Math.floor(mnemonicArray.length / 3)),
[fullIndex, mnemonicArray]
);

const setSelected = (i, v) => {
const tempArray = selectedPhrase;
tempArray[i] = v;
setSelect([...tempArray]);
console.log(selectedPhrase);
};
const setSelected = useCallback(
(i, v) => {
const tempArray = selectedPhrase;
tempArray[i] = v;
setSelect([...tempArray]);
},
[selectedPhrase]
);

const checkMatch = () => {
const correctMatch = chosenIndex.map((index) => mnemonicArray[index]);
Expand Down Expand Up @@ -81,7 +82,6 @@ const RepeatPhrase = ({ handleClick, mnemonic }) => {
setChosen(arr);
setRepeat(repeatMap);
}, [mnemonicArray, positionList]);

useEffect(() => {
handleRandom();
}, [handleRandom]);
Expand Down

0 comments on commit cf91513

Please sign in to comment.