Rende ad accordion l'elenco Profili in admin: una sola scheda aperta

Lo stato "quale giocatore è aperto" sale a Dashboard invece di essere
locale a ogni SchedaGiocatore, così aprirne una chiude quella precedente.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-10 14:38:33 +02:00
co-authored by Claude Sonnet 5
parent 457a0fe23d
commit 99ca3b6495
+15 -7
View File
@@ -380,13 +380,16 @@ function SchedaGiocatore({
profilo, profilo,
oggi, oggi,
indice, indice,
aperta,
onToggle,
}: { }: {
g: GiocatoreSquadra; g: GiocatoreSquadra;
profilo: Profilo | undefined; profilo: Profilo | undefined;
oggi: string; oggi: string;
indice: number; indice: number;
aperta: boolean;
onToggle: () => void;
}) { }) {
const [aperta, setAperta] = useState(false);
const nome = nomeCompleto(g); const nome = nomeCompleto(g);
const { ruolo, numero } = g; const { ruolo, numero } = g;
const perc = completamento(profilo); const perc = completamento(profilo);
@@ -397,11 +400,7 @@ function SchedaGiocatore({
return ( return (
<Reveal indice={indice} className="rounded-2xl bg-card p-4 shadow-card"> <Reveal indice={indice} className="rounded-2xl bg-card p-4 shadow-card">
<button <button type="button" onClick={onToggle} className="flex w-full items-center gap-3 text-left">
type="button"
onClick={() => setAperta((v) => !v)}
className="flex w-full items-center gap-3 text-left"
>
<div className="grid h-10 w-10 shrink-0 place-items-center rounded-xl bg-secondary font-display text-sm tabular-nums"> <div className="grid h-10 w-10 shrink-0 place-items-center rounded-xl bg-secondary font-display text-sm tabular-nums">
{numero} {numero}
</div> </div>
@@ -620,6 +619,7 @@ function Dashboard() {
const { righe: squadra } = useGiocatoriSquadra(); const { righe: squadra } = useGiocatoriSquadra();
const { profili, isPending } = useProfili(); const { profili, isPending } = useProfili();
const { data: notificheAttive } = useNotificheAttive(); const { data: notificheAttive } = useNotificheAttive();
const [schedaAperta, setSchedaAperta] = useState<string | null>(null);
const oggi = oggiISO(); const oggi = oggiISO();
if (!admin) { if (!admin) {
@@ -676,7 +676,15 @@ function Dashboard() {
) : ( ) : (
<div className="space-y-3"> <div className="space-y-3">
{attivi.map((g, i) => ( {attivi.map((g, i) => (
<SchedaGiocatore key={g.id} g={g} profilo={profili[g.id]} oggi={oggi} indice={i} /> <SchedaGiocatore
key={g.id}
g={g}
profilo={profili[g.id]}
oggi={oggi}
indice={i}
aperta={schedaAperta === g.id}
onToggle={() => setSchedaAperta((v) => (v === g.id ? null : g.id))}
/>
))} ))}
</div> </div>
); );