31 lines
1.2 KiB
JavaScript
31 lines
1.2 KiB
JavaScript
import { Popper, Paper, List, ListItem, ListItemText, ClickAwayListener } from '@mui/material';
|
|
|
|
function FilterBox({anchorEl , open = false, handleClose = () => {} , columnFilterModeOptions , onSelectFilter , defaultFilter}) {
|
|
|
|
const id = open ? 'simple-popper' : undefined;
|
|
const handleSelectFilter = (filterFn) => {
|
|
onSelectFilter(filterFn);
|
|
handleClose();
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
<Popper id={id} open={open} anchorEl={anchorEl} placement="bottom" style={{ zIndex: 1301 }}>
|
|
<ClickAwayListener onClickAway={handleClose}>
|
|
<Paper>
|
|
<List>
|
|
{columnFilterModeOptions.map((option, index) => (
|
|
<ListItem key={index} onClick={() => handleSelectFilter(option)} selected={option === defaultFilter} sx={{ cursor: 'pointer' }}>
|
|
<ListItemText primary={option} />
|
|
</ListItem>
|
|
))}
|
|
</List>
|
|
</Paper>
|
|
</ClickAwayListener>
|
|
</Popper>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default FilterBox;
|