Files
buzz-sheet/components/admin/admin-header.tsx
T
gunshiz aaba88865e
CI / Verify (push) Successful in 1m0s
CI / Build immutable images and deploy (push) Successful in 1m33s
style : forget root
2026-08-30 08:30:23 +00:00

82 lines
2.6 KiB
TypeScript

"use client";
import Link from "next/link";
import { usePathname, useRouter } from "next/navigation";
import {
BookOpenIcon,
ExternalLinkIcon,
LayoutDashboardIcon,
LogOutIcon,
PlusIcon,
} from "lucide-react";
import { Button } from "@/components/ui/button";
import { authClient } from "@/lib/auth/client";
export function AdminHeader() {
const pathname = usePathname();
const router = useRouter();
return (
<header className="border-b bg-background/95 supports-backdrop-filter:backdrop-blur">
<div className="mx-auto flex min-h-16 w-full max-w-7xl flex-wrap items-center gap-2 px-4 py-2 sm:px-6">
<Link
href="/admin"
className="mr-auto flex min-h-11 items-center gap-3 rounded-lg font-heading font-semibold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
>
<span className="grid size-9 place-items-center rounded-lg bg-primary text-primary-foreground">
<BookOpenIcon aria-hidden="true" />
</span>
<span className="hidden sm:inline">Buzz Sheet Admin</span>
</Link>
<nav aria-label="Admin navigation" className="flex items-center gap-1">
<Button
variant={pathname === "/admin" ? "secondary" : "ghost"}
size="sm"
nativeButton={false}
render={<Link href="/admin" />}
>
<LayoutDashboardIcon data-icon="inline-start" />
<span className="hidden sm:inline">Dashboard</span>
</Button>
<Button
variant={pathname === "/admin/create" ? "secondary" : "ghost"}
size="sm"
nativeButton={false}
render={<Link href="/admin/create" />}
>
<PlusIcon data-icon="inline-start" />
<span className="hidden sm:inline">New Guide</span>
</Button>
<Button
variant="ghost"
size="icon-sm"
nativeButton={false}
render={<Link href="/" target="_blank" />}
aria-label="เปิดหน้าเว็บไซต์"
>
<ExternalLinkIcon />
</Button>
<Button
variant="ghost"
size="icon-sm"
aria-label="ออกจากระบบ"
onClick={() =>
authClient.signOut({
fetchOptions: {
onSuccess: () => {
router.push("/admin/login");
router.refresh();
},
},
})
}
>
<LogOutIcon />
</Button>
</nav>
</div>
</header>
);
}