Add under-anything knowledge dashboard

Understand-Anything-main/understand-anything-plugin/packages/dashboard/src/hooks/useIsMobile.ts

@@ -0,0 +1,21 @@
+import { useEffect, useState } from "react";
+
+const DEFAULT_BREAKPOINT = 768;
+
+export function useIsMobile(breakpoint: number = DEFAULT_BREAKPOINT): boolean {
+  const query = `(max-width: ${breakpoint - 1}px)`;
+  const [isMobile, setIsMobile] = useState<boolean>(() => {
+    if (typeof window === "undefined") return false;
+    return window.matchMedia(query).matches;
+  });
+
+  useEffect(() => {
+    const mql = window.matchMedia(query);
+    const handler = (event: MediaQueryListEvent) => setIsMobile(event.matches);
+    setIsMobile(mql.matches);
+    mql.addEventListener("change", handler);
+    return () => mql.removeEventListener("change", handler);
+  }, [query]);
+
+  return isMobile;
+}