Component scope

packages/effect-components/src/ReactComponent.ts

@@ -1,24 +1,30 @@
-import { Effect, Runtime, type Scope } from "effect"
+import { Effect, ExecutionStrategy, Exit, Ref, Runtime, Scope } from "effect"
 import * as React from "react"
+import * as ReactHook from "./ReactHook.js"
 
 
 export interface ReactComponent<P, E, R> {
     (props: P): Effect.Effect<React.ReactNode, E, R | Scope.Scope>
 }
 
+
 export const use = <P, E, R>(
     self: ReactComponent<P, E, R>,
     fn: (Component: React.FC<P>) => React.ReactNode,
-): Effect.Effect<React.ReactNode, never, R | Scope.Scope> => Effect.map(
+    options?: ReactHook.ScopeOptions,
+): Effect.Effect<React.ReactNode, never, Exclude<R, Scope.Scope>> => Effect.map(
     Effect.runtime(),
-    runtime => fn(props => Runtime.runSync(runtime)(self(props))),
+    runtime => fn(props =>
+        Runtime.runSync(runtime)(Effect.provideService(self(props), Scope.Scope, useScope(runtime, options)))
+    ),
 )
 
 export const useFC = <P, E, R>(
-    self: ReactComponent<P, E, R>
+    self: ReactComponent<P, E, R>,
+    options?: ReactHook.ScopeOptions,
 ): Effect.Effect<React.FC<P>, never, R | Scope.Scope> => Effect.map(
     Effect.runtime(),
-    runtime => props => Runtime.runSync(runtime)(self(props)),
+    runtime => props => Runtime.runSync(runtime)(Effect.provideService(self(props), Scope.Scope, useScope(runtime, options))),
 )
 
 export const createElement = <P, E, R>(
@@ -34,6 +40,45 @@ export const createElement = <P, E, R>(
     ),
 )
 
-export const useScope: Effect.Effect<void> = Effect.gen(function*() {
 
+const useScope = (
+    runtime: Runtime.Runtime<never>,
+    options?: ReactHook.ScopeOptions,
+): Scope.Scope => {
+    const [isInitialRun, initialScope] = React.useMemo(() => Runtime.runSync(runtime)(
+        Effect.all([Ref.make(true), makeScope(options)])
+    ), [])
+    const [scope, setScope] = React.useState(initialScope)
+
+    React.useEffect(() => Runtime.runSync(runtime)(
+        Effect.if(isInitialRun, {
+            onTrue: () => Effect.as(
+                Ref.set(isInitialRun, false),
+                () => closeScope(scope, runtime, options),
+            ),
+
+            onFalse: () => makeScope(options).pipe(
+                Effect.tap(scope => Effect.sync(() => setScope(scope))),
+                Effect.map(scope => () => closeScope(scope, runtime, options)),
+            ),
         })
+    ), [])
+
+    return scope
+}
+
+const makeScope = (options?: ReactHook.ScopeOptions) => Scope.make(options?.finalizerExecutionStrategy ?? ExecutionStrategy.sequential)
+const closeScope = (
+    scope: Scope.CloseableScope,
+    runtime: Runtime.Runtime<never>,
+    options?: ReactHook.ScopeOptions,
+) => {
+    switch (options?.finalizerExecutionMode ?? "sync") {
+        case "sync":
+            Runtime.runSync(runtime)(Scope.close(scope, Exit.void))
+            break
+        case "fork":
+            Runtime.runFork(runtime)(Scope.close(scope, Exit.void))
+            break
+    }
+}

packages/effect-components/src/index.ts

@@ -1,3 +1,2 @@
-export * from "./hooks.js"
 export * as ReactComponent from "./ReactComponent.js"
-export { use, useFC, createElement } from "./ReactComponent.js"
+export * as ReactHook from "./ReactHook.js"