import { notFound } from "next/navigation";
import { loadClipList } from "@/lib/clips";
import { isMode } from "@/lib/types";
import { CURATED, COMPOUNDS, readVocab } from "@/lib/vocab";
import { REASONS, OTHER_CODE } from "../../song/reasons.mjs";
import Deck from "@/components/Deck";

export const dynamic = "force-dynamic";

export default async function ModePage({
  params,
  searchParams,
}: {
  params: Promise<{ mode: string }>;
  searchParams: Promise<{ limit?: string; only?: string }>;
}) {
  const { mode } = await params;
  if (!isMode(mode)) notFound();
  const { limit, only } = await searchParams;

  const page = await loadClipList({
    mode,
    limit: Math.max(1, Number(limit ?? 200)),
    // ?only=key,key -- look at named clips whatever pile they are in, including
    // rejected ones. Six clips in the last pass were rejected for the window
    // rather than for the clip, and nothing would otherwise offer them again.
    only: only?.split(",").map((s) => s.trim()).filter(Boolean),
  });
  const custom = await readVocab();

  return (
    <Deck
      page={page}
      vocab={{ curated: CURATED, compounds: COMPOUNDS, custom }}
      reasons={{ bad: REASONS.bad, dirty: REASONS.dirty, other: OTHER_CODE }}
    />
  );
}