Fix

packages/effect-fc/src/Form.ts

@@ -97,7 +97,7 @@ export const make: {
                 Option.isSome(value) &&
                 Option.isNone(error) &&
                 Option.isNone(validationFiber) &&
-                (Result.isRunning(submitResult) || Result.isRefreshing(submitResult))
+                !(Result.isRunning(submitResult) || Result.isRefreshing(submitResult))
             ),
         ),
     )
@@ -194,7 +194,7 @@ export const field = <A, I, R, SA, SE, SR, const P extends PropertyPath.Paths<No
         onNone: () => Effect.succeed([]),
     })),
     Subscribable.map(self.validationFiberRef, Option.isSome),
-    Subscribable.map(self.submitResultRef, flow(Result.isRunning, Result.isRefreshing)),
+    Subscribable.map(self.submitResultRef, result => Result.isRunning(result) || Result.isRefreshing(result)),
 )
 
 

packages/effect-fc/src/Result.ts

@@ -102,13 +102,14 @@ export const isSuccess = (u: unknown): u is Success<unknown> => isResult(u) && u
 export const isFailure = (u: unknown): u is Failure<unknown, unknown> => isResult(u) && u._tag === "Failure"
 export const isRefreshing = (u: unknown): u is Refreshing<unknown> => isResult(u) && Predicate.hasProperty(u, "refreshing") && u.refreshing
 
-export const initial = (): Initial => Object.setPrototypeOf({}, ResultPrototype)
-export const running = <P = never>(progress?: P): Running<P> => Object.setPrototypeOf({ progress }, ResultPrototype)
-export const succeed = <A>(value: A): Success<A> => Object.setPrototypeOf({ value }, ResultPrototype)
+export const initial = (): Initial => Object.setPrototypeOf({ _tag: "Initial" }, ResultPrototype)
+export const running = <P = never>(progress?: P): Running<P> => Object.setPrototypeOf({ _tag: "Running", progress }, ResultPrototype)
+export const succeed = <A>(value: A): Success<A> => Object.setPrototypeOf({ _tag: "Success", value }, ResultPrototype)
 export const fail = <E, A = never>(
     cause: Cause.Cause<E>,
     previousSuccess?: Success<A>,
 ): Failure<A, E> => Object.setPrototypeOf({
+    _tag: "Failure",
     cause,
     previousSuccess: Option.fromNullable(previousSuccess),
 }, ResultPrototype)
@@ -144,10 +145,11 @@ export const forkEffectScoped = <A, E, R>(
     effect: Effect.Effect<A, E, R>
 ): Effect.Effect<Queue.Dequeue<Result<A, E>>, never, Scope.Scope | R> => Queue.unbounded<Result<A, E>>().pipe(
     Effect.tap(Queue.offer(initial())),
-    Effect.tap(queue => Effect.forkScoped(Queue.offer(queue, running()).pipe(
+    Effect.tap(queue => Effect.forkScoped(Effect.addFinalizer(() => Queue.shutdown(queue)).pipe(
+        Effect.andThen(Queue.offer(queue, running())),
         Effect.andThen(effect),
         Effect.exit,
         Effect.andThen(exit => Queue.offer(queue, fromExit(exit))),
-        Effect.andThen(Queue.shutdown(queue)),
+        Effect.scoped,
     ))),
 )

packages/example/src/routes/form.tsx

@@ -1,6 +1,6 @@
-import { Button, Container, Flex } from "@radix-ui/themes"
+import { Button, Container, Flex, Text } from "@radix-ui/themes"
 import { createFileRoute } from "@tanstack/react-router"
-import { Console, Effect, Option, ParseResult, Schema } from "effect"
+import { Console, Effect, Match, Option, ParseResult, Schema } from "effect"
 import { Component, Form, Subscribable } from "effect-fc"
 import { TextFieldFormInput } from "@/lib/form/TextFieldFormInput"
 import { DateTimeUtcFromZonedInput } from "@/lib/schema"
@@ -50,7 +50,10 @@ class RegisterForm extends Effect.Service<RegisterForm>()("RegisterForm", {
 class RegisterFormView extends Component.makeUntraced("RegisterFormView")(function*() {
     const form = yield* RegisterForm
     const submit = yield* Form.useSubmit(form)
-    const [canSubmit] = yield* Subscribable.useSubscribables(form.canSubmitSubscribable)
+    const [canSubmit, submitResult] = yield* Subscribable.useSubscribables(
+        form.canSubmitSubscribable,
+        form.submitResultRef,
+    )
 
     const TextFieldFormInputFC = yield* TextFieldFormInput
 
@@ -85,6 +88,14 @@ class RegisterFormView extends Component.makeUntraced("RegisterFormView")(functi
                     <Button disabled={!canSubmit}>Submit</Button>
                 </Flex>
             </form>
+
+            {Match.value(submitResult).pipe(
+                Match.tag("Initial", () => <></>),
+                Match.tag("Running", () => <Text>Submitting...</Text>),
+                Match.tag("Success", () => <Text>Submitted successfully!</Text>),
+                Match.tag("Failure", v => <Text>Error: {v.cause.toString()}</Text>),
+                Match.exhaustive,
+            )}
         </Container>
     )
 }) {}