diff --git a/src/Footer.tsx b/src/Footer.tsx index 04578a1..862b8fe 100644 --- a/src/Footer.tsx +++ b/src/Footer.tsx @@ -15,7 +15,7 @@ export default function Footer() { | - Trainer Analysis + Sociogram | diff --git a/src/Rankings.tsx b/src/Rankings.tsx index 3e75e4f..1c35670 100644 --- a/src/Rankings.tsx +++ b/src/Rankings.tsx @@ -1,6 +1,6 @@ import { ButtonHTMLAttributes, useEffect, useRef, useState } from "react"; import { ReactSortable, ReactSortableProps } from "react-sortablejs"; -import { apiAuth, loadPlayers, User } from "./api"; +import { apiAuth, User } from "./api"; import { TeamState, useSession } from "./Session"; import { Chemistry, MVPRanking, PlayerType } from "./types"; import TabController from "./TabController"; @@ -451,14 +451,7 @@ function HeaderControl({ onLoad, onClear }: HeaderControlProps) { } export default function Rankings() { - const { user, teams } = useSession(); - const [players, setPlayers] = useState(null); - - useEffect(() => { - if (teams) { - loadPlayers(teams.activeTeam).then((data) => setPlayers(data)); - } - }, [user, teams]); + const { user, teams, players } = useSession(); const tabs = [ { id: "Chemistry", label: "🧪 Chemistry" }, diff --git a/src/Session.tsx b/src/Session.tsx index ffed150..e6626ba 100644 --- a/src/Session.tsx +++ b/src/Session.tsx @@ -24,6 +24,7 @@ export interface Session { teams: TeamState | null; setTeams: (teams: TeamState) => void; players: User[] | null; + reloadPlayers: () => void; onLogout: () => void; } @@ -32,6 +33,7 @@ const sessionContext = createContext({ teams: null, setTeams: () => {}, players: null, + reloadPlayers: () => {}, onLogout: () => {}, }); @@ -63,6 +65,10 @@ export function SessionProvider(props: SessionProviderProps) { if (teams) setTeams({ teams: teams, activeTeam: teams[0].id }); } + async function reloadPlayers() { + teams && loadPlayers(teams?.activeTeam).then((data) => setPlayers(data)); + } + useEffect(() => { loadUser(); }, []); @@ -70,7 +76,7 @@ export function SessionProvider(props: SessionProviderProps) { loadTeam(); }, [user]); useEffect(() => { - teams && loadPlayers(teams?.activeTeam).then((data) => setPlayers(data)); + reloadPlayers(); }, [teams]); function onLogin(user: User) { @@ -103,7 +109,7 @@ export function SessionProvider(props: SessionProviderProps) { } else content = ( {children} diff --git a/src/TeamPanel.tsx b/src/TeamPanel.tsx index a5edab3..73a5d0e 100644 --- a/src/TeamPanel.tsx +++ b/src/TeamPanel.tsx @@ -1,12 +1,12 @@ import { FormEvent, useEffect, useState } from "react"; -import { apiAuth, Gender, loadPlayers, User } from "./api"; +import { apiAuth, Gender, User } from "./api"; import { useSession } from "./Session"; import { ErrorState } from "./types"; import { useNavigate } from "react-router"; import Calendar from "./Calendar"; const TeamPanel = () => { - const { user, teams, players } = useSession(); + const { user, teams, players, reloadPlayers } = useSession(); const navigate = useNavigate(); useEffect(() => { user?.scopes.includes(`team:${teams?.activeTeam}`) || @@ -32,14 +32,14 @@ const TeamPanel = () => { if (r.detail) setError({ ok: false, message: r.detail }); else { setError({ ok: true, message: r }); - loadPlayers(teams.activeTeam).then((data) => setPlayers(data)); + reloadPlayers(); } } else { const r = await apiAuth(`player/${teams?.activeTeam}`, player, "PUT"); if (r.detail) setError({ ok: false, message: r.detail }); else { setError({ ok: true, message: r }); - loadPlayers(teams.activeTeam).then((data) => setPlayers(data)); + reloadPlayers(); } } } @@ -59,7 +59,7 @@ const TeamPanel = () => { else { setError({ ok: true, message: r }); setPlayer(newPlayerTemplate); - loadPlayers(teams.activeTeam).then((data) => setPlayers(data)); + reloadPlayers(); } } }