feat: add tournament schedule page with generator component
Schedule page displays round-robin rounds with matchups, team names, status badges, and links to result entry. Generator component provides generate/delete buttons with success/error feedback.
This commit is contained in:
@@ -0,0 +1,219 @@
|
||||
import { prisma } from "@/lib/prisma"
|
||||
export const dynamic = "force-dynamic";
|
||||
import Navigation from "@/components/Navigation"
|
||||
import Link from "next/link"
|
||||
import { notFound, redirect } from "next/navigation"
|
||||
import { canManageTournament } from "@/lib/permissions"
|
||||
import { ScheduleGenerator } from "@/components/ScheduleGenerator"
|
||||
|
||||
interface PageProps {
|
||||
params: {
|
||||
id: string
|
||||
}
|
||||
}
|
||||
|
||||
const statusColors: Record<string, string> = {
|
||||
pending: "bg-gray-100 text-gray-700",
|
||||
in_progress: "bg-yellow-100 text-yellow-800",
|
||||
completed: "bg-green-100 text-green-800",
|
||||
}
|
||||
|
||||
export default async function TournamentSchedulePage({ params }: PageProps) {
|
||||
const { id } = await params
|
||||
const tournamentId = parseInt(id, 10)
|
||||
|
||||
if (isNaN(tournamentId)) {
|
||||
notFound()
|
||||
}
|
||||
|
||||
const permission = await canManageTournament(tournamentId)
|
||||
if (!permission.allowed) {
|
||||
redirect("/auth/login")
|
||||
}
|
||||
|
||||
const tournament = await prisma.event.findUnique({
|
||||
where: { id: tournamentId },
|
||||
include: {
|
||||
teams: {
|
||||
include: {
|
||||
player1: true,
|
||||
player2: true,
|
||||
},
|
||||
},
|
||||
rounds: {
|
||||
orderBy: { roundNumber: "asc" },
|
||||
include: {
|
||||
bracketMatchups: {
|
||||
include: {
|
||||
team1: {
|
||||
include: { player1: true, player2: true },
|
||||
},
|
||||
team2: {
|
||||
include: { player1: true, player2: true },
|
||||
},
|
||||
match: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
if (!tournament) {
|
||||
notFound()
|
||||
}
|
||||
|
||||
const hasSchedule = tournament.rounds.length > 0
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
<Navigation />
|
||||
|
||||
<main className="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
|
||||
<div className="px-4 py-6 sm:px-0">
|
||||
{/* Breadcrumb */}
|
||||
<nav className="mb-4">
|
||||
<ol className="flex items-center space-x-2">
|
||||
<li>
|
||||
<Link href="/admin/tournaments" className="text-green-600 hover:text-green-900">
|
||||
Tournaments
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-gray-400">/</li>
|
||||
<li>
|
||||
<Link href={`/admin/tournaments/${tournament.id}`} className="text-green-600 hover:text-green-900">
|
||||
{tournament.name}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-gray-400">/</li>
|
||||
<li className="text-gray-600">Schedule</li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
{/* Page Header */}
|
||||
<div className="bg-white shadow rounded-lg p-6 mb-6">
|
||||
<h1 className="text-2xl font-bold text-gray-900">Tournament Schedule</h1>
|
||||
<p className="text-gray-500 mt-1">
|
||||
{tournament.name} — {tournament.teams.length} teams
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Schedule Generator (when no schedule exists) */}
|
||||
{!hasSchedule && (
|
||||
<div className="bg-white shadow rounded-lg p-6 mb-6">
|
||||
<h2 className="text-lg font-medium text-gray-900 mb-4">
|
||||
No Schedule Generated
|
||||
</h2>
|
||||
<ScheduleGenerator
|
||||
tournamentId={tournamentId}
|
||||
teamCount={tournament.teams.length}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Schedule Rounds */}
|
||||
{hasSchedule && tournament.rounds.map((round) => (
|
||||
<div key={round.id} className="bg-white shadow rounded-lg p-6 mb-6">
|
||||
<div className="flex justify-between items-center mb-4">
|
||||
<h2 className="text-lg font-medium text-gray-900">
|
||||
Round {round.roundNumber}
|
||||
</h2>
|
||||
<span className={`px-2 py-1 text-xs font-medium rounded-full ${statusColors[round.status] || statusColors.pending}`}>
|
||||
{round.status.replace("_", " ")}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{round.bracketMatchups.length === 0 ? (
|
||||
<p className="text-gray-500">No matchups in this round.</p>
|
||||
) : (
|
||||
<div className="space-y-3">
|
||||
{round.bracketMatchups.map((matchup) => {
|
||||
const team1Name = matchup.team1
|
||||
? `${matchup.team1.player1.name} + ${matchup.team1.player2.name}`
|
||||
: "TBD"
|
||||
const team2Name = matchup.team2
|
||||
? `${matchup.team2.player1.name} + ${matchup.team2.player2.name}`
|
||||
: "TBD"
|
||||
|
||||
return (
|
||||
<div
|
||||
key={matchup.id}
|
||||
className="border border-gray-200 rounded p-3"
|
||||
>
|
||||
<div className="flex justify-between items-center">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center space-x-2">
|
||||
{matchup.tableNumber && (
|
||||
<span className="text-xs text-gray-400 bg-gray-100 px-2 py-0.5 rounded">
|
||||
Table {matchup.tableNumber}
|
||||
</span>
|
||||
)}
|
||||
<span className={`px-2 py-0.5 text-xs font-medium rounded-full ${statusColors[matchup.status] || statusColors.pending}`}>
|
||||
{matchup.status.replace("_", " ")}
|
||||
</span>
|
||||
</div>
|
||||
<p className="font-medium mt-1">
|
||||
{team1Name} <span className="text-gray-400">vs</span> {team2Name}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-3">
|
||||
{matchup.match ? (
|
||||
<div className="flex items-center space-x-2">
|
||||
<span className={`font-bold ${
|
||||
matchup.match.team1Score > matchup.match.team2Score
|
||||
? 'text-green-600'
|
||||
: 'text-gray-900'
|
||||
}`}>
|
||||
{matchup.match.team1Score}
|
||||
</span>
|
||||
<span className="text-gray-400">-</span>
|
||||
<span className={`font-bold ${
|
||||
matchup.match.team2Score > matchup.match.team1Score
|
||||
? 'text-green-600'
|
||||
: 'text-gray-900'
|
||||
}`}>
|
||||
{matchup.match.team2Score}
|
||||
</span>
|
||||
<Link
|
||||
href={`/matches/${matchup.match.id}`}
|
||||
className="text-green-600 hover:text-green-900 text-sm"
|
||||
>
|
||||
View
|
||||
</Link>
|
||||
</div>
|
||||
) : (
|
||||
<Link
|
||||
href={`/admin/tournaments/${tournament.id}/results`}
|
||||
className="px-3 py-1 border border-green-300 rounded text-sm font-medium text-green-700 hover:bg-green-50"
|
||||
>
|
||||
Enter Result
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
|
||||
{/* Actions when schedule exists */}
|
||||
{hasSchedule && (
|
||||
<div className="bg-white shadow rounded-lg p-6">
|
||||
<h2 className="text-lg font-medium text-gray-900 mb-4">
|
||||
Schedule Actions
|
||||
</h2>
|
||||
<ScheduleGenerator
|
||||
tournamentId={tournamentId}
|
||||
teamCount={tournament.teams.length}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user