/**
 * 품목 유형 선택 컴포넌트
 *
 * FG/PT/SM/RM/CS 선택 UI
 */

'use client';

import { Label } from '@/components/ui/label';
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from '@/components/ui/select';
import { type ItemType } from '@/types/item';

interface ItemTypeSelectProps {
  value?: ItemType | '';
  onChange: (value: ItemType) => void;
  disabled?: boolean;
  required?: boolean;
  label?: string;
  showLabel?: boolean;
  description?: string;
}

// 품목 유형 라벨 (영문 포함)
const ITEM_TYPE_LABELS_WITH_ENGLISH: Record<ItemType, string> = {
  FG: '제품 (Finished Goods)',
  PT: '부품 (Part)',
  SM: '부자재 (Sub Material)',
  RM: '원자재 (Raw Material)',
  CS: '소모품 (Consumables)',
};

export default function ItemTypeSelect({
  value,
  onChange,
  disabled = false,
  required = false,
  label = '품목 유형',
  showLabel = true,
  description = '(먼저 선택하세요)',

}: ItemTypeSelectProps) {
  return (
    <div className="space-y-2">
      {showLabel && (
        <Label htmlFor="item-type-select" className="whitespace-nowrap">
          {label}
          {required && <span className="text-red-500 ml-1">*</span>}
          {description}
        </Label>
      )}

      <Select
        value={value || undefined}
        onValueChange={onChange}
        disabled={disabled}
      >
        <SelectTrigger id="item-type-select">
          <SelectValue placeholder="품목 유형을 선택하세요" />
        </SelectTrigger>
        <SelectContent>
          <SelectItem value="FG">{ITEM_TYPE_LABELS_WITH_ENGLISH.FG}</SelectItem>
          <SelectItem value="PT">{ITEM_TYPE_LABELS_WITH_ENGLISH.PT}</SelectItem>
          <SelectItem value="SM">{ITEM_TYPE_LABELS_WITH_ENGLISH.SM}</SelectItem>
          <SelectItem value="RM">{ITEM_TYPE_LABELS_WITH_ENGLISH.RM}</SelectItem>
          <SelectItem value="CS">{ITEM_TYPE_LABELS_WITH_ENGLISH.CS}</SelectItem>
        </SelectContent>
      </Select>
    </div>
  );
}