From 8db3bead13441a5882d8689dfc6a9f09c82375d9 Mon Sep 17 00:00:00 2001 From: Maze Winther Date: Wed, 25 Mar 2026 16:47:22 +0100 Subject: feat: masks, properties refactor, shaders, storage migrations, and more --- apps/web/src/hooks/use-container-size.ts | 24 +++++++----------------- 1 file changed, 7 insertions(+), 17 deletions(-) (limited to 'apps/web/src/hooks/use-container-size.ts') diff --git a/apps/web/src/hooks/use-container-size.ts b/apps/web/src/hooks/use-container-size.ts index 8b46f20e..6f6f89be 100644 --- a/apps/web/src/hooks/use-container-size.ts +++ b/apps/web/src/hooks/use-container-size.ts @@ -1,4 +1,5 @@ -import { useEffect, useState } from "react"; +import { useCallback, useState } from "react"; +import { useResizeObserver } from "./use-resize-observer"; export function useContainerSize({ containerRef, @@ -7,23 +8,12 @@ export function useContainerSize({ }) { const [size, setSize] = useState({ width: 0, height: 0 }); - useEffect(() => { - const container = containerRef.current; - if (!container) return; + const onResize = useCallback((entry: ResizeObserverEntry) => { + const { width, height } = entry.contentRect; + setSize({ width, height }); + }, []); - const observer = new ResizeObserver((entries) => { - for (const entry of entries) { - const { width, height } = entry.contentRect; - setSize({ width, height }); - } - }); - - observer.observe(container); - - return () => { - observer.disconnect(); - }; - }, [containerRef]); + useResizeObserver({ ref: containerRef, onResize }); return size; } -- cgit v1.3.1