useViewportSize

import { useState, useEffect } from "react";
 
interface ViewportSize {
  width: number;
  height: number;
}
 
function useViewportSize(): ViewportSize {
  const [size, setSize] = useState<ViewportSize>({
    width: window.innerWidth,
    height: window.innerHeight,
  });
 
  useEffect(() => {
    const handleResize = () => {
      setSize({
        width: window.innerWidth,
        height: window.innerHeight,
      });
    };
 
    window.addEventListener("resize", handleResize);
    return () => window.removeEventListener("resize", handleResize);
  }, []);
 
  return size;
}

const { width, height } = useViewportSize(); // { width: 800, height: 600 }