update: combine menu and sidebar paths

src/Pages/Menu.tsx

@@ -4,93 +4,10 @@ import { useUserProfileStore } from "../context/zustand-store/userStore";
 import { getFaPermissions } from "../utils/getFaPermissions";
 import { motion, AnimatePresence } from "framer-motion";
 import {
-  UsersIcon,
-  DocumentTextIcon,
-  ChartBarIcon,
   ChevronDownIcon,
-  UserIcon,
   GlobeAsiaAustraliaIcon,
 } from "@heroicons/react/24/outline";
-import { ItemWithSubItems } from "../types/userPermissions";
+import { getInspectionMenuItems } from "../config/menuItems";
-import { checkMenuPermission } from "../utils/checkMenuPermission";
-
-const getInspectionMenuItems = (
-  permissions: string[] = []
-): ItemWithSubItems[] => {
-  const items: ItemWithSubItems[] = [];
-
-  if (checkMenuPermission("nationalinfo", permissions)) {
-    items.push({
-      en: "nationalinfo",
-      fa: "اطلاعات",
-      icon: () => <UserIcon className="w-6 h-6" />,
-      subItems: [
-        {
-          name: "nationalinfo",
-          path: "/nationalinfo",
-          component: () => import("./NationalInfo"),
-        },
-        {
-          name: "ladinginfo",
-          path: "/ladinginfo",
-          component: () => import("./LadingInfo"),
-        },
-        {
-          name: "veterinarytransfer",
-          path: "/veterinarytransfer",
-          component: () => import("./VeterinaryTransfer"),
-        },
-      ],
-    });
-  }
-
-  if (checkMenuPermission("users", permissions)) {
-    items.push({
-      en: "users",
-      fa: "کاربران",
-      icon: () => <UsersIcon className="w-6 h-6" />,
-      subItems: [
-        {
-          name: "users",
-          path: "/users",
-          component: () => import("./Users"),
-        },
-      ],
-    });
-  }
-
-  if (checkMenuPermission("inspections", permissions)) {
-    items.push({
-      en: "inspections",
-      fa: "سوابق بازرسی",
-      icon: () => <DocumentTextIcon className="w-6 h-6" />,
-      subItems: [
-        {
-          name: "inspections",
-          path: "/inspections",
-          component: () => import("./UserInspections"),
-        },
-      ],
-    });
-  }
-
-  if (checkMenuPermission("statics", permissions)) {
-    items.push({
-      en: "statics",
-      fa: "آمار",
-      icon: () => <ChartBarIcon className="w-6 h-6" />,
-      subItems: [
-        {
-          name: "statics",
-          path: "/statics",
-          component: () => import("./Statics"),
-        },
-      ],
-    });
-  }
-
-  return items;
-};
 
 export const Menu = () => {
   const { profile } = useUserProfileStore();

src/config/menuItems.tsx

@@ -0,0 +1,86 @@
+import {
+  UsersIcon,
+  DocumentTextIcon,
+  ChartBarIcon,
+  UserIcon,
+} from "@heroicons/react/24/outline";
+import { ItemWithSubItems } from "../types/userPermissions";
+import { checkMenuPermission } from "../utils/checkMenuPermission";
+
+export const getInspectionMenuItems = (
+  permissions: string[] = [],
+): ItemWithSubItems[] => {
+  const items: ItemWithSubItems[] = [];
+
+  if (checkMenuPermission("nationalinfo", permissions)) {
+    items.push({
+      en: "nationalinfo",
+      fa: "اطلاعات",
+      icon: () => <UserIcon className="w-6 h-6" />,
+      subItems: [
+        {
+          name: "nationalinfo",
+          path: "/nationalinfo",
+          component: () => import("../Pages/NationalInfo"),
+        },
+        {
+          name: "ladinginfo",
+          path: "/ladinginfo",
+          component: () => import("../Pages/LadingInfo"),
+        },
+        {
+          name: "veterinarytransfer",
+          path: "/veterinarytransfer",
+          component: () => import("../Pages/VeterinaryTransfer"),
+        },
+      ],
+    });
+  }
+
+  if (checkMenuPermission("users", permissions)) {
+    items.push({
+      en: "users",
+      fa: "کاربران",
+      icon: () => <UsersIcon className="w-6 h-6" />,
+      subItems: [
+        {
+          name: "users",
+          path: "/users",
+          component: () => import("../Pages/Users"),
+        },
+      ],
+    });
+  }
+
+  if (checkMenuPermission("inspections", permissions)) {
+    items.push({
+      en: "inspections",
+      fa: "سوابق بازرسی",
+      icon: () => <DocumentTextIcon className="w-6 h-6" />,
+      subItems: [
+        {
+          name: "inspections",
+          path: "/inspections",
+          component: () => import("../Pages/UserInspections"),
+        },
+      ],
+    });
+  }
+
+  if (checkMenuPermission("statics", permissions)) {
+    items.push({
+      en: "statics",
+      fa: "آمار",
+      icon: () => <ChartBarIcon className="w-6 h-6" />,
+      subItems: [
+        {
+          name: "statics",
+          path: "/statics",
+          component: () => import("../Pages/Statics"),
+        },
+      ],
+    });
+  }
+
+  return items;
+};

src/screen/SideBar.tsx

@@ -4,21 +4,16 @@ import { useState } from "react";
 import { motion, AnimatePresence } from "framer-motion";
 import { ChevronDownIcon } from "@heroicons/react/24/solid";
 import { useUserProfileStore } from "../context/zustand-store/userStore";
-import { ItemWithSubItems } from "../types/userPermissions";
 import { useNavigate } from "@tanstack/react-router";
 import { getFaPermissions } from "../utils/getFaPermissions";
 import { useSideBarStore } from "../context/zustand-store/appStore";
 import SVGImage from "../components/SvgImage/SvgImage";
-import { checkMenuPermission } from "../utils/checkMenuPermission";
+import { getInspectionMenuItems } from "../config/menuItems";
 import {
   ChevronLeftIcon,
   ChevronRightIcon,
   MagnifyingGlassIcon,
   BuildingOfficeIcon,
-  UsersIcon,
-  DocumentTextIcon,
-  ChartBarIcon,
-  UserIcon,
   GlobeAsiaAustraliaIcon,
 } from "@heroicons/react/24/outline";
 
@@ -69,91 +64,10 @@ const sidebarVariants = {
   },
 };
 
