@effect-app/vue 4.0.0-beta.15 → 4.0.0-beta.151

package/src/{experimental/makeUseCommand.ts → makeUseCommand.ts}

@@ -12,15 +12,15 @@ export interface CommanderResolved<RT, RTHooks>
 export const makeUseCommand = Effect.fnUntraced(
   function*<R = never, RTHooks = never>(rtHooks: Layer.Layer<RTHooks, never, R>) {
     const cmndr = yield* Commander
-    const runtime = yield* Effect.services<R>()
+    const runtime = yield* Effect.context<R>()
 
     const comm = cmndr(runtime, rtHooks)
 
-    const command = {
+    const command: CommanderResolved<R, RTHooks> = {
       ...comm,
       ...CommanderStatic
     }
 
-    return command as CommanderResolved<R, RTHooks>
+    return command
   }
 )

package/src/query.ts

@@ -3,15 +3,16 @@
 /* eslint-disable @typescript-eslint/no-unsafe-return */
 /* eslint-disable @typescript-eslint/no-unsafe-assignment */
 import { type DefaultError, type Enabled, type InitialDataFunction, type NonUndefinedGuard, type PlaceholderDataFunction, type QueryKey, type QueryObserverOptions, type QueryObserverResult, type RefetchOptions, useQuery as useTanstackQuery, useQueryClient, type UseQueryDefinedReturnType, type UseQueryReturnType } from "@tanstack/vue-query"
-import { Array, Cause, Effect, Exit, flow, Option, S, type ServiceMap } from "effect-app"
+import { Array, Cause, type Context, Effect, Option, S } from "effect-app"
 import { type Req } from "effect-app/client"
 import type { RequestHandler, RequestHandlerWithInput } from "effect-app/client/clientFor"
-import { ServiceUnavailableError } from "effect-app/client/errors"
+import { CauseException, ServiceUnavailableError } from "effect-app/client/errors"
 import { type Span } from "effect/Tracer"
 import { isHttpClientError } from "effect/unstable/http/HttpClientError"
 import * as AsyncResult from "effect/unstable/reactivity/AsyncResult"
 import { computed, type ComputedRef, type MaybeRefOrGetter, ref, shallowRef, watch, type WatchSource } from "vue"
 import { makeQueryKey, reportRuntimeError } from "./lib.js"
+import { makeRunPromise } from "./runtime.js"
 
 // we must use interface extends, or we get the dreaded typescript error of isn't portable blabla @tanstack/vue-query/build/modern/types.js
 // but because how they are dealing with some extends clause, we loose all properties except initialData
@@ -74,15 +75,7 @@ export interface CustomDefinedPlaceholderQueryOptions<
     | PlaceholderDataFunction<NonFunctionGuard<TQueryData>, TError, NonFunctionGuard<TQueryData>, TQueryKey>
 }
 
-export class KnownFiberFailure<E> extends Error {
-  readonly error: unknown
-  constructor(public effectCause: Cause.Cause<E>) {
-    super("Query failed with cause: " + Cause.squash(effectCause))
-    this.error = Cause.squash(effectCause)
-  }
-}
-
-export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
+export const makeQuery = <R>(getRuntime: () => Context.Context<R>) => {
   const useQuery_: {
     <I, A, E, Request extends Req, Name extends string>(
       q:
@@ -95,8 +88,8 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
       ): readonly [
         ComputedRef<AsyncResult.AsyncResult<TData, E>>,
         ComputedRef<TData | undefined>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>, never, never>,
-        UseQueryDefinedReturnType<TData, KnownFiberFailure<E>>
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>, never, never>,
+        UseQueryDefinedReturnType<TData, CauseException<E>>
       ]
 
       <TData = A>(
@@ -105,8 +98,8 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
       ): readonly [
         ComputedRef<AsyncResult.AsyncResult<TData, E>>,
         ComputedRef<TData>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>, never, never>,
-        UseQueryDefinedReturnType<TData, KnownFiberFailure<E>>
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>, never, never>,
+        UseQueryDefinedReturnType<TData, CauseException<E>>
       ]
 
       <TData = A>(
@@ -115,8 +108,8 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
       ): readonly [
         ComputedRef<AsyncResult.AsyncResult<TData, E>>,
         ComputedRef<TData>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>, never, never>,
-        UseQueryDefinedReturnType<TData, KnownFiberFailure<E>>
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>, never, never>,
+        UseQueryDefinedReturnType<TData, CauseException<E>>
       ]
     }
   } = <I, A, E, Request extends Req, Name extends string>(
@@ -130,34 +123,39 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
     options?: any
     // TODO
   ) => {
-    // we wrap into KnownFiberFailure because we want to keep the full cause of the failure.
-    const runPromise = flow(Effect.runPromiseExitWith(getRuntime()), (_) =>
-      _.then(
-        Exit.match({
-          onFailure: (cause) => Promise.reject(new KnownFiberFailure(cause)),
-          onSuccess: (value) => Promise.resolve(value)
-        })
-      ))
+    // we wrap into CauseException because we want to keep the full cause of the failure.
+    const runPromise = makeRunPromise(getRuntime())
     const arr = arg
     const req: { value: I } = !arg
-      ? undefined
+      ? undefined as any
       : typeof arr === "function"
       ? ({
         get value() {
           return (arr as any)()
         }
-      } as any)
+      })
       : ref(arg)
     const queryKey = makeQueryKey(q)
     const handler = q.handler
 
