Scalable interceptors (#243)

* v1.0.3

* v1.0.4

* making args for interceptors be objects for scalability

Author: alex-cory

src/__tests__/doFetchArgs.test.tsx

@@ -96,7 +96,7 @@ describe('doFetchArgs: general usages', (): void => {
       cachePolicy: defaults.cachePolicy
     })
     const interceptors = {
-      request(options: any) {
+      async request({ options }: { options: any }) {
         options.headers.Authorization = 'Bearer test'
         return options
       }

src/__tests__/useFetch.test.tsx

@@ -557,7 +557,7 @@ describe('useFetch - BROWSER - interceptors', (): void => {
   const wrapper = ({ children }: { children?: ReactNode }): ReactElement => {
     const options: Options = {
       interceptors: {
-        request: async (opts, url, path, route) => {
+        request: async ({ options: opts, url, path, route }) => {
           if (path === '/path') {
             opts.data = 'path'
           }
@@ -569,7 +569,7 @@ describe('useFetch - BROWSER - interceptors', (): void => {
           }
           return opts
         },
-        async response(res) {
+        async response({ response: res }) {
           if (res.data) res.data = toCamel(res.data)
           return res
         }
@@ -645,11 +645,11 @@ describe('useFetch - BROWSER - interceptors', (): void => {
     const { result, waitForNextUpdate } = renderHook(
       () => useFetch('url', {
         interceptors: {
-          async request(options) {
+          async request({ options }) {
             requestCalled++
             return options
           },
-          async response(response) {
+          async response({ response }) {
             responseCalled++
             return response
           }
@@ -1066,9 +1066,9 @@ describe('useFetch - BROWSER - errors', (): void => {
   const wrapperCustomError = ({ children }: { children?: ReactNode }): ReactElement => {
     const options = {
       interceptors: {
-        async response(res: Res<any>): Promise<Res<any>> {
-          if (!res.ok) throw expectedError
-          return res
+        async response<TData = any>({ response }: { response: Res<TData> }): Promise<Res<TData>> {
+          if (!response.ok) throw expectedError
+          return response
         }
       },
       cachePolicy: NO_CACHE

src/doFetchArgs.ts

@@ -81,7 +81,7 @@ export default async function doFetchArgs<TData = any>(
     if (body !== null) opts.body = body
 
     if (requestInterceptor) {
-      const interceptor = await requestInterceptor(opts, initialURL, path, route)
+      const interceptor = await requestInterceptor({ options: opts, url: initialURL, path, route })
       return interceptor as any
     }
     return opts

src/types.ts

@@ -159,9 +159,9 @@ export type UseFetchObjectReturn<TData> = ReqBase<TData> &
 export type UseFetch<TData> = UseFetchArrayReturn<TData> &
   UseFetchObjectReturn<TData>
 
-export type Interceptors = {
-  request?: (options: Options, url: string, path: string, route: string) => Promise<Options> | Options
-  response?: (response: Res<any>) => Promise<Res<any>>
+export type Interceptors<TData = any> = {
+  request?: ({ options, url, path, route }: { options: Options, url: string, path: string, route: string }) => Promise<Options> | Options
+  response?: ({ response }: { response: Res<TData> }) => Promise<Res<TData>>
 }
 
 // this also holds the response keys. It mimics js Map

src/useFetch.ts

@@ -92,7 +92,7 @@ function useFetch<TData = any>(...args: UseFetchArgs): UseFetch<TData> {
           res.current = response.cached as Res<TData>
           const theData = await tryGetData(response.cached, defaults.data, responseType)
           res.current.data = theData
-          res.current = interceptors.response ? await interceptors.response(res.current) : res.current
+          res.current = interceptors.response ? await interceptors.response({ response: res.current }) : res.current
           invariant('data' in res.current, 'You must have `data` field on the Response returned from your `interceptors.response`')
           data.current = res.current.data as TData
           if (!suspense && mounted.current) forceUpdate()
@@ -124,7 +124,7 @@ function useFetch<TData = any>(...args: UseFetchArgs): UseFetch<TData> {
         newData = await tryGetData(newRes, defaults.data, responseType)
         res.current.data = onNewData(data.current, newData)
 
-        res.current = interceptors.response ? await interceptors.response(res.current) : res.current
+        res.current = interceptors.response ? await interceptors.response({ response: res.current }) : res.current
         invariant('data' in res.current, 'You must have `data` field on the Response returned from your `interceptors.response`')
         data.current = res.current.data as TData