import { Suspense } from "react";
import type { Metadata } from "next";
import { notFound } from "next/navigation";
import { connection } from "next/server";
import { GuidePageShell } from "@/components/public/guide-page-shell";
import { CommentBoardContent } from "@/components/comments/comment-board-content";
import { CommentBoardSkeleton } from "@/components/comments/comment-skeleton";
import { getCachedPublicGuideSummary } from "@/lib/cache/public";

export const instant = false;
type Props = { params: Promise<{ character: string }> };
export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const guide = await getCachedPublicGuideSummary((await params).character);
  return guide
    ? {
        title: `${guide.name}`,
        description: guide.overview,
        openGraph: { images: [guide.coverUrl] },
        twitter: { images: [guide.coverUrl] },
      }
    : { title: "ไม่พบไกด์" };
}
export default async function GuideCommentPage({ params }: Props) {
  await connection();
  const guide = await getCachedPublicGuideSummary((await params).character);
  if (!guide) notFound();
  const target = `guide:${guide.id}`;
  return (
    <GuidePageShell guide={guide} sections={guide.sections} section="comment">
      <Suspense fallback={<CommentBoardSkeleton />}>
        <CommentBoardContent target={target} />
      </Suspense>
    </GuidePageShell>
  );
}