-    const r = useTanstackQuery<A, KnownFiberFailure<E>, TData>(
+    const defaultOptions = {
+      // we do not want to throw errors, because we turn the success and error responses into a Result type
+      // why don't we turn the error/success response into a Result type before returning to tanstack query? because we want to leverage tanstack query's retry and caching mechanism, which relies on throwing errors to trigger retries, and we don't want to interfere with that by catching the errors too early.
+      // but if we allow tanstack query to throw, it will trigger the error boundary in Vue - via a "watcher callback" error - which we currently report and log, which is not what we want.
+      // TODO: we might want to rethink the strategy of how to handle errors that happen after the initial load.
+      // For suspense, the initial load is captured by the suspense boundary.
+      // For subsequent loads (or non suspense use) we currently are required to use the QueryResult component to conditionally render error/loading/etc.
+      throwOnError: false
+    }
+
+    const r = useTanstackQuery<A, CauseException<E>, TData>(
       Effect.isEffect(handler)
         ? {
+          ...defaultOptions,
           ...options,
           retry: (retryCount, error) => {
-            if (error instanceof KnownFiberFailure) {
-              if (!isHttpClientError(error.error) && !S.is(ServiceUnavailableError)(error.error)) {
+            if (error instanceof CauseException) {
+              if (!isHttpClientError(error.cause) && !S.is(ServiceUnavailableError)(error.cause)) {
                 return false
               }
             }
@@ -177,10 +175,11 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
             )
         }
         : {
+          ...defaultOptions,
           ...options,
           retry: (retryCount, error) => {
-            if (error instanceof KnownFiberFailure) {
-              if (!isHttpClientError(error.error) && !S.is(ServiceUnavailableError)(error.error)) {
+            if (error instanceof CauseException) {
+              if (!isHttpClientError(error.cause) && !S.is(ServiceUnavailableError)(error.cause)) {
                 return false
               }
             }
@@ -228,13 +227,13 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
   }
 
   function swrToQuery<E, A>(r: {
-    error: KnownFiberFailure<E> | undefined
+    error: CauseException<E> | undefined
     data: A | undefined
     isValidating: boolean
   }): AsyncResult.AsyncResult<A, E> {
     if (r.error !== undefined) {
       return AsyncResult.failureWithPrevious(
-        r.error.effectCause,
+        r.error.originalCause,
         {
           previous: r.data === undefined ? Option.none() : Option.some(AsyncResult.success(r.data)),
           waiting: r.isValidating
@@ -261,11 +260,11 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
        * Effect results are passed to the caller, including errors.
        */
       <TData = A>(
-        options: CustomDefinedInitialQueryOptions<A, KnownFiberFailure<E>, TData>
+        options: CustomDefinedInitialQueryOptions<A, CauseException<E>, TData>
       ): readonly [
         ComputedRef<AsyncResult.AsyncResult<TData, E>>,
         ComputedRef<TData>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>>,
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>>,
         UseQueryReturnType<any, any>
       ]
       <TData = A>(
@@ -273,17 +272,17 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
       ): readonly [
         ComputedRef<AsyncResult.AsyncResult<TData, E>>,
         ComputedRef<TData>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>, never, never>,
-        UseQueryDefinedReturnType<TData, KnownFiberFailure<E>>
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>, never, never>,
+        UseQueryDefinedReturnType<TData, CauseException<E>>
       ]
       // optional options, optional A
       /**
        * Effect results are passed to the caller, including errors.
        */
-      <TData = A>(options?: CustomUndefinedInitialQueryOptions<A, KnownFiberFailure<E>, TData>): readonly [
+      <TData = A>(options?: CustomUndefinedInitialQueryOptions<A, CauseException<E>, TData>): readonly [
         ComputedRef<AsyncResult.AsyncResult<A, E>>,
         ComputedRef<A | undefined>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>>,
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>>,
         UseQueryReturnType<any, any>
       ]
     }
@@ -300,11 +299,11 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
        */
       <TData = A>(
         arg: Arg | WatchSource<Arg>,
-        options: CustomDefinedInitialQueryOptions<A, KnownFiberFailure<E>, TData>
+        options: CustomDefinedInitialQueryOptions<A, CauseException<E>, TData>
       ): readonly [
         ComputedRef<AsyncResult.AsyncResult<TData, E>>,
         ComputedRef<TData>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>>,
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>>,
         UseQueryReturnType<any, any>
       ]
       // required options, with placeholderData
@@ -313,11 +312,11 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
        */
       <TData = A>(
         arg: Arg | WatchSource<Arg>,
-        options: CustomDefinedPlaceholderQueryOptions<A, KnownFiberFailure<E>, TData>
+        options: CustomDefinedPlaceholderQueryOptions<A, CauseException<E>, TData>
       ): readonly [
         ComputedRef<AsyncResult.AsyncResult<TData, E>>,
         ComputedRef<TData>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>>,
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>>,
         UseQueryReturnType<any, any>
       ]
       // optional options, optional A
@@ -326,11 +325,11 @@ export const makeQuery = <R>(getRuntime: () => ServiceMap.ServiceMap<R>) => {
        */
       <TData = A>(
         arg: Arg | WatchSource<Arg>,
-        options?: CustomUndefinedInitialQueryOptions<A, KnownFiberFailure<E>, TData>
+        options?: CustomUndefinedInitialQueryOptions<A, CauseException<E>, TData>
       ): readonly [
         ComputedRef<AsyncResult.AsyncResult<TData, E>>,
         ComputedRef<TData | undefined>,
-        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, KnownFiberFailure<E>>>,
+        (options?: RefetchOptions) => Effect.Effect<QueryObserverResult<TData, CauseException<E>>>,
         UseQueryReturnType<any, any>
       ]
     }

package/src/runtime.ts

@@ -1,24 +1,24 @@
-import { ManagedRuntime } from "effect"
+import { Exit, flow, ManagedRuntime } from "effect"
 import { Effect, Layer, Logger } from "effect-app"
+import { CauseException } from "effect-app/client/errors"
+import { type Context } from "effect-app/Context"
 
-export function makeAppRuntime<A, E>(layer: Layer.Layer<A, E>) {
-  return Effect.gen(function*() {
-    const l = layer.pipe(
-      Layer.provide(Logger.layer([Logger.consolePretty()]))
-    ) as Layer.Layer<A, never>
-    const mrt = ManagedRuntime.make(l)
-    yield* mrt.servicesEffect
-    return Object.assign(mrt, {
-      [Symbol.dispose]() {
-        return Effect.runSync(mrt.disposeEffect)
-      },
+export const makeAppRuntime = Effect.fnUntraced(function*<A, E>(layer: Layer.Layer<A, E>) {
+  const l = layer.pipe(
+    Layer.provide(Logger.layer([Logger.consolePretty()]))
+  ) as Layer.Layer<A, never>
+  const mrt = ManagedRuntime.make(l)
+  yield* mrt.contextEffect
+  return Object.assign(mrt, {
+    [Symbol.dispose]() {
+      return Effect.runSync(mrt.disposeEffect)
+    },
 
-      [Symbol.asyncDispose]() {
-        return mrt.dispose()
-      }
-    }) // as we initialise here, there is no more error left.
-  })
-}
+    [Symbol.asyncDispose]() {
+      return mrt.dispose()
+    }
+  }) // as we initialise here, there is no more error left.
+})
 
 export function initializeSync<A, E>(layer: Layer.Layer<A, E, never>) {
   const runtime = Effect.runSync(makeAppRuntime(layer))
@@ -29,3 +29,24 @@ export function initializeAsync<A, E>(layer: Layer.Layer<A, E, never>) {
   return Effect
     .runPromise(makeAppRuntime(layer))
 }
+
+// we wrap into CauseException because we want to keep the full cause of the failure.
+export const makeRunPromise = <T>(services: Context<T>) =>
+  flow(Effect.runPromiseExitWith(services), (_) =>
+    _.then(
+      Exit.match({
+        onFailure: (cause) => Promise.reject(new CauseException(cause, "runPromise")),
+        onSuccess: (value) => Promise.resolve(value)
+      })
+    ))
+
+export const makeRunSync = <T>(services: Context<T>) =>
+  flow(
+    Effect.runSyncExitWith(services),
+    Exit.match({
+      onFailure: (cause) => {
+        throw new CauseException(cause, "runSync")
+      },
+      onSuccess: (value) => value
+    })
+  )

package/src/{experimental/toast.ts → toast.ts}

@@ -1,5 +1,5 @@
-import { Effect, Option, ServiceMap } from "effect-app"
-import { proxify } from "effect-app/ServiceMap"
+import { Context, Effect, Option } from "effect-app"
+import { accessEffectFn } from "effect-app/Context"
 
 export type ToastId = string | number
 export type ToastOpts = { id?: ToastId; timeout?: number }
@@ -13,7 +13,7 @@ export type UseToast = () => {
   dismiss: (this: void, id: ToastId) => void
 }
 
-export class CurrentToastId extends ServiceMap.Opaque<CurrentToastId, { toastId: ToastId }>()("CurrentToastId") {}
+export class CurrentToastId extends Context.Opaque<CurrentToastId, { toastId: ToastId }>()("CurrentToastId") {}
 
 /** fallback to CurrentToastId when available unless id is explicitly set to a value or null */
 export const wrap = (toast: ReturnType<UseToast>) => {
@@ -41,26 +41,12 @@ export const wrap = (toast: ReturnType<UseToast>) => {
   }
 }
 
-export class Toast
-  extends proxify(ServiceMap.Opaque<Toast, ReturnType<typeof wrap>>()("Toast"))<Toast, ReturnType<typeof wrap>>()
-{
-}
-
-// const a = Layer.effect(Toast, Effect.sync(() => Toast.of(null as any)))
-
-// const A = Toast.of({
-//   error: () => Effect.succeed(null as any),
-//   info: () => Effect.succeed(null as any),
-//   success: () => Effect.succeed(null as any),
-//   warning: () => Effect.succeed(null as any),
-//   dismiss: () => Effect.succeed(null as any)
-// })
+type ToastShape = ReturnType<typeof wrap>
 
-// const b = Toast.info("test")
-
-// const a2 = Toast.use((_) => _.error("test"))
-
-// const b2 = Effect.gen(function*() {
-//   const toast = yield* Toast
-//   toast.error("test")
-// })
+export class Toast extends Context.Opaque<Toast, ToastShape>()("Toast") {
+  static readonly error = accessEffectFn(this, "error")
+  static readonly info = accessEffectFn(this, "info")
+  static readonly success = accessEffectFn(this, "success")
+  static readonly warning = accessEffectFn(this, "warning")
+  static readonly dismiss = accessEffectFn(this, "dismiss")
+}

package/src/{experimental/withToast.ts → withToast.ts}

@@ -1,10 +1,11 @@
-import { Cause, Effect, Layer, type Option, ServiceMap } from "effect-app"
+import { Cause, Context, Effect, Layer, type Option } from "effect-app"
 import { wrapEffect } from "effect-app/utils"
 import { CurrentToastId, Toast } from "./toast.js"
 
 export interface ToastOptions<A, E, Args extends ReadonlyArray<unknown>, WaiR, SucR, ErrR> {
   stableToastId?: undefined | string | ((...args: Args) => string | undefined)
   timeout?: number
+  showSpanInfo?: false
   onWaiting:
     | string
     | ((...args: Args) => string | null)
@@ -33,10 +34,10 @@ export interface ToastOptions<A, E, Args extends ReadonlyArray<unknown>, WaiR, S
 }
 
 // @effect-diagnostics-next-line missingEffectServiceDependency:off
-export class WithToast extends ServiceMap.Service<WithToast>()("WithToast", {
+export class WithToast extends Context.Service<WithToast>()("WithToast", {
   make: Effect.gen(function*() {
     const toast = yield* Toast
-    return <A, E, Args extends Array<unknown>, R, WaiR = never, SucR = never, ErrR = never>(
+    return <A, E, Args extends readonly unknown[], R, WaiR = never, SucR = never, ErrR = never>(
       options: ToastOptions<A, E, Args, WaiR, SucR, ErrR>
     ) =>
       Effect.fnUntraced(function*(self: Effect.Effect<A, E, R>, ...args: Args) {
@@ -74,15 +75,23 @@ export class WithToast extends ServiceMap.Service<WithToast>()("WithToast", {
               return
             }
 
+            const spanInfo = options.showSpanInfo !== false
+              ? yield* Effect.currentSpan.pipe(
+                Effect.map((span) => `\nTrace: ${span.traceId}\nSpan: ${span.spanId}`),
+                Effect.orElseSucceed(() => "")
+              )
+              : ""
+
             const t = yield* wrapEffect(options.onFailure)(Cause.findErrorOption(cause), ...args)
             const opts = { timeout: baseTimeout * 2 }
 
             if (typeof t === "object") {
+              const message = t.message + spanInfo
               return t.level === "warn"
-                ? yield* toast.warning(t.message, toastId !== undefined ? { ...opts, id: toastId } : opts)
-                : yield* toast.error(t.message, toastId !== undefined ? { ...opts, id: toastId } : opts)
+                ? yield* toast.warning(message, toastId !== undefined ? { ...opts, id: toastId } : opts)
+                : yield* toast.error(message, toastId !== undefined ? { ...opts, id: toastId } : opts)
             }
-            yield* toast.error(t, toastId !== undefined ? { ...opts, id: toastId } : opts)
+            yield* toast.error(t + spanInfo, toastId !== undefined ? { ...opts, id: toastId } : opts)
           }, Effect.uninterruptible)),
           toastId !== undefined ? Effect.provideService(CurrentToastId, CurrentToastId.of({ toastId })) : (_) => _
         )

package/test/Mutation.test.ts

@@ -1,7 +1,8 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { it } from "@effect/vitest"
 import { Cause, Effect, Exit, Fiber, Option } from "effect-app"
-import { CommandContext, DefaultIntl } from "../src/experimental/commander.js"
+import { OperationFailure } from "effect-app/Operations"
+import { CommandContext, DefaultIntl } from "../src/commander.js"
 import { AsyncResult } from "../src/lib.js"
 import { useExperimental } from "./stubs.js"
 
@@ -71,7 +72,10 @@ describe("alt2", () => {
               expect(yield* Effect.currentSpan.pipe(Effect.map((_) => _.name))).toBe("Test Action")
             })),
             Effect.tap(() =>
-              Effect.currentSpan.pipe(Effect.map((_) => _.name), Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action"))))
+              Effect.currentSpan.pipe(
+                Effect.map((_) => _.name),
+                Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action")))
+              )
             ),
             Effect.tap(() => Effect.sync(() => executed = true))
           )
@@ -125,7 +129,10 @@ it.live("works", () =>
           expect(yield* Effect.currentSpan.pipe(Effect.map((_) => _.name))).toBe("Test Action")
         })),
         Effect.tap(() =>
-          Effect.currentSpan.pipe(Effect.map((_) => _.name), Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action"))))
+          Effect.currentSpan.pipe(
+            Effect.map((_) => _.name),
+            Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action")))
+          )
         ),
         Effect.tap(() => Effect.sync(() => executed = true))
       )
@@ -175,7 +182,10 @@ it.live("works non-gen", () =>
           expect(yield* Effect.currentSpan.pipe(Effect.map((_) => _.name))).toBe("Test Action")
         })),
         Effect.tap(() =>
-          Effect.currentSpan.pipe(Effect.map((_) => _.name), Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action"))))
+          Effect.currentSpan.pipe(
+            Effect.map((_) => _.name),
+            Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action")))
+          )
         ),
         Effect.tap(() => Effect.sync(() => executed = true))
       )
@@ -317,7 +327,10 @@ it.live("with toasts", () =>
           expect(yield* Effect.currentSpan.pipe(Effect.map((_) => _.name))).toBe("Test Action")
         })),
         Effect.tap(() =>
-          Effect.currentSpan.pipe(Effect.map((_) => _.name), Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action"))))
+          Effect.currentSpan.pipe(
+            Effect.map((_) => _.name),
+            Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action")))
+          )
         ),
         // WithToast.handle({
         //   onFailure: "failed",
@@ -388,9 +401,55 @@ it.live("fail", () =>
       expect(command.waiting).toBe(false)
       expect(Exit.isFailure(AsyncResult.toExit(command.result))).toBe(true)
       expect(toasts.length).toBe(1) // toast should show error
+      expect(toasts[0].type).toBe("warning")
+      expect(toasts[0].message).toContain("Test Action Failed:\nBoom!")
+      expect(toasts[0].message).toMatch(/Trace: [a-f0-9]{32}/)
+      expect(toasts[0].message).toMatch(/Span: [a-f0-9]{16}/)
+    }))
+
+it.live("fail with showSpanInfo disabled", () =>
+  Effect
+    .gen(function*() {
+      const toasts: any[] = []
+      const Command = useExperimental({ toasts, messages: DefaultIntl.en })
+
+      const command = Command.fn("Test Action")(
+        function*() {
+          return yield* Effect.fail({ message: "Boom!" })
+        },
+        Command.withDefaultToast({ showSpanInfo: false })
+      )
+
+      yield* Fiber.join(command.handle())
+
+      expect(toasts.length).toBe(1)
       expect(toasts[0].message).toBe("Test Action Failed:\nBoom!")
     }))
 
+it.live("fail with custom errorRenderer uses warning toast", () =>
+  Effect
+    .gen(function*() {
+      const toasts: any[] = []
+      const Command = useExperimental({ toasts, messages: DefaultIntl.en })
+
+      const command = Command.fn("Test Action")(
+        function*() {
+          return yield* Effect.fail(OperationFailure.make({ message: null }))
+        },
+        Command.withDefaultToast({
+          errorRenderer: () => "Rendered Boom!"
+        })
+      )
+
+      yield* Fiber.join(command.handle())
+
+      expect(toasts.length).toBe(1)
+      expect(toasts[0].type).toBe("warning")
+      expect(toasts[0].message).toContain("Test Action, with warnings\nRendered Boom!")
+      expect(toasts[0].message).toMatch(/Trace: [a-f0-9]{32}/)
+      expect(toasts[0].message).toMatch(/Span: [a-f0-9]{16}/)
+    }))
+
 it.live("fail and recover", () =>
   Effect
     .gen(function*() {
@@ -444,7 +503,8 @@ it.live("defect", () =>
       expect(command.waiting).toBe(false)
       expect(Exit.isFailure(AsyncResult.toExit(command.result))).toBe(true)
       expect(toasts.length).toBe(1) // toast should show error
-      expect(toasts[0].message).toBe("Test Action unexpected error, please try again shortly.")
+      expect(toasts[0].type).toBe("error")
+      expect(toasts[0].message).toContain("Test Action unexpected error, please try again shortly.")
     }))
 
 it.live("works with alt", () =>
@@ -471,7 +531,10 @@ it.live("works with alt", () =>
             expect(yield* Effect.currentSpan.pipe(Effect.map((_) => _.name))).toBe("Test Action")
           })),
           Effect.tap(() =>
-            Effect.currentSpan.pipe(Effect.map((_) => _.name), Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action"))))
+            Effect.currentSpan.pipe(
+              Effect.map((_) => _.name),
+              Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action")))
+            )
           ),
           Effect.tap(() => Effect.sync(() => executed = true))
         )
@@ -624,7 +687,10 @@ it.live("with toasts with alt", () =>
             expect(yield* Effect.currentSpan.pipe(Effect.map((_) => _.name))).toBe("Test Action")
           })),
           Effect.tap(() =>
-            Effect.currentSpan.pipe(Effect.map((_) => _.name), Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action"))))
+            Effect.currentSpan.pipe(
+              Effect.map((_) => _.name),
+              Effect.tap((_) => Effect.sync(() => expect(_).toBe("Test Action")))
+            )
           ),
           Command.withDefaultToast(),
           Effect.tap(() => Effect.sync(() => executed = true))
@@ -696,7 +762,8 @@ it.live("fail with alt", () =>
       expect(command.waiting).toBe(false)
       expect(Exit.isFailure(AsyncResult.toExit(command.result))).toBe(true)
       expect(toasts.length).toBe(1) // toast should show error
-      expect(toasts[0].message).toBe("Test Action Failed:\nBoom!")
+      expect(toasts[0].type).toBe("warning")
+      expect(toasts[0].message).toContain("Test Action Failed:\nBoom!")
     }))
 
 it.live("fail and recover with alt", () =>
@@ -756,5 +823,58 @@ it.live("defect with alt", () =>
       expect(command.waiting).toBe(false)
       expect(Exit.isFailure(AsyncResult.toExit(command.result))).toBe(true)
       expect(toasts.length).toBe(1) // toast should show error
-      expect(toasts[0].message).toBe("Test Action unexpected error, please try again shortly.")
+      expect(toasts[0].type).toBe("error")
+      expect(toasts[0].message).toContain("Test Action unexpected error, please try again shortly.")
     }))
+
+describe("state-in-toast", () => {
+  it("works", () => {
+    const toasts: any[] = []
+    const removeMutation = Object.assign(
+      Effect.fn(function*(_item: string) {
+        yield* Effect.sleep(1000)
+      }),
+      { id: "remove_thing" }
+    )
+
+    const item = "x"
+
+    const Command = useExperimental({ toasts, messages: DefaultIntl.en })
+
+    Command.fn(removeMutation, {
+      state: () => ({ item }),
+      waitKey: (id) => `${id}.${item}`,
+      blockKey: () => `modify_thing.${item}`
+      //  allowed: () => role.value === "admin"
+    })(
+      function*() {
+        //        yield* Command.confirmOrInterrupt(yield* I18n.formatMessage({ id: "confirm.remove_item" }, { item }))
+        yield* removeMutation(item)
+      },
+      Command.withDefaultToast({
+        onSuccess: (a, b, c, d) => {
+          console.log("Success", { a, b, c, d })
+          expectTypeOf(d.state).toEqualTypeOf<{ readonly item: "x" }>()
+        }
+      })
+    )
+
+    Command.fn(removeMutation, {
+      state: () => ({ item }),
+      waitKey: (id) => `${id}.${item}`,
+      blockKey: () => `modify_thing.${item}`
+      //  allowed: () => role.value === "admin"
+    })(
+      function*() {
+        //        yield* Command.confirmOrInterrupt(yield* I18n.formatMessage({ id: "confirm.remove_item" }, { item }))
+        yield* removeMutation(item)
+      },
+      Command.withDefaultToast({
+        onSuccess: (a, b, c) => {
+          console.log("Success", { a, b, c })
+          expectTypeOf(c).toEqualTypeOf<undefined>()
+        }
+      })
+    )
+  })
+})

package/test/dist/form.test.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form.test.d.ts","sourceRoot":"","sources":["../form.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,CAAC,EAAE,MAAM,YAAY,CAAA;;;;;;;;;;;;;;;;;AAGtC,qBAAa,YAAa,SAAQ,iBAShC;CAAG;;;;AAEL,qBAAa,mBAAoB,SAAQ,wBAEvC;CAAG;;;;;;;;;;;AAEL,qBAAa,WAAY,SAAQ,gBAK/B;CAAG;;;;;;;;AAEL,cAAM,MAAO,SAAQ,WAEnB;CAAG;;;;;;;;AAEL,cAAM,MAAO,SAAQ,WAEnB;CAAG;;;;;;;;;;;AAEL,cAAM,QAAS,SAAQ,aAGrB;CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBL,qBAAa,cAAe,SAAQ,mBAGlC;CAAG"}
+{"version":3,"file":"form.test.d.ts","sourceRoot":"","sources":["../form.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,CAAC,EAAE,MAAM,YAAY,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGtC,qBAAa,YAAa,SAAQ,iBAahC;CAAG;;;;AAEL,qBAAa,mBAAoB,SAAQ,wBAEvC;CAAG;;;;;;;;;;;;AAEL,qBAAa,WAAY,SAAQ,gBAK/B;CAAG;;;;;;;;;;;;;;;;;;;;;;;;AAEL,cAAM,MAAO,SAAQ,WAEnB;CAAG;;;;;;;;;;;;;;;;;;;;;;;;AAEL,cAAM,MAAO,SAAQ,WAEnB;CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEL,cAAM,QAAS,SAAQ,aAGrB;CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBL,qBAAa,cAAe,SAAQ,mBAGlC;CAAG"}