Proyectos de Subversion LeadersLinked - SPA

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

import colors from '@styles/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