import { requireAdmin } from "../../lib/auth";
import { getAvailabilityMap, listPages } from "../../lib/cms";
import { AppHeader } from "../AppHeader";
import { PagesOverview } from "./PagesOverview";

export default async function WebsitePage() {
  const session = await requireAdmin();
  const availability = getAvailabilityMap();
  const pages = listPages().map((p) => ({ ...p, langs: availability[p.slug] ?? [] }));

  return (
    <div className="min-h-screen bg-zinc-50 dark:bg-zinc-950">
      <AppHeader email={session.email} active="website" />

      <main className="max-w-5xl mx-auto px-4 sm:px-6 py-10">
        <h1 className="text-lg font-semibold text-zinc-900 dark:text-zinc-100">Pagina&apos;s ({pages.length})</h1>
        <p className="text-sm text-zinc-500 mt-1 mb-6">
          Beheer de inhoud, het hoofdmenu en de SEO-instellingen van de pagina&apos;s van de publieke website.
        </p>
        <PagesOverview pages={pages} />
      </main>
    </div>
  );
}