1import Menu from '@material-ui/core/Menu';
 2import {useTranslation} from 'react-i18next';
 3import useAuthStore from '../../stores/useAuthStore';
 4import useProfile from '../../hooks/useProfile';
 5import useSettings from '../../hooks/useSettings';
 6import Languages from '../Languages/MenuItem';
 7import Action, {ActionType} from './Action';
 8
 9interface Props {
10  anchorEl: Element;
11  setAnchorEl: (el: Element) => void;
12  actions: ActionType[];
13}
14
15const GenericMenu = (props: Props) => {
16  const {anchorEl, setAnchorEl, actions = []} = props;
17  const {t} = useTranslation();
18  const settings = useSettings();
19  const logout = useAuthStore(s => s.logout);
20  const {user} = useProfile();
21
22  const logoutMenuItem = user && {
23    label: t('menu.logout'),
24    onClick: () => {
25      logout();
26      window.location.href = settings['about_link'];
27      setAnchorEl(null);
28    },
29    id: 'LogoutTabs',
30  };
31  const aboutMenuItem = {
32    label: t('menu.about'),
33    onClick: () => {
34      window.location.href = settings['about_link'];
35      setAnchorEl(null);
36    },
37    id: 'AboutTabs',
38  };
39  const languageMenuItem = {
40    label: <Languages />,
41    id: 'LanguageSelection',
42  };
43
44  const validActions = [
45    ...actions,
46    aboutMenuItem,
47    languageMenuItem,
48    logoutMenuItem,
49  ].filter(Boolean);
50
51  return (
52    <Menu
53      anchorEl={anchorEl}
54      anchorOrigin={{
55        vertical: 'top',
56        horizontal: 'right',
57      }}
58      keepMounted
59      transformOrigin={{
60        vertical: 'top',
61        horizontal: 'right',
62      }}
63      open={!!anchorEl}
64      onClose={() => setAnchorEl(null)}
65    >
66      {validActions?.map((action, index) => (
67        <Action action={action} key={index} />
68      ))}
69    </Menu>
70  );
71};
72
73export default GenericMenu;