Evita di calcolare le statistiche di tutta la rosa dove serve solo l'anagrafica

LinkProfilo (header di ogni pagina) e il Calendario (compleanni del mese) usavano
useIo/useRosa, che calcola MVP, pagelle, cacche, palloni e infortuni per l'intera
squadra tramite 6 hook e un useMemo pesante - anche se a entrambi serviva solo
id/nome/nascita/iniziali. Il Calendario in particolare pagava questo costo ad ogni
apertura solo per i compleanni del mese.

- crapp-data.ts: esporta inizialiDa, già usata internamente per il fallback avatar.
- ui-bits.tsx: LinkProfilo usa useGiocatoreBase (sola anagrafica) invece di useIo.
- rosa.ts: nuovo hook useAnagraficaRosa (id, nome, nascita) senza gli altri 5 hook
  statistici ne' il useMemo su tutta la rosa.
- eventi.ts: compleanniEventi accetta solo i tre campi che usa, non l'intero
  Giocatore.
- calendario.tsx: usa useAnagraficaRosa al posto di useRosa.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/components/crapp/ui-bits.tsx

@@ -2,8 +2,9 @@ import { useId, useState, type ComponentPropsWithoutRef, type ReactNode } from "
 import { Link } from "@tanstack/react-router";
 import { ChevronDown } from "lucide-react";
 import { cn } from "@/lib/utils";
-import { statoMeta, type Stato } from "@/lib/crapp-data";
-import { useIo } from "@/lib/rosa";
+import { inizialiDa, statoMeta, type Stato } from "@/lib/crapp-data";
+import { nomeCompleto } from "@/lib/giocatori-squadra";
+import { useGiocatoreBase } from "@/lib/user-store";
 import { Avatar } from "@/components/crapp/Avatar";
 import { Reveal } from "@/components/motion/Reveal";
 import { Numero } from "@/components/motion/Numero";
@@ -51,9 +52,14 @@ export function Card({
  * Accesso al profilo in alto a destra: la BottomNav ha quattro voci e questa è
  * l'unica porta verso `/profilo`. Sulla pagina del profilo si passa `azione` a
  * `PageHeader` per rimetterci il logo — sarebbe un link a sé stessa.
+ *
+ * Usa `useGiocatoreBase` (sola anagrafica) e non `useIo`: qui serve solo id e
+ * iniziali, mentre `useIo` calcola l'intera rosa con statistiche (MVP, pagelle,
+ * cacche, palloni, infortuni). Essendo in un componente montato su quasi ogni
+ * pagina, quei moduli finirebbero nel bundle condiviso di tutte le rotte.
  */
 export function LinkProfilo() {
-  const g = useIo();
+  const g = useGiocatoreBase();
   if (!g) return <TeamLogo className="h-12 w-12" />;
   return (
     <Link
@@ -61,7 +67,7 @@ export function LinkProfilo() {
       aria-label="Il tuo profilo"
       className="premi shrink-0 rounded-2xl ring-2 ring-primary-foreground/30"
     >
-      <Avatar id={g.id} fallback={g.iniziali} className="h-12 w-12 text-lg" />
+      <Avatar id={g.id} fallback={inizialiDa(nomeCompleto(g))} className="h-12 w-12 text-lg" />
     </Link>
   );
 }

src/lib/crapp-data.ts

@@ -73,7 +73,8 @@ const rosaCSI: Rosa[] = [
   { nome: "Giada Valbonesi", nascita: "1994-05-20", ruolo: "Opposto", numero: 10 },
 ];
 
-function inizialiDa(nome: string) {
+/** Iniziali da un nome completo (max 2 lettere), es. per il fallback di `Avatar`. */
+export function inizialiDa(nome: string) {
   return nome
     .split(" ")
     .map((p) => p[0] ?? "")

src/lib/eventi.ts

@@ -162,8 +162,18 @@ export function useEliminaEvento() {
   });
 }
 
-/** Compleanni della rosa, come eventi di calendario dell'anno indicato. */
-export function compleanniEventi(rosa: Giocatore[], anno = new Date().getFullYear()): Evento[] {
+/**
+ * Compleanni della rosa, come eventi di calendario dell'anno indicato.
+ *
+ * Prende solo i tre campi che usa (non l'intero `Giocatore`): il Calendario li
+ * legge da un'anagrafica leggera per non tirarsi dietro tutte le statistiche
+ * (MVP, pagelle, cacche, palloni, infortuni) di `useRosa` solo per le date di
+ * nascita.
+ */
+export function compleanniEventi(
+  rosa: Array<Pick<Giocatore, "id" | "nome" | "nascita">>,
+  anno = new Date().getFullYear(),
+): Evento[] {
   return rosa
     .filter((g) => g.nascita)
     .map((g) => {

src/lib/rosa.ts

@@ -24,6 +24,23 @@ function iniziali(nome: string, cognome: string): string {
   return `${nome[0] ?? ""}${cognome[0] ?? ""}`.toUpperCase();
 }
 
+/**
+ * Solo anagrafica (id, nome, data di nascita) dei giocatori attivi — es. per i
+ * compleanni nel Calendario. A differenza di `useRosa` non legge MVP, pagelle,
+ * cacche, palloni né infortuni: evita di montare quei cinque hook e il relativo
+ * `useMemo` solo per una data di nascita.
+ */
+export function useAnagraficaRosa(): Array<Pick<Giocatore, "id" | "nome" | "nascita">> {
+  const { righe: squadra } = useGiocatoriSquadra();
+  return useMemo(
+    () =>
+      squadra
+        .filter((g) => g.attivo)
+        .map((g) => ({ id: g.id, nome: nomeCompleto(g), nascita: nascitaPerId[g.id] ?? "" })),
+    [squadra],
+  );
+}
+
 /**
  * Rosa completa con tutte le statistiche personali (presenze, MVP, media voto,
  * palloni, infortuni, ritardi, cacche). Legge l'anagrafica da `giocatori_squadra`

src/routes/calendario.tsx

@@ -9,7 +9,7 @@ import { useMotoRidotto } from "@/lib/motion";
 import { EventoCard, linkPerEvento } from "@/components/crapp/EventoCard";
 import { Card, PageHeader, Section } from "@/components/crapp/ui-bits";
 import { compleanniEventi, useEventi, type Evento } from "@/lib/eventi";
-import { useRosa } from "@/lib/rosa";
+import { useAnagraficaRosa } from "@/lib/rosa";
 import { useIsAdmin } from "@/lib/ruoli";
 import {
   Drawer,
@@ -115,7 +115,7 @@ function Calendario() {
   const [drawerAperto, setDrawerAperto] = useState(false);
   const admin = useIsAdmin();
   const { eventi } = useEventi();
-  const rosa = useRosa();
+  const rosa = useAnagraficaRosa();
   // `useMotoRidotto` copre anche i device deboli (RAM bassa), non solo
   // `prefers-reduced-motion`: disattiva anche lo swipe orizzontale tra mesi.
   const ridotto = useMotoRidotto();