Merge pull request #148 from dvishal485/main

stuff
dtutimes · May 21, 2024 · 88f5373 · 88f5373
2 parents 6a58a06 + 5cf3c9e
commit 88f5373
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 31 deletions.
diff --git a/src/assets/ChevronUpIcon.tsx b/src/assets/ChevronUpIcon.tsx
diff --git a/src/components/SideNavigation/sideNavItems.tsx b/src/components/SideNavigation/sideNavItems.tsx
@@ -1,5 +1,4 @@
 import DownArrow from "@/assets/ChevronDownIcon";
-import UpArrow from "@/assets/ChevronUpIcon";
 import { PermissionProtector } from "@/components/PermissionProtector";
 import RouteElement from "@/types/routeElement";
 import { useEffect, useState } from "react";
@@ -44,10 +43,10 @@ function SidebarItem({
     return null;
   }
 
-  if (items.children) {
+  if (items.submenu) {
     return (
       <PermissionProtector permission={items.permission} fallback={true}>
-        <div className="flex flex-col">
+        <div className="flex flex-col w-min">
           <div
             className={`flex items-center justify-between text-white p-2 cursor-pointer w-[220px] h-[45px] ${isSidebarOpen ? "hover:bg-gray-500 hover:rounded transition-all duration-600" : "w-[45px] transition-all duration-600"}`}
             onClick={menu_open}
@@ -68,12 +67,12 @@ function SidebarItem({
             <div
               className={`ml-3 ${isSidebarOpen ? "transition-all duration-600" : "hidden transition-all duration-600"}`}
             >
-              {is_expanded ? <UpArrow /> : <DownArrow />}
+              <DownArrow className={is_expanded ? "rotate-180" : ""} />
             </div>
           </div>
           {isSidebarOpen && is_expanded ? (
             <div className="pl-4">
-              {items.children.map((item, index) => (
+              {items.submenu.map((item, index) => (
                 <PermissionProtector
                   key={`nested-${item.label}.${index}`}
                   permission={item.permission}
@@ -112,7 +111,7 @@ function SidebarItem({
               to={items.path}
             >
               <div
-                className={`flex items-center w-[220px] h-[45px]  p-2 cursor-pointer ${isSidebarOpen ? "hover:bg-gray-500 hover:rounded transition-all duration-600" : "w-[45px] transition-all duration-600"}`}
+                className={`flex items-center h-[45px]  p-2 cursor-pointer ${isSidebarOpen ? "w-[220px] hover:bg-gray-500 hover:rounded transition-all duration-600" : "w-[45px] transition-all duration-600"}`}
               >
                 <span
                   className={`${isSidebarOpen ? "transition-all duration-800 " : "scale-[1.5] transition-all duration-800  hover:bg-gray-500 hover:rounded w-[40px] h-[30px] flex justify-center items-center"}`}

diff --git a/src/router/routeMap.tsx b/src/router/routeMap.tsx
@@ -67,7 +67,7 @@ const routeMap: CustomRouteElement[] = [
     label: "Story",
     icon: <StoryIcon />,
     permission: [Permission.ReadBlog],
-    children: [
+    submenu: [
       {
         path: "new-story/",
         element: <NewStory />,
@@ -117,7 +117,7 @@ const routeMap: CustomRouteElement[] = [
         <Outlet />
       </>
     ),
-    children: [
+    submenu: [
       {
         path: "new-edition/",
         element: <NewEdition key="new-edition" />,
@@ -149,7 +149,7 @@ const routeMap: CustomRouteElement[] = [
         <Outlet />
       </>
     ),
-    children: [
+    submenu: [
       {
         path: "all-roles/",
         element: <AllRoles />,
@@ -180,7 +180,7 @@ const routeMap: CustomRouteElement[] = [
     permission: [],
     label: "Member",
     icon: <MemberIcon />,
-    children: [
+    submenu: [
       {
         path: "all-members/",
         element: <AllMembers />,
@@ -240,8 +240,8 @@ const routeMap: CustomRouteElement[] = [
 
 const make_protected = (routes: CustomRouteElement[]) => {
   return routes.map((route) => {
-    if (route.children) {
-      route.children = make_protected(route.children);
+    if (route.submenu) {
+      route.children = make_protected(route.submenu);
     } else {
       route.element = (
         <PermissionProtector permission={route.permission}>

diff --git a/src/types/routeElement.ts b/src/types/routeElement.ts
@@ -6,7 +6,7 @@ interface RouteElement extends NonIndexRouteObject {
   label: string;
   icon?: React.SVGProps<SVGSVGElement>;
   hide?: true;
-  children?: RouteElement[];
+  submenu?: RouteElement[];
 }
 
 export default RouteElement;