Restore Async

packages/effect-fc/src/Async.ts

@@ -1,5 +1,5 @@
-/** biome-ignore-all lint/complexity/noBannedTypes: {} is the default type for React props */
-import { Effect, Predicate, Runtime, Scope } from "effect"
+/** biome-ignore-all lint/complexity/useArrowFunction: necessary for class prototypes */
+import { Effect, Function, Predicate, Runtime, Scope } from "effect"
 import * as React from "react"
 import * as Component from "./Component.js"
 
@@ -7,11 +7,19 @@ import * as Component from "./Component.js"
 export const AsyncTypeId: unique symbol = Symbol.for("@effect-fc/Async/Async")
 export type AsyncTypeId = typeof AsyncTypeId
 
-export interface Async extends AsyncPrototype {}
+export interface Async extends AsyncPrototype, AsyncOptions {}
+
 export interface AsyncPrototype {
     readonly [AsyncTypeId]: AsyncTypeId
 }
 
+export interface AsyncOptions {
+    readonly defaultFallback?: React.ReactNode
+}
+
+export type AsyncProps = Omit<React.SuspenseProps, "children">
+
+
 export const AsyncPrototype: AsyncPrototype = Object.freeze({
     [AsyncTypeId]: AsyncTypeId,
 
@@ -20,9 +28,8 @@ export const AsyncPrototype: AsyncPrototype = Object.freeze({
         runtimeRef: React.RefObject<Runtime.Runtime<Exclude<R, Scope.Scope>>>,
     ) {
         const Inner = (props: { readonly promise: Promise<React.ReactNode> }) => React.use(props.promise)
-        Inner.displayName = `${ this.displayName }Inner`
 
-        return (props: P) => {
+        return ({ fallback, name, ...props }: AsyncProps) => {
             const promise = Runtime.runPromise(runtimeRef.current)(
                 Effect.andThen(
                     Component.useScope([], this),
@@ -30,7 +37,11 @@ export const AsyncPrototype: AsyncPrototype = Object.freeze({
                 )
             )
 
-            return React.createElement(Inner, { promise })
+            return React.createElement(
+                React.Suspense,
+                { fallback: fallback ?? this.defaultFallback, name },
+                React.createElement(Inner, { promise }),
+            )
         }
     },
 } as const)
@@ -40,10 +51,35 @@ export const isAsync = (u: unknown): u is Async => Predicate.hasProperty(u, Asyn
 
 export const async = <T extends Component.Component<any, any, any, any>>(
     self: T
-): T & Async => Object.setPrototypeOf(
-    Object.assign(() => {}, self),
+): (
+    & Omit<T, keyof Component.Component.AsComponent<T>>
+    & Component.Component<
+        Component.Component.Props<T> & AsyncProps,
+        Component.Component.Success<T>,
+        Component.Component.Error<T>,
+        Component.Component.Context<T>
+    >
+    & Async
+) => Object.setPrototypeOf(
+    Object.assign(function() {}, self),
     Object.freeze(Object.setPrototypeOf(
         Object.assign({}, AsyncPrototype),
         Object.getPrototypeOf(self),
     )),
 )
+
+export const withOptions: {
+    <T extends Component.Component<any, any, any, any> & Async>(
+        options: Partial<AsyncOptions>
+    ): (self: T) => T
+    <T extends Component.Component<any, any, any, any> & Async>(
+        self: T,
+        options: Partial<AsyncOptions>,
+    ): T
+} = Function.dual(2, <T extends Component.Component<any, any, any, any> & Async>(
+    self: T,
+    options: Partial<AsyncOptions>,
+): T => Object.setPrototypeOf(
+    Object.assign(function() {}, self, options),
+    Object.getPrototypeOf(self),
+))