export const dynamic = "force-dynamic";

import type { Metadata } from "next";
import { notFound } from "next/navigation";
import { getLettersByYear } from "@/lib/letters";
import { ogForLettersByYear } from "@/lib/og";
import { YearMonthBrowser } from "./year-month-browser";

export async function generateMetadata({
  params,
}: {
  params: Promise<{ year: string }>;
}): Promise<Metadata> {
  const { year: yearStr } = await params;
  const year = parseInt(yearStr, 10);
  if (isNaN(year)) return {};
  const letters = await getLettersByYear(year);
  return ogForLettersByYear(year, letters.length);
}

export default async function LettersByYearPage({
  params,
}: {
  params: Promise<{ year: string }>;
}) {
  const { year: yearStr } = await params;
  const year = parseInt(yearStr, 10);
  if (isNaN(year)) notFound();

  const letters = await getLettersByYear(year);
  if (letters.length === 0) notFound();

  const serialized = letters.map((l) => ({
    slug: l.slug,
    recipientDisplay: l.recipientDisplay,
    date: l.date,
    year: l.year,
    month: l.month,
    location: l.location,
  }));

  return (
    <div className="min-h-screen bg-background">
      <YearMonthBrowser
        letters={serialized}
        year={year}
        totalCount={letters.length}
      />
    </div>
  );
}