import MenuItem from "@mui/material/MenuItem";
import TextField from "@mui/material/TextField";
import { restorePlaceholderAfterAllSelected } from "@/shared/ui/selectAllBehavior.js";

export function StatusSelect({ className, label = "状态", options = [], size = "small", value, onChange }) {
  const handleChange = (event) => {
    const nextValue = event.target.value;
    const selectedOption = options.find(([optionValue]) => String(optionValue) === String(nextValue));
    onChange(nextValue);
    restorePlaceholderAfterAllSelected(selectedOption?.[1]);
  };

  return (
    <TextField
      className={className}
      label={label}
      select
      size={size}
      value={value ?? ""}
      onChange={handleChange}
    >
      {options.map(([optionValue, optionLabel]) => (
        <MenuItem key={optionValue || "all"} value={optionValue}>
          {optionLabel}
        </MenuItem>
      ))}
    </TextField>
  );
}
