Proyectos de Subversion LeadersLinked - SPA

import React, { useContext } from 'react';

import React, { useContext } from 'react';

import { IconButton, MenuItem as MuiMenuItem, Menu as MuiMenu } from '@mui/material';

import { IconButton, MenuItem as MuiMenuItem, Menu as MuiMenu } from '@mui/material';

import MoreVert from '@mui/icons-material/MoreVert';

import MoreVert from '@mui/icons-material/MoreVert';

import { MenuContext } from './MenuContext';

import { MenuContext } from './MenuContext';

export function MenuContent({ icon, children, style, ...props }) {

export function MenuContent({ icon, children, style, ...props }) {

  const { anchorEl, open, openMenu, closeMenu } = useContext(MenuContext);

  const { anchorEl, open, openMenu, closeMenu } = useContext(MenuContext);

  return (

  return (

    <>

    <>

      <IconButton

      <IconButton

        onClick={(event) => {

        onClick={(event) => {

          event.stopPropagation();

          event.stopPropagation();

          openMenu(event.currentTarget);

          openMenu(event.currentTarget);

        }}

        }}

        style={style}

        style={style}

        {...props}

        {...props}

      >

      >

        {icon ? icon : <MoreVert />}

        {icon ? icon : <MoreVert />}

      </IconButton>

      </IconButton>

      <MuiMenu

      <MuiMenu

        anchorEl={anchorEl}

        anchorEl={anchorEl}

        open={open}

        open={open}

        onClose={(event) => {

        onClose={(event) => {

          event.stopPropagation();

          event.stopPropagation();

          closeMenu();

          closeMenu();

        }}

        }}

        anchorOrigin={{

        anchorOrigin={{

          vertical: 'center',

          vertical: 'center',

          horizontal: 'center'

          horizontal: 'center'

        }}

        }}

        transformOrigin={{

        transformOrigin={{

          vertical: 'top',

          vertical: 'top',

          horizontal: 'right'

          horizontal: 'right'

        }}

        }}

      >

      >

        {children}

        {children}

      </MuiMenu>

      </MuiMenu>

    </>

    </>

  );

  );

}

}

export function MenuItem({ onClick, children }) {

export function MenuItem({ onClick, children }) {

  const { handleClick } = useContext(MenuContext);

  const { handleClick } = useContext(MenuContext);

  return (

  return (

    <MuiMenuItem

    <MuiMenuItem

      onClick={(event) => {

      onClick={(event) => {

        event.stopPropagation();

        event.stopPropagation();

        handleClick(onClick);

        handleClick(onClick);

      }}

      }}

    >

    >

      {children}

      {children}

    </MuiMenuItem>

    </MuiMenuItem>

  );

  );

}

}