import { FormControl, InputLabel, Select } from "@material-ui/core";

export const DropDownList = ({data, label, value, labelField, valueField, onChange, classes, ...others}) => {
  return (
    <FormControl
      variant="outlined"
      margin="normal"
    >
      <InputLabel className={classes.whiteBackground}>
        {label}
      </InputLabel>
      <Select
        native
        value={value}
        variant="outlined"
        onChange={onChange}
        {...others}
      >
      {data && data.map((item, index) => (
        <option key={index} value={item[valueField || "value"]}>{item[labelField || "label"]}</option>
      ))}
      </Select>
    </FormControl>
  );
}