Team Card - Copy this React, Tailwind Component to your project

Sto creando una pagina in un'applicazione Django per gestire un torneo. Ogni torneo ha più fasi, e ogni fase può avere una tipologia (GRUPPI, ELIMINAZIONE_DIRETTA, ecc.). Quando una fase è di tipo ELIMINAZIONE_DIRETTA, voglio visualizzare un bracket interattivo, utilizzando la libreria jQuery Bracket. In questa pagina HTML (dettaglio_tornei.html), ogni fase è rappresentata in una tab, e la tab attiva è quella attualmente in corso. L'obiettivo è che per ogni fase venga mostrato: Un contenitore bracket (#bracket-<fase.id>) Che venga popolato dinamicamente via JS con un JSON conforme a jQuery Bracket Che quando l’utente seleziona un vincitore nel bracket, venga fatto un fetch() al backend per salvare il risultato Inoltre, nella stessa pagina c’è una colonna con le squadre iscritte (con logo e nome), in modo che io possa eventualmente implementare una modalità manuale (drag & drop per assegnare squadre). Voglio che il comportamento sia: Senza reload pagina (tutto via API) Responsive e dark-themed Estendibile in futuro anche per gironi e round robin Mi serve: struttura HTML con tabs per fasi, un esempio di JSON valido per jQuery Bracket, codice JS per inizializzare dinamicamente ogni bracket.