diff --git a/apps/admin/app/dashboard/auth-control/email/page.tsx b/apps/admin/app/dashboard/auth-control/email/page.tsx index 86b315b..db5f9ae 100644 --- a/apps/admin/app/dashboard/auth-control/email/page.tsx +++ b/apps/admin/app/dashboard/auth-control/email/page.tsx @@ -3,25 +3,28 @@ import { getEmailSmtpConfig, testEmailSmtp, updateEmailSmtpConfig } from '@/services/admin/system'; import { useQuery } from '@tanstack/react-query'; import { Button } from '@workspace/ui/components/button'; +import { + Card, + CardContent, + CardDescription, + CardHeader, + CardTitle, +} from '@workspace/ui/components/card'; import { Label } from '@workspace/ui/components/label'; import { Switch } from '@workspace/ui/components/switch'; import { Table, TableBody, TableCell, TableRow } from '@workspace/ui/components/table'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@workspace/ui/components/tabs'; +import { Textarea } from '@workspace/ui/components/textarea'; import { HTMLEditor } from '@workspace/ui/custom-components/editor'; import { EnhancedInput } from '@workspace/ui/custom-components/enhanced-input'; import { useTranslations } from 'next-intl'; import { useRef, useState } from 'react'; import { toast } from 'sonner'; -interface ConfigProps { - data?: Record & API.EmailSmtpConfig; - updateConfig: (key: string, value: unknown) => Promise; - isFetching?: boolean; -} - export default function Page() { const t = useTranslations('email'); const ref = useRef>({}); + const [email, setEmail] = useState(); const { data, refetch, isFetching } = useQuery({ queryKey: ['getEmailSmtpConfig'], @@ -42,10 +45,9 @@ export default function Page() { toast.success(t('saveSuccess')); refetch(); } catch (error) { - /* empty */ + toast.error(t('saveFailed')); } } - const [email, setEmail] = useState(); return ( @@ -54,126 +56,154 @@ export default function Page() { {t('emailTemplate')} {t('emailLogs')} - -
- - - - {[ - { - key: 'email_smtp_host', - label: t('smtpServerAddress'), - description: t('smtpServerAddressDescription'), - }, - { - key: 'email_smtp_port', - label: t('smtpServerPort'), - description: t('smtpServerPortDescription'), - type: 'number', - }, - { - key: 'email_smtp_ssl', - label: t('smtpEncryptionMethod'), - description: t('smtpEncryptionMethodDescription'), - component: 'switch', - }, - { - key: 'email_smtp_user', - label: t('smtpAccount'), - description: t('smtpAccountDescription'), - }, - { - key: 'email_smtp_pass', - label: t('smtpPassword'), - description: t('smtpPasswordDescription'), - type: 'password', - }, - { - key: 'email_smtp_from', - label: t('senderAddress'), - description: t('senderAddressDescription'), - }, - ].map(({ key, label, description, type = 'text', component = 'input' }) => ( - - - -

{description}

-
- - {component === 'input' ? ( - updateConfig(key, value)} - /> - ) : ( - updateConfig(key, checked)} - /> - )} - -
- ))} - - - -

{t('sendTestEmailDescription')}

+ +
+ + {[ + { + key: 'email_enabled', + label: t('enable'), + description: t('enableDescription'), + component: 'switch', + }, + { + key: 'enable_email_verify', + label: t('emailVerification'), + description: t('emailVerificationDescription'), + component: 'switch', + }, + { + key: 'enable_email_domain_suffix', + label: t('emailSuffixWhitelist'), + description: t('emailSuffixWhitelistDescription'), + component: 'switch', + }, + { + key: 'email_domain_suffix_list', + label: t('whitelistSuffixes'), + description: t('whitelistSuffixesDescription'), + component: 'textarea', + }, + { + key: 'email_smtp_host', + label: t('smtpServerAddress'), + description: t('smtpServerAddressDescription'), + }, + { + key: 'email_smtp_port', + label: t('smtpServerPort'), + description: t('smtpServerPortDescription'), + type: 'number', + }, + { + key: 'email_smtp_ssl', + label: t('smtpEncryptionMethod'), + description: t('smtpEncryptionMethodDescription'), + component: 'switch', + }, + { + key: 'email_smtp_user', + label: t('smtpAccount'), + description: t('smtpAccountDescription'), + }, + { + key: 'email_smtp_pass', + label: t('smtpPassword'), + description: t('smtpPasswordDescription'), + type: 'password', + }, + { + key: 'email_smtp_from', + label: t('senderAddress'), + description: t('senderAddressDescription'), + }, + ].map(({ key, label, description, type = 'text', component = 'input' }) => ( + + + +

{description}

- - setEmail(value as string)} - /> - + + {component === 'input' ? ( + updateConfig(key, value)} + /> + ) : component === 'switch' ? ( + updateConfig(key, checked)} + /> + ) : ( +