@effect-app/vue 4.0.0-beta.33 → 4.0.0-beta.331

package/src/queryLifetime.ts

@@ -0,0 +1,74 @@
+import type * as AsyncResult from "effect/unstable/reactivity/AsyncResult"
+import * as Atom from "effect/unstable/reactivity/Atom"
+
+/**
+ * Per-query observer count + invalidation flag. Lives on the family atom so
+ * invalidate can mark stale and refetch only when someone is looking
+ * (TanStack refetchType: "active").
+ */
+export interface QueryLifetime {
+  observers: number
+  invalidated: boolean
+}
+
+const lifetimes = new WeakMap<Atom.Atom<any>, QueryLifetime>()
+
+const rootOf = (atom: Atom.Atom<any>): Atom.Atom<any> => {
+  let target = atom
+  while (target.initialValueTarget !== undefined) {
+    target = target.initialValueTarget
+  }
+  return target
+}
+
+export const queryLifetimeOf = (atom: Atom.Atom<any>): QueryLifetime | undefined =>
+  lifetimes.get(rootOf(atom)) ?? lifetimes.get(atom)
+
+export const attachQueryLifetime = <A, E>(
+  atom: Atom.Atom<AsyncResult.AsyncResult<A, E>>
+): QueryLifetime => {
+  const existing = queryLifetimeOf(atom)
+  if (existing !== undefined) return existing
+  const created: QueryLifetime = { observers: 0, invalidated: false }
+  lifetimes.set(rootOf(atom), created)
+  lifetimes.set(atom, created)
+  return created
+}
+
+/**
+ * Count this subscription as an observer of `family`. On remount, consume a
+ * pending invalidation and refresh the family atom.
+ */
+export const observeQueryAtom = <A, E>(
+  family: Atom.Atom<AsyncResult.AsyncResult<A, E>>
+): Atom.Atom<AsyncResult.AsyncResult<A, E>> => {
+  const life = attachQueryLifetime(family)
+  return Atom.transform(family, (get) => {
+    life.observers++
+    get.addFinalizer(() => {
+      life.observers = Math.max(0, life.observers - 1)
+    })
+    if (life.invalidated) {
+      life.invalidated = false
+      get.refresh(family)
+    }
+    return get(family)
+  }, { initialValueTarget: family })
+}
+
+/**
+ * Idle queries with a lifetime are marked stale. Queries that still have
+ * observers (or have no lifetime, e.g. ad-hoc registry mounts of a raw
+ * effect atom) are refetched now.
+ */
+export const atomsToRefetch = <A, E>(
+  atoms: ReadonlyArray<Atom.Atom<AsyncResult.AsyncResult<A, E>>>
+): ReadonlyArray<Atom.Atom<AsyncResult.AsyncResult<A, E>>> => {
+  const active: Array<Atom.Atom<AsyncResult.AsyncResult<A, E>>> = []
+  for (const atom of atoms) {
+    const life = queryLifetimeOf(atom)
+    if (life === undefined || life.observers > 0) active.push(atom)
+    else life.invalidated = true
+  }
+  return active
+}

package/src/routeParams.ts

@@ -1,7 +1,7 @@
-import { flow } from "effect"
-import { Option, S } from "effect-app"
-import type { Schema } from "effect-app/Schema"
+import * as Option from "effect-app/Option"
+import * as S from "effect-app/Schema"
 import { typedKeysOf } from "effect-app/utils"
+import { flow } from "effect/Function"
 import type { ParsedQuery } from "query-string"
 
 export function getQueryParam(search: ParsedQuery, param: string) {
@@ -16,7 +16,7 @@ export const getQueryParamO = flow(getQueryParam, Option.fromNullishOr)
 
 export function parseRouteParamsOption<NER extends Record<string, S.Codec<any, any>>>(query: Record<string, any>, t: NER // enforce non empty
 ): {
-  [K in keyof NER]: Option.Option<Schema.Type<NER[K]>>
+  [K in keyof NER]: Option.Option<NER[K]["Type"]>
 } {
   return typedKeysOf(t).reduce(
     (prev, cur) => {
@@ -28,7 +28,7 @@ export function parseRouteParamsOption<NER extends Record<string, S.Codec<any, a
       return prev
     },
     {} as {
-      [K in keyof NER]: Option.Option<Schema.Type<NER[K]>>
+      [K in keyof NER]: Option.Option<NER[K]["Type"]>
     }
   )
 }
@@ -37,7 +37,7 @@ export function parseRouteParams<NER extends Record<string, S.Codec<any, any>>>(
   query: Record<string, any>,
   t: NER // enforce non empty
 ): {
-  [K in keyof NER]: Schema.Type<NER[K]>
+  [K in keyof NER]: NER[K]["Type"]
 } {
   return typedKeysOf(t).reduce(
     (prev, cur) => {
@@ -49,7 +49,7 @@ export function parseRouteParams<NER extends Record<string, S.Codec<any, any>>>(
       return prev
     },
     {} as {
-      [K in keyof NER]: Schema.Type<NER[K]>
+      [K in keyof NER]: NER[K]["Type"]
     }
   )
 }

package/src/runtime.ts

@@ -1,31 +1 @@
-import { ManagedRuntime } from "effect"
-import { Effect, Layer, Logger } from "effect-app"
-
-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)
-      },
-
-      [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))
-  return runtime
-}
-
-export function initializeAsync<A, E>(layer: Layer.Layer<A, E, never>) {
-  return Effect
-    .runPromise(makeAppRuntime(layer))
-}
+export * from "effect-app/runtime"

