prometheus

1
import { useEffect, useState } from 'react';
2

3
// A hook to determine whether a CSS media query finds any matches.
4
const useMedia = (query: string): boolean => {
5
  const mediaQuery = window.matchMedia(query);
6
  const [matches, setMatches] = useState(mediaQuery.matches);
7

8
  useEffect(() => {
9
    const handler = () => setMatches(mediaQuery.matches);
10
    mediaQuery.addEventListener('change', handler);
11
    return () => mediaQuery.removeEventListener('change', handler);
12
  }, [mediaQuery]);
13

14
  return matches;
15
};
16

17
export default useMedia;
18