🐛 fix(user): Update notification and verify code settings

2025-02-14 15:39:25 +07:00
parent e3f9ef6ebe
commit 574b043be6
112 changed files with 500 additions and 502 deletions
@@ -3,13 +3,15 @@
 import { Invite } from './invite';
 import { Register } from './register';
 import { Verify } from './verify';
+import { VerifyCode } from './verify-code';

 export default function Page() {
  return (
    <div className='space-y-3'>
-      <Register />
-      <Verify />
      <Invite />
+      <Register />
+      <VerifyCode />
+      <Verify />
    </div>
  );
 }
@@ -0,0 +1,95 @@
+'use client';
+
+import { getVerifyCodeConfig, updateVerifyCodeConfig } from '@/services/admin/system';
+import { useQuery } from '@tanstack/react-query';
+import { Card, CardContent, CardHeader, CardTitle } from '@workspace/ui/components/card';
+import { Label } from '@workspace/ui/components/label';
+import { Table, TableBody, TableCell, TableRow } from '@workspace/ui/components/table';
+import { EnhancedInput } from '@workspace/ui/custom-components/enhanced-input';
+import { useTranslations } from 'next-intl';
+import { toast } from 'sonner';
+
+export function VerifyCode() {
+  const t = useTranslations('auth-control.verify-code');
+
+  const { data, refetch } = useQuery({
+    queryKey: ['getVerifyCodeConfig'],
+    queryFn: async () => {
+      const { data } = await getVerifyCodeConfig();
+      return data.data;
+    },
+  });
+
+  async function updateConfig(key: string, value: unknown) {
+    if (data?.[key] === value) return;
+    try {
+      await updateVerifyCodeConfig({
+        ...data,
+        [key]: value,
+      } as API.VerifyCodeConfig);
+      toast.success(t('saveSuccess'));
+      refetch();
+    } catch (error) {
+      /* empty */
+    }
+  }
+
+  return (
+    <Card className='mb-6'>
+      <CardHeader>
+        <CardTitle>{t('verifyCodeSettings')}</CardTitle>
+      </CardHeader>
+      <CardContent>
+        <Table>
+          <TableBody>
+            <TableRow>
+              <TableCell>
+                <Label>{t('expireTime')}</Label>
+                <p className='text-muted-foreground text-xs'>{t('expireTimeDescription')}</p>
+              </TableCell>
+              <TableCell className='text-right'>
+                <EnhancedInput
+                  type='number'
+                  placeholder='5'
+                  value={data?.verify_code_expire_time}
+                  onValueBlur={(value) => updateConfig('verify_code_expire_time', Number(value))}
+                  suffix={t('minute')}
+                />
+              </TableCell>
+            </TableRow>
+            <TableRow>
+              <TableCell>
+                <Label>{t('interval')}</Label>
+                <p className='text-muted-foreground text-xs'>{t('intervalDescription')}</p>
+              </TableCell>
+              <TableCell className='text-right'>
+                <EnhancedInput
+                  type='number'
+                  placeholder='60'
+                  value={data?.verify_code_interval}
+                  onValueBlur={(value) => updateConfig('verify_code_interval', Number(value))}
+                  suffix={t('second')}
+                />
+              </TableCell>
+            </TableRow>
+            <TableRow>
+              <TableCell>
+                <Label>{t('dailyLimit')}</Label>
+                <p className='text-muted-foreground text-xs'>{t('dailyLimitDescription')}</p>
+              </TableCell>
+              <TableCell className='text-right'>
+                <EnhancedInput
+                  type='number'
+                  placeholder='15'
+                  value={data?.verify_code_limit}
+                  onValueBlur={(value) => updateConfig('verify_code_limit', Number(value))}
+                  suffix={t('times')}
+                />
+              </TableCell>
+            </TableRow>
+          </TableBody>
+        </Table>
+      </CardContent>
+    </Card>
+  );
+}