Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */
import * as React from 'react';
import Box from '@mui/material/Box';
import Drawer from '@mui/material/Drawer';
import List from '@mui/material/List';
import ListItem from '@mui/material/ListItem';
import ListItemIcon from '@mui/material/ListItemIcon';
import ListItemText from '@mui/material/ListItemText';
import Accordion from '@mui/material/Accordion';
import AccordionSummary from '@mui/material/AccordionSummary';
import AccordionDetails from '@mui/material/AccordionDetails';
import Link from '@mui/material/Link';
import Typography from '@mui/material/Typography';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';

function MenuDrawer({ isOpen = false, items = [], icons=[], closeDrawer = () => { } }) {

    return (
        <Drawer
            anchor='right'
            open={isOpen}
            onClose={closeDrawer}
        >
            <Box
                sx={{ width: 250 }}
                role="presentation"
            >
                <List>
                    {items.map((navItem, index) => {
                        return (
                            <MenuDrawer.Item
                                key={index}
                                Icon={icons[index]}
                                title={navItem.label}
                                url={navItem.href}
                                childs={navItem.childs}
                            />
                        )
                    })}
                </List>
            </Box>

        </Drawer>
    )
}

const Item = ({ Icon, title, url, childs = [] }) => {
    return (
        <ListItem disablePadding>
            {!childs.length
                ?
                <Link href={url}>
                    <ListItemIcon>
                        {Icon && <Icon />}
                    </ListItemIcon>
                    <ListItemText primary={title} />
                </Link>
                :
                <Accordion>
                    <AccordionSummary
                        expandIcon={<ExpandMoreIcon />}
                        aria-controls="panel1a-content"
                        id="panel1a-header"
                    >
                        <Typography>Accordion 1</Typography>
                    </AccordionSummary>
                    <AccordionDetails>
                        {childs.map((child, index) => {
                            return (
                                <Link key={index} href={child.href}>
                                    <ListItemText primary={child.label} />
                                </Link>
                            )
                        })}
                    </AccordionDetails>
                </Accordion>
            }

        </ListItem>
    )
}

MenuDrawer.Item = Item

export default MenuDrawer