hooks use-mobile.ts

0% Statements 0/13

0% Branches 0/1

0% Functions 0/1

0% Lines 0/13

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import * as React from "react";
 
const MOBILE_BREAKPOINT = 768;
 
export function useIsMobile() {
  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined);
 
  React.useEffect(() => {
    const media = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
    const onChange = () => setIsMobile(media.matches);
    onChange();
    media.addEventListener("change", onChange);
    return () => media.removeEventListener("change", onChange);
  }, []);
 
  return !!isMobile;
}