diff --git a/src/hooks/useWindowDimensions.ts b/src/hooks/useWindowDimensions.ts new file mode 100644 index 0000000..21daa13 --- /dev/null +++ b/src/hooks/useWindowDimensions.ts @@ -0,0 +1,26 @@ +import { useState, useEffect } from 'react'; + +//https://stackoverflow.com/questions/36862334/get-viewport-window-height-in-reactjs + +function getWindowDimensions() { + const { innerWidth: width, innerHeight: height } = window; + return { + width, + height + }; +} + +export default function useWindowDimensions() { + const [windowDimensions, setWindowDimensions] = useState(getWindowDimensions()); + + useEffect(() => { + function handleResize() { + setWindowDimensions(getWindowDimensions()); + } + + window.addEventListener('resize', handleResize); + return () => window.removeEventListener('resize', handleResize); + }, []); + + return windowDimensions; +}