-export const getInspectionMenuItems = (
-  permissions: string[] = []
-): ItemWithSubItems[] => {
-  const items: ItemWithSubItems[] = [];
-
-  if (checkMenuPermission("nationalinfo", permissions)) {
-    items.push({
-      en: "nationalinfo",
-      fa: "اطلاعات",
-      icon: () => <UserIcon className="w-6 h-6" />,
-      subItems: [
-        {
-          name: "nationalinfo",
-          path: "/nationalinfo",
-          component: () => import("../Pages/NationalInfo"),
-        },
-
-        {
-          name: "ladinginfo",
-          path: "/ladinginfo",
-          component: () => import("../Pages/LadingInfo"),
-        },
-        {
-          name: "veterinarytransfer",
-          path: "/veterinarytransfer",
-          component: () => import("../Pages/VeterinaryTransfer"),
-        },
-      ],
-    });
-  }
-
-  if (checkMenuPermission("users", permissions)) {
-    items.push({
-      en: "users",
-      fa: "کاربران",
-      icon: () => <UsersIcon className="w-6 h-6" />,
-      subItems: [
-        {
-          name: "users",
-          path: "/users",
-          component: () => import("../Pages/Users"),
-        },
-      ],
-    });
-  }
-
-  if (checkMenuPermission("inspections", permissions)) {
-    items.push({
-      en: "inspections",
-      fa: "سوابق بازرسی",
-      icon: () => <DocumentTextIcon className="w-6 h-6" />,
-      subItems: [
-        {
-          name: "inspections",
-          path: "/inspections",
-          component: () => import("../Pages/UserInspections"),
-        },
-      ],
-    });
-  }
-
-  if (checkMenuPermission("statics", permissions)) {
-    items.push({
-      en: "statics",
-      fa: "آمار",
-      icon: () => <ChartBarIcon className="w-6 h-6" />,
-      subItems: [
-        {
-          name: "statics",
-          path: "/statics",
-          component: () => import("../Pages/Statics"),
-        },
-      ],
-    });
-  }
-
-  return items;
-};
-
 export const SideBar = () => {
   const isMobile = checkIsMobile();
   const { profile } = useUserProfileStore();
-  const menuItems: ItemWithSubItems[] = getInspectionMenuItems(
+  const menuItems = getInspectionMenuItems(profile?.permissions || []);
-    profile?.permissions || []
-  );
   const [search, setSearch] = useState("");
 
   const { isSideBarOpen, toggleSideBar } = useSideBarStore();
@@ -161,7 +75,7 @@ export const SideBar = () => {
   const getOpenedItem = () => {
     if (window.location.pathname !== "/") {
       const matchedIndex = menuItems.findIndex((item) =>
-        item.subItems.some((sub) => sub.path === window.location.pathname)
+        item.subItems.some((sub) => sub.path === window.location.pathname),
       );
       return matchedIndex;
     } else {
@@ -180,7 +94,7 @@ export const SideBar = () => {
           getFaPermissions(subItem.name)
             .toLowerCase()
             .includes(search.toLowerCase()) ||
-          subItem.path.toLowerCase().includes(search.toLowerCase())
+          subItem.path.toLowerCase().includes(search.toLowerCase()),
       );
 
       return {
@@ -191,7 +105,7 @@ export const SideBar = () => {
     .filter(
       (item) =>
         item.subItems.length > 0 ||
-        item.fa.toLowerCase().includes(search.toLowerCase())
+        item.fa.toLowerCase().includes(search.toLowerCase()),
     );
 
   if (isMobile) return null;