import type { Metadata } from "next";
import { notFound } from "next/navigation";
import { getPageForPreview, getPublishedPage } from "@/lib/actions/footer";

type Props = {
  params: Promise<{ slug: string }>;
  searchParams: Promise<{ preview?: string }>;
};

export async function generateMetadata({
  params,
  searchParams,
}: Props): Promise<Metadata> {
  const { slug } = await params;
  const { preview } = await searchParams;
  const page =
    preview === "1"
      ? await getPageForPreview(slug)
      : await getPublishedPage(slug);
  if (!page) return { title: "Not Found" };
  return {
    title: page.title,
    description: page.description,
  };
}

export default async function StorePage({ params, searchParams }: Props) {
  const { slug } = await params;
  const { preview } = await searchParams;
  const page =
    preview === "1"
      ? await getPageForPreview(slug)
      : await getPublishedPage(slug);
  if (!page) notFound();

  return (
    <main className="mx-auto w-full max-w-3xl px-gutter py-12">
      <h1 className="text-3xl font-bold tracking-tight">{page.title}</h1>
      <p className="mt-3 text-muted-foreground">{page.description}</p>

      <div className="mt-10 space-y-8">
        {page.content.sections.map((section) => (
          <section key={section.heading}>
            <h2 className="text-xl font-semibold">{section.heading}</h2>
            <p className="mt-2 leading-relaxed text-foreground/80">
              {section.body}
            </p>
          </section>
        ))}
      </div>
    </main>
  );
}