@effect-app/vue 1.26.0 → 1.26.2

package/src/makeClient2.ts

@@ -1,137 +1,15 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { flow, pipe, tuple } from "@effect-app/core/Function"
-import type { MutationResult } from "@effect-app/vue"
-import { Result } from "@effect-app/vue"
 import * as Sentry from "@sentry/browser"
-import { type MaybeRefOrGetter, type Pausable, useIntervalFn, type UseIntervalFnOptions } from "@vueuse/core"
-import type { Either } from "effect-app"
-import { Array, Cause, Effect, Match, Option, Runtime, S } from "effect-app"
-import { type SupportedErrors } from "effect-app/client"
+import { Cause, Effect, Exit, Match, Option, S } from "effect-app"
 import { Failure, Success } from "effect-app/Operations"
 import { dropUndefinedT } from "effect-app/utils"
 import { computed, type ComputedRef } from "vue"
+import type { Opts, ResponseErrors } from "./makeClient.js"
 import type { MakeIntlReturn } from "./makeIntl.js"
-import type { MakeMutation2, MutationOptions } from "./mutate2.js"
-
-/**
- * Use this after handling an error yourself, still continueing on the Error track, but the error will not be reported.
- */
-export class SuppressErrors extends Cause.YieldableError {
-  readonly _tag = "SuppressErrors"
-}
-
-export type ResponseErrors = S.ParseResult.ParseError | SupportedErrors | SuppressErrors
-
-export function pauseWhileProcessing(
-  iv: Pausable,
-  pmf: () => Promise<unknown>
-) {
-  return Promise
-    .resolve(iv.pause())
-    .then(() => pmf())
-    .finally(() => iv.resume())
-}
-
-export function useIntervalPauseWhileProcessing(
-  pmf: () => Promise<unknown>,
-  interval?: MaybeRefOrGetter<number>,
-  options?: Omit<UseIntervalFnOptions, "immediateCallback">
-) {
-  const iv = useIntervalFn(
-    () => pauseWhileProcessing(iv, pmf),
-    interval,
-    options ? { ...options, immediateCallback: false } : options
-  )
-  return {
-    isActive: iv.isActive
-  }
-}
-
-export interface Opts<A> extends MutationOptions {
-  suppressErrorToast?: boolean
-  suppressSuccessToast?: boolean
-  successToast?: (a: A) => any
-}
-
-export const withSuccess: {
-  <I, E extends ResponseErrors, A, X, R>(
-    self: {
-      handler: (i: I) => Effect<A, E, R>
-      name: string
-    },
-    onSuccess: (a: A, i: I) => Promise<X>
-  ): {
-    handler: (i: I) => Effect<X, E, R>
-    name: string
-  }
-  <E extends ResponseErrors, A, X, R>(
-    self: {
-      handler: Effect<A, E, R>
-      name: string
-    },
-    onSuccess: (_: A) => Promise<X>
-  ): {
-    handler: Effect<X, E, R>
-    name: string
-  }
-} = (self: any, onSuccess: any): any => ({
-  ...self,
-  handler: typeof self.handler === "function"
-    ? (i: any) =>
-      pipe(
-        (
-          self.handler as (
-            i: any
-          ) => Effect<any, any, any>
-        )(i),
-        Effect.flatMap((_) =>
-          Effect.promise(() => onSuccess(_, i)).pipe(
-            Effect.withSpan("onSuccess")
-          )
-        )
-      )
-    : Effect.flatMap(self.handler, (_) => Effect.promise(() => onSuccess(_)).pipe(Effect.withSpan("onSuccess")))
-})
-
-export const withSuccessE: {
-  <I, E extends ResponseErrors, A, E2, X, R>(
-    self: {
-      handler: (i: I) => Effect<A, E, R>
-      name: string
-    },
-    onSuccessE: (_: A, i: I) => Effect<X, E2>
-  ): {
-    handler: (i: I) => Effect<X, E | E2, R>
-    name: string
-  }
-  <E extends ResponseErrors, A, E2, X, R>(
-    self: {
-      handler: Effect<A, E, R>
-      name: string
-    },
-    onSuccessE: (_: A) => Effect<X, E2>
-  ): {
-    handler: Effect<X, E | E2, R>
-    name: string
-  }
-} = (self: any, onSuccessE: any): any => {
-  return {
-    ...self,
-    handler: typeof self.handler === "function"
-      ? (i: any) =>
-        pipe(
-          self.handler(i),
-          Effect.flatMap((_) => onSuccessE(_, i))
-        )
-      : Effect.flatMap(self.handler, (_) => onSuccessE(_))
-  }
-}
-
-export interface Res<A, E> {
-  readonly loading: boolean
-  readonly data: A | undefined
-  readonly error: E | undefined
-}
+import { mutationResultToVue } from "./mutate.js"
+import type { Res } from "./mutate.js"
+import type { MakeMutation2 } from "./mutate2.js"
 
 type WithAction<A> = A & {
   action: string
@@ -139,43 +17,16 @@ type WithAction<A> = A & {
 
 // computed() takes a getter function and returns a readonly reactive ref
 // object for the returned value from the getter.
-type Resp<I, E, A> = readonly [
+type Resp<I, E, A, R> = readonly [
   ComputedRef<Res<A, E>>,
-  WithAction<(I: I) => Promise<void>>
+  WithAction<(I: I) => Effect<A, E, R>>
 ]
 
-type ActResp<E, A> = readonly [
+type ActResp<E, A, R> = readonly [
   ComputedRef<Res<A, E>>,
-  WithAction<() => Promise<void>>
+  WithAction<() => Effect<A, E, R>>
 ]
 
-export function mutationResultToVue<A, E>(
-  mutationResult: MutationResult<A, E>
-): Res<A, E> {
-  switch (mutationResult._tag) {
-    case "Loading": {
-      return { loading: true, data: undefined, error: undefined }
-    }
-    case "Success": {
-      return {
-        loading: false,
-        data: mutationResult.data,
-        error: undefined
-      }
-    }
-    case "Error": {
-      return {
-        loading: false,
-        data: undefined,
-        error: mutationResult.error
-      }
-    }
-    case "Initial": {
-      return { loading: false, data: undefined, error: undefined }
-    }
-  }
-}
-
 export const makeClient2 = <Locale extends string, R>(
   useIntl: MakeIntlReturn<Locale>["useIntl"],
   useToast: () => {
@@ -198,9 +49,10 @@ export const makeClient2 = <Locale extends string, R>(
     function handleRequestWithToast<
       E extends ResponseErrors,
       A,
+      R,
       Args extends unknown[]
     >(
-      f: (...args: Args) => Promise<Either<A, E>>,
+      f: (...args: Args) => Effect<A, E, R>,
       action: string,
       options: Opts<A> = { suppressErrorToast: false }
     ) {
@@ -218,68 +70,70 @@ export const makeClient2 = <Locale extends string, R>(
         { action: message }
       )
       return Object.assign(
-        flow(f, (p) =>
-          p.then(
-            (r) =>
-              r._tag === "Right"
-                ? S.is(Failure)(r.right)
-                  ? Promise
-                    .resolve(
-                      toast.warning(
-                        warnMessage + r.right.message
-                          ? "\n" + r.right.message
-                          : ""
-                      )
+        flow(
+          f,
+          Effect.onExit(
+            Exit.matchEffect({
+              onSuccess: (r) =>
+                Effect.gen(function*() {
+                  if (S.is(Failure)(r)) {
+                    toast.warning(
+                      warnMessage + r.message
+                        ? "\n" + r.message
+                        : ""
                     )
-                    .then((_) => {})
-                  : Promise
-                    .resolve(
-                      toast.success(
-                        successMessage
-                          + (S.is(Success)(r.right) && r.right.message
-                            ? "\n" + r.right.message
-                            : "")
-                      )
-                    )
-                    .then((_) => {})
-                : r.left._tag === "SuppressErrors"
-                ? Promise.resolve(void 0)
-                : Promise
-                  .resolve(
-                    !options.suppressErrorToast
-                      && toast.error(`${errorMessage}:\n` + renderError(r.left))
+                    return
+                  }
+
+                  toast.success(
+                    successMessage
+                      + (S.is(Success)(r) && r.message
+                        ? "\n" + r.message
+                        : "")
                   )
-                  .then((_) => {
-                    console.warn(r.left, r.left.toString())
-                  }),
-            (err) => {
-              if (
-                Cause.isInterruptedException(err)
-                || (Runtime.isFiberFailure(err)
-                  && Cause.isInterruptedOnly(err[Runtime.FiberFailureCauseId]))
-              ) {
-                return
-              }
-              const extra = {
-                action,
-                message: `Unexpected Error trying to ${action}`
-              }
-              Sentry.captureException(err, {
-                extra
-              })
-              console.error(err, extra)
+                }),
+              onFailure: (err) =>
+                Effect.gen(function*() {
+                  if (Cause.isInterruptedOnly(err)) {
+                    return
+                  }
+
+                  const fail = Cause.failureOption(err)
+                  if (Option.isSome(fail)) {
+                    if ((fail as any)._tag === "SuppressErrors") {
+                      return Effect.succeed(void 0)
+                    }
 
-              return toast.error(
-                intl.value.formatMessage(
-                  { id: "handle.unexpected_error" },
-                  {
-                    action: message,
-                    error: JSON.stringify(err, undefined, 2)
+                    if (!options.suppressErrorToast) {
+                      toast.error(`${errorMessage}:\n` + renderError(fail.value))
+                    }
+
+                    console.warn(fail, fail.toString())
+                    return
                   }
-                )
-              )
-            }
-          )),
+
+                  const extra = {
+                    action,
+                    message: `Unexpected Error trying to ${action}`
+                  }
+                  Sentry.captureException(err, {
+                    extra
+                  })
+                  console.error(err, extra)
+
+                  toast.error(
+                    intl.value.formatMessage(
+                      { id: "handle.unexpected_error" },
+                      {
+                        action: message,
+                        error: JSON.stringify(err, undefined, 2)
+                      }
+                    )
+                  )
+                })
+            })
+          )
+        ),
         { action }
       )
     }
@@ -343,26 +197,21 @@ export const makeClient2 = <Locale extends string, R>(
    * Returns a tuple with state ref and execution function which reports errors as Toast.
    */
   const useAndHandleMutation: {
-    <I, E extends ResponseErrors, A>(
-      self: {
-        handler: (i: I) => Effect<A, E, R>
-        name: string
-      },
+    <I, E extends ResponseErrors, A, R, Request extends S.TaggedRequest.Any>(
+      self: RequestHandlerWithInput<I, A, E, R, Request>,
       action: string,
       options?: Opts<A>
-    ): Resp<I, A, E>
-    <E extends ResponseErrors, A>(
-      self: {
-        handler: Effect<A, E, R>
-        name: string
-      },
+    ): Resp<I, A, E, R>
+    <E extends ResponseErrors, A, R, Request extends S.TaggedRequest.Any>(
+      self: RequestHandler<A, E, R, Request>,
       action: string,
       options?: Opts<A>
-    ): ActResp<E, A>
+    ): ActResp<E, A, R>
   } = (self: any, action: any, options?: Opts<any>) => {
     const handleRequestWithToast = useHandleRequestWithToast()
     const [a, b] = useSafeMutation(
       {
+        ...self,
         handler: Effect.isEffect(self.handler)
           ? (pipe(
             Effect.annotateCurrentSpan({ action }),
@@ -372,8 +221,7 @@ export const makeClient2 = <Locale extends string, R>(
             pipe(
               Effect.annotateCurrentSpan({ action }),
               Effect.andThen(self.handler(...args))
-            ),
-        name: self.name
+            )
       },
       dropUndefinedT({
         queryInvalidation: options?.queryInvalidation
@@ -387,48 +235,31 @@ export const makeClient2 = <Locale extends string, R>(
   }
 
   function makeUseAndHandleMutation(
-    onSuccess?: () => Promise<void>,
     defaultOptions?: Opts<any>
   ) {
     return ((self: any, action: any, options: any) => {
       return useAndHandleMutation(
-        {
-          handler: typeof self.handler === "function"
-            ? onSuccess
-              ? (i: any) => Effect.tap(self.handler(i), () => Effect.promise(onSuccess))
-              : self.handler
-            : onSuccess
-            ? (Effect.tap(self.handler, () => Effect.promise(onSuccess)) as any)
-            : self.handler,
-          name: self.name
-        },
+        self,
         action,
         { ...defaultOptions, ...options }
       )
     }) as {
-      <I, E extends ResponseErrors, A>(
-        self: {
-          handler: (i: I) => Effect<A, E, R>
-          name: string
-        },
+      <I, E extends ResponseErrors, A, R, Request extends S.TaggedRequest.Any>(
+        self: RequestHandlerWithInput<I, A, E, R, Request>,
         action: string,
         options?: Opts<A>
-      ): Resp<I, A, E>
-      <E extends ResponseErrors, A>(
-        self: {
-          handler: Effect<A, E, R>
-          name: string
-        },
+      ): Resp<I, A, E, R>
+      <E extends ResponseErrors, A, Request extends S.TaggedRequest.Any>(
+        self: RequestHandler<A, E, R, Request>,
         action: string,
         options?: Opts<A>
-      ): ActResp<E, A>
+      ): ActResp<E, A, R>
     }
   }
 
-  const useSafeMutationWithState = <I, E, A>(self: {
-    handler: (i: I) => Effect<A, E, R>
-    name: string
-  }) => {
+  const useSafeMutationWithState = <I, E, A, Request extends S.TaggedRequest.Any>(
+    self: RequestHandlerWithInput<I, A, E, R, Request>
+  ) => {
     const [a, b] = useSafeMutation(self)
 
     return tuple(
@@ -445,80 +276,14 @@ export const makeClient2 = <Locale extends string, R>(
   }
 }
 
-export const mapHandler: {
-  <I, E, R, A, E2, A2, R2>(
-    self: {
-      handler: (i: I) => Effect<A, E, R>
-      name: string
-      mapPath: (i: I) => string
-    },
-    map: (i: I) => (handler: Effect<A, E, R>) => Effect<A2, E2, R2>
-  ): {
-    handler: (i: I) => Effect<A2, E2, R2>
-    name: string
-    mapPath: (i: I) => string
-  }
-  <E, A, R, E2, A2, R2>(
-    self: {
-      handler: Effect<A, E, R>
-      name: string
-      mapPath: string
-    },
-    map: (handler: Effect<A, E, R>) => Effect<A2, E2, R2>
-  ): {
-    handler: Effect<A2, E2, R2>
-    name: string
-    mapPath: string
-  }
-} = (self: any, map: any): any => ({
-  ...self,
-  handler: typeof self.handler === "function"
-    ? (i: any) => map(i)((self.handler as (i: any) => Effect<any, any, any>)(i))
-    : map(self.handler)
-})
-
-export function composeQueries<
-  R extends Record<string, Result.Result<any, any>>
->(
-  results: R,
-  renderPreviousOnFailure?: boolean
-): Result.Result<
-  {
-    [Property in keyof R]: R[Property] extends Result.Result<infer A, any> ? A
-      : never
-  },
-  {
-    [Property in keyof R]: R[Property] extends Result.Result<any, infer E> ? E
-      : never
-  }[keyof R]
-> {
-  const values = renderPreviousOnFailure
-    ? Object.values(results).map(orPrevious)
-    : Object.values(results)
-  const error = values.find(Result.isFailure)
-  if (error) {
-    return error
-  }
-  const initial = Array.findFirst(values, (x) => x._tag === "Initial" ? Option.some(x) : Option.none())
-  if (initial.value !== undefined) {
-    return initial.value
-  }
-  const loading = Array.findFirst(values, (x) => Result.isInitial(x) && x.waiting ? Option.some(x) : Option.none())
-  if (loading.value !== undefined) {
-    return loading.value
-  }
-
-  const isRefreshing = values.some((x) => x.waiting)
-
-  const r = Object.entries(results).reduce((prev, [key, value]) => {
-    prev[key] = Result.value(value).value
-    return prev
-  }, {} as any)
-  return Result.success(r, isRefreshing)
+export interface RequestHandler<A, E, R, Request extends S.TaggedRequest.Any> {
+  handler: Effect<A, E, R>
+  name: string
+  Request: Request
 }
 
-function orPrevious<E, A>(result: Result.Result<A, E>) {
-  return Result.isFailure(result) && Option.isSome(result.previousValue)
-    ? Result.success(result.previousValue.value, result.waiting)
-    : result
+export interface RequestHandlerWithInput<I, A, E, R, Request extends S.TaggedRequest.Any> {
+  handler: (i: I) => Effect<A, E, R>
+  name: string
+  Request: Request
 }

package/src/mutate.ts

@@ -225,3 +225,36 @@ export const makeMutation = <R>(runtime: Ref<Runtime.Runtime<R>>) => {
 
 // eslint-disable-next-line @typescript-eslint/no-empty-object-type
 export interface MakeMutation<R> extends ReturnType<typeof makeMutation<R>> {}
+
+export function mutationResultToVue<A, E>(
+  mutationResult: MutationResult<A, E>
+): Res<A, E> {
+  switch (mutationResult._tag) {
+    case "Loading": {
+      return { loading: true, data: undefined, error: undefined }
+    }
+    case "Success": {
+      return {
+        loading: false,
+        data: mutationResult.data,
+        error: undefined
+      }
+    }
+    case "Error": {
+      return {
+        loading: false,
+        data: undefined,
+        error: mutationResult.error
+      }
+    }
+    case "Initial": {
+      return { loading: false, data: undefined, error: undefined }
+    }
+  }
+}
+
+export interface Res<A, E> {
+  readonly loading: boolean
+  readonly data: A | undefined
+  readonly error: E | undefined
+}

package/src/mutate2.ts

@@ -3,10 +3,12 @@ import { tuple } from "@effect-app/core/Function"
 import * as Result from "@effect-rx/rx/Result"
 import type { InvalidateOptions, InvalidateQueryFilters } from "@tanstack/vue-query"
 import { useQueryClient } from "@tanstack/vue-query"
+import type { S } from "effect-app"
 import { Cause, Effect, Exit, Option } from "effect-app"
 import type { ComputedRef, Ref } from "vue"
 import { computed, ref, shallowRef } from "vue"
 import { reportRuntimeError } from "./internal.js"
+import type { RequestHandler, RequestHandlerWithInput } from "./makeClient2.js"
 import { getQueryKey } from "./mutate.js"
 
 export type WatchSource<T = any> = Ref<T> | ComputedRef<T> | (() => T)
@@ -78,35 +80,27 @@ export interface MutationOptions {
                 */
 
 export const makeMutation2 = () => {
-  type HandlerWithInput<I, A, E, R> = {
-    handler: (i: I) => Effect<A, E, R>
-    name: string
-  }
-  type Handler<A, E, R> = { handler: Effect<A, E, R>; name: string }
-
   /**
    * Pass a function that returns an Effect, e.g from a client action, or an Effect
    * Returns a tuple with state ref and execution function which reports errors as Toast.
    */
   const useSafeMutation: {
-    <I, E, A, R>(
-      self: HandlerWithInput<I, A, E, R>,
+    <I, E, A, R, Request extends S.TaggedRequest.Any>(
+      self: RequestHandlerWithInput<I, A, E, R, Request>,
       options?: MutationOptions
     ): readonly [
       Readonly<Ref<MutationResult<A, E>>>,
       (i: I) => Effect<A, E, R>
     ]
-    <E, A, R>(self: Handler<A, E, R>, options?: MutationOptions): readonly [
+    <E, A, R, Request extends S.TaggedRequest.Any>(
+      self: RequestHandler<A, E, R, Request>,
+      options?: MutationOptions
+    ): readonly [
       Readonly<Ref<MutationResult<A, E>>>,
       () => Effect<A, E, R> // TODO: remove () =>
     ]
-  } = <I, E, A, R>(
-    self: {
-      handler:
-        | HandlerWithInput<I, A, E, R>["handler"]
-        | Handler<A, E, R>["handler"]
-      name: string
-    },
+  } = <I, E, A, R, Request extends S.TaggedRequest.Any>(
+    self: RequestHandlerWithInput<I, A, E, R, Request> | RequestHandler<A, E, R, Request>,
     options?: MutationOptions
   ) => {
     const queryClient = useQueryClient()