add more hooks

web/src/components/ui/grid/examples.txt

@@ -1,11 +0,0 @@
-https://react-grid-layout.github.io/react-grid-layout/examples/20-resizable-handles.html
-
-https://gridstackjs.com/demo/nested.html#
-
-
-
-
-
-https://strml.github.io/react-resizable/examples/1.html
-
-https://bokuweb.github.io/re-resizable/?path=/story/multiple--horizontal

web/src/hooks/index.ts

@@ -22,3 +22,4 @@ export * from './useScroll';
 export * from './useUpdateEffect';
 export * from './useWhyDidYouUpdate';
 export * from './useSetInterval';
+export * from './useWindowWidth';

web/src/hooks/useWindowWidth.ts

@@ -0,0 +1,22 @@
+import { useState, useEffect } from 'react';
+
+export const useWindowWidth = () => {
+  const [isMobile, setIsMobile] = useState(false);
+
+  useEffect(() => {
+    const checkWidth = () => {
+      setIsMobile(window.innerWidth < 900);
+    };
+
+    // Initial check
+    checkWidth();
+
+    // Add event listener
+    window.addEventListener('resize', checkWidth);
+
+    // Cleanup
+    return () => window.removeEventListener('resize', checkWidth);
+  }, []);
+
+  return isMobile;
+};