add

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: (
-        <NavLink
-          to={route.path}
+	const [collapsed, setCollapsed] = useState(false);
+	const { token } = useToken();
+	const matches = useMatches();
+	console.log(matches);
+	const menuItems: MenuProps["items"] = useMemo(
+		() =>
+			routes.map((route) => ({
+				key: route.path,
+				icon: route.icon,
+				label: <NavLink to={route.path}>{route.name}</NavLink>,
+			})),
+		[routes]
+	);
 
-        >
-          {route.name}
-        </NavLink>
-      ),
-    }))
-    , [routes]);
-
-  return (
-    <Sider
-      collapsible
-      collapsed={collapsed}
-      onCollapse={(value) => setCollapsed(value)}
-      width={150}
-      className="h-screen sticky top-0"
-      style={{
-        backgroundColor: token.colorBgContainer,
-        borderRight: `1px solid ${token.colorBorderSecondary}`
-      }}
-    >
-      <Menu
-        theme="light"
-        mode="inline"
-        selectedKeys={routes
-          .filter(route => matches.some(match => match.pathname.includes(route.path)))
-          .map(route => route.path)}
-
-        items={menuItems}
-        className="border-r-0"
-        style={{
-          borderRight: 0
-        }}
-      />
-    </Sider>
-  );
+	return (
+		<Sider
+			collapsible
+			collapsed={collapsed}
+			onCollapse={(value) => setCollapsed(value)}
+			width={150}
+			className="h-screen sticky top-0"
+			style={{
+				backgroundColor: token.colorBgContainer,
+				borderRight: `1px solid ${token.colorBorderSecondary}`,
+			}}>
+			<Menu
+				theme="light"
+				mode="inline"
+				selectedKeys={routes
+					.filter((route) =>
+						matches.some((match) =>
+							match.pathname.includes(route.path)
+						)
+					)
+					.map((route) => route.path)}
+				items={menuItems}
+				className="border-r-0"
+				style={{
+					borderRight: 0,
+				}}
+			/>
+		</Sider>
+	);
 }