diff --git a/app/features/tournament-bracket/routes/to.$id.brackets.tsx b/app/features/tournament-bracket/routes/to.$id.brackets.tsx index bd6d29191..cb8a0068f 100644 --- a/app/features/tournament-bracket/routes/to.$id.brackets.tsx +++ b/app/features/tournament-bracket/routes/to.$id.brackets.tsx @@ -30,7 +30,7 @@ import { findAllMatchesByTournamentId } from "../queries/findAllMatchesByTournam import { setBestOf } from "../queries/setBestOf.server"; import { canAdminTournament } from "~/permissions"; import { requireUser, useUser } from "~/modules/auth"; -import { tournamentIdFromParams } from "~/features/tournament"; +import { TOURNAMENT, tournamentIdFromParams } from "~/features/tournament"; import { bracketSubscriptionKey, fillWithNullTillPowerOfTwo, @@ -101,17 +101,27 @@ export const action: ActionFunction = async ({ params, request }) => { export const loader = ({ params }: LoaderArgs) => { const tournamentId = tournamentIdFromParams(params); - const tournament = notFoundIfFalsy(findByIdentifier(tournamentId)); const hasStarted = hasTournamentStarted(tournamentId); const manager = getTournamentManager(hasStarted ? "SQL" : "IN_MEMORY"); + if (hasStarted) { + return { + hasStarted: true, + enoughTeams: true, + bracket: manager.get.tournamentData(tournamentId), + }; + } + + const tournament = notFoundIfFalsy(findByIdentifier(tournamentId)); + let teams = findTeamsByTournamentId(tournamentId); if (checkInHasStarted(tournament)) { teams = teams.filter(teamHasCheckedIn); } - if (!hasStarted && teams.length >= 2) { + const enoughTeams = teams.length >= TOURNAMENT.ENOUGH_TEAMS_TO_START; + if (enoughTeams) { manager.create({ tournamentId, name: resolveTournamentStageName(tournament.format), @@ -127,7 +137,7 @@ export const loader = ({ params }: LoaderArgs) => { return { bracket: data, hasStarted, - teamsForBracketCount: teams.length, + enoughTeams, }; }; @@ -140,10 +150,8 @@ export default function TournamentBracketsPage() { const navigate = useNavigate(); const parentRouteData = useOutletContext(); - const lessThanTwoTeamsRegistered = data.teamsForBracketCount < 2; - React.useEffect(() => { - if (lessThanTwoTeamsRegistered) return; + if (!data.enoughTeams) return; // matches aren't generated before tournament starts if (data.hasStarted) { @@ -211,13 +219,7 @@ export default function TournamentBracketsPage() { element.innerHTML = ""; }; - }, [ - data.bracket, - navigate, - parentRouteData, - data.hasStarted, - lessThanTwoTeamsRegistered, - ]); + }, [data, navigate, parentRouteData]); // TODO: also disable autorefresh (don't render component) and don't trigger revalidate after tournament is finalized React.useEffect(() => { @@ -233,7 +235,7 @@ export default function TournamentBracketsPage() { return (
{visibility !== "hidden" ? : null} - {!data.hasStarted && !lessThanTwoTeamsRegistered ? ( + {!data.hasStarted && data.enoughTeams ? (
{!canAdminTournament({ user, event: parentRouteData.event }) ? ( ) : null}
- {lessThanTwoTeamsRegistered ? ( + {!data.enoughTeams ? (
- Bracket will be shown here when at least 2 teams have registered + Bracket will be shown here when at least{" "} + {TOURNAMENT.ENOUGH_TEAMS_TO_START} teams have registered
) : null}
diff --git a/app/features/tournament/tournament-constants.ts b/app/features/tournament/tournament-constants.ts index b7776b24d..a1d2717ce 100644 --- a/app/features/tournament/tournament-constants.ts +++ b/app/features/tournament/tournament-constants.ts @@ -6,4 +6,5 @@ export const TOURNAMENT = { TEAM_MIN_MEMBERS_FOR_FULL: 4, TEAM_MAX_MEMBERS: 6, AVAILABLE_BEST_OF: [3, 5, 7] as const, + ENOUGH_TEAMS_TO_START: 2, } as const;