import { InputAdornment, TextField, Typography } from "@mui/material";
import FilterListIcon from "@mui/icons-material/FilterList";

function CustomTextField({
  column,
  defaultFilterTranslation,
  filterParameters,
  handleOpenFilterBox,
  handleBlur,
  handleChange,
}) {
  return (
    <TextField
      id={column.id}
      name={column.id}
      label={column.header}
      value={filterParameters.value}
      onChange={(e) =>
        handleChange({ ...filterParameters, value: e.target.value })
      }
      onBlur={handleBlur}
      fullWidth
      variant="outlined"
      size="small"
      sx={{ my: 1 }}
      InputProps={{
        endAdornment: (
          <InputAdornment
            position="end"
            sx={{ cursor: "pointer" }}
            onClick={handleOpenFilterBox}
          >
            <FilterListIcon />
          </InputAdornment>
        ),
      }}
      InputLabelProps={{ shrink: true }}
    />
  );
}

export default CustomTextField;
