zetaloop
33 lines
902 B
TypeScript
33 lines
902 B
TypeScript
"use client"
|
|
|
|
import { useEffect } from "react"
|
|
import { Button } from "@/components/ui/button"
|
|
import { useAuthStore } from "@/store/auth"
|
|
import { useLoginDialogStore } from "@/store/login-dialog"
|
|
|
|
interface AuthGuardProps {
|
|
children: React.ReactNode
|
|
}
|
|
|
|
export function AuthGuard({ children }: AuthGuardProps) {
|
|
const isAuthenticated = useAuthStore((s) => s.isAuthenticated)
|
|
const openLoginDialog = useLoginDialogStore((s) => s.openLoginDialog)
|
|
|
|
useEffect(() => {
|
|
if (!isAuthenticated) {
|
|
openLoginDialog()
|
|
}
|
|
}, [isAuthenticated, openLoginDialog])
|
|
|
|
if (isAuthenticated) {
|
|
return <>{children}</>
|
|
}
|
|
|
|
return (
|
|
<div className="flex min-h-[50vh] flex-col items-center justify-center gap-4 text-center">
|
|
<p className="text-sm text-muted-foreground">请先登录后继续访问此页面</p>
|
|
<Button onClick={openLoginDialog}>登录</Button>
|
|
</div>
|
|
)
|
|
}
|