From a17ed646a0768e83f6808059654b5b136213c1a0 Mon Sep 17 00:00:00 2001
From: shuaiplus <2327005759@qq.com>
Date: Fri, 20 Mar 2026 05:53:24 +0800
Subject: [PATCH] feat: update backup routes and navigation links for
 consistency

---
 webapp/src/App.tsx                              |  6 +++---
 webapp/src/components/AppAuthenticatedShell.tsx |  2 +-
 webapp/src/components/AppMainRoutes.tsx         | 13 ++++++++++++-
 3 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/webapp/src/App.tsx b/webapp/src/App.tsx
index ce0c62c..8d3c407 100644
--- a/webapp/src/App.tsx
+++ b/webapp/src/App.tsx
@@ -52,7 +52,7 @@ import { t } from '@/lib/i18n';
 import { APP_NOTIFY_EVENT, type AppNotifyDetail } from '@/lib/app-notify';
 import type { AppPhase, Cipher, Folder as VaultFolder, Profile, Send, SessionState } from '@/lib/types';
 
-const IMPORT_ROUTE = '/help/import-export';
+const IMPORT_ROUTE = '/backup/import-export';
 const IMPORT_ROUTE_PATHS = [IMPORT_ROUTE, '/tools/import', '/tools/import-export', '/tools/import-data', '/import', '/import-export'] as const;
 const IMPORT_ROUTE_ALIASES: ReadonlySet<string> = new Set(IMPORT_ROUTE_PATHS.filter((path) => path !== IMPORT_ROUTE));
 const SETTINGS_HOME_ROUTE = '/settings';
@@ -918,7 +918,7 @@ export default function App() {
     if (location === '/sends') return t('nav_sends');
     if (location === '/admin') return t('nav_admin_panel');
     if (location === '/security/devices') return t('nav_device_management');
-    if (location === '/help') return t('nav_backup_strategy');
+    if (location === '/backup') return t('nav_backup_strategy');
     if (isImportRoute) return t('nav_import_export');
     if (location === SETTINGS_ACCOUNT_ROUTE) return t('nav_account_settings');
     if (location === SETTINGS_HOME_ROUTE) return t('txt_settings');
@@ -936,7 +936,7 @@ export default function App() {
   }, [phase, isImportHashRoute, location, navigate]);
 
   useEffect(() => {
-    if (phase === 'app' && profile?.role !== 'admin' && location === '/help') {
+    if (phase === 'app' && profile?.role !== 'admin' && location === '/backup') {
       navigate('/vault');
     }
   }, [phase, profile?.role, location, navigate]);
diff --git a/webapp/src/components/AppAuthenticatedShell.tsx b/webapp/src/components/AppAuthenticatedShell.tsx
index b9abfed..761e71b 100644
--- a/webapp/src/components/AppAuthenticatedShell.tsx
+++ b/webapp/src/components/AppAuthenticatedShell.tsx
@@ -87,7 +87,7 @@ export default function AppAuthenticatedShell(props: AppAuthenticatedShellProps)
               <span>{t('nav_device_management')}</span>
             </Link>
             {props.profile?.role === 'admin' && (
-              <Link href="/help" className={`side-link ${props.location === '/help' ? 'active' : ''}`}>
+              <Link href="/backup" className={`side-link ${props.location === '/backup' ? 'active' : ''}`}>
                 <Cloud size={16} />
                 <span>{t('nav_backup_strategy')}</span>
               </Link>
diff --git a/webapp/src/components/AppMainRoutes.tsx b/webapp/src/components/AppMainRoutes.tsx
index 273e973..b071ff7 100644
--- a/webapp/src/components/AppMainRoutes.tsx
+++ b/webapp/src/components/AppMainRoutes.tsx
@@ -1,4 +1,5 @@
 import { lazy, Suspense } from 'preact/compat';
+import { useEffect } from 'preact/hooks';
 import { Link, Route, Switch } from 'wouter';
 import { ArrowUpDown, Cloud, LogOut, Settings as SettingsIcon, Shield, ShieldUser } from 'lucide-preact';
 import type { ImportAttachmentFile, ImportResultSummary } from '@/components/ImportPage';
@@ -21,6 +22,13 @@ function RouteContentFallback() {
   return <div className="loading-screen">{t('txt_loading_nodewarden')}</div>;
 }
 
+function LegacyBackupRedirect(props: { onNavigate: (path: string) => void }) {
+  useEffect(() => {
+    props.onNavigate('/backup');
+  }, [props]);
+  return null;
+}
+
 export interface AppMainRoutesProps {
   profile: Profile | null;
   session: SessionState | null;
@@ -232,7 +240,7 @@ export default function AppMainRoutes(props: AppMainRoutesProps) {
                 </Link>
               )}
               {props.profile.role === 'admin' && (
-                <Link href="/help" className="mobile-settings-link">
+                <Link href="/backup" className="mobile-settings-link">
                   <Cloud size={18} />
                   <span>{t('nav_backup_strategy')}</span>
                 </Link>
@@ -299,6 +307,9 @@ export default function AppMainRoutes(props: AppMainRoutesProps) {
         </Route>
       ))}
       <Route path="/help">
+        <LegacyBackupRedirect onNavigate={props.onNavigate} />
+      </Route>
+      <Route path="/backup">
         {props.profile?.role === 'admin' ? (
           <div className="stack">
             {props.mobileLayout && (