import { useEffect, useState } from 'react';

//
// TODO: adicionar callback para toda atualização do resize useWindowSize
//
// Ao invés de atualizar o componente toda vez que houver uma atualização
//

export function useWindowSize(): { width: number; height: number } {
   const isClient = typeof window === 'object';

   function getSize(): { width: number; height: number } {
      return {
         width: isClient ? window.innerWidth : undefined,
         height: isClient ? window.innerHeight : undefined,
      };
   }

   const [windowSize, setWindowSize] = useState(getSize);

   useEffect((): any => {
      if (!isClient) {
         return false;
      }

      function handleResize(): void {
         setWindowSize(getSize());
      }

      window.addEventListener('resize', handleResize);
      return () => window.removeEventListener('resize', handleResize);
   }, []); // Empty array ensures that effect is only run on mount and unmount

   return windowSize;
}