package/src/suspense.ts

@@ -0,0 +1,43 @@
+import { Effect } from "effect-app"
+import * as AsyncResult from "effect/unstable/reactivity/AsyncResult"
+import { computed, type ComputedRef, nextTick } from "vue"
+
+/**
+ * The always-defined `data` ref behind a resolved suspense query.
+ *
+ * A reactive arg can re-point the view at a DIFFERENT cache atom after the suspense promise
+ * resolved; the fresh atom starts `Initial` (no `previousSuccess` carried over), so the raw data
+ * briefly reads `undefined` while it fetches. The suspense contract ("after the await there is
+ * always a value") is kept by serving the last defined value across that transition — TanStack's
+ * keepPreviousData, which Vue needs because it cannot re-suspend after mount. Waiting/failure of
+ * the new fetch stays observable on the view's `result` ref.
+ *
+ * Throws only if there has never been a value, which is unreachable once the suspense await
+ * resolved successfully.
+ */
+export const latestDefined = <TData>(source: () => TData | undefined, label: string): ComputedRef<TData> => {
+  let last: TData | undefined
+  return computed<TData>(() => {
+    const latest = source()
+    if (latest !== undefined) {
+      last = latest
+      return latest
+    }
+    if (last !== undefined) return last
+    throw new Error(`Internal Error: ${label} resolved without a latest value`)
+  })
+}
+
+export const awaitResolvedSuspenseResult = <A, E>(
+  resultRef: ComputedRef<AsyncResult.AsyncResult<A, E>>
+) =>
+  Effect.gen(function*() {
+    let result = resultRef.value
+
+    for (let remainingTicks = 3; remainingTicks > 0 && AsyncResult.isInitial(result); remainingTicks--) {
+      yield* Effect.promise(() => nextTick())
+      result = resultRef.value
+    }
+
+    return result
+  })

package/src/toast.ts

@@ -0,0 +1 @@
+export * from "effect-app/toast"

package/src/withToast.ts

@@ -0,0 +1 @@
+export * from "effect-app/withToast"

package/test/Mutation.test.ts

