import React from "react";
import {
  FormControl,
  InputLabel,
  Select as MuiSelect,
  MenuItem,
  FormHelperText,
} from "@material-ui/core";

export default function Select(props) {
  const {
    name,
    label,
    value,
    error = null,
    multiple = false,
    onChange,
    options,
    type,
  } = props;
  return (
    <FormControl variant="outlined" {...(error && { error: true })}>
      <InputLabel>{label}</InputLabel>
      <MuiSelect
        label={label}
        name={name}
        multiple={multiple}
        value={value}
        onChange={onChange}
      >
        {options.map((item) => (
          <MenuItem
            key={type === "type" ? item.type_id : item.sign_id}
            value={type === "type" ? item.type_id : item.sign_id}
          >
            {type === "type" ? item.type : item.text}
          </MenuItem>
        ))}
      </MuiSelect>
      {error && <FormHelperText>{error}</FormHelperText>}
    </FormControl>
  );
}
