From 2d22f12dc4e23cacba49666e3c1c75a53cc1296f Mon Sep 17 00:00:00 2001
From: AmirHossein Mahmoodi <amir.mahmoodi74@gmail.com>
Date: Tue, 19 Dec 2023 12:07:31 +0330
Subject: [PATCH] change sidebar

---
 .../layouts/Dashboard/Sidebar/SidebarList.jsx | 98 +++++++------------
 1 file changed, 37 insertions(+), 61 deletions(-)

diff --git a/src/components/layouts/Dashboard/Sidebar/SidebarList.jsx b/src/components/layouts/Dashboard/Sidebar/SidebarList.jsx
index 1c76f07..f3afdba 100644
--- a/src/components/layouts/Dashboard/Sidebar/SidebarList.jsx
+++ b/src/components/layouts/Dashboard/Sidebar/SidebarList.jsx
@@ -8,51 +8,34 @@ import useUser from "@/lib/app/hooks/useUser";
 function reducer(state, action) {
     switch (action.type) {
         case "COLLAPSE_MENU":
-            return state.map((itemsArr) =>
-                itemsArr.map((item) =>
-                    action.key === item.key ? {...item, showSubItem: !item.showSubItem} : item
-                )
-            );
+            return state.map((itemsArr) => itemsArr.map((item) => action.key === item.key ? {
+                ...item,
+                showSubItem: !item.showSubItem
+            } : item));
         case "SELECTED":
-            return state.map((itemsArr) =>
-                itemsArr.map((item) => {
-                    return item.type === "page"
-                        ? {...item, selected: action.route === item.route, routing: false}
-                        : item.subItem && Array.isArray(item.subItem)
-                            ? {
-                                ...item,
-                                subItem: item.subItem.map((subitem) => ({
-                                    ...subitem,
-                                    selected: subitem.route === action.route,
-                                    routing: false
-                                })),
-                                showSubItem: item.subItem.some(
-                                    (subitem) => subitem.selected
-                                ),
-                            }
-                            : item;
-                })
-            );
+            return state.map((itemsArr) => itemsArr.map((item) => {
+                return item.type === "page" ? {
+                    ...item,
+                    selected: action.route === item.route,
+                    routing: false
+                } : item.subItem && Array.isArray(item.subItem) ? {
+                    ...item, subItem: item.subItem.map((subitem) => ({
+                        ...subitem, selected: subitem.route === action.route, routing: false
+                    })), showSubItem: item.subItem.some((subitem) => subitem.selected),
+                } : item;
+            }));
         case "SELECTING":
-            return state.map((itemsArr) =>
-                itemsArr.map((item) => {
-                    return item.type === "page"
-                        ? {...item, selected: action.route === item.route, routing: action.route === item.route}
-                        : item.subItem && Array.isArray(item.subItem)
-                            ? {
-                                ...item,
-                                subItem: item.subItem.map((subitem) => ({
-                                    ...subitem,
-                                    selected: subitem.route === action.route,
-                                    routing: subitem.route === action.route
-                                })),
-                                showSubItem: item.subItem.some(
-                                    (subitem) => subitem.selected
-                                ),
-                            }
-                            : item;
-                })
-            );
+            return state.map((itemsArr) => itemsArr.map((item) => {
+                return item.type === "page" ? {
+                    ...item,
+                    selected: action.route === item.route,
+                    routing: action.route === item.route
+                } : item.subItem && Array.isArray(item.subItem) ? {
+                    ...item, subItem: item.subItem.map((subitem) => ({
+                        ...subitem, selected: subitem.route === action.route, routing: subitem.route === action.route
+                    })), showSubItem: item.subItem.some((subitem) => subitem.selected),
+                } : item;
+            }));
         default:
             throw new Error();
     }
@@ -81,28 +64,21 @@ export default function SidebarList({handleDrawerToggle}) {
 
     useEffect(() => {
         selectedKey && document.querySelector(`[data-route="${selectedKey}"]`)?.scrollIntoView({
-            behavior: "smooth",
-            block: "center"
+            behavior: "smooth", block: "center"
         });
     }, [selectedKey]);
 
-    return (
-        <List dense={true} sx={{overflow: "scroll"}}>
-            {itemMenu.map((itemArr, index) => (
-                <Fragment key={index}>
-                    {itemArr.map((item) =>
-                        <Fragment key={item.key}>
-                            {(user?.permissions?.includes(item.permission) || item.permission === "all") &&
-                                <SidebarListItem
-                                    item={item}
-                                    dispatch={dispatch}
-                                    handleDrawerToggle={handleDrawerToggle}
-                                />}
-                        </Fragment>
-                    )}
+    return (<List dense={true} sx={{overflow: "scroll", p: 0}}>
+            {itemMenu.map((itemArr, index) => (<Fragment key={index}>
+                    {itemArr.map((item) => <Fragment key={item.key}>
+                        {(user?.permissions?.includes(item.permission) || item.permission === "all") && <SidebarListItem
+                            item={item}
+                            dispatch={dispatch}
+                            handleDrawerToggle={handleDrawerToggle}
+                        />}
+                    </Fragment>)}
                     <Divider/>
-                </Fragment>
-            ))}
+                </Fragment>))}
         </List>
 
     );