| | |
| | | import SubMenu from './SubMenu'; |
| | | import SettingsIcon from '@mui/icons-material/Settings'; |
| | | import DashboardIcon from '@mui/icons-material/Dashboard'; |
| | | import DehazeIcon from '@mui/icons-material/Dehaze'; |
| | | import HorizontalRuleIcon from '@mui/icons-material/HorizontalRule'; |
| | | import PersonIcon from '@mui/icons-material/Person'; |
| | | import * as Icons from '@mui/icons-material'; |
| | | |
| | | const getIconComponent = (iconStr) => { |
| | | return Icons[iconStr] || DehazeIcon; |
| | | return Icons[iconStr] || HorizontalRuleIcon; |
| | | }; |
| | | |
| | | export const MyMenu = ({ dense = false }) => { |
| | |
| | | const { isPending, permissions } = usePermissions(); |
| | | |
| | | useEffect(() => { |
| | | // default open sub menu |
| | | const defaultExpandMenu = ["menu.warehouse", "menu.dispatcher", "menu.equipment"]; |
| | | permissions?.forEach(item => { |
| | | if (defaultExpandMenu.includes(item.name)) { |
| | | setState(state => ({ ...state, [item.route]: true })); |
| | | } |
| | | }); |
| | | }, [permissions]); |
| | | |
| | | useEffect(() => { |
| | | // expand this parent menu |
| | | const currentPath = location.pathname; |
| | | const parentRoutes = findParentRoutes(currentPath, permissions) |
| | | for (const parentRoute of parentRoutes) { |
| | | setState(state => ({ ...state, [parentRoute]: true })); |
| | | } |
| | | }, [location.pathname, permissions]); |
| | | |
| | | }, [location.pathname]); |
| | | |
| | | const handleToggle = (menu) => { |
| | | setState(state => ({ ...state, [menu]: !state[menu] })); |
| | |
| | | |
| | | const getIcon = (iconStr) => { |
| | | const IconComponent = getIconComponent(iconStr); |
| | | return <IconComponent />; |
| | | if (IconComponent) { |
| | | return <IconComponent />; |
| | | } |
| | | }; |
| | | |
| | | const generateMenu = (permissions) => { |