feat(frontend): 控制台 next-intl 中英双语

接入无 URL 前缀的 zh-CN/en，顶栏与外观设置可切换语言；选择写入 cookie 后刷新生效。

frontend/components/layout/sidebar.tsx

@@ -58,33 +58,39 @@ import {
   UserRound,
 } from 'lucide-react';
 
+import { useTranslations } from 'next-intl';
 import { useUser } from '@/contexts/user-context';
 import { usePublicConfig } from '@/hooks/use-public-config';
 import { OpenFlareSidebarMenu } from '@/components/layout/openflare-sidebar-menu';
 import { openflareSidebarNav } from '@/lib/navigation/openflare-nav';
 
-/* 导航数据 */
-const data = {
-  admin: [
-    { title: '用户管理', url: '/admin/users', icon: UserRound },
-    { title: '任务管理', url: '/admin/tasks', icon: Layers },
-    { title: '存储管理', url: '/admin/files', icon: FolderOpen },
-    { title: '数据管理', url: '/admin/database', icon: Database },
-    { title: '通知推送', url: '/admin/push', icon: Bell },
-    // { title: '系统日志', url: '/admin/logs', icon: Terminal },
-    { title: '系统配置', url: '/admin/system', icon: ShieldCheck },
-    { title: '系统设置', url: '/admin/settings', icon: Settings },
-  ],
-  document: [
-    {
-      title: '使用文档',
-      url: 'https://open-flare.pages.dev/',
-      icon: FileText,
-      external: true,
-    },
-  ],
+type NavItem = {
+  titleKey: string;
+  url: string;
+  icon: React.ComponentType;
+  external?: boolean;
 };
 
+const adminItems: NavItem[] = [
+  { titleKey: 'users', url: '/admin/users', icon: UserRound },
+  { titleKey: 'tasks', url: '/admin/tasks', icon: Layers },
+  { titleKey: 'storage', url: '/admin/files', icon: FolderOpen },
+  { titleKey: 'database', url: '/admin/database', icon: Database },
+  { titleKey: 'push', url: '/admin/push', icon: Bell },
+  // { titleKey: 'logs', url: '/admin/logs', icon: Terminal },
+  { titleKey: 'system', url: '/admin/system', icon: ShieldCheck },
+  { titleKey: 'adminSettings', url: '/admin/settings', icon: Settings },
+];
+
+const documentItems: NavItem[] = [
+  {
+    titleKey: 'usageDocs',
+    url: 'https://open-flare.pages.dev/',
+    icon: FileText,
+    external: true,
+  },
+];
+
 function parseMenuDisplayConfig(
   raw: string | undefined,
 ): Record<string, boolean> {
@@ -122,6 +128,8 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
   const { toggleSidebar, state, isMobile, setOpenMobile } = useSidebar();
   const { user, logout, loading: userLoading } = useUser();
   const { config } = usePublicConfig();
+  const t = useTranslations('layout');
+  const tCommon = useTranslations('common');
   const [showLogoutDialog, setShowLogoutDialog] = React.useState(false);
   const [isLoggingOut, setIsLoggingOut] = React.useState(false);
   const pathname = usePathname();
@@ -161,9 +169,11 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
       await logout();
       setShowLogoutDialog(false);
     } catch (error) {
-      toast.error('登出失败', {
+      toast.error(t('logoutDialog.failed'), {
         description:
-          error instanceof Error ? error.message : '登出时发生错误，请重试',
+          error instanceof Error
+            ? error.message
+            : t('logoutDialog.failedDescription'),
       });
       setIsLoggingOut(false);
     }
@@ -171,12 +181,12 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
 
   const adminFiltered = React.useMemo(() => {
     const displayConfig = parseMenuDisplayConfig(config?.menu_display_config);
-    return data.admin.filter((item) => displayConfig[item.url] !== false);
+    return adminItems.filter((item) => displayConfig[item.url] !== false);
   }, [config]);
 
   const documentFiltered = React.useMemo(() => {
     const displayConfig = parseMenuDisplayConfig(config?.menu_display_config);
-    return data.document.filter((item) => displayConfig[item.url] !== false);
+    return documentItems.filter((item) => displayConfig[item.url] !== false);
   }, [config]);
 
   return (
@@ -232,10 +242,10 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
                 </div>
                 <div className='flex flex-col items-start flex-1 text-left group-data-[collapsible=icon]:hidden'>
                   <span className='text-xs font-medium truncate w-full text-left ml-2'>
-                    {user?.nickname || user?.username || 'Unknown User'}
+                    {user?.nickname || user?.username || t('user.unknownUser')}
                   </span>
                   <span className='text-[11px] font-medium text-muted-foreground/100 truncate w-full text-left ml-2'>
-                    {user?.is_admin ? '系统管理员' : '普通用户'}
+                    {user?.is_admin ? t('user.adminRole') : t('user.userRole')}
                   </span>
                 </div>
                 <ChevronDown className='size-4 text-muted-foreground ml-auto group-data-[collapsible=icon]:hidden' />
@@ -286,15 +296,17 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
                   </div>
                   <span className='text-base font-semibold truncate mt-2'>
                     {userLoading
-                      ? '加载中...'
-                      : user?.nickname || user?.username || '未登录'}
+                      ? tCommon('loading')
+                      : user?.nickname ||
+                        user?.username ||
+                        t('user.notLoggedIn')}
                   </span>
                   <span className='text-xs font-base text-muted-foreground'>
                     {userLoading
-                      ? '正在同步账户'
+                      ? t('user.syncing')
                       : user?.is_admin
-                        ? '系统管理员'
-                        : '普通用户'}
+                        ? t('user.adminRole')
+                        : t('user.userRole')}
                   </span>
                 </div>
               </DropdownMenuLabel>
@@ -305,7 +317,7 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
                 }}
               >
                 <UserRound className='mr-2 size-4' />
