Portal/rsconcept/frontend/src/hooks/useWindowSize.ts

36 lines
842 B
TypeScript

'use client';
import { useCallback, useEffect, useState } from 'react';
import { PARAMETER } from '@/utils/constants';
function useWindowSize() {
const isClient = typeof window === 'object';
const getSize = useCallback(
() => ({
width: isClient ? window.innerWidth : undefined,
height: isClient ? window.innerHeight : undefined,
isSmall: isClient && window.innerWidth < PARAMETER.smallScreen
}),
[isClient]
);
const [windowSize, setWindowSize] = useState(getSize);
useEffect(() => {
if (!isClient) {
return;
}
function handleResize() {
setWindowSize(getSize());
}
window.addEventListener('resize', handleResize);
return () => window.removeEventListener('resize', handleResize);
}, [isClient, getSize]);
return windowSize;
}
export default useWindowSize;