diff --git a/components/auth-guard.tsx b/components/auth-guard.tsx index 7f13c2e..6c35d15 100644 --- a/components/auth-guard.tsx +++ b/components/auth-guard.tsx @@ -32,7 +32,7 @@ export function AuthGuard({ children }: AuthGuardProps) { return (

请先登录后继续访问此页面

- +
) } diff --git a/components/login-dialog.tsx b/components/login-dialog.tsx index 3e48696..6c080ef 100644 --- a/components/login-dialog.tsx +++ b/components/login-dialog.tsx @@ -16,6 +16,7 @@ import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import { currentUser } from "@/lib/mock" import { useAuthStore } from "@/store/auth" +import { useLoginDialogStore } from "@/store/login-dialog" const loginSchema = z.object({ phone: z.string().min(11, "请输入正确的手机号"), @@ -30,6 +31,7 @@ interface LoginDialogProps { export function LoginDialog({ open, onOpenChange }: LoginDialogProps) { const router = useRouter() const { login } = useAuthStore() + const consumePendingAction = useLoginDialogStore((state) => state.consumePendingAction) const { register, handleSubmit, @@ -41,6 +43,7 @@ export function LoginDialog({ open, onOpenChange }: LoginDialogProps) { const onSubmit = async (_data: z.infer) => { await new Promise((r) => setTimeout(r, 500)) login(currentUser, ["consumer", "player", "owner"]) + consumePendingAction() onOpenChange(false) } diff --git a/lib/use-require-auth.ts b/lib/use-require-auth.ts index ce11ce0..1901101 100644 --- a/lib/use-require-auth.ts +++ b/lib/use-require-auth.ts @@ -13,7 +13,7 @@ export function useRequireAuth() { if (isAuthenticated) { action() } else { - openLoginDialog() + openLoginDialog(action) } }, [isAuthenticated, openLoginDialog], diff --git a/store/login-dialog.ts b/store/login-dialog.ts index 5d10cb4..9fbf362 100644 --- a/store/login-dialog.ts +++ b/store/login-dialog.ts @@ -2,12 +2,20 @@ import { create } from "zustand" interface LoginDialogState { open: boolean - openLoginDialog: () => void + pendingAction: (() => void) | null + openLoginDialog: (action?: () => void) => void closeLoginDialog: () => void + consumePendingAction: () => void } -export const useLoginDialogStore = create((set) => ({ +export const useLoginDialogStore = create((set, get) => ({ open: false, - openLoginDialog: () => set({ open: true }), - closeLoginDialog: () => set({ open: false }), + pendingAction: null, + openLoginDialog: (action) => set({ open: true, pendingAction: action ?? null }), + closeLoginDialog: () => set({ open: false, pendingAction: null }), + consumePendingAction: () => { + const action = get().pendingAction + set({ pendingAction: null }) + action?.() + }, }))