import { watch } from "alien-deepsignals"; import { useEffect, useRef, useState } from "react"; import { createSignalObjectForShape } from "src/ng-mock/js-land/connector/createSignalObjectForShape"; import type { Scope, Shape } from "src/ng-mock/js-land/types"; const useShape = (shape: Shape, scope: Scope) => { const shapeSignalRef = useRef>( createSignalObjectForShape(shape, scope) ); const [, setTick] = useState(0); useEffect(() => { const deepSignalObj = shapeSignalRef.current.signalObject; const { stopListening } = watch(deepSignalObj, () => { // trigger a React re-render when the deep signal updates setTick((t) => t + 1); }); return () => { shapeSignalRef.current.stop(); stopListening(); }; }, []); return shapeSignalRef.current.signalObject; }; export default useShape;