refactor(auth): unify current user state usage across UI

components/header.tsx

@@ -29,11 +29,11 @@ import {
 } from "@/components/ui/dropdown-menu"
 import { Input } from "@/components/ui/input"
 import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from "@/components/ui/sheet"
-import { currentUser, mockShops } from "@/lib/mock"
 import type { UserRole } from "@/lib/types"
 import { cn } from "@/lib/utils"
 import { useAuthStore } from "@/store/auth"
 import { useNotificationStore } from "@/store/notifications"
+import { useShopStore } from "@/store/shops"
 
 const roleLabels: Record<UserRole, string> = {
   consumer: "消费者",
@@ -45,7 +45,10 @@ export function Header() {
   const [mobileOpen, setMobileOpen] = useState(false)
   const pathname = usePathname()
   const router = useRouter()
-  const { isAuthenticated, currentRole, verifiedRoles, switchRole, logout } = useAuthStore()
+  const { isAuthenticated, currentRole, verifiedRoles, switchRole, logout, user } = useAuthStore()
+  const ownerShop = useShopStore((state) =>
+    user ? state.shops.find((shop) => shop.owner.id === user.id) : undefined,
+  )
 
   const navLinks =
     currentRole === "consumer"
@@ -84,6 +87,17 @@ export function Header() {
     if (q.trim()) router.push(`/search?q=${encodeURIComponent(q.trim())}`)
   }
 
+  const profileHref =
+    currentRole === "player"
+      ? user
+        ? `/player/${user.id}`
+        : "/settings"
+      : currentRole === "owner"
+        ? `/shop/${ownerShop?.id ?? "shop1"}`
+        : user
+          ? `/user/${user.id}`
+          : "/settings"
+
   return (
     <header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
       <div className="container mx-auto flex h-14 items-center gap-4 px-4">
@@ -155,25 +169,17 @@ export function Header() {
                 <DropdownMenuTrigger asChild>
                   <Button variant="ghost" size="icon" className="rounded-full h-9 w-9">
                     <Avatar className="h-7 w-7">
-                      <AvatarImage src={currentUser.avatar} />
-                      <AvatarFallback>{currentUser.nickname[0]}</AvatarFallback>
+                      <AvatarImage src={user?.avatar} />
+                      <AvatarFallback>{user?.nickname?.[0] ?? "?"}</AvatarFallback>
                     </Avatar>
                   </Button>
                 </DropdownMenuTrigger>
                 <DropdownMenuContent align="end" className="w-48">
-                  <DropdownMenuLabel>{currentUser.nickname}</DropdownMenuLabel>
+                  <DropdownMenuLabel>{user?.nickname ?? "未登录"}</DropdownMenuLabel>
                   <DropdownMenuSeparator />
                   <DropdownMenuGroup>
                     <DropdownMenuItem asChild>
-                      <Link
-                        href={
-                          currentRole === "player"
-                            ? `/player/${currentUser.id}`
-                            : currentRole === "owner"
-                              ? `/shop/${mockShops.find((s) => s.owner.id === currentUser.id)?.id ?? "shop1"}`
-                              : `/user/${currentUser.id}`
-                        }
-                      >
+                      <Link href={profileHref}>
                         <User className="mr-2 h-4 w-4" />
                         个人主页
                       </Link>
@@ -254,11 +260,11 @@ export function Header() {
                 {isAuthenticated && (
                   <div className="flex items-center gap-2 px-1">
                     <Avatar className="h-8 w-8">
-                      <AvatarImage src={currentUser.avatar} />
-                      <AvatarFallback>{currentUser.nickname[0]}</AvatarFallback>
+                      <AvatarImage src={user?.avatar} />
+                      <AvatarFallback>{user?.nickname?.[0] ?? "?"}</AvatarFallback>
                     </Avatar>
                     <div className="flex-1 min-w-0">
-                      <p className="text-sm font-medium truncate">{currentUser.nickname}</p>
+                      <p className="text-sm font-medium truncate">{user?.nickname ?? "未登录"}</p>
                       <p className="text-xs text-muted-foreground">{roleLabels[currentRole]}</p>
                     </div>
                   </div>