-                <span>我的资料</span>
+                <span>{t('user.profile')}</span>
               </DropdownMenuItem>
               <DropdownMenuItem
                 onClick={() => {
@@ -314,7 +326,7 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
                 }}
               >
                 <Settings className='mr-2 size-4' />
-                <span>设置</span>
+                <span>{t('user.settings')}</span>
               </DropdownMenuItem>
               <DropdownMenuSeparator className='my-2' />
               <DropdownMenuItem
@@ -328,14 +340,14 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
                 }}
               >
                 <FileQuestionMark className='mr-2 size-4' />
-                <span>使用帮助</span>
+                <span>{t('user.help')}</span>
               </DropdownMenuItem>
               <DropdownMenuItem
                 className='text-destructive hover:bg-destructive/50'
                 onClick={() => setShowLogoutDialog(true)}
               >
                 <LogOut className='mr-2 size-4 text-destructive' />
-                <span>退出登录</span>
+                <span>{t('user.logout')}</span>
               </DropdownMenuItem>
             </DropdownMenuContent>
           </DropdownMenu>
@@ -352,27 +364,30 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
           {user?.is_admin && adminFiltered.length > 0 && (
             <SidebarGroup className='py-0 pt-4'>
               <SidebarGroupLabel className='text-xs font-normal text-muted-foreground'>
-                管理
+                {t('groups.admin')}
               </SidebarGroupLabel>
               <SidebarGroupContent className='py-1'>
                 <SidebarMenu className='gap-1'>
-                  {adminFiltered.map((item) => (
-                    <SidebarMenuItem key={item.title}>
-                      <SidebarMenuButton
-                        tooltip={item.title}
-                        isActive={
-                          pathname === item.url ||
-                          pathname.startsWith(`${item.url}/`)
-                        }
-                        asChild
-                      >
-                        <Link href={item.url} onClick={handleCloseSidebar}>
-                          {item.icon && <item.icon />}
-                          <span>{item.title}</span>
-                        </Link>
-                      </SidebarMenuButton>
-                    </SidebarMenuItem>
-                  ))}
+                  {adminFiltered.map((item) => {
+                    const title = t(`nav.${item.titleKey}`);
+                    return (
+                      <SidebarMenuItem key={item.url}>
+                        <SidebarMenuButton
+                          tooltip={title}
+                          isActive={
+                            pathname === item.url ||
+                            pathname.startsWith(`${item.url}/`)
+                          }
+                          asChild
+                        >
+                          <Link href={item.url} onClick={handleCloseSidebar}>
+                            {item.icon && <item.icon />}
+                            <span>{title}</span>
+                          </Link>
+                        </SidebarMenuButton>
+                      </SidebarMenuItem>
+                    );
+                  })}
                 </SidebarMenu>
               </SidebarGroupContent>
             </SidebarGroup>
@@ -381,37 +396,40 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
           {documentFiltered.length > 0 && (
             <SidebarGroup className='py-0 pt-4'>
               <SidebarGroupLabel className='text-xs font-normal text-muted-foreground'>
-                文档库
+                {t('groups.docs')}
               </SidebarGroupLabel>
               <SidebarGroupContent className='py-1'>
                 <SidebarMenu className='gap-1'>
-                  {documentFiltered.map((item) => (
-                    <SidebarMenuItem key={item.title}>
-                      <SidebarMenuButton
-                        tooltip={item.title}
-                        isActive={pathname === item.url}
-                        asChild
-                      >
-                        {item.external ? (
-                          <Link
-                            href={item.url}
-                            target='_blank'
-                            rel='noopener noreferrer'
-                            onClick={handleCloseSidebar}
-                          >
-                            {item.icon && <item.icon />}
-                            <span className='flex-1'>{item.title}</span>
-                            <ArrowUpRight className='size-3 text-muted-foreground' />
-                          </Link>
-                        ) : (
-                          <Link href={item.url} onClick={handleCloseSidebar}>
-                            {item.icon && <item.icon />}
-                            <span className='flex-1'>{item.title}</span>
-                          </Link>
-                        )}
-                      </SidebarMenuButton>
-                    </SidebarMenuItem>
-                  ))}
+                  {documentFiltered.map((item) => {
+                    const title = t(`nav.${item.titleKey}`);
+                    return (
+                      <SidebarMenuItem key={item.url}>
+                        <SidebarMenuButton
+                          tooltip={title}
+                          isActive={pathname === item.url}
+                          asChild
+                        >
+                          {item.external ? (
+                            <Link
+                              href={item.url}
+                              target='_blank'
+                              rel='noopener noreferrer'
+                              onClick={handleCloseSidebar}
+                            >
+                              {item.icon && <item.icon />}
+                              <span className='flex-1'>{title}</span>
+                              <ArrowUpRight className='size-3 text-muted-foreground' />
+                            </Link>
+                          ) : (
+                            <Link href={item.url} onClick={handleCloseSidebar}>
+                              {item.icon && <item.icon />}
+                              <span className='flex-1'>{title}</span>
+                            </Link>
+                          )}
+                        </SidebarMenuButton>
+                      </SidebarMenuItem>
+                    );
+                  })}
                 </SidebarMenu>
               </SidebarGroupContent>
             </SidebarGroup>
@@ -431,18 +449,22 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
       >
         <AlertDialogContent>
           <AlertDialogHeader>
-            <AlertDialogTitle>确认登出</AlertDialogTitle>
+            <AlertDialogTitle>{t('logoutDialog.title')}</AlertDialogTitle>
             <AlertDialogDescription>
               {isLoggingOut
-                ? '正在登出，请稍候...'
-                : '您确定要登出当前账户吗？'}
+                ? t('logoutDialog.loggingOut')
+                : t('logoutDialog.description')}
             </AlertDialogDescription>
           </AlertDialogHeader>
           <AlertDialogFooter>
-            <AlertDialogCancel disabled={isLoggingOut}>取消</AlertDialogCancel>
+            <AlertDialogCancel disabled={isLoggingOut}>
+              {tCommon('cancel')}
+            </AlertDialogCancel>
             <AlertDialogAction onClick={handleLogout} disabled={isLoggingOut}>
               {isLoggingOut && <Spinner className='mr-2' />}
-              {isLoggingOut ? '登出中...' : '确认登出'}
+              {isLoggingOut
+                ? t('logoutDialog.inProgress')
+                : t('logoutDialog.confirm')}
             </AlertDialogAction>
           </AlertDialogFooter>
         </AlertDialogContent>