import type { Metadata } from "next";
import Link from "next/link";
import { Card } from "@/components/ui";

export const metadata: Metadata = { title: "Plus", robots: { index: false } };

const GROUPS: [string, [string, string, string][]][] = [
  ["Données", [["/prevision", "Prévision", "Sièges, vote, probabilités, historique"], ["/signaux", "Au-delà des sondages", "Marchés, presse, attention, fondamentaux, partielles"], ["/sondages", "Sondages", "Moyenne QC26, Poll Inspector, effets maison"], ["/circonscriptions", "Circonscriptions", "127 fiches, recherche instantanée"], ["/live", "Soirée électorale", "Direct, forecast vs live, nowcast"], ["/replay", "Replay", "Rejouer la soirée"]]],
  ["Partis", [["/partis", "Partis", "Chefs, candidatures, projections"], ["/partis/comparateur", "Comparateur", "Matrice enjeux × partis"], ["/enjeux", "Enjeux", "Propositions par sujet, recherche documentaire"], ["/documents", "Bibliothèque", "Documents officiels versionnés"]]],
  ["Transparence", [["/methodologie", "Méthodologie", "Comment QC26 calcule"], ["/methodologie/changelog", "Changelog", "Versions du modèle et runs"], ["/statut", "Statut des données", "Connecteurs, sources, travaux"], ["/live/model-vs-reality", "Modèle vs réalité", "Précision le soir du vote"]]],
];

export default function Page() {
  return (
    <div className="space-y-8">
      <h1 className="display text-[36px]">Plus</h1>
      {GROUPS.map(([g, items]) => (<section key={g}><div className="eyebrow mb-2">{g}</div><div className="grid gap-2">{items.map(([href, t, d]) => <Link key={href} href={href}><Card className="!p-3.5 card-hover"><div className="font-semibold text-[15px]">{t}</div><div className="text-[12.5px] text-ink-2">{d}</div></Card></Link>)}</div></section>))}
    </div>
  );
}