Les propriétés du composant
Liste des épreuves à organiser par discipline
Callback appelé lors du clic sur une épreuve
Vue organisée des épreuves par discipline avec carrousels interactifs
// Utilisation basique avec liste d'épreuves mixtes
<DisplayedEpreuves
epreuves={allEpreuves}
onCardClickAction={(id) => openEpreuveDetails(id)}
/>
// Avec épreuves filtrées et gestion d'état
const [selectedEpreuve, setSelectedEpreuve] = useState<number | null>(null);
<DisplayedEpreuves
epreuves={filteredEpreuves}
onCardClickAction={(epreuveId) => {
setSelectedEpreuve(epreuveId);
setShowModal(true);
}}
/>
// Affichage conditionnel selon les résultats
{epreuves.length > 0 ? (
<DisplayedEpreuves
epreuves={epreuves}
onCardClickAction={handleSelection}
/>
) : (
<EmptyState message="Aucune épreuve disponible" />
)}
Composant DisplayedEpreuves pour l'organisation et l'affichage groupé des épreuves. Voir la documentation du module ci-dessus pour les détails complets.
Le composant prend une liste d'épreuves et les organise automatiquement par discipline, créant un carrousel séparé pour chaque discipline avec un label descriptif. Il offre une navigation intuitive et structurée des épreuves disponibles.