"use client"

import * as React from "react"
import { cn } from "@/lib/utils"
import {
  Select,
  SelectContent,
  SelectGroup,
  SelectItem,
  SelectLabel,
  SelectTrigger,
  SelectValue,
} from "@/components/ui/select"

interface ContractInfo {
  contractId: number
  contractName: string
}

interface ProjectInfo {
  projectId: number
  projectCode: string
  projectName: string
  contracts: ContractInfo[]
}

interface ProjectSwitcherProps {
  isCollapsed: boolean
  projects: ProjectInfo[]

  // 상위가 관리하는 "현재 선택된 contractId"
  selectedContractId: number | null

  // 콜백: 사용자가 "어떤 contract"를 골랐는지
  //   => 우리가 projectId도 찾아서 상위 state를 같이 갱신해야 함
  onSelectContract: (projectId: number, contractId: number) => void
}

export function ProjectSwitcher({
  isCollapsed,
  projects,
  selectedContractId,
  onSelectContract,
}: ProjectSwitcherProps) {
  // Select value = stringified contractId
  const selectValue = selectedContractId ? String(selectedContractId) : ""

  // 현재 선택된 contract 객체 찾기
  const selectedContract = React.useMemo(() => {
    if (!selectedContractId) return null
    for (const proj of projects) {
      const found = proj.contracts.find((c) => c.contractId === selectedContractId)
      if (found) {
        return { ...found, projectId: proj.projectId }
      }
    }
    return null
  }, [projects, selectedContractId])

  // Trigger label => 계약 이름 or placeholder
  const triggerLabel = selectedContract?.contractName ?? "Select a contract"

  // onValueChange: val = String(contractId)
  //   => 찾으면 projectId, contractId 모두 상위로 전달
  function handleValueChange(val: string) {
    const contractId = Number(val)
    // Find which project has this contract
    let foundProjectId = 0
    let foundContractName = ""

    for (const proj of projects) {
      const found = proj.contracts.find((c) => c.contractId === contractId)
      if (found) {
        foundProjectId = proj.projectId
        foundContractName = found.contractName
        break
      }
    }
    // 상위로 알림
    onSelectContract(foundProjectId, contractId)
  }

  return (
    <Select value={selectValue} onValueChange={handleValueChange}>
      <SelectTrigger
        className={cn(
          "flex items-center gap-2",
          isCollapsed && "flex h-9 w-9 shrink-0 items-center justify-center p-0"
        )}
        aria-label="Select Contract"
      >
        <SelectValue placeholder="Select a contract">
          <span className={cn("ml-2", isCollapsed && "hidden")}>
            {triggerLabel}
          </span>
        </SelectValue>
      </SelectTrigger>

      <SelectContent>
        {projects.map((project) => (
          <SelectGroup key={project.projectCode}>
            <SelectLabel>{project.projectName}</SelectLabel>
            {project.contracts.map((contract) => (
              <SelectItem
                key={contract.contractId}
                value={String(contract.contractId)}
              >
                {contract.contractName}
              </SelectItem>
            ))}
          </SelectGroup>
        ))}
      </SelectContent>
    </Select>
  )
}