@cullsin/lnc-menu 6.7.0 → 6.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/SideMenu.d.ts +2 -1
- package/dist/src/SideMenu.js +14 -3
- package/dist/src/sidemenu.scss +4 -4
- package/package.json +1 -1
package/dist/src/SideMenu.d.ts
CHANGED
|
@@ -10,6 +10,7 @@ interface SideMenuProps {
|
|
|
10
10
|
navigate: NavigateFunction;
|
|
11
11
|
location: Location;
|
|
12
12
|
language?: Language;
|
|
13
|
+
module?: 'sample' | 'patient';
|
|
13
14
|
}
|
|
14
|
-
declare function SideMenu({ useDrawer, SampleMgmtIcon, location, language }: SideMenuProps): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
declare function SideMenu({ useDrawer, SampleMgmtIcon, location, language, module }: SideMenuProps): import("react/jsx-runtime").JSX.Element;
|
|
15
16
|
export default SideMenu;
|
package/dist/src/SideMenu.js
CHANGED
|
@@ -9,7 +9,7 @@ import ListItemText from "@mui/material/ListItemText";
|
|
|
9
9
|
import Tooltip from "@mui/material/Tooltip";
|
|
10
10
|
import * as React from "react";
|
|
11
11
|
import { getTranslations } from "./translations";
|
|
12
|
-
function SideMenu({ useDrawer, SampleMgmtIcon, location, language = 'en' }) {
|
|
12
|
+
function SideMenu({ useDrawer, SampleMgmtIcon, location, language = 'en', module }) {
|
|
13
13
|
const [selectedMainMenu, setSelectedMainMenu] = React.useState(null);
|
|
14
14
|
const { isDrawerOpen } = useDrawer();
|
|
15
15
|
const t = React.useMemo(() => getTranslations(language), [language]);
|
|
@@ -25,8 +25,19 @@ function SideMenu({ useDrawer, SampleMgmtIcon, location, language = 'en' }) {
|
|
|
25
25
|
path: `/sample/${language}/sample-listing`,
|
|
26
26
|
},
|
|
27
27
|
], [SampleMgmtIcon, t, language]);
|
|
28
|
-
// Sync selection with
|
|
28
|
+
// Sync selection with module prop or current path
|
|
29
29
|
React.useEffect(() => {
|
|
30
|
+
// If module prop is provided, use it to set the selection
|
|
31
|
+
if (module) {
|
|
32
|
+
if (module === 'sample') {
|
|
33
|
+
setSelectedMainMenu(t.menu.sampleManagement);
|
|
34
|
+
}
|
|
35
|
+
else if (module === 'patient') {
|
|
36
|
+
setSelectedMainMenu(t.menu.patientManagement);
|
|
37
|
+
}
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
// Fall back to path-based detection
|
|
30
41
|
const currentPath = location.pathname;
|
|
31
42
|
const pathMatch = currentPath.match(/^\/([^/]+)/);
|
|
32
43
|
if (pathMatch) {
|
|
@@ -44,7 +55,7 @@ function SideMenu({ useDrawer, SampleMgmtIcon, location, language = 'en' }) {
|
|
|
44
55
|
else {
|
|
45
56
|
setSelectedMainMenu(null);
|
|
46
57
|
}
|
|
47
|
-
}, [location.pathname, t.menu.sampleManagement, t.menu.patientManagement]);
|
|
58
|
+
}, [module, location.pathname, t.menu.sampleManagement, t.menu.patientManagement]);
|
|
48
59
|
const handleMenuClick = (item) => {
|
|
49
60
|
setSelectedMainMenu(item.text);
|
|
50
61
|
window.location.href = item.path;
|
package/dist/src/sidemenu.scss
CHANGED
|
@@ -18,8 +18,8 @@
|
|
|
18
18
|
.MuiList-root {
|
|
19
19
|
.MuiListItem-root {
|
|
20
20
|
// Apply capsule layout with gradient permanently for testing
|
|
21
|
-
padding:
|
|
22
|
-
margin: 12px
|
|
21
|
+
padding: 8px 12px;
|
|
22
|
+
margin: 12px 6px 0px 6px;
|
|
23
23
|
border-radius: 15px;
|
|
24
24
|
display: flex;
|
|
25
25
|
align-items: center;
|
|
@@ -28,11 +28,11 @@
|
|
|
28
28
|
|
|
29
29
|
// Width based on menu open/closed state
|
|
30
30
|
&.menu-closed {
|
|
31
|
-
width:
|
|
31
|
+
width: 52px;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
&.menu-open {
|
|
35
|
-
width:
|
|
35
|
+
width: 218px;
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
// Hover design - override the default background on hover
|