Files
buzz-sheet/components/public/site-header.tsx
T
gunshiz 6df8f2ac36
CI / Verify (push) Successful in 1m30s
CI / Build immutable images and deploy (push) Successful in 2m39s
chore(header) : place edit link after visitor indicator
2026-10-06 18:06:05 +07:00

53 lines
2.3 KiB
TypeScript

import Image from "@/components/ui/resilient-image";
import Link from "next/link";
import { Suspense } from "react";
import { PencilIcon } from "lucide-react";
import { Button } from "@/components/ui/button";
import { VisitorPresence } from "@/components/public/visitor-presence";
import { PublicNavigation } from "@/components/public/public-navigation";
import { SignOutButton } from "@/components/auth/sign-out-button";
import { getAdminSession } from "@/lib/auth/server";
import { HttpError } from "@/lib/security/http";
async function AdminEditLink({ editHref }: { editHref: string }) {
let isAdmin = false;
try {
isAdmin = Boolean(await getAdminSession());
} catch (cause) {
if (!(cause instanceof HttpError) || cause.status !== 503) throw cause;
}
return isAdmin ? (
<Button variant="ghost" size="sm" nativeButton={false} render={<Link href={editHref} />} aria-label="ไปหน้าแก้ไข">
<PencilIcon data-icon="inline-start" className="lg:hidden" />
<span className="hidden lg:inline">ไปหน้าแก้ไข</span>
</Button>
) : null;
}
export function SiteHeader({ editHref = "/admin", guideId }: { editHref?: string; guideId?: string } = {}) {
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-nowrap items-center gap-2 px-4 py-2 sm:px-6">
<Link
href="/"
aria-label="หน้าแรก ไกด์เกนชินไม่ใช่เกมมือถือ"
className="mr-auto flex min-h-11 shrink-0 items-center gap-3 rounded-lg font-heading font-semibold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
>
<Image src="/icon.png" alt="" width={36} height={36} className="size-9 object-contain" />
<span className="hidden lg:inline">ไกด์เกนชินไม่ใช่เกมมือถือ</span>
</Link>
<PublicNavigation />
<div className="hidden lg:block">
<VisitorPresence guideId={guideId} />
</div>
<Suspense fallback={null}>
<AdminEditLink editHref={editHref} />
</Suspense>
<SignOutButton />
</div>
</header>
);
}