/ src / utils / usePageVisibility.js
usePageVisibility.js
 1  import { useEffect, useRef } from 'preact/hooks';
 2  
 3  export default function usePageVisibility(fn = () => {}, deps = []) {
 4    const savedCallback = useRef(fn);
 5    useEffect(() => {
 6      savedCallback.current = fn;
 7    }, [deps]);
 8  
 9    useEffect(() => {
10      const handleVisibilityChange = () => {
11        const hidden = document.hidden || document.visibilityState === 'hidden';
12        console.log('👀 Page visibility changed', hidden ? 'hidden' : 'visible');
13        savedCallback.current(!hidden);
14      };
15  
16      document.addEventListener('visibilitychange', handleVisibilityChange);
17      return () =>
18        document.removeEventListener('visibilitychange', handleVisibilityChange);
19    }, []);
20  }