import type { Metadata } from "next";
import { MOMENT_PLACEHOLDER_KEY } from "yt-dlp-transcript-common/lib/report/views";
import MomentArticle from "../../components/reports/MomentArticle";
import { EmptyState } from "../../components/reports/parts";
import { momentKeys, readMomentView } from "../../lib/reports";

// /m/<channel>/<id>/<start>-<end>/ (a span) and /m/<channel>/<id>/ (a post):
// one cited moment, from /m/<key>/moment.json. The key's segments are the
// route's (common/lib/citations/moments.ts). Static: every moment the site's
// reports cite is listed, nothing else resolves; a site with none builds the
// one placeholder page.
export const dynamicParams = false;

export function generateStaticParams(): { moment: string[] }[] {
  const keys = momentKeys();
  return (keys.length > 0 ? keys : [MOMENT_PLACEHOLDER_KEY]).map((k) => ({ moment: k.split("/") }));
}

type Params = { params: Promise<{ moment: string[] }> };

// Next hands a catch-all's segments back URL-encoded on some paths; a key's
// segments are plain ASCII, so decoding is lossless.
async function keyOf(params: Params["params"]): Promise<string> {
  return (await params).moment.map((s) => decodeURIComponent(s)).join("/");
}

export async function generateMetadata({ params }: Params): Promise<Metadata> {
  const view = readMomentView(await keyOf(params));
  if (!view) return { title: "No moments" };
  const who = view.record.title ?? view.record.channelTitle ?? view.record.channel;
  return { title: `“${view.quote.length > 60 ? `${view.quote.slice(0, 57)}…` : view.quote}” — ${who}` };
}

export default async function MomentPage({ params }: Params) {
  const view = readMomentView(await keyOf(params));
  if (!view) {
    return <EmptyState title="No moments">No report on this site cites a moment yet.</EmptyState>;
  }
  return <MomentArticle view={view} />;
}