46 lines
1.8 KiB
JavaScript
46 lines
1.8 KiB
JavaScript
import {Collapse, ListItem, ListItemButton, ListItemIcon, ListItemText} from "@mui/material";
|
|
import { ExpandLess, ExpandMore } from '@mui/icons-material';
|
|
import WifiIcon from '@mui/icons-material/Wifi';
|
|
import SidebarSubitems from "@/core/components/SidebarSubitems";
|
|
|
|
const SidebarListItems = ({menuItem, dispatch}) => {
|
|
return(
|
|
<>
|
|
<ListItem disablePadding sx={{p : 0}}>
|
|
<ListItemButton sx={{
|
|
'&.Mui-selected': {
|
|
backgroundColor: 'rgba(0, 0, 0, 0.2)',
|
|
},
|
|
}} selected={menuItem.selected} onClick={() => {
|
|
dispatch({type: "COLLAPSE_MENU", id: menuItem.id})
|
|
}}>
|
|
<ListItemIcon
|
|
sx={{
|
|
minWidth: 0,
|
|
justifyContent: "center",
|
|
color: "primary.main",
|
|
width: 40,
|
|
height: 24,
|
|
pr: 2,
|
|
}}
|
|
>
|
|
{menuItem.icon}
|
|
</ListItemIcon>
|
|
<ListItemText primary={menuItem.id} />
|
|
{menuItem.hasSubitems ? (menuItem.showSubitems ? <ExpandLess /> : <ExpandMore />) : null }
|
|
</ListItemButton>
|
|
</ListItem>
|
|
<Collapse in={menuItem.showSubitems} timeout="auto" mountOnEnter={true} unmountOnExit={true}>
|
|
{
|
|
menuItem.hasSubitems ? (menuItem.Subitems.map((subitem,index)=>{
|
|
return(
|
|
<SidebarSubitems dispatch={dispatch} key={index} subitem={subitem}/>
|
|
)
|
|
})) : null
|
|
}
|
|
</Collapse>
|
|
|
|
</>
|
|
)
|
|
}
|
|
export default SidebarListItems |