1import React from 'react';
 2import Menu from '@material-ui/core/Menu';
 3import MenuItem from '@material-ui/core/MenuItem';
 4import {makeStyles} from '@material-ui/core/styles';
 5import {useTranslation} from 'react-i18next';
 6import {useStrapi} from 'strapi-react-context';
 7
 8const EventMenu = ({anchorEl, setAnchorEl, actions = []}) => {
 9  const {t} = useTranslation();
10  const strapi = useStrapi();
11  const classes = useStyles();
12  const [settings] = strapi.stores?.settings || [{}];
13  const aboutMenuItem = {
14    label: t('menu.about'),
15    onClick: () => (window.location.href = settings['about_link']),
16    id: 'AboutTabs',
17    className: classes.withDivider,
18  };
19
20  return (
21    <Menu
22      anchorEl={anchorEl}
23      anchorOrigin={{
24        vertical: 'top',
25        horizontal: 'right',
26      }}
27      keepMounted
28      transformOrigin={{
29        vertical: 'top',
30        horizontal: 'right',
31      }}
32      open={!!anchorEl}
33      onClose={() => setAnchorEl(null)}
34    >
35      {actions &&
36        [...actions, aboutMenuItem]
37          .filter(Boolean)
38          .map(({label, id, onClick, ...attributes}, idx) => (
39            <MenuItem
40              onClick={() => {
41                onClick();
42                setAnchorEl(null);
43              }}
44              key={idx}
45              id={id || `MenuItem${idx}`}
46              {...attributes}
47            >
48              {label}
49            </MenuItem>
50          ))}
51    </Menu>
52  );
53};
54
55const useStyles = makeStyles(theme => ({
56  withDivider: {
57    borderTop: `1px solid ${theme.palette.divider}`,
58  },
59}));
60export default EventMenu;