58 lines
2.4 KiB
TypeScript
58 lines
2.4 KiB
TypeScript
import { Suspense } from "react";
|
|
import Link from "next/link";
|
|
import { ArrowLeftIcon } from "lucide-react";
|
|
import { notFound, redirect } from "next/navigation";
|
|
import { connection } from "next/server";
|
|
|
|
import { AdminHeader } from "@/components/admin/admin-header";
|
|
import { GuideSectionNav } from "@/components/admin/guide-section-nav";
|
|
import { CommentBoardContent } from "@/components/comments/comment-board-content";
|
|
import { CommentBoardSkeleton } from "@/components/comments/comment-skeleton";
|
|
import { Button } from "@/components/ui/button";
|
|
import Image from "@/components/ui/resilient-image";
|
|
import { getAdminSession } from "@/lib/auth/server";
|
|
import { getGuideEditorHeader } from "@/lib/guides/queries";
|
|
|
|
export const instant = false;
|
|
|
|
export default async function GuideCommentPage({
|
|
params,
|
|
}: {
|
|
params: Promise<{ character: string }>;
|
|
}) {
|
|
await connection();
|
|
if (!(await getAdminSession())) redirect("/auth/login?next=%2Fadmin");
|
|
const { character } = await params;
|
|
const guide = await getGuideEditorHeader(character);
|
|
if (!guide) notFound();
|
|
const extras = guide.sections
|
|
.filter((section) => section.kind === "extra")
|
|
.map(({ id, slug, title }) => ({ id, slug, title }));
|
|
|
|
return (
|
|
<div className="min-h-svh">
|
|
<AdminHeader />
|
|
<main lang="th" className="mx-auto flex w-full max-w-7xl flex-col gap-6 px-4 pb-4 sm:px-6 sm:pb-6 lg:px-8 lg:pb-8">
|
|
<div className="flex flex-col">
|
|
<header className="flex items-center gap-4">
|
|
<Button variant="ghost" size="icon" render={<Link href="/admin" />} nativeButton={false} aria-label="กลับหน้าภาพรวม">
|
|
<ArrowLeftIcon />
|
|
</Button>
|
|
<div className="relative size-16 shrink-0 overflow-hidden rounded-lg border">
|
|
<Image src={guide.coverUrl} alt={guide.name} fill sizes="64px" className="object-cover" />
|
|
</div>
|
|
<div className="min-w-0">
|
|
<p className="text-sm text-muted-foreground">{guide.name}</p>
|
|
<h1 className="font-heading text-3xl font-semibold">ความคิดเห็น</h1>
|
|
</div>
|
|
</header>
|
|
<GuideSectionNav guideId={guide.id} characterKey={guide.characterKey} current="comment" extras={extras} />
|
|
</div>
|
|
<Suspense fallback={<CommentBoardSkeleton />}>
|
|
<CommentBoardContent target={`guide:${guide.id}`} />
|
|
</Suspense>
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|