feat: add draft board link visibility for all season statuses
This commit is contained in:
parent
6c5c9f709b
commit
cf90bf52ec
1 changed files with 78 additions and 56 deletions
|
|
@ -38,7 +38,9 @@ export async function loader(args: Route.LoaderArgs) {
|
|||
|
||||
// Fetch current season with sports
|
||||
const season = await findCurrentSeason(leagueId);
|
||||
const seasonWithSports = season ? await findSeasonWithSportsSeasons(season.id) : null;
|
||||
const seasonWithSports = season
|
||||
? await findSeasonWithSportsSeasons(season.id)
|
||||
: null;
|
||||
|
||||
// Fetch commissioners
|
||||
const commissioners = await findCommissionersByLeagueId(leagueId);
|
||||
|
|
@ -71,9 +73,10 @@ export async function loader(args: Route.LoaderArgs) {
|
|||
const teams = season ? await findTeamsBySeasonId(season.id) : [];
|
||||
|
||||
// Fetch draft slots if season is in pre_draft or draft status
|
||||
const draftSlots = season && (season.status === "pre_draft" || season.status === "draft")
|
||||
? await findDraftSlotsBySeasonId(season.id)
|
||||
: [];
|
||||
const draftSlots =
|
||||
season && (season.status === "pre_draft" || season.status === "draft")
|
||||
? await findDraftSlotsBySeasonId(season.id)
|
||||
: [];
|
||||
|
||||
// Fetch user data for team owners
|
||||
const ownerIds = teams
|
||||
|
|
@ -297,45 +300,58 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
|
|||
{/* Right Column - 1/3 width on desktop */}
|
||||
<div className="space-y-6">
|
||||
{/* Draft Order Display - Only show during pre_draft and draft */}
|
||||
{season && (season.status === "pre_draft" || season.status === "draft") && draftSlots.length > 0 && (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<CardTitle>Draft Order</CardTitle>
|
||||
<CardDescription>
|
||||
{season.status === "pre_draft" ? "Upcoming draft order" : "Current draft order"}
|
||||
</CardDescription>
|
||||
{season &&
|
||||
(season.status === "pre_draft" || season.status === "draft") &&
|
||||
draftSlots.length > 0 && (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<CardTitle>Draft Order</CardTitle>
|
||||
<CardDescription>
|
||||
{season.status === "pre_draft"
|
||||
? "Upcoming draft order"
|
||||
: "Current draft order"}
|
||||
</CardDescription>
|
||||
</div>
|
||||
<Button asChild size="sm">
|
||||
<Link to={`/leagues/${league.id}/draft/${season.id}`}>
|
||||
Enter Draft Room
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
<Button asChild size="sm">
|
||||
<Link to={`/leagues/${league.id}/draft/${season.id}`}>
|
||||
Enter Draft Room
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="space-y-2">
|
||||
{draftSlots.map((slot: any, index: number) => {
|
||||
const ownerName = slot.team.ownerId ? ownerMap[slot.team.ownerId] : null;
|
||||
return (
|
||||
<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">
|
||||
{index + 1}
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="space-y-2">
|
||||
{draftSlots.map((slot: any, index: number) => {
|
||||
const ownerName = slot.team.ownerId
|
||||
? ownerMap[slot.team.ownerId]
|
||||
: null;
|
||||
return (
|
||||
<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">
|
||||
{index + 1}
|
||||
</div>
|
||||
<div className="flex-1 min-w-0">
|
||||
<p className="font-medium text-sm truncate">
|
||||
{slot.team.name}
|
||||
</p>
|
||||
{ownerName && (
|
||||
<p className="text-xs text-muted-foreground truncate">
|
||||
{ownerName}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-1 min-w-0">
|
||||
<p className="font-medium text-sm truncate">{slot.team.name}</p>
|
||||
{ownerName && (
|
||||
<p className="text-xs text-muted-foreground truncate">{ownerName}</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
|
|
@ -351,30 +367,34 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
|
|||
{season && (
|
||||
<>
|
||||
<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">
|
||||
{season.status.replace("_", " ")}
|
||||
</p>
|
||||
</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>
|
||||
</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>
|
||||
</div>
|
||||
{(season.status === "active" || season.status === "completed") && (
|
||||
<div>
|
||||
<p className="text-sm text-muted-foreground">Draft Board</p>
|
||||
<Link
|
||||
to={`/leagues/${league.id}/draft-board/${season.id}`}
|
||||
className="text-blue-600 hover:underline font-medium"
|
||||
>
|
||||
View Draft Board
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
<div>
|
||||
<p className="text-sm text-muted-foreground">Draft Board</p>
|
||||
<Link
|
||||
to={`/leagues/${league.id}/draft-board/${season.id}`}
|
||||
className="text-blue-600 hover:underline font-medium"
|
||||
>
|
||||
View Draft Board
|
||||
</Link>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-muted-foreground">Flex Spots</p>
|
||||
<p className="font-medium text-primary">
|
||||
|
|
@ -383,7 +403,9 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
|
|||
</div>
|
||||
{season.draftDateTime && (
|
||||
<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">
|
||||
{format(new Date(season.draftDateTime), "PPP 'at' p")}
|
||||
</p>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue