diff --git a/apps/web/src/components/layout/admin/AdminSidebar.tsx b/apps/web/src/components/layout/admin/AdminSidebar.tsx index 7578544..005bac4 100644 --- a/apps/web/src/components/layout/admin/AdminSidebar.tsx +++ b/apps/web/src/components/layout/admin/AdminSidebar.tsx @@ -1,61 +1,58 @@ -import { useState, useMemo } from 'react'; -import { NavLink, matchPath, useLocation, useMatches } from 'react-router-dom'; -import { Layout, Menu, theme } from 'antd'; -import type { MenuProps } from 'antd'; -import { CustomRouteObject } from '@web/src/routes/types'; +import { useState, useMemo } from "react"; +import { NavLink, matchPath, useLocation, useMatches } from "react-router-dom"; +import { Layout, Menu, theme } from "antd"; +import type { MenuProps } from "antd"; +import { CustomRouteObject } from "@web/src/routes/types"; const { Sider } = Layout; const { useToken } = theme; type SidebarProps = { - routes: CustomRouteObject[]; + routes: CustomRouteObject[]; }; export default function AdminSidebar({ routes }: SidebarProps) { - const [collapsed, setCollapsed] = useState(false); - const { token } = useToken(); - let matches = useMatches(); - console.log(matches) - const menuItems: MenuProps['items'] = useMemo(() => - routes.map(route => ({ - key: route.path, - icon: route.icon, - label: ( - + routes.map((route) => ({ + key: route.path, + icon: route.icon, + label: {route.name}, + })), + [routes] + ); - > - {route.name} - - ), - })) - , [routes]); - - return ( - setCollapsed(value)} - width={150} - className="h-screen sticky top-0" - style={{ - backgroundColor: token.colorBgContainer, - borderRight: `1px solid ${token.colorBorderSecondary}` - }} - > - matches.some(match => match.pathname.includes(route.path))) - .map(route => route.path)} - - items={menuItems} - className="border-r-0" - style={{ - borderRight: 0 - }} - /> - - ); + return ( + setCollapsed(value)} + width={150} + className="h-screen sticky top-0" + style={{ + backgroundColor: token.colorBgContainer, + borderRight: `1px solid ${token.colorBorderSecondary}`, + }}> + + matches.some((match) => + match.pathname.includes(route.path) + ) + ) + .map((route) => route.path)} + items={menuItems} + className="border-r-0" + style={{ + borderRight: 0, + }} + /> + + ); }