Refactor sidebar toggle functionality to support independent left and right UI states; update related components and styles for improved usability

app/src/store/useUIToggleStore.ts

@@ -1,13 +1,17 @@
 import { create } from "zustand";
 
 interface ToggleState {
-  toggleUI: boolean; // State to track UI toggle
-  setToggleUI: (value: boolean) => void; // Action to update toggleUI
+  toggleUILeft: boolean;
+  toggleUIRight: boolean;
+  setToggleUI: (value1: boolean, value2: boolean) => void;
 }
 
 const useToggleStore = create<ToggleState>((set) => ({
-  toggleUI: true, // Initial state
-  setToggleUI: (value: boolean) => set({ toggleUI: value }), // Update the state
+  toggleUILeft: true,
+  toggleUIRight: false,
+  setToggleUI: (value1: boolean, value2: boolean) => {
+    set({ toggleUILeft: value1, toggleUIRight: value2 });
+  },
 }));
 
 export default useToggleStore;