import { ChangeEvent } from "react";

export type SelectOption = {
  value: string;
  label: string;
};

export default function Select({
  label,
  options,
  value,
  onChange,
  disabled
}: {
  label: string;
  options: SelectOption[];
  value: string;
  onChange: (value: string) => void;
  disabled?: boolean;
}) {
  return (
    <label className="form-label">
      {label}
      <select
        className="form-select"
        value={value}
        onChange={(event: ChangeEvent<HTMLSelectElement>) => onChange(event.target.value)}
        disabled={disabled}
      >
        {options.map((option) => (
          <option key={option.value} value={option.value}>
            {option.label}
          </option>
        ))}
      </select>
    </label>
  );
}