github.com/voedger/voedger@v0.0.0-20240520144910-273e84102129/pkg/apps/sys.monitor/site.main.src/src/layout/MonMenu.js (about) 1 /* 2 * Copyright (c) 2022-present unTill Pro, Ltd. 3 */ 4 5 import * as React from 'react'; 6 import { useState } from 'react'; 7 import Box from '@mui/material/Box'; 8 import PerformanceIcon from '@mui/icons-material/QueryStats'; 9 import ResourcesIcon from '@mui/icons-material/Memory'; 10 import AppsIcon from '@mui/icons-material/Apps'; 11 12 import { 13 useTranslate, 14 DashboardMenuItem, 15 MenuItemLink, 16 useSidebarState, 17 } from 'react-admin'; 18 19 import SubMenu from './SubMenu'; 20 21 const MonMenu = (props) => { 22 const [state, setState] = useState({ 23 menuUntillAir: false, 24 menuSysMonitor: false, 25 menuSysRegistry: false, 26 }); 27 const translate = useTranslate(); 28 const [open] = useSidebarState(); 29 const { dense } = props; 30 31 const handleToggle = (menu) => { 32 setState(state => ({ ...state, [menu]: !state[menu] })); 33 }; 34 35 return ( 36 <Box 37 sx={{ 38 width: open ? 250 : 50, 39 marginTop: 1, 40 marginBottom: 1, 41 transition: theme => 42 theme.transitions.create('width', { 43 easing: theme.transitions.easing.sharp, 44 duration: theme.transitions.duration.leavingScreen, 45 }), 46 }} 47 > 48 <DashboardMenuItem /> 49 <MenuItemLink 50 to="/sys-performance" 51 state={{ _scrollToTop: true }} 52 primaryText={translate(`menu.sysPerformance`, { 53 smart_count: 2, 54 })} 55 leftIcon={<PerformanceIcon/>} 56 dense={dense} 57 /> 58 <MenuItemLink 59 to="/sys-resources" 60 state={{ _scrollToTop: true }} 61 primaryText={translate(`menu.sysResources`, { 62 smart_count: 2, 63 })} 64 leftIcon={<ResourcesIcon/>} 65 dense={dense} 66 /> 67 <SubMenu 68 handleToggle={() => handleToggle('menuUntillAir')} 69 isOpen={state.menuUntillAir} 70 name="untill/air" 71 translate={false} 72 icon={<AppsIcon />} 73 dense={dense} 74 > 75 <MenuItemLink 76 to="/app-performance?app=untill.air" 77 state={{ _scrollToTop: true }} 78 primaryText={translate(`menu.performance`, { 79 smart_count: 2, 80 })} 81 leftIcon={<PerformanceIcon/>} 82 dense={dense} 83 /> 84 </SubMenu> 85 <SubMenu 86 handleToggle={() => handleToggle('menuSysMonitor')} 87 isOpen={state.menuSysMonitor} 88 translate={false} 89 name="sys/monitor" 90 icon={<AppsIcon />} 91 dense={dense} 92 > 93 <MenuItemLink 94 to="/app-performance?app=sys.monitor" 95 state={{ _scrollToTop: true }} 96 primaryText={translate(`menu.performance`, { 97 smart_count: 2, 98 })} 99 leftIcon={<PerformanceIcon/>} 100 dense={dense} 101 /> 102 </SubMenu> 103 <SubMenu 104 handleToggle={() => handleToggle('menuSysRegistry')} 105 isOpen={state.menuSysRegistry} 106 name="sys/registry" 107 translate={false} 108 icon={<AppsIcon />} 109 dense={dense} 110 > 111 <MenuItemLink 112 to="/app-performance?app=sys.registry" 113 state={{ _scrollToTop: true }} 114 primaryText={translate(`menu.performance`, { 115 smart_count: 2, 116 })} 117 leftIcon={<PerformanceIcon/>} 118 dense={dense} 119 /> 120 </SubMenu> 121 </Box> 122 ); 123 }; 124 125 export default MonMenu;