31 lines
791 B
TypeScript
31 lines
791 B
TypeScript
import { type RefObject, useEffect } from "react";
|
|
import type { GraphCanvasRef } from "reagraph";
|
|
|
|
export function useCanvasResize(
|
|
containerRef: RefObject<HTMLDivElement | null>,
|
|
graphRef: RefObject<GraphCanvasRef | null>
|
|
) {
|
|
useEffect(() => {
|
|
const container = containerRef.current;
|
|
if (!container) return;
|
|
|
|
const triggerResize = () => {
|
|
if (graphRef.current) {
|
|
requestAnimationFrame(() => {
|
|
window.dispatchEvent(new Event("resize"));
|
|
});
|
|
}
|
|
};
|
|
|
|
const resizeObserver = new ResizeObserver(triggerResize);
|
|
resizeObserver.observe(container);
|
|
|
|
const timeoutId = setTimeout(triggerResize, 100);
|
|
|
|
return () => {
|
|
resizeObserver.disconnect();
|
|
clearTimeout(timeoutId);
|
|
};
|
|
}, [containerRef, graphRef]);
|
|
}
|