diff --git a/src/layout/LayoutMenu.jsx b/src/layout/LayoutMenu.jsx index b350641..28cf0ad 100644 --- a/src/layout/LayoutMenu.jsx +++ b/src/layout/LayoutMenu.jsx @@ -1,5 +1,5 @@ -import React, { useState } from 'react'; -import { Link } from 'react-router-dom'; +import React, { useState, useEffect } from 'react'; +import { Link, useLocation } from 'react-router-dom'; import { Menu, Typography, Image } from 'antd'; import { getSessionData } from '../components/Global/Formatter'; import { @@ -145,7 +145,65 @@ const allItems = [ ]; const LayoutMenu = () => { + const location = useLocation(); const [stateOpenKeys, setStateOpenKeys] = useState(['home']); + const [selectedKeys, setSelectedKeys] = useState(['home']); + + // Function to get menu key from current path + const getMenuKeyFromPath = (pathname) => { + // Remove leading slash and split path + const pathParts = pathname.replace(/^\//, '').split('/'); + + // Handle different route patterns + if (pathname === '/dashboard/home') return 'home'; + if (pathname === '/user') return 'user'; + if (pathname === '/role') return 'role'; + if (pathname === '/notification') return 'notification'; + if (pathname === '/event-alarm') return 'event-alarm'; + + // Handle master routes + if (pathname.startsWith('/master/')) { + const subPath = pathParts[1]; + return `master-${subPath}`; + } + + // Handle history routes + if (pathname.startsWith('/history/')) { + const subPath = pathParts[1]; + return `history-${subPath}`; + } + + // Handle shift management routes + if (pathname.startsWith('/shift-management/')) { + const subPath = pathParts[1]; + return `shift-${subPath}`; + } + + return 'home'; // default + }; + + // Function to get parent key from menu key + const getParentKey = (key) => { + if (key.startsWith('master-')) return 'master'; + if (key.startsWith('history-')) return 'history'; + if (key.startsWith('shift-')) return 'shift-management'; + return null; + }; + + // Update selected and open keys when route changes + useEffect(() => { + const currentKey = getMenuKeyFromPath(location.pathname); + setSelectedKeys([currentKey]); + + const parentKey = getParentKey(currentKey); + + // If current menu has parent, open it. Otherwise, close all dropdowns + if (parentKey) { + setStateOpenKeys([parentKey]); + } else { + setStateOpenKeys([]); + } + }, [location.pathname]); const getLevelKeys = (items1) => { const key = {}; @@ -213,7 +271,7 @@ const LayoutMenu = () => {