github.com/turbot/steampipe@v1.7.0-rc.0.0.20240517123944-7cef272d4458/ui/dashboard/src/hooks/useMediaQuery.ts (about)

     1  import { useEffect, useState } from "react";
     2  
     3  const useMediaQuery = (query) => {
     4    let mediaQuery;
     5    if (
     6      typeof window !== "undefined" &&
     7      typeof window.matchMedia !== "undefined"
     8    ) {
     9      mediaQuery = window.matchMedia(query);
    10    }
    11  
    12    const [match, setMatch] = useState(mediaQuery ? !!mediaQuery.matches : false);
    13  
    14    useEffect(() => {
    15      if (!mediaQuery) {
    16        return;
    17      }
    18      const handler = () => setMatch(!!mediaQuery.matches);
    19      mediaQuery.addEventListener("change", handler);
    20      return () => mediaQuery.removeEventListener("change", handler);
    21    }, [mediaQuery]);
    22  
    23    return match;
    24  };
    25  
    26  export default useMediaQuery;