feat!: hooks do not override hooks created by useFetch.create

s3xysteak · Jul 28, 2024 · 522a00d · 522a00d
1 parent 3b5ec7e
commit 522a00d
Show file tree

Hide file tree

Showing 5 changed files with 95 additions and 17 deletions.
diff --git a/src/core/ctx.ts b/src/core/ctx.ts
@@ -1,15 +1,21 @@
 import { $fetch } from 'ofetch'
 import type { ResponseType, UseFetchOptions } from './types'
 
-export function createContext<R extends ResponseType>(userOptions: UseFetchOptions<R>) {
-  const options = resolveOptions<R>(userOptions)
+export function createContext<R extends ResponseType>(
+  userOptions: UseFetchOptions<R>,
+  defaultOptions: UseFetchOptions<R>,
+) {
+  const options = resolveOptions<R>(userOptions, defaultOptions)
 
   return {
     ...options,
   }
 }
 
-function resolveOptions<R extends ResponseType>(options: UseFetchOptions<R>) {
+function resolveOptions<R extends ResponseType>(
+  options: UseFetchOptions<R>,
+  defaultOptions: UseFetchOptions<R>,
+) {
   const {
     immediate = true,
     watch = [],
@@ -43,7 +49,10 @@ function resolveOptions<R extends ResponseType>(options: UseFetchOptions<R>) {
     window,
 
     ...optionsWatch
-  } = options
+  } = {
+    ...defaultOptions,
+    ...options,
+  }
 
   return {
     optionsComposable: {
@@ -80,5 +89,6 @@ function resolveOptions<R extends ResponseType>(options: UseFetchOptions<R>) {
       timeout,
       window,
     },
+    optionsDefault: defaultOptions,
   }
 }
diff --git a/src/core/useFetch.ts b/src/core/useFetch.ts
@@ -21,7 +21,7 @@ export function createUseFetch(defaultOptions: UseFetchOptions<any> = {}) {
     _req: UseFetchParams,
     options: UseFetchOptions<R> = {},
   ): UseFetchReturns<R, T> {
-    const ctx = createContext<R>(Object.assign(options, defaultOptions))
+    const ctx = createContext<R>(options, defaultOptions)
 
     const status = ref<UseFetchStatus>('idle')
     const pending = ref(false)
@@ -41,14 +41,26 @@ export function createUseFetch(defaultOptions: UseFetchOptions<any> = {}) {
         ...Object.fromEntries(
           Object.entries(toValue(watchOptions)).map(([k, v]) => [k, toValue(v)]),
         ),
-        onResponse($fetchCtx) {
+        onRequest(context) {
+          ctx.optionsDefault?.onRequest?.(context)
+          ctx.options$fetch?.onRequest?.(context)
+        },
+        onRequestError(context) {
+          status.value = 'error'
+          error.value = context.error
+          ctx.optionsDefault?.onRequestError?.(context as any)
+          ctx.options$fetch?.onRequestError?.(context as any)
+        },
+        onResponse(context) {
           status.value = 'success'
-          ctx.options$fetch?.onResponse?.($fetchCtx)
+          ctx.optionsDefault?.onResponse?.(context)
+          ctx.options$fetch?.onResponse?.(context)
         },
-        onRequestError($fetchCtx) {
+        onResponseError(context) {
           status.value = 'error'
-          error.value = $fetchCtx.error
-          ctx.options$fetch?.onResponseError?.($fetchCtx as any)
+          error.value = context.error ?? null
+          ctx.optionsDefault?.onResponseError?.(context)
+          ctx.options$fetch?.onResponseError?.(context as any)
         },
       })
 
@@ -89,7 +101,7 @@ export function createUseFetch(defaultOptions: UseFetchOptions<any> = {}) {
   }
 
   useFetch.create = newDefaultOptions =>
-    createUseFetch(Object.assign(defaultOptions, newDefaultOptions))
+    createUseFetch({ ...defaultOptions, ...newDefaultOptions })
 
   return useFetch
 }
diff --git a/src/core/usePagination.ts b/src/core/usePagination.ts
@@ -25,24 +25,38 @@ export function createUsePagination(defaultOptions: UsePaginationOptions<any> =
 
       useFetch = defaultUseFetch,
       ...useFetchOptions
-    } = Object.assign(defaultOptions, options)
+    } = { ...defaultOptions, ...options }
 
     const pageSize = ref<number>(defaultPageSize)
     const pageCurrent = ref<number>(1)
 
     const val = useFetch(_req, {
       ...useFetchOptions,
       watch: useFetchOptions.watch !== false && [pageSize, pageCurrent, ...toArray(useFetchOptions.watch || [])],
-      onRequest(ctx) {
+      onRequest(context) {
+        defaultOptions.onRequest?.(context)
+
         const assignPaginationKey = (p: Record<string, any> = {}) =>
           Object.assign(p, {
             [pageCurrentKey]: p[pageCurrentKey] || toValue(pageCurrent),
             [pageSizeKey]: p[pageSizeKey] || toValue(pageSize),
           })
 
-        ctx.options.query = assignPaginationKey(ctx.options.query)
-        ctx.options.params = assignPaginationKey(ctx.options.params)
-        useFetchOptions?.onRequest?.(ctx)
+        context.options.query = assignPaginationKey(context.options.query)
+        context.options.params = assignPaginationKey(context.options.params)
+        useFetchOptions?.onRequest?.(context)
+      },
+      onRequestError(context) {
+        defaultOptions?.onResponseError?.(context as any)
+        useFetchOptions?.onResponseError?.(context as any)
+      },
+      onResponse(context) {
+        defaultOptions?.onResponse?.(context)
+        useFetchOptions?.onResponse?.(context)
+      },
+      onResponseError(context) {
+        defaultOptions?.onResponseError?.(context)
+        useFetchOptions?.onResponseError?.(context as any)
       },
     })
 
@@ -60,7 +74,7 @@ export function createUsePagination(defaultOptions: UsePaginationOptions<any> =
     }
   }
 
-  usePagination.create = newDefaultOptions => createUsePagination(Object.assign(defaultOptions, newDefaultOptions))
+  usePagination.create = newDefaultOptions => createUsePagination({ ...defaultOptions, ...newDefaultOptions })
 
   return usePagination
 }
diff --git a/test/general.test.ts b/test/general.test.ts
@@ -105,4 +105,25 @@ createTest(3001, (listener, getURL) => {
     await e2()
     expect(d2.value).toBe('ok')
   })
+
+  it('useFetch.create - hook', async () => {
+    let target
+    const u = useFetch.create({
+      immediate: false,
+      onRequest({ options }) {
+        if (!(options.headers instanceof Headers))
+          options.headers = new Headers(options.headers)
+
+        options.headers.append('foo', 'bar')
+      },
+    })
+    const { execute } = u(getURL('ok'), {
+      onRequest({ options }) {
+        // @ts-expect-error - test
+        target = options.headers.get('foo')
+      },
+    })
+    await execute()
+    expect(target).toBe('bar')
+  })
 })
diff --git a/test/pagination.test.ts b/test/pagination.test.ts
@@ -83,4 +83,25 @@ createTest(3002, (listener, getURL) => {
     await next(data)
     expect(key!).toBe('2')
   })
+
+  it('usePagination.create - hook', async () => {
+    let target
+    const u = usePagination.create({
+      immediate: false,
+      onRequest({ options }) {
+        if (!(options.headers instanceof Headers))
+          options.headers = new Headers(options.headers)
+
+        options.headers.append('foo', 'bar')
+      },
+    })
+    const { execute } = u(getURL('ok'), {
+      onRequest({ options }) {
+        // @ts-expect-error - test
+        target = options.headers.get('foo')
+      },
+    })
+    await execute()
+    expect(target).toBe('bar')
+  })
 })