9353ab1edc
Progress on issue #7 - tournament schedule e2e tests: - Created ScheduleDisplay component with clickthrough to matches - Updated ScheduleGenerator to use router.refresh() instead of window.location.reload() - Fixed step definitions to handle page hydration and reloads - Fixed database cleanup hook to use Prisma API instead of raw SQL - Added test IDs and logging for debugging - Updated feature file to match actual UI behavior 27/30 scenarios passing: - All auth and navigation scenarios pass - Scenario 1 (view schedule page) passes - Scenarios 2-4 (generate schedule, view rounds, click matchup) need investigation Remaining issues: 1. Page refresh not picking up newly generated schedule data 2. Round data not visible after 'Generated' message 3. Matchup elements not found after refresh 4. Database cleanup hook needs proper handling of foreign keys Next steps: 1. Investigate why router.refresh() and explicit reload don't show new data 2. Check if there's a caching issue in the production build 3. Verify database transactions are committing correctly 4. Add more logging to trace data flow
109 lines
3.2 KiB
TypeScript
109 lines
3.2 KiB
TypeScript
"use client"
|
|
|
|
import Link from "next/link"
|
|
|
|
interface Player {
|
|
id: number
|
|
name: string
|
|
}
|
|
|
|
interface BracketMatchup {
|
|
id: number
|
|
player1P1: Player | null
|
|
player1P2: Player | null
|
|
player2P1: Player | null
|
|
player2P2: Player | null
|
|
match: { id: number } | null
|
|
bracketPosition: number | null
|
|
status: string
|
|
}
|
|
|
|
interface TournamentRound {
|
|
id: number
|
|
roundNumber: number
|
|
status: string
|
|
bracketMatchups: BracketMatchup[]
|
|
}
|
|
|
|
export function ScheduleDisplay({ rounds }: { rounds: TournamentRound[] }) {
|
|
return (
|
|
<div className="space-y-6">
|
|
{rounds.map((round) => (
|
|
<div key={round.id} className="border border-gray-200 rounded-lg p-4">
|
|
<h3 className="text-lg font-semibold text-gray-900 mb-3">
|
|
Round {round.roundNumber}
|
|
<span className="ml-2 text-sm font-normal text-gray-500">
|
|
({round.status})
|
|
</span>
|
|
</h3>
|
|
|
|
<div className="space-y-3">
|
|
{round.bracketMatchups.map((matchup) => {
|
|
const team1 = [
|
|
matchup.player1P1?.name,
|
|
matchup.player1P2?.name,
|
|
]
|
|
.filter(Boolean)
|
|
.join(" + ")
|
|
|
|
const team2 = [
|
|
matchup.player2P1?.name,
|
|
matchup.player2P2?.name,
|
|
]
|
|
.filter(Boolean)
|
|
.join(" + ")
|
|
|
|
const content = (
|
|
<div className="flex items-center justify-between p-3 bg-gray-50 rounded-md">
|
|
<div className="flex-1">
|
|
<span className="font-medium text-gray-900">
|
|
{team1 || "TBD"}
|
|
</span>
|
|
<span className="mx-3 text-gray-400">vs</span>
|
|
<span className="font-medium text-gray-900">
|
|
{team2 || "TBD"}
|
|
</span>
|
|
</div>
|
|
<div className="text-sm text-gray-500">
|
|
{matchup.status === "pending" ? (
|
|
<span className="text-gray-400">Pending</span>
|
|
) : matchup.match ? (
|
|
<span className="text-green-600">Completed</span>
|
|
) : (
|
|
<span className="text-gray-400">{matchup.status}</span>
|
|
)}
|
|
</div>
|
|
</div>
|
|
)
|
|
|
|
if (matchup.match) {
|
|
return (
|
|
<Link
|
|
key={matchup.id}
|
|
href={`/matches/${matchup.match.id}`}
|
|
className="block hover:bg-gray-100 rounded-md transition-colors"
|
|
data-testid="matchup"
|
|
>
|
|
{content}
|
|
</Link>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<Link
|
|
key={matchup.id}
|
|
href={`/matches/new?matchup=${matchup.id}`}
|
|
className="block hover:bg-gray-100 rounded-md transition-colors"
|
|
data-testid="matchup"
|
|
>
|
|
{content}
|
|
</Link>
|
|
)
|
|
})}
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|