import { Select } from "antd";
import { ProSelectProps } from "./types";

const { Option } = Select;

const ProInModalMultiSelect = ({
  optionList,
  valueField = "id",
  displayField = "name",
  ...rest
}: ProSelectProps) => (
  <Select
    listHeight={150}
    {...rest}
    mode="multiple"
    allowClear
    optionFilterProp="label"
  >
    {optionList && Array.isArray(optionList)
      ? optionList.map((option) => (
          <Option
            value={option[valueField]}
            key={option[displayField]}
            label={option[displayField]}
          >
            {option[displayField]}
          </Option>
        ))
      : null}
  </Select>
);

export default ProInModalMultiSelect;
