use-viewport-size.tsx

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