chore: refactor settings route

app/(app)/(reader)/letters/year/[year]/page.tsx

@@ -0,0 +1,51 @@
+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>
+  );
+}