fix: bugfix for cloud backup (#10827)

* fix: bugfix for cloud backup * refactor: remove commented code * fix: prettier --------- Co-authored-by: guanbinrui <[email protected]> Co-authored-by: guanbinrui <[email protected]>
DimensionDev · Sep 22, 2023 · 830970f · 830970f
1 parent 91758b2
commit 830970f
Show file tree

Hide file tree

Showing 11 changed files with 31 additions and 36 deletions.
diff --git a/packages/mask/dashboard/components/PasswordField/index.tsx b/packages/mask/dashboard/components/PasswordField/index.tsx
@@ -13,10 +13,10 @@ const PasswordField = forwardRef(({ show = true, ...props }: PasswordFieldProps,
             {...props}
             ref={ref}
             type={showPassword ? 'text' : 'password'}
-            size="small"
+            size="medium"
             InputProps={{
                 ...props.InputProps,
-                size: 'small',
+                size: 'medium',
                 disableUnderline: true,
                 endAdornment: show ? (
                     <InputAdornment position="end">

diff --git a/packages/mask/dashboard/components/Restore/BackupInfoCard.tsx b/packages/mask/dashboard/components/Restore/BackupInfoCard.tsx
@@ -5,6 +5,7 @@ import type { BackupFileInfo } from '../../type.js'
 import { formatFileSize } from '@masknet/kit'
 import { FileFrame } from '@masknet/shared'
 import { makeStyles } from '@masknet/theme'
+import fromUnixTime from 'date-fns/fromUnixTime'
 
 const useStyles = makeStyles()((theme) => ({
     file: {
@@ -35,7 +36,7 @@ export const BackupInfoCard = memo(function BackupInfoCard({ info }: BackupInfoP
             operations={<Typography className={classes.desc}>{formatFileSize(info.size, true)}</Typography>}>
             {Number.isNaN(info.uploadedAt) ? null : (
                 <Typography fontSize={12} color="second">
-                    {formatDateTime(info.uploadedAt, 'yyyy-MM-dd hh:mm')}
+                    {formatDateTime(fromUnixTime(info.uploadedAt), 'yyyy-MM-dd hh:mm')}
                 </Typography>
             )}
         </FileFrame>

diff --git a/packages/mask/dashboard/components/Restore/RestoreFromCloud/ConfirmBackupInfo.tsx b/packages/mask/dashboard/components/Restore/RestoreFromCloud/ConfirmBackupInfo.tsx
@@ -64,6 +64,7 @@ export const ConfirmBackupInfo = memo(function ConfirmBackupInfo() {
             </PrimaryButton>,
         )
     }, [handleNext, t, loading])
+    console.log(backupFileInfo)
 
     if (!backupFileInfo) return null
 
@@ -75,7 +76,8 @@ export const ConfirmBackupInfo = memo(function ConfirmBackupInfo() {
             </Box>
             <Box mt={4}>
                 <PasswordField
-                    label={t.sign_in_account_cloud_backup_password()}
+                    fullWidth
+                    placeholder={t.sign_in_account_cloud_backup_password()}
                     onChange={(e) => {
                         setErrorMessage('')
                         setPassword(e.currentTarget.value)

diff --git a/packages/mask/dashboard/locales/en-US.json b/packages/mask/dashboard/locales/en-US.json
@@ -455,14 +455,14 @@
     "data_backup_title": "Select the contents of the backup",
     "data_backup_description": "Please select the appropriate method to restore your personal data.",
     "cloud_backup_title": "login to your Mask Cloud",
-    "cloud_backup_email_exists": "The email address used for the last backup was <strong>{{account}}</strong>.",
-    "cloud_backup_mobile_exists": "The mobile number used for last backup is <strong>{{account}}</strong>.",
+    "cloud_backup_backup_exists": "You used <strong>{{account}}</strong> for the last cloud backup..",
     "cloud_backup_no_exist_tips": "Please use your frequently used email account or mobile phone for backup.",
     "cloud_backup_email_title": "E-mail",
     "cloud_backup_phone_title": "Mobile",
     "cloud_backup_incorrect_email_address": "The email address is incorrect.",
     "cloud_backup_incorrect_verified_code": "The code is incorrect.",
     "cloud_backup_email_verification_code": "Email verification code",
+    "cloud_backup_phone_verification_code": "Phone verification code",
     "cloud_backup_preview_title": "Welcome to Mask Cloud Services",
     "cloud_backup_preview_description": "Please select the appropriate method to restore your personal data.",
     "cloud_backup_preview_switch_other_account": "Switch other account",

diff --git a/packages/mask/dashboard/modals/BackupPreviewModal/BackupPreviewDialog.tsx b/packages/mask/dashboard/modals/BackupPreviewModal/BackupPreviewDialog.tsx
@@ -95,6 +95,7 @@ export const BackupPreviewDialog = memo<BackupPreviewDialogProps>(function Backu
         },
     } = useBackupFormState()
     const { showSnackbar } = useCustomSnackbar()
+
     const [{ loading: uploadLoading, value }, handleUploadBackup] = useAsyncFn(
         async (data: BackupFormInputs) => {
             try {
@@ -106,15 +107,17 @@ export const BackupPreviewDialog = memo<BackupPreviewDialogProps>(function Backu
                     }
                 }
 
-                const { file, personaNickNames } = await Services.Backup.createBackupFile({
-                    excludeBase: backupPersonas,
-                    excludeWallet: backupWallets,
+                const { file } = await Services.Backup.createBackupFile({
+                    excludeBase: !backupPersonas,
+                    excludeWallet: !backupWallets,
                 })
+
+                const name = `mask-network-keystore-backup-${formatDateTime(new Date(), 'yyyy-MM-dd')}`
                 const uploadUrl = await fetchUploadLink({
                     code,
                     account,
                     type,
-                    abstract: abstract ?? personaNickNames.join(','),
+                    abstract: name,
                 })
                 const encrypted = await encryptBackup(encode(account + data.backupPassword), encode(file))
                 const controller = new AbortController()
@@ -203,7 +206,7 @@ export const BackupPreviewDialog = memo<BackupPreviewDialogProps>(function Backu
                     onChange={setBackupWallets}
                 />
 
-                {backupWallets ? (
+                {backupWallets && hasPassword ? (
                     <Controller
                         control={control}
                         render={({ field }) => (

diff --git a/packages/mask/dashboard/modals/MergeBackupModal/MergeBackupDialog.tsx b/packages/mask/dashboard/modals/MergeBackupModal/MergeBackupDialog.tsx
@@ -166,12 +166,12 @@ export const MergeBackupDialog = memo<MergeBackupDialogProps>(function MergeBack
             type,
             account,
         })
-        onClose()
-    }, [code, abstract, type, account])
+        handleClose()
+    }, [code, abstract, type, account, handleClose])
 
     if (showCongratulation)
         return (
-            <InjectedDialog title={t.cloud_backup_merge_to_local_database()} open={open} onClose={onClose}>
+            <InjectedDialog title={t.cloud_backup_merge_to_local_database()} open={open} onClose={handleClose}>
                 <DialogContent>
                     <Box className={classes.container}>
                         <Typography fontSize={36}>🎉</Typography>

diff --git a/packages/mask/dashboard/pages/SetupPersona/CloudBackup/PhoneForm.tsx b/packages/mask/dashboard/pages/SetupPersona/CloudBackup/PhoneForm.tsx
@@ -76,7 +76,7 @@ export const PhoneForm = memo(function PhoneForm() {
                         {...field}
                         onFocus={() => clearErrors('code')}
                         fullWidth
-                        placeholder={t.cloud_backup_email_verification_code()}
+                        placeholder={t.cloud_backup_phone_verification_code()}
                         error={!!errors.code?.message}
                         helperText={errors.code?.message}
                         InputProps={{

diff --git a/packages/mask/dashboard/pages/SetupPersona/CloudBackup/index.tsx b/packages/mask/dashboard/pages/SetupPersona/CloudBackup/index.tsx
@@ -119,14 +119,14 @@ const CloudBackupInner = memo(function CloudBackupInner() {
     const description = useMemo(() => {
         if (user.cloudBackupMethod === AccountType.Email && user.email)
             return (
-                <DashboardTrans.cloud_backup_email_exists
+                <DashboardTrans.cloud_backup_backup_exists
                     components={{ strong: <strong /> }}
                     values={{ account: user.email }}
                 />
             )
         if (user.cloudBackupMethod === AccountType.Phone && user.phone)
             return (
-                <DashboardTrans.cloud_backup_mobile_exists
+                <DashboardTrans.cloud_backup_backup_exists
                     components={{ strong: <strong /> }}
                     values={{ account: user.phone }}
                 />

diff --git a/packages/mask/dashboard/pages/SetupPersona/CloudBackupPreview/index.tsx b/packages/mask/dashboard/pages/SetupPersona/CloudBackupPreview/index.tsx
@@ -1,7 +1,7 @@
-import { Box, Tooltip, Typography } from '@mui/material'
+import { Box, Typography } from '@mui/material'
 import { memo, useCallback, useEffect, useMemo } from 'react'
 import { useDashboardI18N } from '../../../locales/i18n_generated.js'
-import { ActionButton, makeStyles } from '@masknet/theme'
+import { ActionButton, TextOverflowTooltip, makeStyles } from '@masknet/theme'
 import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 import { DashboardRoutes } from '@masknet/shared-base'
 import { Icons } from '@masknet/icons'
@@ -14,18 +14,6 @@ import type { AccountType } from '../../../type.js'
 import { EmptyStatus } from '@masknet/shared'
 import { SetupFrameController } from '../../../components/SetupFrame/index.js'
 
-function economizeAbstract(input: string) {
-    if (!input.length) return <div>error</div>
-    if (input.length < 30) return <div>{input}</div>
-    return (
-        <Tooltip title={input} placement="top" arrow>
-            <div>
-                {input.slice(0, 30)}...({input.split(',').length})
-            </div>
-        </Tooltip>
-    )
-}
-
 const useStyles = makeStyles()((theme) => ({
     title: {
         fontSize: 36,
@@ -162,9 +150,10 @@ export const CloudBackupPreview = memo(function CloudBackupPreview() {
                         <Box className={classes.content}>
                             <Icons.Message size={48} />
                             <Box flex={1}>
-                                <Typography className={classes.text}>
-                                    {economizeAbstract(previewInfo.abstract ?? '')}
-                                </Typography>
+                                <TextOverflowTooltip title={previewInfo.abstract} arrow placement="top">
+                                    <Typography className={classes.text}>{previewInfo.abstract}</Typography>
+                                </TextOverflowTooltip>
+
                                 <Typography display="flex" columnGap="4px">
                                     <Typography component="span" fontSize={12} fontWeight={700} lineHeight="16px">
                                         {formatFileSize(Number(previewInfo.size), false)}

diff --git a/packages/mask/src/extension/popups/pages/Settings/index.tsx b/packages/mask/src/extension/popups/pages/Settings/index.tsx
@@ -334,7 +334,7 @@ const Settings = memo(function Settings() {
                             <ListItemText
                                 classes={itemClasses}
                                 primary={t('popups_settings_faq')}
-                                secondary={FAQ_LINK}
+                                secondary={'realmasknetwork.notion.site'}
                             />
                             <Icons.ArrowRight size={24} className={classes.arrow} />
                         </ListItem>

diff --git a/packages/shared/src/UI/components/CountryCodePicker/index.tsx b/packages/shared/src/UI/components/CountryCodePicker/index.tsx
@@ -139,7 +139,7 @@ export const CountryCodePicker = memo<CountryCodePickerProps>(({ open, anchorEl,
                     })}
                 </List>
             ) : (
-                <EmptyStatus style={{ height: '100%' }}>{t.no_results()}</EmptyStatus>
+                <EmptyStatus style={{ height: 246 }}>{t.no_results()}</EmptyStatus>
             )}
         </Popover>
     )