@effect-app/vue 4.0.0-beta.98 → 4.0.0

package/src/internal/tanstackQuery.ts

@@ -0,0 +1,308 @@
+import { injectRegistry } from "@effect/atom-vue"
+import { QueryClient, useQuery as useTanstackQuery } from "@tanstack/vue-query"
+import { DataDependencies, makeQueryKey, type Req } from "effect-app/client"
+import type { RequestHandlerWithInput } from "effect-app/client/clientFor"
+import { CauseException, ServiceUnavailableError } from "effect-app/client/errors"
+import type * as Context from "effect-app/Context"
+import * as Effect from "effect-app/Effect"
+import * as Option from "effect-app/Option"
+import * as S from "effect-app/Schema"
+import * as Cause from "effect/Cause"
+import { isHttpClientError } from "effect/http/HttpClientError"
+import * as AsyncResult from "effect/reactivity/AsyncResult"
+import * as Atom from "effect/reactivity/Atom"
+import * as Ref from "effect/Ref"
+import type * as Tracer from "effect/Tracer"
+import { computed, type MaybeRefOrGetter, shallowRef, toValue, watch, type WatchSource } from "vue"
+import { replaceEqualDeep } from "../atomQuery.ts"
+import { clearQueryReadDependencies, registerQueryInvalidationMode, setQueryReadDependencies } from "../dependencyMetadata.ts"
+import { reportRuntimeError } from "../lib.ts"
+import type { QueryInvalidator } from "../mutate.ts"
+import type { CustomDefinedInitialQueryOptions, CustomDefinedPlaceholderQueryOptions, CustomUndefinedInitialQueryOptions, CustomUseQueryOptions, MakeQuery2, QueryCacheUpdater, QueryHandle, QueryObserverResult, RefetchOptions } from "../query.ts"
+import { makeRunPromise } from "../runtime.ts"
+
+const swrToQuery = <E, A>(r: {
+  readonly error: CauseException<E> | null | undefined
+  readonly data: A | undefined
+  readonly isValidating: boolean
+}): AsyncResult.AsyncResult<A, E> => {
+  if (r.error !== undefined && r.error !== null) {
+    return AsyncResult.failureWithPrevious(
+      r.error.originalCause,
+      {
+        previous: r.data === undefined ? Option.none() : Option.some(AsyncResult.success(r.data)),
+        waiting: r.isValidating
+      }
+    )
+  }
+  if (r.data !== undefined) {
+    return AsyncResult.success<A, E>(r.data, { waiting: r.isValidating })
+  }
+
+  return AsyncResult.initial(r.isValidating)
+}
+
+const recoverCauseException = <A, E>(error: unknown): Effect.Effect<A, E> =>
+  error instanceof CauseException
+    ? Effect.failCause(error.originalCause)
+    : Effect.die(error)
+
+const isRetryable = (error: unknown) => {
+  if (error instanceof CauseException) {
+    return isHttpClientError(error.cause) || S.is(ServiceUnavailableError)(error.cause)
+  }
+  return false
+}
+
+const isInputOption = <I>(value: I | Option.Option<I> | undefined): value is Option.Option<I> => Option.isOption(value)
+
+const resolveInput = <I>(
+  arg: I | WatchSource<I> | undefined | WatchSource<Option.Option<I>>,
+  mode: "optional" | undefined
+): I | undefined => {
+  if (mode === "optional") {
+    const option = toValue(arg)
+    return isInputOption(option) && Option.isSome(option) ? option.value : undefined
+  }
+  const value = toValue(arg)
+  return isInputOption(value) ? undefined : value
+}
+
+const resolveEnabled = <I>(
+  arg: I | WatchSource<I> | undefined | WatchSource<Option.Option<I>>,
+  options: {
+    readonly mode?: "optional" | undefined
+    readonly enabled?: MaybeRefOrGetter<boolean | undefined> | undefined
+  } | undefined
+) => {
+  if (options?.mode === "optional") {
+    return computed(() => {
+      const option = toValue(arg)
+      return Option.isSome(option)
+    })
+  }
+  return computed(() => {
+    const enabled = options?.enabled
+    if (enabled === undefined) return true
+    return !!toValue(enabled)
+  })
+}
+
+type LegacyTanstackOptions<A, E, TData> =
+  & (
+    | CustomUndefinedInitialQueryOptions<A, E, TData>
+    | CustomDefinedInitialQueryOptions<A, E, TData>
+    | CustomDefinedPlaceholderQueryOptions<A, E, TData>
+    | CustomUseQueryOptions<A, E, TData>
+  )
+  & { readonly mode?: "optional" | undefined }
+
+export const makeTanstackQueryClient = () => new QueryClient()
+
+export const makeTanstackQueryInvalidator = (queryClient: QueryClient): QueryInvalidator => ({
+  invalidateAndAwait: (keys) =>
+    Effect
+      .gen(function*() {
+        const span = yield* Effect.currentParentSpan.pipe(Effect.orElseSucceed(() => undefined))
+        yield* Effect.forEach(
+          keys,
+          (queryKey) => {
+            const options = { updateMeta: { span } }
+            return Effect.promise(() => queryClient.invalidateQueries({ queryKey }, options))
+          },
+          { discard: true, concurrency: "unbounded" }
+        )
+      })
+      .pipe(Effect.orDie),
+  invalidateSoft: (keys) =>
+    Effect
+      .gen(function*() {
+        const span = yield* Effect.currentParentSpan.pipe(Effect.orElseSucceed(() => undefined))
+        yield* Effect.forEach(
+          keys,
+          (queryKey) => Effect.promise(() => queryClient.invalidateQueries({ queryKey }, { updateMeta: { span } })),
+          { discard: true, concurrency: "unbounded" }
+        )
+      })
+      .pipe(Effect.orDie)
+})
+
+const fullQueryKey = (
+  q: { readonly queryKeyProjectionHash?: string },
+  queryKey: ReadonlyArray<unknown>,
+  input: unknown
+) => q.queryKeyProjectionHash === undefined ? [...queryKey, input] : [...queryKey, q.queryKeyProjectionHash, input]
+
+export const makeTanstackQueryCacheUpdater = (queryClient: QueryClient): QueryCacheUpdater => ({
+  update: <I, A, E, R, Request extends Req, Name extends string>(
+    _registry: ReturnType<typeof injectRegistry>,
+    query: RequestHandlerWithInput<I, A, E, R, Request, Name>,
+    input: I,
+    updater: (data: NoInfer<A>) => NoInfer<A>
+  ) => {
+    const queryKey = fullQueryKey(query, makeQueryKey(query), input)
+    if (queryClient.getQueryData(queryKey) === undefined) {
+      console.warn(`Query ${query.id} has not been used yet; nothing to update`)
+      return
+    }
+    queryClient.setQueryData(queryKey, (data: A | undefined) => data === undefined ? data : updater(data))
+  }
+})
+
+export const makeTanstackQuery = <R>(
+  getRuntime: () => Context.Context<R>,
+  queryClient: QueryClient
+): MakeQuery2<R> => {
+  // Drop a query's recorded read-dependencies when tanstack evicts it from the cache, so the
+  // registry mirrors the live queries (mirrors the atom engine's `trackReadDependencies` finalizer).
+  queryClient.getQueryCache().subscribe((event) => {
+    if (event.type === "removed") clearQueryReadDependencies(event.query.queryKey)
+  })
+
+  const useQuery: MakeQuery2<R> = <I, A, E, Request extends Req, Name extends string>(
+    q: RequestHandlerWithInput<I, A, E, R, Request, Name>
+  ) =>
+  <TData = A>(
+    arg: I | WatchSource<I> | undefined | WatchSource<Option.Option<I>>,
+    options?: LegacyTanstackOptions<A, CauseException<E>, TData>
+  ) => {
+    const runPromise = makeRunPromise(getRuntime())
+    const queryKey = makeQueryKey(q)
+    const enabled = resolveEnabled(arg, options)
+    const structuralSharing = options?.structuralSharing === false ? false : replaceEqualDeep
+    const tanstackOptions = {
+      ...(options?.staleTime !== undefined ? { staleTime: options.staleTime } : {}),
+      ...(typeof options?.gcTime === "number" ? { gcTime: options.gcTime } : {}),
+      ...(options?.refetchOnWindowFocus !== undefined ? { refetchOnWindowFocus: options.refetchOnWindowFocus } : {}),
+      structuralSharing,
+      ...(options?.refetchInterval !== undefined ? { refetchInterval: options.refetchInterval } : {}),
+      ...(options?.select !== undefined ? { select: options.select } : {})
+    }
+    const resolvedQueryKey = computed(() => {
+      const input = resolveInput(arg, options?.mode)
+      return fullQueryKey(q, queryKey, input)
+    })
+    watch(
+      resolvedQueryKey,
+      (key, _, onCleanup) => onCleanup(registerQueryInvalidationMode(key, options?.invalidation ?? "await")),
+      { immediate: true }
+    )
+    const tanstack = useTanstackQuery<A, CauseException<E>, TData>({
+      ...tanstackOptions,
+      enabled,
+      throwOnError: false,
+      retry: (retryCount: number, error: unknown) => isRetryable(error) && retryCount < 5,
+      queryKey: resolvedQueryKey,
+      queryFn: (
+        { meta, signal }: {
+          readonly meta?: { readonly span?: Tracer.AnySpan | undefined } | undefined
+          readonly signal: AbortSignal
+        }
+      ) =>
+        runPromise(
+          Effect.gen(function*() {
+            const input = resolveInput(arg, options?.mode)!
+            // Record the repository/server read-dependencies seen while fetching, keyed by the
+            // tanstack queryKey, so a later mutation whose writes intersect them derives this query
+            // as an invalidation target (the tanstack invalidator invalidates by this same key).
+            const readsRef = yield* Ref.make(DataDependencies.empty())
+            const writesRef = yield* Ref.make(DataDependencies.empty())
+            const recorder = DataDependencies.makeDataDependencyRecorder(readsRef, writesRef)
+            const result = yield* q
+              .handler(input)
+              .pipe(
+                Effect.provideService(DataDependencies.DataDependencyRecorder, recorder),
+                Effect.tapCauseIf(Cause.hasDies, (cause) => reportRuntimeError(cause)),
+                Effect.withSpan(`query ${q.id}`, {}, { captureStackTrace: false }),
+                meta?.span === undefined
+                  ? (effect) => effect
+                  : Effect.withParentSpan(meta.span, { captureStackTrace: false })
+              )
+            setQueryReadDependencies(fullQueryKey(q, queryKey, input), yield* Ref.get(readsRef))
+            return result
+          }),
+          { signal }
+        )
+    }, queryClient)
+
+    const latestSuccess = shallowRef<TData>()
+    const result = computed((): AsyncResult.AsyncResult<TData, E> =>
+      swrToQuery({
+        error: tanstack.error.value,
+        data: tanstack.data.value === undefined ? latestSuccess.value : tanstack.data.value,
+        isValidating: tanstack.isFetching.value
+      })
+    )
+    watch(result, (value) => latestSuccess.value = Option.getOrUndefined(AsyncResult.value(value)), { immediate: true })
+    const seedLatestSuccess = (data: TData) => {
+      if (latestSuccess.value === undefined) {
+        latestSuccess.value = data
+      }
+    }
+
+    const registry = injectRegistry()
+    const latestSuccessRef = computed(() => latestSuccess.value)
+    const atom = computed<Atom.Atom<AsyncResult.AsyncResult<TData, E>>>(() => Atom.readable(() => result.value))
+
+    const awaitResult = (): Effect.Effect<TData, E> =>
+      Effect
+        .tryPromise({
+          try: async () => {
+            const queryResult = await tanstack.suspense()
+            const data = queryResult.data
+            if (data === undefined) {
+              throw new Error("TanStack query resolved without data")
+            }
+            seedLatestSuccess(data)
+            return data
+          },
+          catch: (error) => error
+        })
+        .pipe(
+          Effect.catch((error) => recoverCauseException<TData, E>(error))
+        )
+
+    const refetch = (): Effect.Effect<TData, E> =>
+      Effect.gen(function*() {
+        const span = yield* Effect.currentParentSpan.pipe(Effect.orElseSucceed(() => undefined))
+        return yield* Effect
+          .tryPromise({
+            try: async () => {
+              const options = { throwOnError: true, updateMeta: { span } }
+              const queryResult = await tanstack.refetch(options)
+              const data = queryResult.data
+              if (data === undefined) {
+                throw new Error("TanStack query refetched without data")
+              }
+              return data
+            },
+            catch: (error) => error
+          })
+          .pipe(
+            Effect.catch((error) => recoverCauseException<TData, E>(error))
+          )
+      })
+
+    const handle: QueryHandle<TData, E> = {
+      awaitResult,
+      refetch,
+      refresh: () => {
+        void tanstack.refetch()
+      },
+      registry,
+      atom
+    }
+
+    const fetch = (_options?: RefetchOptions): Effect.Effect<QueryObserverResult<TData, CauseException<E>>> =>
+      refetch().pipe(Effect.exit, Effect.map(AsyncResult.fromExit))
+
+    return [
+      result,
+      latestSuccessRef,
+      fetch,
+      handle
+    ] as const
+  }
+
+  return useQuery
+}