@@ -1,9 +1,14 @@
 /* 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 * as Effect from "effect-app/Effect"
+import * as Option from "effect-app/Option"
+import * as Cause from "effect/Cause"
+import * as Exit from "effect/Exit"
+import * as Fiber from "effect/Fiber"
+import { TestClock } from "effect/testing"
+import { CommandContext, DefaultIntl } from "../src/commander.js"
 import { AsyncResult } from "../src/lib.js"
-import { useExperimental } from "./stubs.js"
+import { useExperimental, useExperimentalE } from "./stubs.js"
 
 const unwrap = <A, E>(r: Fiber.Fiber<Exit.Exit<A, E>, never>) => Fiber.join(r).pipe(Effect.flatten)
 
@@ -71,7 +76,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 +133,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 +186,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))
       )
@@ -308,8 +322,8 @@ it.live("with toasts", () =>
         function*() {
           expect(yield* Effect.currentSpan.pipe(Effect.map((_) => _.name))).toBe("Test Action")
 
-          expect(toasts.length).toBe(1)
-          expect(toasts[0].message).toBe("Test Action executing...")
+          // fast actions complete before the 1s waiting-toast delay, so no waiting toast is shown
+          expect(toasts.length).toBe(0)
 
           return "test-value"
         },
@@ -317,7 +331,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",
@@ -346,7 +363,7 @@ it.live("interrupted", () =>
 
       const command = Command.fn("Test Action")(
         function*() {
-          expect(toasts.length).toBe(1)
+          expect(toasts.length).toBe(0)
           yield* Effect.interrupt
           return "test-value"
         },
@@ -373,7 +390,7 @@ it.live("fail", () =>
 
       const command = Command.fn("Test Action")(
         function*() {
-          expect(toasts.length).toBe(1)
+          expect(toasts.length).toBe(0)
           return yield* Effect.fail({ message: "Boom!" })
         },
         Command.withDefaultToast(),
@@ -388,9 +405,30 @@ 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].message).toBe("Test Action Failed:\nBoom!")
+      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 and recover", () =>
   Effect
     .gen(function*() {
@@ -400,7 +438,7 @@ it.live("fail and recover", () =>
 
       const command = Command.fn("Test Action")(
         function*() {
-          expect(toasts.length).toBe(1)
+          expect(toasts.length).toBe(0)
           return yield* Effect.fail({ message: "Boom!" })
         },
         Effect.orElseSucceed(() => "recovered"), // we recover from the error here, so the final result is success
@@ -428,7 +466,7 @@ it.live("defect", () =>
 
       const command = Command.fn("Test Action")(
         function*() {
-          expect(toasts.length).toBe(1)
+          expect(toasts.length).toBe(0)
           return yield* Effect.die({ message: "Boom!" })
         },
         Command.withDefaultToast(),
@@ -444,7 +482,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 +510,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))
         )
@@ -615,8 +657,8 @@ it.live("with toasts with alt", () =>
           function*() {
             expect(yield* Effect.currentSpan.pipe(Effect.map((_) => _.name))).toBe("Test Action")
 
-            expect(toasts.length).toBe(1)
-            expect(toasts[0].message).toBe("Test Action executing...")
+            // fast actions complete before the 1s waiting-toast delay, so no waiting toast is shown
+            expect(toasts.length).toBe(0)
 
             return "test-value"
           },
@@ -624,7 +666,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))
@@ -650,7 +695,7 @@ it.live("interrupted with alt", () =>
       const command = Command.alt("Test Action")(
         Effect.fnUntraced(
           function*() {
-            expect(toasts.length).toBe(1)
+            expect(toasts.length).toBe(0)
             // @effect-diagnostics-next-line missingReturnYieldStar:off
             yield* Effect.interrupt
             return "test-value"
@@ -680,7 +725,7 @@ it.live("fail with alt", () =>
       const command = Command.alt("Test Action")(
         Effect.fnUntraced(
           function*() {
-            expect(toasts.length).toBe(1)
+            expect(toasts.length).toBe(0)
             return yield* Effect.fail({ message: "Boom!" })
           },
           Command.withDefaultToast(),
@@ -696,7 +741,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", () =>
@@ -709,7 +755,7 @@ it.live("fail and recover with alt", () =>
       const command = Command.alt("Test Action")(
         Effect.fnUntraced(
           function*() {
-            expect(toasts.length).toBe(1)
+            expect(toasts.length).toBe(0)
             return yield* Effect.fail({ message: "Boom!" })
           },
           Effect.orElseSucceed(() => "recovered"), // we recover from the error here, so the final result is success
@@ -729,6 +775,64 @@ it.live("fail and recover with alt", () =>
       expect(toasts[0].message).toBe("Test Action Success")
     }))
 
+it.effect("slow action shows waiting toast after the 1s delay", () =>
+  Effect
+    .gen(function*() {
+      const toasts: any[] = []
+      const Command = yield* useExperimentalE({ toasts, messages: DefaultIntl.en })
+
+      const command = Command.fn("Test Action")(
+        function*() {
+          // before 1s the waiting toast must NOT have surfaced yet
+          expect(toasts.length).toBe(0)
+          yield* Effect.sleep("1100 millis")
+          // after the delay window the waiting info toast should be visible
+          expect(toasts.length).toBe(1)
+          expect(toasts[0].type).toBe("info")
+          expect(toasts[0].message).toBe("Test Action executing...")
+          return "test-value"
+        },
+        Command.withDefaultToast()
+      )
+
+      const fiber = command.handle()
+      yield* TestClock.adjust("2 seconds")
+      const r = yield* unwrap(fiber)
+
+      expect(r).toBe("test-value")
+      // waiting toast is replaced (same id) with the success toast
+      expect(toasts.length).toBe(1)
+      expect(toasts[0].type).toBe("success")
+      expect(toasts[0].message).toBe("Test Action Success")
+    }))
+
+it.effect("slow failing action surfaces waiting toast then shows error", () =>
+  Effect
+    .gen(function*() {
+      const toasts: any[] = []
+      const Command = yield* useExperimentalE({ toasts, messages: DefaultIntl.en })
+
+      const command = Command.fn("Test Action")(
+        function*() {
+          expect(toasts.length).toBe(0)
+          yield* Effect.sleep("1100 millis")
+          expect(toasts.length).toBe(1)
+          expect(toasts[0].type).toBe("info")
+          return yield* Effect.fail({ message: "Boom!" })
+        },
+        Command.withDefaultToast()
+      )
+
+      const fiber = command.handle()
+      yield* TestClock.adjust("2 seconds")
+      const r = yield* Fiber.join(fiber)
+
+      expect(Exit.isFailure(r) && Cause.hasFails(r.cause)).toBe(true)
+      expect(toasts.length).toBe(1)
+      expect(toasts[0].type).toBe("warning")
+      expect(toasts[0].message).toContain("Test Action Failed:\nBoom!")
+    }))
+
 it.live("defect with alt", () =>
   Effect
     .gen(function*() {
@@ -756,5 +860,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>()
+        }
+      })
+    )
+  })
+})