packages/example/src/routes/tests.tsx

@@ -3,8 +3,6 @@ import { Button, Flex, Text } from "@radix-ui/themes"
 import { createFileRoute } from "@tanstack/react-router"
 import { GetRandomValues, makeUuid4 } from "@typed/id"
 import { Console, Effect, Ref } from "effect"
-import { useMemo } from "react"
-import { SubscriptionSubRef } from "reffuse/types"
 
 
 export const Route = createFileRoute("/tests")({
@@ -13,11 +11,11 @@ export const Route = createFileRoute("/tests")({
 
 function RouteComponent() {
     const deepRef = R.useRef({ value: "poulet" })
-    const deepValueRef = useMemo(() => SubscriptionSubRef.makeFromGetSet(
+    const deepValueRef = R.useSubRefFromGetSet(
         deepRef,
         b => b.value,
         (b, a) => ({ ...b, value: a }),
-    ), [deepRef])
+    )
 
     // const value = R.useMemoScoped(Effect.addFinalizer(() => Console.log("cleanup")).pipe(
     //     Effect.andThen(makeUuid4),

packages/reffuse/src/ReffuseNamespace.ts

@@ -2,7 +2,7 @@ import { type Context, Effect, ExecutionStrategy, Exit, type Fiber, type Layer,
 import * as React from "react"
 import * as ReffuseContext from "./ReffuseContext.js"
 import * as ReffuseRuntime from "./ReffuseRuntime.js"
-import { SetStateAction } from "./types/index.js"
+import { SetStateAction, SubscriptionSubRef } from "./types/index.js"
 
 
 export interface RenderOptions {
@@ -384,6 +384,18 @@ export abstract class ReffuseNamespace<R> {
         )
     }
 
+    useSubRefFromGetSet<A, B, R>(
+        this: ReffuseNamespace<R>,
+        parent: SubscriptionRef.SubscriptionRef<B>,
+        getter: (parentValue: B) => A,
+        setter: (parentValue: B, value: A) => B,
+    ): SubscriptionSubRef.SubscriptionSubRef<A, B> {
+        return React.useMemo(
+            () => SubscriptionSubRef.makeFromGetSet(parent, getter, setter),
+            [parent],
+        )
+    }
+
     useSubscribeRefs<
         const Refs extends readonly SubscriptionRef.SubscriptionRef<any>[],
         R,