refactor: redux migration - toggle menubar

renderer/components/Sidebar/MenuBar/index.js

@@ -1,18 +1,13 @@
 import React from 'react';
 import Link from 'next/link';
 import { IconCode, IconStack, IconGitPullRequest, IconUser, IconUsers, IconSettings, IconBuilding, IconChevronsLeft} from '@tabler/icons';
-import actions from 'providers/Store/actions';
-import { useStore } from 'providers/Store';
+import { useSelector, useDispatch } from 'react-redux';
+import { toggleLeftMenuBar } from 'providers/ReduxStore/slices/app'
 import StyledWrapper from './StyledWrapper';
 
 const MenuBar = () => {
-  const [store, storeDispatch] = useStore();
-
-  const hideMenuBar = () => {
-    storeDispatch({
-      type: actions.TOGGLE_LEFT_MENUBAR
-    })
-  };
+  const leftMenuBarOpen = useSelector((state) => state.app.leftMenuBarOpen);
+  const dispatch = useDispatch();
 
   return (
     <StyledWrapper className="h-full flex flex-col">
@@ -45,7 +40,7 @@ const MenuBar = () => {
         <div className="menu-item">
           <IconSettings size={28} strokeWidth={1.5}/>
         </div>
-        <div className="menu-item" onClick={hideMenuBar}>
+        <div className="menu-item" onClick={() => dispatch(toggleLeftMenuBar())}>
           <IconChevronsLeft size={28} strokeWidth={1.5}/>
         </div>
       </div>