Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 678 | Rev 2123 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
5 stevensc 1
import React, { useState } from 'react'
1659 stevensc 2
import { Menu, MenuItem, IconButton } from '@mui/material'
3
import { MoreVert } from '@mui/icons-material'
5 stevensc 4
 
1659 stevensc 5
const Options = ({ options = [], right = '.5rem', top = '.5rem' }) => {
5 stevensc 6
  const [anchorEl, setAnchorEl] = useState(null)
7
  const open = Boolean(anchorEl)
8
 
9
  const handleClick = (event) => {
10
    setAnchorEl(event.currentTarget)
11
  }
12
 
13
  const handleClose = () => {
14
    setAnchorEl(null)
15
  }
16
 
1659 stevensc 17
  if (!options.length) {
18
    return null
19
  }
20
 
5 stevensc 21
  return (
22
    <>
1659 stevensc 23
      <IconButton
24
        sx={{
25
          position: 'absolute',
26
          right,
27
          top,
28
          zIndex: 100,
29
          transform: top ? 'none' : 'translateY(-50%)'
30
        }}
5 stevensc 31
        right={right}
32
        top={top}
33
        onClick={handleClick}
1659 stevensc 34
        aria-controls={open ? 'account-menu' : ''}
677 stevensc 35
        aria-haspopup='true'
1659 stevensc 36
        aria-expanded={open ? 'true' : ''}
5 stevensc 37
      >
1659 stevensc 38
        <MoreVert />
39
      </IconButton>
5 stevensc 40
      <Menu
41
        anchorEl={anchorEl}
677 stevensc 42
        id='account-menu'
5 stevensc 43
        open={open}
44
        onClose={handleClose}
45
        onClick={handleClose}
46
        transformOrigin={{ horizontal: 'right', vertical: 'top' }}
47
        anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}
48
      >
49
        {options.map((option, index) => (
50
          <MenuItem
51
            key={index}
52
            onClick={() => {
53
              option.action()
54
              handleClose()
55
            }}
56
          >
57
            {option.label}
58
          </MenuItem>
59
        ))}
60
      </Menu>
61
    </>
62
  )
63
}
64
 
65
export default Options