Files
hackathon/front_end/src/components/ressourcePanel.tsx

53 lines
1.8 KiB
TypeScript

import { useState } from "react";
import { useLocalData } from "../context/useLocalData";
import ListButton from "./dropdownButton";
import { AthleteList, ActiviteList } from "./ressourceList";
import { Activite, Athlete } from "../classes";
export default function RessourcePanel() {
const { user } = useLocalData();
const [showAthletes, setShowAthletes] = useState(false);
const [showActivites, setShowActivites] = useState(false);
const athleteMap: Map<number, Athlete> = new Map();
user.sessions.forEach(session => {
session.athletes?.forEach(a => athleteMap.set(a.id, a));
});
const allAthletes: Athlete[] = Array.from(athleteMap.values());
const activiteMap: Map<number, Activite> = new Map();
user.sessions.forEach(session => {
session.activites?.forEach(act => activiteMap.set(act.id, act));
});
const allActivites: Activite[] = Array.from(activiteMap.values());
return (
<div className="ressource_panel">
<ListButton
onAthletesClick={() => {
setShowAthletes(prev => !prev);
setShowActivites(false);
}}
onActivitiesClick={() => {
setShowActivites(prev => !prev);
setShowAthletes(false);
}}
/>
{showAthletes && (
<div className="edt_athletes_panel">
<h3>Liste des athlètes</h3>
<AthleteList athletes={allAthletes} activites={[]}/>
</div>
)}
{showActivites && (
<div className="edt_activites_panel">
<h3>Liste des activités</h3>
<ActiviteList athletes={[]} activites={allActivites} />
</div>
)}
</div>
);
}