github.com/voedger/voedger@v0.0.0-20240520144910-273e84102129/pkg/apps/sys.monitor/site.main.src/src/layout/SubMenu.js (about) 1 /* 2 * Copyright (c) 2022-present unTill Pro, Ltd. 3 */ 4 5 import * as React from 'react'; 6 import { 7 List, 8 MenuItem, 9 ListItemIcon, 10 Typography, 11 Collapse, 12 Tooltip, 13 } from '@mui/material'; 14 import ExpandMore from '@mui/icons-material/ExpandMore'; 15 import { useTranslate, useSidebarState } from 'react-admin'; 16 17 const SubMenu = (props) => { 18 const { handleToggle, isOpen, name, icon, children, dense } = props; 19 const translate = useTranslate(); 20 21 const [sidebarIsOpen] = useSidebarState(); 22 23 const header = ( 24 <MenuItem dense={dense} onClick={handleToggle}> 25 <ListItemIcon sx={{ minWidth: 5 }}> 26 {isOpen ? <ExpandMore /> : icon} 27 </ListItemIcon> 28 <Typography variant="inherit" color="textSecondary"> 29 {name} 30 </Typography> 31 </MenuItem> 32 ); 33 34 return ( 35 <div> 36 {sidebarIsOpen || isOpen ? ( 37 header 38 ) : ( 39 <Tooltip title={name} placement="right"> 40 {header} 41 </Tooltip> 42 )} 43 <Collapse in={isOpen} timeout="auto" unmountOnExit> 44 <List 45 dense={dense} 46 component="div" 47 disablePadding 48 sx={{ 49 '& a': { 50 transition: 51 'padding-left 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms', 52 paddingLeft: sidebarIsOpen ? 4 : 2, 53 }, 54 }} 55 > 56 {children} 57 </List> 58 </Collapse> 59 </div> 60 ); 61 }; 62 63 export default SubMenu;