import { fmtDate, fmtInt, t, type Locale } from "@/lib/i18n";
import type { stats } from "@/lib/papers/queries";
export function StatTiles({ s, locale }: { s: Awaited<ReturnType<typeof stats>>; locale: Locale }) {
  const d = t(locale);
  const tiles: [string, string][] = [
    [d.stats.papers, fmtInt(locale, s.papers)], [d.stats.manuscripts, fmtInt(locale, s.manuscripts)], [d.stats.topics, fmtInt(locale, s.topics)], [d.stats.authors, fmtInt(locale, s.authors)],
    [d.stats.datasets, fmtInt(locale, s.datasets)], [d.stats.methods, fmtInt(locale, s.methods)], [d.stats.pages, fmtInt(locale, s.pages)], [d.stats.latest, s.latest ? fmtDate(locale, s.latest, "month") : "—"],
  ];
  return (
    <dl className="grid grid-cols-2 sm:grid-cols-4 gap-3">
      {tiles.map(([label, value]) => <div key={label} className="card px-4 py-3"><dt className="label">{label}</dt><dd className="serif text-2xl mt-1 text-fg">{value}</dd></div>)}
    </dl>
  );
}