feat: 添加用户账号侧边栏的多语言

Fizznoc · Sep 18, 2024 · d6f561e · d6f561e
1 parent 97f2f07
commit d6f561e
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 12 deletions.
diff --git a/src/components/layout/user-account-nav.tsx b/src/components/layout/user-account-nav.tsx
@@ -1,9 +1,9 @@
 "use client";
 
 import { useState } from "react";
-import Link from "@/components/link/link";
 import { LayoutDashboard, Lock, LogOut, Settings } from "lucide-react";
 import { signOut, useSession } from "next-auth/react";
+import { useTranslations } from "next-intl";
 import { Drawer } from "vaul";
 
 import { useMediaQuery } from "@/hooks/use-media-query";
@@ -14,9 +14,11 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
+import Link from "@/components/link/link";
 import { UserAvatar } from "@/components/shared/user-avatar";
 
 export function UserAccountNav() {
+  const t = useTranslations("UserAccountNav");
   const { data: session } = useSession();
   const user = session?.user;
 
@@ -71,7 +73,7 @@ export function UserAccountNav() {
                     className="flex w-full items-center gap-3 px-2.5 py-2"
                   >
                     <Lock className="size-4" />
-                    <p className="text-sm">Admin</p>
+                    <p className="text-sm">{t("admin")}</p>
                   </Link>
                 </li>
               ) : null}
@@ -83,7 +85,7 @@ export function UserAccountNav() {
                   className="flex w-full items-center gap-3 px-2.5 py-2"
                 >
                   <LayoutDashboard className="size-4" />
-                  <p className="text-sm">Dashboard</p>
+                  <p className="text-sm">{t("dashboard")}</p>
                 </Link>
               </li>
 
@@ -94,7 +96,7 @@ export function UserAccountNav() {
                   className="flex w-full items-center gap-3 px-2.5 py-2"
                 >
                   <Settings className="size-4" />
-                  <p className="text-sm">Settings</p>
+                  <p className="text-sm">{t("settings")}</p>
                 </Link>
               </li>
 
@@ -109,7 +111,7 @@ export function UserAccountNav() {
               >
                 <div className="flex w-full items-center gap-3 px-2.5 py-2">
                   <LogOut className="size-4" />
-                  <p className="text-sm">Log out </p>
+                  <p className="text-sm">{t("logOut")}</p>
                 </div>
               </li>
             </ul>
@@ -145,15 +147,15 @@ export function UserAccountNav() {
           <DropdownMenuItem asChild>
             <Link href="/admin" className="flex items-center space-x-2.5">
               <Lock className="size-4" />
-              <p className="text-sm">Admin</p>
+              <p className="text-sm">{t("admin")}</p>
             </Link>
           </DropdownMenuItem>
         ) : null}
 
         <DropdownMenuItem asChild>
           <Link href="/dashboard" className="flex items-center space-x-2.5">
             <LayoutDashboard className="size-4" />
-            <p className="text-sm">Dashboard</p>
+            <p className="text-sm">{t("dashboard")}</p>
           </Link>
         </DropdownMenuItem>
 
@@ -163,7 +165,7 @@ export function UserAccountNav() {
             className="flex items-center space-x-2.5"
           >
             <Settings className="size-4" />
-            <p className="text-sm">Settings</p>
+            <p className="text-sm">{t("settings")}</p>
           </Link>
         </DropdownMenuItem>
         <DropdownMenuSeparator />
@@ -178,7 +180,7 @@ export function UserAccountNav() {
         >
           <div className="flex items-center space-x-2.5">
             <LogOut className="size-4" />
-            <p className="text-sm">Log out </p>
+            <p className="text-sm">{t("logOut")}</p>
           </div>
         </DropdownMenuItem>
       </DropdownMenuContent>

diff --git a/src/locales/en.json b/src/locales/en.json
@@ -300,5 +300,11 @@
     "activeSubscription": "Active Subscription",
     "deleteWarning": "Permanently delete your {siteName} account. This action cannot be undone, please proceed with caution.",
     "deleteButton": "Delete Account"
+  },
+  "UserAccountNav": {
+    "admin": "Admin",
+    "dashboard": "Dashboard",
+    "settings": "Settings",
+    "logOut": "Log out"
   }
 }
diff --git a/src/locales/zh.json b/src/locales/zh.json
@@ -160,7 +160,7 @@
       "3": "采用 FFlow Next 后，我们团队的生产力飞速提升。强烈推荐！",
       "4": "我对 FFlow Next 的代码质量和清晰文档印象深刻。向团队致敬！",
       "5": "FFlow Next 为我提供了必要的工具，以高效地管理用户数据。非常感谢！",
-      "6": "FFlow Next 在我作为营销经理的角色中发挥了无价的作用。通过 Stripe 的无缝集成，我能够启动具有内置支付功能的定向营活动，使我们能够更有效地货币化我们的产品和服务。",
+      "6": "FFlow Next 在我作为营销经理的角色中发挥了无价的作用。通过 Stripe 的无缝集成，我能够启动具有内置支付功能的定向营��动，使我们能够更有效地货币化我们的产品和服务。",
       "7": "感谢 FFlow Next, 我能够在创纪录的时间内创建现代和吸引人的用户界面。入门套件为构建时尚和直观的界面提供了坚实的基础, 使我能够更专注于工作的创造性方面。"
     }
   },
@@ -183,7 +183,7 @@
     "subtitle": "这些功能旨在提高您的工作效率和用户体验",
     "visitSite": "访问网站",
     "feature1": {
-      "title": "功能 1",
+      "title": "���能 1",
       "description": "满足当前需求，节省时间并提供价值。明智而睿智的选择。",
       "link": "/",
       "icon": "nextjs"
@@ -221,7 +221,7 @@
   },
   "InfoLanding": {
     "Empower your projects": {
-      "title": "为的项目赋能",
+      "title": "为的��目赋能",
       "description": "通过我们的开源 SaaS 平台释放项目的全部潜力。无缝协作，轻松创新，无限扩展。",
       "list": {
         "Collaborative": {
@@ -300,5 +300,11 @@
     "activeSubscription": "活跃订阅",
     "deleteWarning": "永久删除您的 {siteName} 账户。此操作无法撤销，请谨慎操作。",
     "deleteButton": "删除账户"
+  },
+  "UserAccountNav": {
+    "admin": "管理员",
+    "dashboard": "仪表盘",
+    "settings": "设置",
+    "logOut": "退出登录"
   }
 }