1import Divider from '@material-ui/core/Divider';
 2import {makeStyles} from '@material-ui/core/styles';
 3import Typography from '@material-ui/core/Typography';
 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            if (divider)
29              return (
30                <Divider
31                  key={idx}
32                  variant="fullWidth"
33                  className={classes.divider}
34                />
35              );
36            if (onClick)
37              return (
38                <MenuItem
39                  onClick={() => {
40                    if (!!onClick) onClick();
41                    setAnchorEl(null);
42                  }}
43                  key={idx}
44                  id={id || `MenuItem${idx}`}
45                  {...menuItemProps}
46                >
47                  {label}
48                </MenuItem>
49              );
50            else
51              return (
52                <Typography
53                  variant="body1"
54                  key={idx}
55                  id={id || `MenuItem${idx}`}
56                  className={classes.textItem}
57                >
58                  {label}
59                </Typography>
60              );
61          }
62        )}
63    </Menu>
64  );
65};
66
67const useStyles = makeStyles(theme => ({
68  divider: {
69    margin: theme.spacing(1, 0),
70  },
71  textItem: {
72    margin: theme.spacing(1, 2),
73    '&:focus': {outline: 0},
74  },
75}));
76export default Toolbar;