web-humas-fe/components/layout/navbar/HumasSidebarWrapper.tsx

107 lines
2.4 KiB
TypeScript

import React from "react";
import { RxHamburgerMenu } from "react-icons/rx";
import {
MdDashboard,
MdSupervisedUserCircle,
MdShoppingBag,
MdAttachMoney,
MdWork,
MdAnalytics,
MdPeople,
MdOutlineSettings,
MdHelpCenter,
} from "react-icons/md";
import MenuLinks from "../../page/menu-link";
import Link from "next/link";
import { DashboardIcon } from "@/components/icons/sidebar-icon";
const menuItems = [
{
title: "Pages",
list: [
{
title: "Dashboard",
path: "/admin/dashboard",
// icon: <DashboardIcon />,
},
{
title: "Users",
path: "/dashboard/users",
// icon: <MdSupervisedUserCircle />,
},
{
title: "Producst",
path: "/dashboard/producst",
// icon: <MdShoppingBag />,
},
{
title: "Transactions",
path: "/dashboard/transactions",
// icon: <MdAttachMoney />,
},
],
},
{
title: "Analytics",
list: [
{
title: "Revenue",
path: "/dashboard/revenue",
// icon: <MdWork />,
},
{
title: "Reports",
path: "/dashboard/reports",
// icon: <MdAnalytics />,
},
{
title: "Teams",
path: "/dashboard/teams",
// icon: <MdPeople />,
},
],
},
{
title: "User",
list: [
{
title: "Settings",
path: "/dashboard/settings",
// icon: <MdOutlineSettings />,
},
{
title: "Help",
path: "/dashboard/help",
// icon: <MdHelpCenter />,
},
],
},
];
export default function HumasSidebarWrapper() {
return (
<aside className="w-1/4 dark:text-white bg-slate-200 border-gray-700 dark:bg-[#182237] h-screen overflow-y-auto custom-scrollbar p-3 space-y-7">
<div className="flex">
<div className="w-full flex justify-center">
<Link href="/">
<img src="/logohumas.png" alt="log" />
</Link>
</div>
<div>{/* <RxHamburgerMenu size={28} /> */}</div>
</div>
<div>
<ul className="p-2 space-y-3">
{/* {menuItems.map((category) => (
<li className="space-y-1" key={category.title}>
<span>{category.title}</span>
{category.list.map((item) => (
<MenuLinks item={item} key={item.title} />
))}
</li>
))} */}
</ul>
</div>
</aside>
);
}