import { Button } from "~/components/ui/button";

interface CommissionerDraftControlsProps {
  seasonStatus: string;
  isDraftComplete: boolean;
  isPaused: boolean;
  onStart: () => void;
  onPause: () => void;
  onResume: () => void;
  buttonClassName?: string;
  autoStartDraft?: boolean;
  secondsUntilAutoStart?: number | null;
}

function formatCountdown(seconds: number): string {
  const h = Math.floor(seconds / 3600);
  const m = Math.floor((seconds % 3600) / 60);
  const s = seconds % 60;
  if (h > 0) return `${h}:${String(m).padStart(2, "0")}:${String(s).padStart(2, "0")}`;
  return `${m}:${String(s).padStart(2, "0")}`;
}

export function CommissionerDraftControls({
  seasonStatus,
  isDraftComplete,
  isPaused,
  onStart,
  onPause,
  onResume,
  buttonClassName,
  autoStartDraft,
  secondsUntilAutoStart,
}: CommissionerDraftControlsProps) {
  if (seasonStatus === "pre_draft") {
    if (autoStartDraft && secondsUntilAutoStart !== null && secondsUntilAutoStart !== undefined && secondsUntilAutoStart > 0) {
      return (
        <div className="flex items-center gap-2">
          <span className="text-sm text-muted-foreground font-mono tabular-nums">
            Auto-starts in {formatCountdown(secondsUntilAutoStart)}
          </span>
          <Button variant="ghost" size="sm" className={buttonClassName} onClick={onStart}>
            Start Now
          </Button>
        </div>
      );
    }
    if (autoStartDraft && secondsUntilAutoStart === 0) {
      return <span className="text-sm text-muted-foreground">Starting…</span>;
    }
    return (
      <Button className={buttonClassName} onClick={onStart}>
        Start Draft
      </Button>
    );
  }

  if (seasonStatus === "draft" && !isDraftComplete) {
    return isPaused ? (
      <Button className={buttonClassName} onClick={onResume}>
        Resume Draft
      </Button>
    ) : (
      <Button className={buttonClassName} variant="outline" onClick={onPause}>
        Pause Draft
      </Button>
    );
  }

  return null;
}