Proyectos de Subversion LeadersLinked - SPA

import React, { useState } from 'react';
import { Menu, MenuItem, IconButton } from '@mui/material';
import MoreVert from '@mui/icons-material/MoreVert';

import colors from '@styles/config/colors';

const Options = ({ children }) => {
  const [anchorEl, setAnchorEl] = useState(null);
  const open = Boolean(anchorEl);

  const handleClick = (event) => setAnchorEl(event.currentTarget);

  const handleClose = () => setAnchorEl(null);

  return (
    <>
      <IconButton
        onClick={handleClick}
        aria-controls={open ? 'account-menu' : ''}
        aria-expanded={open ? 'true' : ''}
        aria-haspopup='true'
      >
        <MoreVert />
      </IconButton>
      <Menu
        id='account-menu'
        anchorEl={anchorEl}
        open={open}
        onClose={handleClose}
        onClick={handleClose}
        transformOrigin={{ horizontal: 'right', vertical: 'top' }}
        anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}
        sx={{
          '& .MuiPaper-root': {
            boxShadow: 'none',
            border: `1px solid ${colors.border.primary}`
          }
        }}
      >
        {children}
      </Menu>
    </>
  );
};

function OptionItem({ children, ...props }) {
  return <MenuItem {...props}>{children}</MenuItem>;
}

Options.Item = OptionItem;

export default Options;