107 lines
3.1 KiB
TypeScript
107 lines
3.1 KiB
TypeScript
import { Button } from "~/components/ui/button";
|
|
import { Play, Pause, FastForward } from "lucide-react";
|
|
|
|
interface CommissionerControlsProps {
|
|
isDraftStarted: boolean;
|
|
isDraftPaused: boolean;
|
|
isDraftComplete: boolean;
|
|
currentTeamName: string;
|
|
onStartDraft: () => void;
|
|
onPauseDraft: () => void;
|
|
onResumeDraft: () => void;
|
|
onForcePick: () => void;
|
|
}
|
|
|
|
export function CommissionerControls({
|
|
isDraftStarted,
|
|
isDraftPaused,
|
|
isDraftComplete,
|
|
currentTeamName,
|
|
onStartDraft,
|
|
onPauseDraft,
|
|
onResumeDraft,
|
|
onForcePick,
|
|
}: CommissionerControlsProps) {
|
|
if (isDraftComplete) {
|
|
return (
|
|
<div className="space-y-4">
|
|
<div className="rounded-lg bg-green-500/10 p-4 text-center">
|
|
<p className="font-medium text-green-600 dark:text-green-400">
|
|
Draft Complete
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (!isDraftStarted) {
|
|
return (
|
|
<div className="space-y-4">
|
|
<p className="text-sm text-muted-foreground">
|
|
The draft has not started yet. Click below to begin the draft.
|
|
</p>
|
|
<Button onClick={onStartDraft} className="w-full" size="lg">
|
|
<Play className="mr-2 h-4 w-4" />
|
|
Start Draft
|
|
</Button>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
{/* Draft Status */}
|
|
<div className="rounded-lg border bg-muted/50 p-3">
|
|
<div className="flex items-center justify-between">
|
|
<span className="text-sm font-medium">Draft Status:</span>
|
|
<span
|
|
className={`text-sm font-semibold ${
|
|
isDraftPaused
|
|
? "text-yellow-600 dark:text-yellow-400"
|
|
: "text-green-600 dark:text-green-400"
|
|
}`}
|
|
>
|
|
{isDraftPaused ? "Paused" : "Active"}
|
|
</span>
|
|
</div>
|
|
<div className="mt-2 flex items-center justify-between">
|
|
<span className="text-sm font-medium">Current Pick:</span>
|
|
<span className="text-sm text-muted-foreground">{currentTeamName}</span>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Control Buttons */}
|
|
<div className="space-y-2">
|
|
{isDraftPaused ? (
|
|
<Button onClick={onResumeDraft} className="w-full" variant="default">
|
|
<Play className="mr-2 h-4 w-4" />
|
|
Resume Draft
|
|
</Button>
|
|
) : (
|
|
<Button onClick={onPauseDraft} className="w-full" variant="outline">
|
|
<Pause className="mr-2 h-4 w-4" />
|
|
Pause Draft
|
|
</Button>
|
|
)}
|
|
|
|
<Button
|
|
onClick={onForcePick}
|
|
className="w-full"
|
|
variant="destructive"
|
|
disabled={isDraftPaused}
|
|
>
|
|
<FastForward className="mr-2 h-4 w-4" />
|
|
Force Pick for {currentTeamName}
|
|
</Button>
|
|
</div>
|
|
|
|
{/* Help Text */}
|
|
<div className="rounded-lg bg-muted/30 p-3">
|
|
<p className="text-xs text-muted-foreground">
|
|
<strong>Force Pick:</strong> Automatically selects the top player from the
|
|
current team's queue, or the highest EV available player if queue is empty.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|