package/src/intl.ts

@@ -1,6 +1,6 @@
-import { Context } from "effect-app"
+import * as Context from "effect-app/Context"
 import { accessCn, accessFn } from "effect-app/Context"
-import { type MakeIntlReturn } from "./makeIntl.js"
+import { type MakeIntlReturn } from "./makeIntl.ts"
 
 type I18nShape = ReturnType<MakeIntlReturn<string>["useIntl"]>
 

package/src/lib.ts

@@ -1,12 +1,13 @@
 import { type Pausable, useIntervalFn, type UseIntervalFnOptions } from "@vueuse/core"
-import { Cause, type Effect, pipe } from "effect-app"
-import { type Req } from "effect-app/client"
-import type { ClientForOptions, RequestHandler, RequestHandlerWithInput } from "effect-app/client/clientFor"
-import { isHttpClientError } from "effect/unstable/http/HttpClientError"
-import type { MaybeRefOrGetter } from "vue"
-import { reportError } from "./errorReporter.js"
+import type { Req } from "effect-app/client"
+import type { RequestHandlerWithInput } from "effect-app/client/clientFor"
+import type * as Effect from "effect-app/Effect"
+import * as Cause from "effect/Cause"
+import { isHttpClientError } from "effect/http/HttpClientError"
+import { isProxy, isReactive, isRef, type MaybeRefOrGetter, toRaw } from "vue"
+import { reportError } from "./errorReporter.ts"
 
