diff --git a/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarListItems.jsx b/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarListItems.jsx
index 05ee6df..533d2b8 100644
--- a/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarListItems.jsx
+++ b/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarListItems.jsx
@@ -8,7 +8,7 @@ const SidebarListItems = ({ menuItem, dispatch }) => {
         <>
             <ListItem disablePadding divider>
                 <ListItemButton
-                    sx={{ py: 1, px: 0.5 }}
+                    sx={{ p: 0.5 }}
                     disableGutters
                     selected={menuItem.selected}
                     component={menuItem.type === "page" ? Link : null}
diff --git a/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarMenu.jsx b/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarMenu.jsx
index 0a3026c..a745929 100644
--- a/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarMenu.jsx
+++ b/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarMenu.jsx
@@ -26,60 +26,53 @@ function selectPage(item, route) {
     return item;
 }
 
+function toggleSubitems(items, actionId) {
+    return items.map((item) =>
+        actionId === item.id
+            ? { ...item, showSubitems: !item.showSubitems }
+            : { ...item, showSubitems: false }
+    );
+}
+
 function reducer(state, action) {
     switch (action.type) {
         case "UPDATE_MENU":
             const _permissions = action.permissions || [];
-            const filteredPageMenu = filterMenuItems(state, ["all", ..._permissions]);
-            return filteredPageMenu;
+            return filterMenuItems(state, ["all", ..._permissions]);
+
         case "COLLAPSE_MENU":
-            return state.map((item) =>
-                action.id == item.id
-                    ? {
-                        ...item,
-                        showSubitems: !item.showSubitems,
-                    }
-                    : item,
-            );
+            return state.map((item) => ({
+                ...item,
+                showSubitems: item.id === action.id ? !item.showSubitems : false,
+            }));
+
         case "COLLAPSE_SUB_ITEMS":
-            return state.map((item) => {
-                return item.hasSubitems
+            return state.map((item) =>
+                item.hasSubitems
+                    ? { ...item, Subitems: toggleSubitems(item.Subitems, action.id) }
+                    : item
+            );
+
+        case "COLLAPSE_SUB_SECOND_ITEMS":
+            return state.map((item) =>
+                item.hasSubitems
                     ? {
                         ...item,
                         Subitems: item.Subitems.map((subitem) =>
-                            action.id === subitem.id
+                            subitem.hasSubitems
                                 ? {
                                     ...subitem,
-                                    showSubitems: !subitem.showSubitems,
-                                }
-                                : subitem,
-                        ),
-                    }
-                    : item;
-            });
-        case "COLLAPSE_SUB_SECOND_ITEMS":
-            return state.map((item) => {
-                return item.hasSubitems
-                    ? {
-                        ...item,
-                        Subitems: item.Subitems.map((subitem) => {
-                            return subitem.hasSubitems
-                                ? {
-                                    ...subitem,
-                                    Subitems: subitem.Subitems.map((secondSubitem) =>
-                                        action.id === secondSubitem.id
-                                            ? {
-                                                ...secondSubitem,
-                                                showSubitems: !secondSubitem.showSubitems,
-                                            }
-                                            : secondSubitem,
+                                    Subitems: toggleSubitems(
+                                        subitem.Subitems,
+                                        action.id
                                     ),
                                 }
-                                : subitem;
-                        }),
+                                : subitem
+                        ),
                     }
-                    : item;
-            });
+                    : item
+            );
+
         case "SELECTED":
             return state.map((item) => selectPage(item, action.route));
 
diff --git a/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarSubitems.jsx b/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarSubitems.jsx
index 69418ea..e539394 100644
--- a/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarSubitems.jsx
+++ b/src/components/layouts/dashboard/headerWithSidebar/Sidebar/SidebarSubitems.jsx
@@ -8,7 +8,7 @@ const SidebarSubitems = ({ subitem, dispatch }) => {
             <ListItem disablePadding divider>
                 <ListItemButton
                     disableGutters
-                    sx={{ py: 1, px: 0.5, pl: 1 }}
+                    sx={{ p: 0.5, pl: 1 }}
                     selected={subitem.selected}
                     component={subitem.type === "page" ? Link : null}
                     href={subitem.type === "page" ? subitem.route : null}