Skip to content

Commit 9c22f0b

Browse files
fix: Unsynchronized backup settings (labring#5615)
* fix: Unsynchronized backup settings chore: create db table heading copyright adjust * chore: clean unused code * fix: Update the terminal version and use the built-in mc client * fix: comma * chore: duplicated key
1 parent 6eb28db commit 9c22f0b

6 files changed

Lines changed: 59 additions & 67 deletions

File tree

frontend/providers/dbprovider/public/locales/en/common.json

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -382,9 +382,10 @@
382382
"edit_password_failed": "Failed to edit password",
383383
"edit_password_tip": "Editing the password will cause the database to restart",
384384
"comp_name": "Component Name",
385-
"has_comps": "has {number} components",
386-
"each": "{perc} each",
387-
"occupy": "occupies {num}",
385+
"has_comps_one": " has {{count}} component",
386+
"has_comps_other": " has {{count}} components",
387+
"each": " each occupy {{perc}}",
388+
"occupy": "{{comp}} occupies {{num}}",
388389
"ha_desc": "Sentinel nodes take up extra resources",
389390
"pod_completed": "Pod has ended, cannot view logs",
390391
"app_already_exists": "App name already exists. Please use a different name or check your app list."

frontend/providers/dbprovider/src/pages/api/migrate/createDump.ts

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -64,11 +64,9 @@ export const json2DumpCR = async (
6464
const time = formatTime(new Date(), 'YYYYMMDDHHmmss');
6565

6666
const commands = new Command();
67-
commands.add('wget https://objectstorageapi.gzg.sealos.run/7nl57qi8-test/mc -O mc');
68-
commands.add('chmod +x mc');
6967
// Configure MinIO
70-
commands.add(`./mc alias set migrationTask $MINIO_URL $MINIO_AK $MINIO_SK`);
71-
commands.add(`./mc cp migrationTask/$BUCKET/${data.fileName} /root`);
68+
commands.add(`mc alias set migrationTask $MINIO_URL $MINIO_AK $MINIO_SK`);
69+
commands.add(`mc cp migrationTask/$BUCKET/${data.fileName} /root`);
7270

7371
const secretMysql = `--host=$HOST --port=$PORT --user=$USERNAME --password=$PASSWORD`;
7472
const secretPg = `--host=$HOST --port=$PORT --user=$USERNAME -w`;

frontend/providers/dbprovider/src/pages/db/detail/components/BackupModal.tsx

Lines changed: 36 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
1-
import { createBackup, updateBackupPolicy } from '@/api/backup';
1+
import { createBackup, getBackupPolicyByCluster, updateBackupPolicy } from '@/api/backup';
22
import Tip from '@/components/Tip';
33
import { DBBackupMethodNameMap, DBTypeEnum, SelectTimeList, WeekSelectList } from '@/constants/db';
44
import { useConfirm } from '@/hooks/useConfirm';
55
import type { AutoBackupFormType, AutoBackupType } from '@/types/backup';
6-
import { I18nCommonKey } from '@/types/i18next';
76
import { convertCronTime, getErrText } from '@/utils/tools';
87
import { InfoOutlineIcon } from '@chakra-ui/icons';
98
import {
@@ -17,14 +16,13 @@ import {
1716
ModalCloseButton,
1817
ModalContent,
1918
ModalOverlay,
20-
Switch,
21-
useTheme
19+
Switch
2220
} from '@chakra-ui/react';
2321
import { MySelect, Tabs, useMessage } from '@sealos/ui';
24-
import { useMutation } from '@tanstack/react-query';
22+
import { useMutation, useQuery } from '@tanstack/react-query';
2523
import { customAlphabet } from 'nanoid';
2624
import { useTranslation } from 'next-i18next';
27-
import { MutableRefObject, useCallback, useRef, useState } from 'react';
25+
import { useCallback, useEffect, useState } from 'react';
2826
import { useForm } from 'react-hook-form';
2927
const nanoid = customAlphabet('abcdefghijklmnopqrstuvwxyz1234567890', 6);
3028

@@ -34,22 +32,29 @@ enum NavEnum {
3432
}
3533

3634
const BackupModal = ({
37-
defaultVal,
3835
dbName,
3936
dbType,
40-
onClose,
41-
refetchPolicy
37+
onClose
4238
}: {
43-
defaultVal: AutoBackupFormType;
4439
dbName: string;
4540
dbType: `${DBTypeEnum}`;
4641
onClose: () => void;
47-
refetchPolicy: () => void;
4842
}) => {
4943
const { t } = useTranslation();
50-
const theme = useTheme();
5144
const { message: toast } = useMessage();
5245

46+
const { data: defaultVal, refetch: refetchPolicy } = useQuery(
47+
['initpolicy', dbName, dbType],
48+
() =>
49+
getBackupPolicyByCluster({
50+
dbName,
51+
dbType
52+
}),
53+
{
54+
refetchOnMount: true
55+
}
56+
);
57+
5358
const { openConfirm, ConfirmChild } = useConfirm({
5459
title: 'confirm',
5560
content: 'manual_backup_tip',
@@ -78,9 +83,18 @@ const BackupModal = ({
7883
register: autoRegister,
7984
handleSubmit: handleSubmitAuto,
8085
getValues: getAutoValues,
81-
setValue: setAutoValue
86+
setValue: setAutoValue,
87+
reset: resetAutoForm
8288
} = useForm<AutoBackupFormType>({
83-
defaultValues: defaultVal
89+
defaultValues: {
90+
start: false,
91+
type: 'day',
92+
week: [],
93+
hour: '18',
94+
minute: '00',
95+
saveTime: 7,
96+
saveType: 'd'
97+
}
8498
});
8599

86100
const navStyle = useCallback(
@@ -196,6 +210,13 @@ const BackupModal = ({
196210
}
197211
});
198212

213+
useEffect(() => {
214+
if (defaultVal) {
215+
resetAutoForm(defaultVal);
216+
}
217+
setRefresh((state) => !state);
218+
}, [defaultVal, resetAutoForm]);
219+
199220
return (
200221
<>
201222
<Modal isOpen onClose={onClose} isCentered lockFocusAcrossFrames={false}>
@@ -221,7 +242,7 @@ const BackupModal = ({
221242
variant={'deepLight'}
222243
isChecked={getAutoValues('start')}
223244
onChange={(e) => {
224-
if (defaultVal.start) {
245+
if (defaultVal?.start) {
225246
CloseAutoBackup(onclickCloseAutoBackup)();
226247
return;
227248
}

frontend/providers/dbprovider/src/pages/db/detail/components/BackupTable.tsx

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -201,13 +201,6 @@ const BackupTable = ({ db }: { db?: DBDetailType }, ref: ForwardedRef<ComponentR
201201
backupProcessing
202202
}));
203203

204-
const { data, refetch: refetchPolicy } = useQuery(['initpolicy', db.dbName, db.dbType], () =>
205-
getBackupPolicyByCluster({
206-
dbName: db.dbName,
207-
dbType: db.dbType
208-
})
209-
);
210-
211204
return (
212205
<Flex flexDirection={'column'} h="100%" position={'relative'}>
213206
<Flex justifyContent={'space-between'} alignItems={'center'} mb={'16px'}>
@@ -284,14 +277,8 @@ const BackupTable = ({ db }: { db?: DBDetailType }, ref: ForwardedRef<ComponentR
284277
)}
285278
<Loading loading={isInitialLoading} fixed={false} />
286279
<RestartConfirmDelChild />
287-
{isOpenBackupModal && data && (
288-
<BackupModal
289-
dbName={db.dbName}
290-
dbType={db.dbType}
291-
defaultVal={data}
292-
onClose={onCloseBackupModal}
293-
refetchPolicy={refetchPolicy}
294-
/>
280+
{isOpenBackupModal && (
281+
<BackupModal dbName={db.dbName} dbType={db.dbType} onClose={onCloseBackupModal} />
295282
)}
296283
{!!backupInfo?.name && (
297284
<RestoreModal db={db} backupInfo={backupInfo} onClose={() => setBackupInfo(undefined)} />

frontend/providers/dbprovider/src/pages/db/edit/components/Form.tsx

Lines changed: 15 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@ import { AutoBackupType } from '@/types/backup';
1919
import type { DBEditType, DBType } from '@/types/db';
2020
import { I18nCommonKey } from '@/types/i18next';
2121
import { distributeResources } from '@/utils/database';
22-
import { tWithParams } from '@/utils/i18n-client';
2322
import { InfoOutlineIcon } from '@chakra-ui/icons';
2423
import {
2524
Accordion,
@@ -59,18 +58,24 @@ import { UseFormReturn } from 'react-hook-form';
5958

6059
function ResourcesDistributeTable({ data }: { data: Parameters<typeof distributeResources>[0] }) {
6160
const resources = distributeResources(data);
62-
const { t } = useTranslation();
61+
const { t, i18n } = useTranslation();
6362

6463
const compNum = Object.keys(resources).length;
65-
const dbName = DBTypeList.findLast((item) => item.id === data.dbType)!.label;
64+
const dbName = DBTypeList.find((item) => item.id === data.dbType)?.label ?? '';
6665

6766
const descriptionMap: Map<DBType, string> = new Map([
68-
[DBTypeEnum.postgresql, tWithParams('occupy', { num: '100%' })],
69-
[DBTypeEnum.mongodb, tWithParams('occupy', { num: '100%' })],
70-
[DBTypeEnum.mysql, tWithParams('occupy', { num: '100%' })],
71-
[DBTypeEnum.redis, `redis ${tWithParams('occupy', { num: '100%' })}, ${t('ha_desc')}`],
72-
[DBTypeEnum.kafka, tWithParams('each', { perc: '25%' })],
73-
[DBTypeEnum.milvus, tWithParams('each', { perc: '30%, 40%, 30%' })]
67+
[DBTypeEnum.postgresql, t('occupy', { comp: 'PostgreSQL', num: '100%' })],
68+
[DBTypeEnum.mongodb, t('occupy', { comp: 'MongoDB', num: '100%' })],
69+
[DBTypeEnum.mysql, t('occupy', { comp: 'MySQL', num: '100%' })],
70+
[DBTypeEnum.redis, `${t('occupy', { comp: 'Redis', num: '100%' })}, ${t('ha_desc')}`],
71+
[DBTypeEnum.kafka, `Controller, broker, exporter, server${t('each', { perc: '25%' })}`],
72+
[
73+
DBTypeEnum.milvus,
74+
`${t('occupy', { comp: 'Etcd', num: '30%' })}, ${t('occupy', {
75+
comp: 'milvus',
76+
num: '40%'
77+
})}, ${t('occupy', { comp: 'minio', num: '30%' })}`
78+
]
7479
]);
7580

7681
return (
@@ -106,18 +111,7 @@ function ResourcesDistributeTable({ data }: { data: Parameters<typeof distribute
106111
<MyIcon name="warningInfo" w={'16px'} h={'16px'} mr={2} />
107112
<Text fontWeight="500">
108113
{dbName}
109-
{tWithParams('has_comps', { number: compNum })}:&emsp;
110-
</Text>
111-
<Text>
112-
{Object.keys(resources)
113-
.sort()
114-
.map((item) => {
115-
return item.split('-').at(-1);
116-
})
117-
.join(', ')}
118-
</Text>
119-
<Text mx={2} color="#C4CBD7">
120-
|
114+
{t('has_comps', { count: compNum })}:&emsp;
121115
</Text>
122116
<Text>{descriptionMap.get(data.dbType)}</Text>
123117
</Box>

frontend/providers/dbprovider/src/utils/i18n-client.ts

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,3 @@ export function assembleTranslate(key: Array<keyword>, language: string) {
1010
const { t } = useTranslation();
1111
return key.map((item) => t(item)).join(language === 'en' ? ' ' : '');
1212
}
13-
14-
export function tWithParams(key: keyword, params: { [key: string]: string | number }) {
15-
const { t } = useTranslation();
16-
let res = t(key) as string;
17-
Object.entries(params).forEach(([key, value]) => {
18-
res = res.replaceAll(`{${key}}`, value.toString());
19-
});
20-
return res;
21-
}

0 commit comments

Comments
 (0)