-export * as AsyncResult from "effect/unstable/reactivity/AsyncResult"
+export * as AsyncResult from "effect/reactivity/AsyncResult"
 
 const reportRuntimeError_ = reportError("Runtime")
 
@@ -31,15 +32,7 @@ const determineLevel = (cause: Cause.Cause<unknown>) => {
 export const reportRuntimeError = (cause: Cause.Cause<unknown>, extras?: Record<string, unknown>) =>
   reportRuntimeError_(cause, extras, determineLevel(cause))
 
-// $Project/$Configuration.Index
-// -> "$Project", "$Configuration", "Index"
-export const makeQueryKey = ({ id, options }: { id: string; options?: ClientForOptions }) =>
-  pipe(
-    id.split("/"),
-    (split) => split.filter((_) => !options || !options?.skipQueryKey?.includes(_)).map((_) => "$" + _)
-  )
-    .join(".")
-    .split(".")
+export { makeQueryKey } from "effect-app/client"
 
 export function pauseWhileProcessing(
   iv: Pausable,
@@ -75,13 +68,48 @@ export const mapHandler: {
     self: RequestHandlerWithInput<I, A, E, R, Request, Name>,
     map: (handler: (i: I) => Effect.Effect<A, E, R>) => (i: I) => Effect.Effect<A2, E2, R2>
   ): RequestHandlerWithInput<I, A2, E2, R2, Request, Name>
-  <E, A, R, E2, A2, R2, Request extends Req, Name extends string>(
-    self: RequestHandler<A, E, R, Request, Name>,
-    map: (handler: Effect.Effect<A, E, R>) => Effect.Effect<A2, E2, R2>
-  ): RequestHandler<A2, E2, R2, Request, Name>
 } = (self: any, map: any): any => ({
   ...self,
-  handler: typeof self.handler === "function"
-    ? (i: any) => map(self.handler as (i: any) => Effect.Effect<any, any, any>)(i)
-    : map(self.handler)
+  handler: (i: any) => map(self.handler as (i: any) => Effect.Effect<any, any, any>)(i)
 })
+
+export function deepToRaw<T>(sourceObj: T): T {
+  const objectIterator = (input: any): any => {
+    if (isRef(input)) {
+      return objectIterator(input.value)
+    }
+
+    const rawInput = isReactive(input) || isProxy(input)
+      ? toRaw(input)
+      : input
+
+    if (Array.isArray(rawInput)) {
+      return rawInput.map((item) => objectIterator(item))
+    }
+
+    if (rawInput instanceof Map) {
+      return new Map(
+        Array.from(rawInput.entries(), ([key, value]) => [objectIterator(key), objectIterator(value)])
+      )
+    }
+
+    if (rawInput instanceof Set) {
+      return new Set(Array.from(rawInput.values(), (value) => objectIterator(value)))
+    }
+
+    if (rawInput instanceof Date) {
+      return new Date(rawInput)
+    }
+
+    if (rawInput && typeof rawInput === "object") {
+      return Object.keys(rawInput).reduce((acc, key) => {
+        acc[key] = objectIterator(rawInput[key])
+        return acc
+      }, {} as Record<string, unknown>)
+    }
+
+    return rawInput
+  }
+
+  return objectIterator(sourceObj)
+}

package/src/liveQueryInvalidation.ts

@@ -0,0 +1,138 @@
+import { DataDependencies } from "effect-app/client"
+import * as Hash from "effect/Hash"
+
+export interface LiveQueryOptions {
+  /** Fixed maximum delay from the first matching write. Zero reacts immediately. */
+  readonly maxDelayMs?: number
+}
+
+export interface LiveQueryInvalidationSource {
+  /** Resolve only after events received after this point can no longer be missed. */
+  readonly ready: () => Promise<void>
+  readonly subscribe: (
+    onWrites: (writes: DataDependencies.DataDependencies) => void,
+    onReset: () => void
+  ) => () => void
+  readonly invalidate: (keys: ReadonlyArray<ReadonlyArray<unknown>>) => void
+}
+
+interface LiveQueryEntry {
+  readonly key: ReadonlyArray<unknown>
+  readonly reads: () => DataDependencies.DataDependencies
+  observers: number
+  readonly delays: Map<number, number>
+  timer: ReturnType<typeof setTimeout> | undefined
+}
+
+const entries = new Map<number, LiveQueryEntry>()
+let source: LiveQueryInvalidationSource | undefined
+let unsubscribe: (() => void) | undefined
+let discovering = 0
+let bufferedWrites = DataDependencies.empty()
+
+const invalidateEntry = (entry: LiveQueryEntry) => {
+  entry.timer = undefined
+  source?.invalidate([entry.key])
+}
+
+const schedule = (entry: LiveQueryEntry) => {
+  if (entry.timer !== undefined) return
+  const maxDelayMs = Math.min(...entry.delays.keys())
+  if (maxDelayMs <= 0) return invalidateEntry(entry)
+  entry.timer = setTimeout(() => invalidateEntry(entry), maxDelayMs)
+}
+
+const dispatch = (writes: DataDependencies.DataDependencies) => {
+  if (!DataDependencies.isNonEmpty(writes)) return
+  for (const entry of entries.values()) {
+    if (DataDependencies.intersects(entry.reads(), writes)) schedule(entry)
+  }
+}
+
+const receive = (writes: DataDependencies.DataDependencies) => {
+  if (discovering > 0) {
+    bufferedWrites = DataDependencies.merge(bufferedWrites, writes)
+    return
+  }
+  dispatch(writes)
+}
+
+const reset = () => {
+  bufferedWrites = DataDependencies.empty()
+  for (const entry of entries.values()) {
+    if (DataDependencies.isNonEmpty(entry.reads())) schedule(entry)
+  }
+}
+
+const ensureSubscribed = () => {
+  if (unsubscribe === undefined && source !== undefined && entries.size > 0) {
+    unsubscribe = source.subscribe(receive, reset)
+  }
+}
+
+export const configureLiveQueryInvalidation = (next: LiveQueryInvalidationSource) => {
+  unsubscribe?.()
+  unsubscribe = undefined
+  source = next
+  ensureSubscribed()
+}
+
+export const registerLiveQuery = (
+  key: ReadonlyArray<unknown>,
+  reads: () => DataDependencies.DataDependencies,
+  options: LiveQueryOptions
+) => {
+  const hash = Hash.hash(key)
+  const delay = options.maxDelayMs ?? 0
+  const current = entries.get(hash)
+  if (current !== undefined) {
+    current.observers++
+    current.delays.set(delay, (current.delays.get(delay) ?? 0) + 1)
+  } else {
+    entries.set(hash, {
+      key,
+      reads,
+      observers: 1,
+      delays: new Map([[delay, 1]]),
+      timer: undefined
+    })
+  }
+  ensureSubscribed()
+
+  return () => {
+    const entry = entries.get(hash)
+    if (entry === undefined) return
+    const delayObservers = entry.delays.get(delay) ?? 0
+    if (delayObservers <= 1) entry.delays.delete(delay)
+    else entry.delays.set(delay, delayObservers - 1)
+    if (--entry.observers > 0) return
+    if (entry.timer !== undefined) clearTimeout(entry.timer)
+    entries.delete(hash)
+    if (entries.size === 0) {
+      unsubscribe?.()
+      unsubscribe = undefined
+      bufferedWrites = DataDependencies.empty()
+    }
+  }
+}
+
+export const beginLiveQueryFetch = async (key: ReadonlyArray<unknown>) => {
+  if (!entries.has(Hash.hash(key)) || source === undefined) return false
+  discovering++
+  try {
+    await source.ready()
+    return true
+  } catch (error) {
+    discovering--
+    throw error
+  }
+}
+
+export const endLiveQueryFetch = (wasLive: boolean) => {
+  if (!wasLive) return
+  discovering = Math.max(0, discovering - 1)
+  if (discovering > 0 || !DataDependencies.isNonEmpty(bufferedWrites)) return
+  const writes = bufferedWrites
+  bufferedWrites = DataDependencies.empty()
+  dispatch(writes)
+}