From 2fece3e558516a8cf1093f0e09e96e3018d2d419 Mon Sep 17 00:00:00 2001
From: tone <3341154833@qq.com>
Date: Thu, 19 Jun 2025 14:55:58 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=8E=A7=E5=88=B6=E5=8F=B0?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=E5=8A=A0=E8=BD=BD=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../app/console/(with-menu)/layout.tsx        | 32 ++++---------------
 tone-page-web/components/app-sidebar.tsx      | 20 ++++++++++--
 tone-page-web/components/nav-main.tsx         | 13 +++++---
 3 files changed, 34 insertions(+), 31 deletions(-)

diff --git a/tone-page-web/app/console/(with-menu)/layout.tsx b/tone-page-web/app/console/(with-menu)/layout.tsx
index 30191f6..f2430b2 100644
--- a/tone-page-web/app/console/(with-menu)/layout.tsx
+++ b/tone-page-web/app/console/(with-menu)/layout.tsx
@@ -14,6 +14,7 @@ import {
 } from "@/components/ui/sidebar"
 import { UserApi } from "@/lib/api";
 import { useRouter } from "next/navigation";
+import { useEffect, useLayoutEffect } from "react";
 import { toast } from "sonner";
 import useSWR from "swr";
 
@@ -22,41 +23,22 @@ export default function ConsoleMenuLayout({
 }: {
     children: React.ReactNode
 }) {
-
+    const isClientSide = typeof window !== 'undefined';
     const router = useRouter();
 
-
-    const getInitialData = () => {
-        if (!window || !window.localStorage) return null;
-        const cache = localStorage.getItem(UserApi.USER_ME_CACHE_KEY);
-        if (!cache) return;
-        try {
-            const user = JSON.parse(cache);
-            if (!user || !user.userId) throw new Error();
-            return user;
-        } catch (error) {
-            localStorage.removeItem(UserApi.USER_ME_CACHE_KEY);
-        }
-        return undefined;
-    }
-
-    const { data: user, isLoading, error } = useSWR(
+    const { data: user, isLoading, error, mutate } = useSWR(
         '/api/user/me',
-        async () => {
-            const data = await UserApi.me();
-            localStorage.setItem(UserApi.USER_ME_CACHE_KEY, JSON.stringify(data));
-            return data;
-        },
+        async () => UserApi.me(),
         {
             onError: (error) => {
                 if (error.statusCode === 401) {
-                    localStorage.removeItem('token');
-                    localStorage.removeItem(UserApi.USER_ME_CACHE_KEY);
+                    if (isClientSide) {
+                        localStorage.removeItem('token');
+                    }
                     toast.info('登录凭证已失效，请重新登录');
                     router.replace('/console/login');
                 }
             },
-            fallbackData: getInitialData(),
             revalidateIfStale: false,
             revalidateOnFocus: false,
             revalidateOnReconnect: false,
diff --git a/tone-page-web/components/app-sidebar.tsx b/tone-page-web/components/app-sidebar.tsx
index 547816f..60820b6 100644
--- a/tone-page-web/components/app-sidebar.tsx
+++ b/tone-page-web/components/app-sidebar.tsx
@@ -4,6 +4,7 @@ import * as React from "react"
 import {
   CloudUpload,
   Inbox,
+  LucideIcon,
   Mail,
   Server,
   SquareTerminal,
@@ -34,7 +35,22 @@ export function AppSidebar({ user, isUserLoading, ...props }: React.ComponentPro
       email: "m@example.com",
       avatar: "/avatars/shadcn.jpg",
     },
-    navMain: [
+    navMain: null as null | {
+      title: string
+      url: string
+      icon?: LucideIcon
+      isActive?: boolean
+      isHidden?: boolean
+      items?: {
+        title: string
+        url: string
+        isHidden?: boolean
+      }[]
+    }[],
+  }
+
+  if (!isUserLoading) {
+    data.navMain = [
       {
         title: "网站管理",
         url: "/console/web",
@@ -101,7 +117,7 @@ export function AppSidebar({ user, isUserLoading, ...props }: React.ComponentPro
         url: "/",
         icon: Undo2,
       },
-    ],
+    ]
   }
 
   return (
diff --git a/tone-page-web/components/nav-main.tsx b/tone-page-web/components/nav-main.tsx
index 2e19281..39f6362 100644
--- a/tone-page-web/components/nav-main.tsx
+++ b/tone-page-web/components/nav-main.tsx
@@ -18,13 +18,12 @@ import {
   SidebarMenuSubItem,
 } from "@/components/ui/sidebar"
 import Link from "next/link"
-import { usePathname } from "next/navigation"
-import { useState, useEffect } from "react"
+import { Skeleton } from "./ui/skeleton"
 
 export function NavMain({
   items,
 }: {
-  items: {
+  items: null | {
     title: string
     url: string
     icon?: LucideIcon
@@ -41,7 +40,13 @@ export function NavMain({
     <SidebarGroup>
       <SidebarGroupLabel>菜单</SidebarGroupLabel>
       <SidebarMenu>
-        {items.filter(i => !i.isHidden).map((item) => (
+        {
+          !items && Array(5).fill(null).map((_, i) => (
+            <Skeleton key={i} className="w-full h-7 mt-1" />
+          ))
+        }
+
+        {items && items.filter(i => !i.isHidden).map((item) => (
           (item.items && item.items.length > 0)
             ? (
               <Collapsible