From 6df680e9daeeee6ebbec89935e52af3d14bd8ae1 Mon Sep 17 00:00:00 2001 From: JiPai Date: Fri, 7 Mar 2025 23:32:15 +0800 Subject: [PATCH] feat(i18n): add internationalization support for 2FA setup and error messages --- .../dashboard/settings/profile/enable-2fa.tsx | 62 +++++++++++-------- apps/dokploy/public/locales/en/settings.json | 24 +++++++ .../public/locales/zh-Hans/settings.json | 24 +++++++ 3 files changed, 83 insertions(+), 27 deletions(-) diff --git a/apps/dokploy/components/dashboard/settings/profile/enable-2fa.tsx b/apps/dokploy/components/dashboard/settings/profile/enable-2fa.tsx index f47c8d9c..0945ab79 100644 --- a/apps/dokploy/components/dashboard/settings/profile/enable-2fa.tsx +++ b/apps/dokploy/components/dashboard/settings/profile/enable-2fa.tsx @@ -26,6 +26,7 @@ import { authClient } from "@/lib/auth-client"; import { api } from "@/utils/api"; import { zodResolver } from "@hookform/resolvers/zod"; import { Fingerprint, QrCode } from "lucide-react"; +import { useTranslation } from "next-i18next"; import QRCode from "qrcode"; import { useEffect, useState } from "react"; import { useForm } from "react-hook-form"; @@ -55,6 +56,7 @@ type PinForm = z.infer; export const Enable2FA = () => { const utils = api.useUtils(); + const { t } = useTranslation("settings"); const [data, setData] = useState(null); const [backupCodes, setBackupCodes] = useState([]); const [isDialogOpen, setIsDialogOpen] = useState(false); @@ -86,16 +88,18 @@ export const Enable2FA = () => { }); setStep("verify"); - toast.success("Scan the QR code with your authenticator app"); + toast.success(t("settings.2fa.scanQrCode")); } else { throw new Error("No TOTP URI received from server"); } } catch (error) { toast.error( - error instanceof Error ? error.message : "Error setting up 2FA", + error instanceof Error + ? error.message + : t("settings.2fa.errorSettingUp") ); passwordForm.setError("password", { - message: "Error verifying password", + message: t("settings.2fa.errorVerifyingPassword"), }); } finally { setIsPasswordLoading(false); @@ -111,9 +115,9 @@ export const Enable2FA = () => { if (result.error) { if (result.error.code === "INVALID_TWO_FACTOR_AUTHENTICATION") { pinForm.setError("pin", { - message: "Invalid code. Please try again.", + message: t("settings.2fa.invalidCode"), }); - toast.error("Invalid verification code"); + toast.error(t("settings.2fa.invalidVerificationCode")); return; } @@ -124,14 +128,14 @@ export const Enable2FA = () => { throw new Error("No response received from server"); } - toast.success("2FA configured successfully"); + toast.success(t("settings.2fa.success")); utils.user.get.invalidate(); setIsDialogOpen(false); } catch (error) { if (error instanceof Error) { const errorMessage = error.message === "Failed to fetch" - ? "Connection error. Please check your internet connection." + ? t("settings.2fa.connectionError") : error.message; pinForm.setError("pin", { @@ -140,9 +144,9 @@ export const Enable2FA = () => { toast.error(errorMessage); } else { pinForm.setError("pin", { - message: "Error verifying code", + message: t("settings.2fa.errorVerifyingCode"), }); - toast.error("Error verifying 2FA code"); + toast.error(t("settings.2fa.errorVerifying2faCode")); } } }; @@ -176,16 +180,16 @@ export const Enable2FA = () => { - 2FA Setup + {t("settings.2fa.title")} {step === "password" - ? "Enter your password to begin 2FA setup" - : "Scan the QR code and verify with your authenticator app"} + ? t("settings.2fa.enterPassword") + : t("settings.2fa.scanQrCodeAndVerify")} @@ -201,16 +205,18 @@ export const Enable2FA = () => { name="password" render={({ field }) => ( - Password + + {t("settings.2fa.password")} + - Enter your password to enable 2FA + {t("settings.2fa.enterPasswordDescription")} @@ -221,7 +227,7 @@ export const Enable2FA = () => { className="w-full" isLoading={isPasswordLoading} > - Continue + {t("settings.2fa.continue")} @@ -238,16 +244,16 @@ export const Enable2FA = () => {
- Scan this QR code with your authenticator app + {t("settings.2fa.scanQrCode")} 2FA QR Code
- Can't scan the QR code? + {t("settings.2fa.cantScanQrCode")} {data.secret} @@ -257,7 +263,9 @@ export const Enable2FA = () => { {backupCodes && backupCodes.length > 0 && (
-

Backup Codes

+

+ {t("settings.2fa.backupCodes")} +

{backupCodes.map((code, index) => ( { ))}

- Save these backup codes in a secure place. You can use - them to access your account if you lose access to your - authenticator device. + {t("settings.2fa.saveBackupCodes")}

)} @@ -288,7 +294,9 @@ export const Enable2FA = () => { name="pin" render={({ field }) => ( - Verification Code + + {t("settings.2fa.verificationCode")} + @@ -302,7 +310,7 @@ export const Enable2FA = () => { - Enter the 6-digit code from your authenticator app + {t("settings.2fa.enterVerificationCode")} @@ -314,7 +322,7 @@ export const Enable2FA = () => { className="w-full" isLoading={isPasswordLoading} > - Enable 2FA + {t("settings.2fa.enable2fa")} diff --git a/apps/dokploy/public/locales/en/settings.json b/apps/dokploy/public/locales/en/settings.json index 1f16b64c..ee7961ee 100644 --- a/apps/dokploy/public/locales/en/settings.json +++ b/apps/dokploy/public/locales/en/settings.json @@ -43,6 +43,30 @@ "settings.profile.password": "Password", "settings.profile.avatar": "Avatar", + "settings.2fa.enable2fa": "Enable 2FA", + "settings.2fa.title": "2FA Setup", + "settings.2fa.enterPassword": "Enter your password to begin 2FA setup", + "settings.2fa.scanQrCodeAndVerify": "Scan the QR code and verify with your authenticator app", + "settings.2fa.password": "Password", + "settings.2fa.enterPasswordPlaceholder": "Enter your password", + "settings.2fa.enterPasswordDescription": "Enter your password to enable 2FA", + "settings.2fa.continue": "Continue", + "settings.2fa.scanQrCode": "Scan this QR code with your authenticator app", + "settings.2fa.qrCodeAlt": "2FA QR Code", + "settings.2fa.cantScanQrCode": "Can't scan the QR code?", + "settings.2fa.backupCodes": "Backup Codes", + "settings.2fa.saveBackupCodes": "Save these backup codes in a secure place. You can use them to access your account if you lose access to your authenticator device.", + "settings.2fa.verificationCode": "Verification Code", + "settings.2fa.enterVerificationCode": "Enter the 6-digit code from your authenticator app", + "settings.2fa.errorSettingUp": "Error setting up 2FA", + "settings.2fa.errorVerifyingPassword": "Error verifying password", + "settings.2fa.invalidCode": "Invalid code. Please try again.", + "settings.2fa.invalidVerificationCode": "Invalid verification code", + "settings.2fa.success": "2FA configured successfully", + "settings.2fa.connectionError": "Connection error. Please check your internet connection.", + "settings.2fa.errorVerifyingCode": "Error verifying code", + "settings.2fa.errorVerifying2faCode": "Error verifying 2FA code", + "settings.appearance.title": "Appearance", "settings.appearance.description": "Customize the theme of your dashboard.", "settings.appearance.theme": "Theme", diff --git a/apps/dokploy/public/locales/zh-Hans/settings.json b/apps/dokploy/public/locales/zh-Hans/settings.json index f950a468..c16365e4 100644 --- a/apps/dokploy/public/locales/zh-Hans/settings.json +++ b/apps/dokploy/public/locales/zh-Hans/settings.json @@ -43,6 +43,30 @@ "settings.profile.password": "密码", "settings.profile.avatar": "头像", + "settings.2fa.enable2fa": "启用 2FA", + "settings.2fa.title": "2FA 设置", + "settings.2fa.enterPassword": "输入您的密码以开始 2FA 设置", + "settings.2fa.scanQrCodeAndVerify": "扫描二维码并使用您的身份验证器应用程序进行验证", + "settings.2fa.password": "密码", + "settings.2fa.enterPasswordPlaceholder": "输入您的密码", + "settings.2fa.enterPasswordDescription": "输入您的密码以启用 2FA", + "settings.2fa.continue": "继续", + "settings.2fa.scanQrCode": "使用您的身份验证器应用程序扫描此二维码", + "settings.2fa.qrCodeAlt": "2FA 二维码", + "settings.2fa.cantScanQrCode": "无法扫描二维码？", + "settings.2fa.backupCodes": "备份代码", + "settings.2fa.saveBackupCodes": "将这些备份代码保存在安全的地方。如果您丢失了身份验证设备，可以使用它们访问您的帐户。", + "settings.2fa.verificationCode": "验证码", + "settings.2fa.enterVerificationCode": "输入您的身份验证器应用程序中的 6 位数代码", + "settings.2fa.errorSettingUp": "设置 2FA 时出错", + "settings.2fa.errorVerifyingPassword": "验证密码时出错", + "settings.2fa.invalidCode": "无效的代码。请再试一次。", + "settings.2fa.invalidVerificationCode": "无效的验证码", + "settings.2fa.success": "2FA 配置成功", + "settings.2fa.connectionError": "连接错误。请检查您的互联网连接。", + "settings.2fa.errorVerifyingCode": "验证代码时出错", + "settings.2fa.errorVerifying2faCode": "验证 2FA 代码时出错", + "settings.appearance.title": "外观", "settings.appearance.description": "自定义面板主题", "settings.appearance.theme": "主题",