"use client";

import { useState, useEffect } from "react";
import { generatePatches, PatchesPuzzle } from "@/lib/generators/patches";
import { todayISO } from "@/lib/rng";
import PatchesBoard from "@/components/PatchesBoard";
import DailyPageShell from "@/components/DailyPageShell";

export default function PatchesPage() {
  const date = todayISO();
  const [puzzle, setPuzzle] = useState<PatchesPuzzle | null>(null);
  useEffect(() => { setPuzzle(generatePatches(date)); }, [date]);

  const dateLabel = new Date(date + "T00:00:00").toLocaleDateString("fr-FR", {
    weekday: "long", day: "numeric", month: "long",
  });

  return (
    <DailyPageShell game="patches" date={date} dateLabel={dateLabel}>
      {puzzle ? (
        <PatchesBoard puzzle={puzzle} date={date} />
      ) : (
        <div className="py-20 text-gray-300 text-sm">Chargement…</div>
      )}
    </DailyPageShell>
  );
}
