1import React from 'react';
 2import Divider from '@material-ui/core/Divider';
 3import {makeStyles} from '@material-ui/core/styles';
 4import Menu from '@material-ui/core/Menu';
 5import MenuItem from '@material-ui/core/MenuItem';
 6
 7const Toolbar = ({anchorEl, setAnchorEl, actions = []}) => {
 8  const classes = useStyles();
 9  if (actions.length === 0) return null;
10  return (
11    <Menu
12      anchorEl={anchorEl}
13      anchorOrigin={{
14        vertical: 'top',
15        horizontal: 'right',
16      }}
17      keepMounted
18      transformOrigin={{
19        vertical: 'top',
20        horizontal: 'right',
21      }}
22      open={!!anchorEl}
23      onClose={() => setAnchorEl(null)}
24    >
25      {actions &&
26        actions.map(
27          ({onClick, id, label, divider = false, ...menuItemProps}, idx) =>
28            divider ? (
29              <Divider variant="fullWidth" className={classes.divider} />
30            ) : (
31              <MenuItem
32                onClick={() => {
33                  if (!!onClick) onClick();
34                  setAnchorEl(null);
35                }}
36                key={idx}
37                id={id || `MenuItem${idx}`}
38                {...menuItemProps}
39              >
40                {label}
41              </MenuItem>
42            )
43        )}
44    </Menu>
45  );
46};
47
48const useStyles = makeStyles(theme => ({
49  divider: {
50    margin: theme.spacing(1, 0),
51  },
52}));
53export default Toolbar;