feat(Sidebar): Refactoring sidebar menu with feature and permissions abilities control.

src/hooks/state/dashboard.js

@@ -1,9 +1,14 @@
 import { useCallback } from 'react';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
+import { createSelector } from 'reselect';
 import {
   splashStopLoading,
   splashStartLoading,
   dashboardPageTitle,
+  openSidebarSubmenu,
+  closeSidebarSubmenu,
+  openDialog,
+  closeDialog,
 } from '../../store/dashboard/dashboard.actions';
 
 export const useDispatchAction = (action) => {
@@ -30,3 +35,44 @@ export const useSplashLoading = () => {
     useDispatchAction(splashStopLoading),
   ];
 };
+
+/**
+ * Sidebar submenu actions.
+ */
+export const useSidebarSubmnuActions = () => {
+  return {
+    openSidebarSubmenu: useDispatchAction(openSidebarSubmenu),
+    closeSidebarSubmenu: useDispatchAction(closeSidebarSubmenu),
+    toggleSidebarSubmenu: useDispatchAction(openSidebarSubmenu),
+  };
+};
+
+/**
+ * Retrieves the sidebar submenu selector.
+ */
+const sidebarSubmenuSelector = createSelector(
+  (state) => state.dashboard.sidebarSubmenu,
+  (sidebarSubmenu) => sidebarSubmenu,
+);
+
+/**
+ * Retrieves the sidebar submenu selector.
+ */
+export const useSidebarSubmenu = () => {
+  const sidebarSubmenu = useSelector(sidebarSubmenuSelector);
+
+  return {
+    isOpen: sidebarSubmenu?.isOpen || false,
+    submenuId: sidebarSubmenu?.submenuId || null,
+  };
+};
+
+/**
+ * Dialogs actions.
+ */
+export const useDialogActions = () => {
+  return {
+    openDialog: useDispatchAction(openDialog),
+    closeDialog: useDispatchAction(closeDialog),
+  };
+};