fix: ts fix

app/letters/year/[year]/year-month-browser.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState, useMemo, useRef, useEffect } from "react";
+import { useState, useMemo, useRef } from "react";
 import Link from "next/link";
 import { Card, CardContent } from "@/components/ui/card";
 import { buttonVariants } from "@/components/ui/button";
@@ -321,21 +321,19 @@ export function YearMonthBrowser({
 }) {
   const allGroups = useMemo(() => buildMonthGroups(letters), [letters]);
 
-  const [activeMonth, setActiveMonth] = useState<number>(
+  const [activeMonthRaw, setActiveMonth] = useState<number>(
     allGroups.length > 0 ? allGroups[0].month : 1,
   );
 
-  const contentRef = useRef<HTMLDivElement>(null);
+  // Derive a safe active month — if the raw value is no longer valid, fall back to the first group
+  const activeMonth = useMemo(() => {
+    if (allGroups.length === 0) return activeMonthRaw;
+    if (allGroups.find((g) => g.month === activeMonthRaw))
+      return activeMonthRaw;
+    return allGroups[0].month;
+  }, [allGroups, activeMonthRaw]);
 
-  // Keep active month valid
-  useEffect(() => {
-    if (
-      allGroups.length > 0 &&
-      !allGroups.find((g) => g.month === activeMonth)
-    ) {
-      setActiveMonth(allGroups[0].month);
-    }
-  }, [allGroups, activeMonth]);
+  const contentRef = useRef<HTMLDivElement>(null);
 
   const handleMonthSelect = (month: number) => {
     setActiveMonth(month);