import type { Metadata } from "next";
import { requirePermission } from "@/lib/auth/session";
import { getProtocols, getProtocolEntries } from "@/lib/protocols/queries";
import { PageHeader } from "@/components/ui/PageHeader";
import { ProtocolsManager } from "./ProtocolsManager";

export const metadata: Metadata = { title: "Protokolle" };

export const dynamic = "force-dynamic";

type Search = { [key: string]: string | string[] | undefined };

export default async function ChangelogPage({
  searchParams,
}: {
  searchParams: Promise<Search>;
}) {
  const session = await requirePermission("changelog.view");
  const userId = session.user.id;
  const canManage = Boolean(session.user.permissions?.includes("changelog.manage"));

  const protocols = await getProtocols(userId);

  // Auswahl per Query-Parameter — dadurch sind einzelne Protokolle verlinkbar.
  const sp = await searchParams;
  const wanted = typeof sp.p === "string" ? sp.p : null;
  const selected = protocols.find((p) => p.id === wanted) ?? protocols[0] ?? null;

  const entries = selected
    ? await getProtocolEntries(selected.id, userId, canManage)
    : [];

  return (
    <div className="flex flex-col gap-5">
      <PageHeader
        eyebrow="Dokumentation"
        title="Protokolle"
        description="Changelogs, Wartungsfenster und Besprechungsprotokolle — je Strang gesammelt und nach Vorlage erfasst."
      />
      <ProtocolsManager
        protocols={protocols}
        entries={entries}
        selectedId={selected?.id ?? null}
        canManage={canManage}
      />
    </div>
  );
}