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

This commit is contained in:
zetaloop
2026-02-22 08:03:09 +08:00
parent 7bcb73f139
commit 312061330c
8 changed files with 47 additions and 44 deletions
+23 -17
View File
@@ -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>
+2 -2
View File
@@ -14,7 +14,7 @@ import {
} from "@/components/ui/dialog"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import { currentUser } from "@/lib/mock"
import { getCurrentUserForLogin } from "@/lib/api"
import { useAuthStore } from "@/store/auth"
import { useLoginDialogStore } from "@/store/login-dialog"
@@ -42,7 +42,7 @@ export function LoginDialog({ open, onOpenChange }: LoginDialogProps) {
const onSubmit = async (_data: z.infer<typeof loginSchema>) => {
await new Promise((r) => setTimeout(r, 500))
login(currentUser, ["consumer", "player", "owner"])
login(getCurrentUserForLogin(), ["consumer", "player", "owner"])
consumePendingAction()
onOpenChange(false)
}
+4 -4
View File
@@ -2,7 +2,7 @@
import { Heart } from "lucide-react"
import { useState } from "react"
import { currentUser } from "@/lib/mock"
import { generateId } from "@/lib/id"
import type { Comment } from "@/lib/types"
import { useRequireAuth } from "@/lib/use-require-auth"
import { useAuthStore } from "@/store/auth"
@@ -32,14 +32,14 @@ export function PostComments({ initialComments, postId }: PostCommentsProps) {
requireAuth(() => {
const nextContent = content.trim()
if (!nextContent) return
const author = user ?? currentUser
if (!user) return
const createdAt = new Date().toISOString()
setComments((prev) => [
...prev,
{
id: `comment-${postId}-${createdAt}`,
id: generateId(`comment-${postId}`),
postId,
author,
author: user,
content: nextContent,
likeCount: 0,
liked: false,