import { FormControl, InputLabel, MenuItem, Select } from '@mui/material';

const ProductType = ({ productType, handleProductTypeChange }) => {
  return (
    <>
      <FormControl sx={{ width: '200px' }}>
        <InputLabel id="product-type-label">Product Type</InputLabel>
        <Select
          MenuProps={{
            disableScrollLock: true,
          }}
          label="Product Type"
          labelId="product-type-label"
          id="product-type-label"
          value={productType}
          onChange={handleProductTypeChange}
        >
          <MenuItem value="All">All</MenuItem>
          <MenuItem value="Coffee">Coffee</MenuItem>
          <MenuItem value="Mug">Mug</MenuItem>
        </Select>
      </FormControl>
    </>
  );
};

export default ProductType;
