размер / размеры элемента div наблюдателя с использованием useRef и события изменения размера окна (React Hook)

Question

Я пытаюсь постоянно наблюдать / определять размер элемента div с помощью React Hook JS. Я использовал разные способы, но каждый раз вижу общую проблему, когда уменьшение размера окна не меняет ref.current.offsetWidth, а увеличивает его, меняет значение ref.current.offsetWidth.

Вот мой код:

function Chart({}) {
    const targetRef = useRef(null);
    const [dimensions, setDimensions] = useState({width: 0, height: 0});

    const updateDimensions = debounce(() => {
        if(targetRef.current) {
            setDimensions({
                width: targetRef.current.offsetWidth,
                height: targetRef.current.offsetHeight
            });
        }
    }, 50);

    useEffect(() => {
        updateDimensions();
    }, []);

    useEffect(() => {
        window.addEventListener("resize", updateDimensions);
        updateDimensions();
        return () => {
            window.removeEventListener("resize", updateDimensions);
        };
    }, []);

    return (
        <div style={{minHeight: 250}} ref={targetRef}>
           <some svg component/>
        </div>

    );
}

Примечание: Повторный рендеринг всего приложения обновит размеры, но я не хочу обновлять sh всю страницу, чтобы получить нужный размер.