90 lines
2.7 KiB
TypeScript
90 lines
2.7 KiB
TypeScript
import { createFileRoute, redirect, useRouter } from '@tanstack/react-router'
|
|
import { tournamentQueries, useTournament } from '@/features/tournaments/queries'
|
|
import { ensureServerQueryData } from '@/lib/tanstack-query/utils/ensure'
|
|
import SeedTournament from '@/features/tournaments/components/seed-tournament'
|
|
import { Container, Alert, Text } from '@mantine/core'
|
|
import { Info } from '@phosphor-icons/react'
|
|
import { useMemo } from 'react'
|
|
import { BracketData } from '@/features/bracket/types'
|
|
import { Match } from '@/features/matches/types'
|
|
import BracketView from '@/features/bracket/components/bracket-view'
|
|
|
|
export const Route = createFileRoute('/_authed/admin/tournaments/run/$id')({
|
|
beforeLoad: async ({ context, params }) => {
|
|
const { queryClient } = context
|
|
const tournament = await ensureServerQueryData(
|
|
queryClient,
|
|
tournamentQueries.details(params.id)
|
|
)
|
|
if (!tournament) throw redirect({ to: '/admin/tournaments' })
|
|
return {
|
|
tournament,
|
|
}
|
|
},
|
|
loader: ({ context }) => ({
|
|
fullWidth: true,
|
|
header: {
|
|
withBackButton: true,
|
|
title: `Run ${context.tournament.name}`,
|
|
},
|
|
}),
|
|
component: RouteComponent,
|
|
})
|
|
|
|
function RouteComponent() {
|
|
const { id } = Route.useParams();
|
|
const { data: tournament } = useTournament(id)
|
|
|
|
const bracket: BracketData = useMemo(() => {
|
|
if (!tournament.matches || tournament.matches.length === 0) {
|
|
return { winners: [], losers: [] }
|
|
}
|
|
|
|
const winnersMap = new Map<number, Match[]>()
|
|
const losersMap = new Map<number, Match[]>()
|
|
|
|
tournament.matches.sort((a, b) => a.lid - b.lid).forEach((match) => {
|
|
if (!match.is_losers_bracket) {
|
|
if (!winnersMap.has(match.round)) {
|
|
winnersMap.set(match.round, [])
|
|
}
|
|
winnersMap.get(match.round)!.push(match)
|
|
} else {
|
|
if (!losersMap.has(match.round)) {
|
|
losersMap.set(match.round, [])
|
|
}
|
|
losersMap.get(match.round)!.push(match)
|
|
}
|
|
})
|
|
|
|
const winners = Array.from(winnersMap.entries())
|
|
.sort(([a], [b]) => a - b)
|
|
.map(([, matches]) => matches)
|
|
|
|
const losers = Array.from(losersMap.entries())
|
|
.sort(([a], [b]) => a - b)
|
|
.map(([, matches]) => matches)
|
|
return { winners, losers }
|
|
}, [tournament.matches])
|
|
|
|
const handleStartMatch = (match: Match) => {
|
|
|
|
}
|
|
|
|
console.log(tournament.matches)
|
|
|
|
return (
|
|
<Container size="md">
|
|
{
|
|
tournament.matches?.length ?
|
|
<BracketView bracket={bracket} onStartMatch={console.log} />
|
|
: (
|
|
<SeedTournament
|
|
tournamentId={tournament.id}
|
|
teams={tournament.teams || []}
|
|
/>)
|
|
}
|
|
</Container>
|
|
)
|
|
}
|