import { CheckCircle2 } from "lucide-react"
import type { RefObject } from "react"

import { Badge } from "@/shared/ui/badge"
import { Button } from "@/shared/ui/button"

import type { SelectionResults } from "../api/selection.types"
import { getSelectionRunStatusPresentation } from "./selection-presentation"

interface ExecutionStatusTriggerProps {
  drawerOpen: boolean
  onOpen: () => void
  result: SelectionResults
  triggerRef: RefObject<HTMLButtonElement | null>
}

export function ExecutionStatusTrigger({
  drawerOpen,
  onOpen,
  result,
  triggerRef,
}: ExecutionStatusTriggerProps) {
  const statusPresentation = getSelectionRunStatusPresentation(result.status)

  if (!statusPresentation) return null

  return (
    <Button
      aria-controls="selection-execution-status-drawer"
      aria-expanded={drawerOpen}
      aria-haspopup="dialog"
      aria-label={`查看执行状态：${statusPresentation.label}，未完成评估 ${result.failures.length} 条`}
      className="h-auto min-h-11 shrink-0 justify-start gap-1.5 px-2 md:min-h-8"
      onClick={onOpen}
      ref={triggerRef}
      variant="outline"
    >
      <Badge className="gap-1" variant={statusPresentation.variant}>
        {result.status === "success" ? (
          <CheckCircle2 aria-hidden="true" />
        ) : null}
        {statusPresentation.label}
      </Badge>
      <span className="text-[11px] text-muted-foreground">
        {result.failures.length} 条未完成
      </span>
    </Button>
  )
}