Add Lens.useFromState

packages/effect-fc/src/Lens.ts

@@ -3,6 +3,7 @@ import { Lens } from "effect-lens"
 import * as React from "react"
 import * as Component from "./Component.js"
 import * as SetStateAction from "./SetStateAction.js"
+import * as SubscriptionRef from "./SubscriptionRef.js"
 
 
 export declare namespace useState {
@@ -35,4 +36,28 @@ export const useState = Effect.fnUntraced(function* <A, ER, EW, RR, RW>(
     return [reactStateValue, setValue]
 })
 
+export declare namespace useFromState {
+    export interface Options<A> {
+        readonly equivalence?: Equivalence.Equivalence<A>
+    }
+}
+
+export const useFromState = Effect.fnUntraced(function* <A>(
+    [value, setValue]: readonly [A, React.Dispatch<React.SetStateAction<A>>],
+    options?: useFromState.Options<NoInfer<A>>,
+): Effect.fn.Return<Lens.Lens<A, never, never, never, never>> {
+    const lens = yield* Component.useOnMount(() => Effect.map(
+        SubscriptionRef.make(value),
+        Lens.fromSubscriptionRef,
+    ))
+
+    yield* Component.useReactEffect(() => Effect.forkScoped(Stream.runForEach(
+        Stream.changesWith(lens.changes, options?.equivalence ?? Equivalence.strict()),
+        v => Effect.sync(() => setValue(v)),
+    )), [setValue])
+    yield* Component.useReactEffect(() => Lens.set(lens, value), [value])
+
+    return lens
+})
+
 export * from "effect-lens/Lens"