96 lines
2.6 KiB
TypeScript
96 lines
2.6 KiB
TypeScript
import List from "@mui/material/List";
|
|
import ListItem from "@mui/material/ListItem";
|
|
import ListItemButton from "@mui/material/ListItemButton";
|
|
import ListItemIcon from "@mui/material/ListItemIcon";
|
|
import ListItemText from "@mui/material/ListItemText";
|
|
import Stack from "@mui/material/Stack";
|
|
import HomeRoundedIcon from "@mui/icons-material/HomeRounded";
|
|
import AnalyticsRoundedIcon from "@mui/icons-material/AnalyticsRounded";
|
|
import FormatListBulletedIcon from "@mui/icons-material/FormatListBulleted";
|
|
import { Link, useLocation } from "react-router-dom";
|
|
import { useSelector } from "react-redux";
|
|
import { RootState } from "../../redux/store/store";
|
|
import DashboardOutlinedIcon from "@mui/icons-material/DashboardOutlined";
|
|
import ManageAccountsOutlinedIcon from "@mui/icons-material/ManageAccountsOutlined";
|
|
|
|
//Eknoor singh and Jaanvi
|
|
//date:- 12-Feb-2025
|
|
//Made a different variable for super admin to access all the details.
|
|
|
|
type PropType = {
|
|
hidden: boolean;
|
|
};
|
|
|
|
export default function MenuContent({ hidden }: PropType) {
|
|
const location = useLocation();
|
|
const userRole = useSelector(
|
|
(state: RootState) => state.profileReducer.user?.userType
|
|
);
|
|
const baseMenuItems = [
|
|
{
|
|
text: "Dashboard",
|
|
icon: <DashboardOutlinedIcon />,
|
|
url: "/panel/dashboard",
|
|
},
|
|
userRole === "superadmin" && {
|
|
text: "Admins",
|
|
icon: <AnalyticsRoundedIcon />,
|
|
url: "/panel/admin-list",
|
|
},
|
|
userRole === "admin" && {
|
|
text: "Users",
|
|
icon: <AnalyticsRoundedIcon />,
|
|
url: "/panel/user-list",
|
|
},
|
|
userRole === "superadmin" && {
|
|
text: "Roles",
|
|
icon: <AnalyticsRoundedIcon />,
|
|
url: "/panel/role-list",
|
|
},
|
|
];
|
|
|
|
const filteredMenuItems = baseMenuItems.filter(Boolean);
|
|
return (
|
|
<Stack sx={{ flexGrow: 1, p: 1, justifyContent: "space-between" }}>
|
|
<List dense>
|
|
{filteredMenuItems.map((item, index) => (
|
|
<ListItem
|
|
key={index}
|
|
disablePadding
|
|
sx={{ display: "block", py: 1 }}
|
|
>
|
|
{/* Wrap ListItemButton with Link to enable routing */}
|
|
<ListItemButton
|
|
component={Link}
|
|
to={item.url}
|
|
selected={item.url === location.pathname}
|
|
sx={{ alignItems: "center", columnGap: 1 }}
|
|
>
|
|
<ListItemIcon
|
|
sx={{
|
|
minWidth: "fit-content",
|
|
".MuiSvgIcon-root": {
|
|
fontSize: 24,
|
|
},
|
|
}}
|
|
>
|
|
{item.icon}
|
|
</ListItemIcon>
|
|
<ListItemText
|
|
sx={{
|
|
display: !hidden ? "none" : "",
|
|
transition: "all 0.5s ease",
|
|
".MuiListItemText-primary": {
|
|
fontSize: "16px",
|
|
},
|
|
}}
|
|
primary={item.text}
|
|
/>
|
|
</ListItemButton>
|
|
</ListItem>
|
|
))}
|
|
</List>
|
|
</Stack>
|
|
);
|
|
}
|