diff --git a/packages/dashboard/src/components/MaskAlert/index.tsx b/packages/dashboard/src/components/MaskAlert/index.tsx
index 1f2219b08145..b6359002edb8 100644
--- a/packages/dashboard/src/components/MaskAlert/index.tsx
+++ b/packages/dashboard/src/components/MaskAlert/index.tsx
@@ -41,11 +41,24 @@ const InfoAlert = styled(Alert)(({ theme }) => ({
[`&.${alertClasses.standardError} .${alertClasses.message}`]: {
color: `${getMaskColor(theme).redMain}`,
},
+ // success
+ [`&.${alertClasses.standardSuccess}`]: {
+ backgroundColor: `${MaskColorVar.greenMain.alpha(0.1)}`,
+ },
+ [`&.${alertClasses.standardSuccess} .${alertClasses.icon}`]: {
+ color: `${getMaskColor(theme).greenMain}`,
+ },
+ [`&.${alertClasses.standardSuccess} .${alertClasses.action}`]: {
+ color: `${getMaskColor(theme).greenMain}`,
+ },
+ [`&.${alertClasses.standardSuccess} .${alertClasses.message}`]: {
+ color: `${getMaskColor(theme).greenMain}`,
+ },
}))
export interface MaskAlertProps {
description: string
- type?: 'error' | 'info'
+ type?: 'error' | 'info' | 'success'
}
export const MaskAlert = memo(({ description, type = 'info' }: MaskAlertProps) => {
diff --git a/packages/dashboard/src/locales/en-US.json b/packages/dashboard/src/locales/en-US.json
index 82ac8aa2058d..a3303604d92a 100644
--- a/packages/dashboard/src/locales/en-US.json
+++ b/packages/dashboard/src/locales/en-US.json
@@ -268,10 +268,10 @@
"settings_dialogs_change_email_validation": "To change the Email, you need to verify your current Email address:",
"settings_dialogs_current_phone_validation": "The current phone number for verification is",
"settings_dialogs_change_phone_validation": "To change the phone number, you need to verify your current phone number:",
- "settings_dialogs_merge_to_local": "Merge to local",
- "settings_dialogs_merge_to_local_data": "Merge to local and Backup",
- "settings_dialogs_upload_local_data": "Upload local data",
- "settings_dialogs_backup_action_desc": "There is already a cloud backup, please merge the cloud backup to local before you back up.",
+ "settings_dialogs_backup_to_cloud": "Backup to cloud",
+ "settings_dialogs_merge_to_local_data": "Merge Cloud backup to local and backup to cloud",
+ "settings_dialogs_backup_action_desc": "There is already a cloud backup, please merge the cloud backup to local before you back up, or back up directly.",
+ "settings_dialogs_backup_merged_tip": "You already obtained the cloud backup to your local. If you want to complete your back up, please click on the backup button to update all your data to cloud.",
"settings_label_backup_password": "Backup Password",
"settings_label_new_backup_password": "New Backup Password",
"settings_label_backup_password_cloud": "Backup passwords for files in the cloud",
diff --git a/packages/dashboard/src/pages/Settings/components/BackupSetting.tsx b/packages/dashboard/src/pages/Settings/components/BackupSetting.tsx
index 68a2309687b4..aab104e01246 100644
--- a/packages/dashboard/src/pages/Settings/components/BackupSetting.tsx
+++ b/packages/dashboard/src/pages/Settings/components/BackupSetting.tsx
@@ -14,6 +14,7 @@ export default function BackupSetting() {
const t = useDashboardI18N()
const { state } = useLocation() as { state: { open: 'setting' | null } }
const { ensurePasswordSet } = useContext(UserContext)
+ const [merged, setMerged] = useState(false)
const [showDialog, setShowDialog] = useState({
backup: false,
mode: false,
@@ -62,6 +63,7 @@ export default function BackupSetting() {
local={localMode}
params={params}
open={showDialog.backup}
+ merged={merged}
onClose={() => setShowDialog({ ...showDialog, backup: false })}
/>
) : null}
@@ -85,7 +87,10 @@ export default function BackupSetting() {
info={cloudFileInfo}
open={showDialog.merge}
onClose={() => setShowDialog({ ...showDialog, merge: false })}
- onMerged={() => setShowDialog({ ...showDialog, merge: false, backup: true })}
+ onMerged={(merged) => {
+ setMerged(merged)
+ setShowDialog({ ...showDialog, merge: false, backup: true })
+ }}
/>
) : null}
>
diff --git a/packages/dashboard/src/pages/Settings/components/dialogs/BackupDialog.tsx b/packages/dashboard/src/pages/Settings/components/dialogs/BackupDialog.tsx
index 4853741ccd75..3e5cbb4a2afb 100644
--- a/packages/dashboard/src/pages/Settings/components/dialogs/BackupDialog.tsx
+++ b/packages/dashboard/src/pages/Settings/components/dialogs/BackupDialog.tsx
@@ -13,15 +13,17 @@ import { LoadingCard } from '../../../../components/Restore/steps/LoadingCard'
import { encryptBackup } from '@masknet/backup-format'
import { encode } from '@msgpack/msgpack'
import PasswordFiled from '../../../../components/PasswordField'
+import { MaskAlert } from '../../../../components/MaskAlert'
export interface BackupDialogProps {
local?: boolean
params?: VerifyCodeRequest
open: boolean
+ merged?: boolean
onClose(): void
}
-export default function BackupDialog({ local = true, params, open, onClose }: BackupDialogProps) {
+export default function BackupDialog({ local = true, params, open, merged, onClose }: BackupDialogProps) {
const snackbar = useSnackbar()
const t = useDashboardI18N()
const [backupPassword, setBackupPassword] = useState('')
@@ -118,6 +120,12 @@ export default function BackupDialog({ local = true, params, open, onClose }: Ba
) : (
+ {merged ? (
+
+
+
+ ) : null}
+
{previewInfo ? : null}
{
+ if (mode === '1') {
+ onMerged(false)
+ } else {
+ handleMerge()
+ }
+ }
+
useEffect(() => {
setIncorrectBackupPassword(false)
}, [backupPassword])
@@ -55,18 +84,35 @@ export function CloudBackupMergeDialog({ account, info, open, onClose, onMerged
{t.settings_dialogs_backup_action_desc()}
- setBackupPassword(event.target.value)}
- placeholder={t.settings_label_backup_password_cloud()}
- sx={{ marginBottom: '24px' }}
- error={incorrectBackupPassword}
- helperText={incorrectBackupPassword ? t.settings_dialogs_incorrect_password() : ''}
- />
-
- {t.settings_dialogs_merge_to_local_data()}
+ setMode(e.target.value)}>
+ }
+ label={t.settings_dialogs_backup_to_cloud()}
+ />
+ }
+ label={t.settings_dialogs_merge_to_local_data()}
+ />
+
+
+ {mode === '2' ? (
+ setBackupPassword(event.target.value)}
+ placeholder={t.settings_label_backup_password_cloud()}
+ sx={{ marginBottom: '24px' }}
+ error={incorrectBackupPassword}
+ helperText={incorrectBackupPassword ? t.settings_dialogs_incorrect_password() : ''}
+ />
+ ) : null}
+
+
+ {t.settings_button_backup()}
diff --git a/packages/dashboard/src/pages/Settings/components/dialogs/CloudBackupPreviewDialog.tsx b/packages/dashboard/src/pages/Settings/components/dialogs/CloudBackupPreviewDialog.tsx
deleted file mode 100644
index a41ad6fa9f1c..000000000000
--- a/packages/dashboard/src/pages/Settings/components/dialogs/CloudBackupPreviewDialog.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import { MaskDialog } from '@masknet/theme'
-import { Box, Typography, Button } from '@material-ui/core'
-import { BackupInfoCard } from '../../../../components/Restore/BackupInfoCard'
-import { useDashboardI18N } from '../../../../locales'
-import type { BackupFileInfo } from '../../type'
-
-export type Action = 'merge' | 'upload'
-
-export interface CloudBackupPreviewDialogProps {
- info: BackupFileInfo
- open: boolean
- onClose(): void
- onSelect(action: Action): void
-}
-
-export function CloudBackupPreviewDialog({ info, open, onClose, onSelect }: CloudBackupPreviewDialogProps) {
- const t = useDashboardI18N()
-
- return (
-
-
-
-
- {t.settings_dialogs_backup_action_desc()}
-
-
-
-
-
-
-
-
- )
-}