slanted-gamedev-toolz/lib/cardDecks/hooks/useResponsiveDesign.js

A slanted mix of tools for your brilliant ideas in game design.

import { useEffect, useState } from "react";
export const useResponsiveDesign = () => {
    const [windowSize, setWindowSize] = useState({
        width: window.innerWidth,
        height: window.innerHeight,
    });
    const updateWindowSize = () => {
        setWindowSize({
            width: window.innerWidth,
            height: window.innerHeight,
        });
    };
    useEffect(() => {
        window.addEventListener("resize", updateWindowSize);
        return () => {
            window.removeEventListener("resize", updateWindowSize);
        };
    }, []);
    return { windowSize };
};