Biiig changes for 2.0 :))

frontend/src/context/contextApi.jsx

@@ -1,6 +1,4 @@
-
-import { createContext, useState } from 'react';
-
+import { createContext, useState, useEffect } from 'react';
 export const Context = createContext();
 
 export const AppContext =(props) => {
@@ -8,6 +6,21 @@ export const AppContext =(props) => {
     // Left side bar global states
     const [searchBarModalOpen, setSearchBarModalOpen] = useState(false);
     const [leftSideBarOpenByClick, setLeftSideBarOpenByClick] = useState(false);
+    const [windowWidth, setWindowWidth] = useState(window.innerWidth);
+
+
+    //Calculate window width
+    useEffect(() => {
+        const handleResize = () => {
+            setWindowWidth(window?.innerWidth);
+        };
+
+        window.addEventListener('resize', handleResize);
+
+        return () => {
+            window.removeEventListener('resize', handleResize);
+        };
+    }, []);
 
 
     return (
@@ -15,7 +28,8 @@ export const AppContext =(props) => {
             searchBarModalOpen,
             setSearchBarModalOpen,
             leftSideBarOpenByClick,
-            setLeftSideBarOpenByClick
+            setLeftSideBarOpenByClick,
+            windowWidth
         }}>
             {props.children}
         </Context.Provider>