feat: add draft board link visibility for all season statuses

This commit is contained in:
Chris Parsons 2025-10-20 15:53:38 -07:00
parent 6c5c9f709b
commit cf90bf52ec

View file

@ -38,7 +38,9 @@ export async function loader(args: Route.LoaderArgs) {
// Fetch current season with sports // Fetch current season with sports
const season = await findCurrentSeason(leagueId); const season = await findCurrentSeason(leagueId);
const seasonWithSports = season ? await findSeasonWithSportsSeasons(season.id) : null; const seasonWithSports = season
? await findSeasonWithSportsSeasons(season.id)
: null;
// Fetch commissioners // Fetch commissioners
const commissioners = await findCommissionersByLeagueId(leagueId); const commissioners = await findCommissionersByLeagueId(leagueId);
@ -71,7 +73,8 @@ export async function loader(args: Route.LoaderArgs) {
const teams = season ? await findTeamsBySeasonId(season.id) : []; const teams = season ? await findTeamsBySeasonId(season.id) : [];
// Fetch draft slots if season is in pre_draft or draft status // Fetch draft slots if season is in pre_draft or draft status
const draftSlots = season && (season.status === "pre_draft" || season.status === "draft") const draftSlots =
season && (season.status === "pre_draft" || season.status === "draft")
? await findDraftSlotsBySeasonId(season.id) ? await findDraftSlotsBySeasonId(season.id)
: []; : [];
@ -297,14 +300,18 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
{/* Right Column - 1/3 width on desktop */} {/* Right Column - 1/3 width on desktop */}
<div className="space-y-6"> <div className="space-y-6">
{/* Draft Order Display - Only show during pre_draft and draft */} {/* Draft Order Display - Only show during pre_draft and draft */}
{season && (season.status === "pre_draft" || season.status === "draft") && draftSlots.length > 0 && ( {season &&
(season.status === "pre_draft" || season.status === "draft") &&
draftSlots.length > 0 && (
<Card> <Card>
<CardHeader> <CardHeader>
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<div> <div>
<CardTitle>Draft Order</CardTitle> <CardTitle>Draft Order</CardTitle>
<CardDescription> <CardDescription>
{season.status === "pre_draft" ? "Upcoming draft order" : "Current draft order"} {season.status === "pre_draft"
? "Upcoming draft order"
: "Current draft order"}
</CardDescription> </CardDescription>
</div> </div>
<Button asChild size="sm"> <Button asChild size="sm">
@ -317,16 +324,25 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
<CardContent> <CardContent>
<div className="space-y-2"> <div className="space-y-2">
{draftSlots.map((slot: any, index: number) => { {draftSlots.map((slot: any, index: number) => {
const ownerName = slot.team.ownerId ? ownerMap[slot.team.ownerId] : null; const ownerName = slot.team.ownerId
? ownerMap[slot.team.ownerId]
: null;
return ( return (
<div key={slot.id} className="flex items-center gap-3 py-2 border-b last:border-0"> <div
key={slot.id}
className="flex items-center gap-3 py-2 border-b last:border-0"
>
<div className="flex items-center justify-center w-7 h-7 rounded-full bg-primary text-primary-foreground font-bold text-xs"> <div className="flex items-center justify-center w-7 h-7 rounded-full bg-primary text-primary-foreground font-bold text-xs">
{index + 1} {index + 1}
</div> </div>
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
<p className="font-medium text-sm truncate">{slot.team.name}</p> <p className="font-medium text-sm truncate">
{slot.team.name}
</p>
{ownerName && ( {ownerName && (
<p className="text-xs text-muted-foreground truncate">{ownerName}</p> <p className="text-xs text-muted-foreground truncate">
{ownerName}
</p>
)} )}
</div> </div>
</div> </div>
@ -351,20 +367,25 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
{season && ( {season && (
<> <>
<div> <div>
<p className="text-sm text-muted-foreground">Season Status</p> <p className="text-sm text-muted-foreground">
Season Status
</p>
<p className="font-medium capitalize"> <p className="font-medium capitalize">
{season.status.replace("_", " ")} {season.status.replace("_", " ")}
</p> </p>
</div> </div>
<div> <div>
<p className="text-sm text-muted-foreground">Draft Rounds</p> <p className="text-sm text-muted-foreground">
Draft Rounds
</p>
<p className="font-medium">{season.draftRounds}</p> <p className="font-medium">{season.draftRounds}</p>
</div> </div>
<div> <div>
<p className="text-sm text-muted-foreground">Sports Selected</p> <p className="text-sm text-muted-foreground">
Sports Selected
</p>
<p className="font-medium">{sportsCount}</p> <p className="font-medium">{sportsCount}</p>
</div> </div>
{(season.status === "active" || season.status === "completed") && (
<div> <div>
<p className="text-sm text-muted-foreground">Draft Board</p> <p className="text-sm text-muted-foreground">Draft Board</p>
<Link <Link
@ -374,7 +395,6 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
View Draft Board View Draft Board
</Link> </Link>
</div> </div>
)}
<div> <div>
<p className="text-sm text-muted-foreground">Flex Spots</p> <p className="text-sm text-muted-foreground">Flex Spots</p>
<p className="font-medium text-primary"> <p className="font-medium text-primary">
@ -383,7 +403,9 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
</div> </div>
{season.draftDateTime && ( {season.draftDateTime && (
<div> <div>
<p className="text-sm text-muted-foreground">Draft Date</p> <p className="text-sm text-muted-foreground">
Draft Date
</p>
<p className="font-medium"> <p className="font-medium">
{format(new Date(season.draftDateTime), "PPP 'at' p")} {format(new Date(season.draftDateTime), "PPP 'at' p")}
</p> </p>