forked from carrydela/Rs_blog_front
53 lines
1.6 KiB
TypeScript
53 lines
1.6 KiB
TypeScript
"use client";
|
|
|
|
import { useSyncExternalStore } from "react";
|
|
import Link from "next/link";
|
|
import { Container } from "./Container";
|
|
import { TextLink } from "@/components/ui/TextLink";
|
|
import { useAuth } from "@/lib/hooks/useAuth";
|
|
|
|
const subscribe = () => () => {};
|
|
const getSnapshot = () => true;
|
|
const getServerSnapshot = () => false;
|
|
|
|
export function Header() {
|
|
const { isAuthenticated, logout } = useAuth();
|
|
const mounted = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
|
|
|
|
return (
|
|
<header className="py-8 border-b border-neutral-100">
|
|
<Container>
|
|
<nav className="flex items-center justify-between">
|
|
<Link
|
|
href="/"
|
|
className="text-xl font-bold tracking-tighter hover:opacity-70 transition-opacity"
|
|
>
|
|
AI Blog
|
|
</Link>
|
|
|
|
<div className="flex items-center gap-8">
|
|
{mounted && (
|
|
<>
|
|
{isAuthenticated ? (
|
|
<>
|
|
<TextLink href="/admin">Dashboard</TextLink>
|
|
<TextLink href="/drafts">My Drafts</TextLink>
|
|
<button
|
|
onClick={logout}
|
|
className="text-sm tracking-wide uppercase text-neutral-500 hover:text-black transition-colors"
|
|
>
|
|
Logout
|
|
</button>
|
|
</>
|
|
) : (
|
|
<TextLink href="/login">Login</TextLink>
|
|
)}
|
|
</>
|
|
)}
|
|
</div>
|
|
</nav>
|
|
</Container>
|
|
</header>
|
|
);
|
|
}
|