typesafe handleErrors (#808)

libs/api/errors.ts

@@ -26,23 +26,21 @@ const methodCodeMap: { [key in keyof Partial<ApiMethods>]: Record<string, string
   },
 }
 
-export const handleErrors =
-  <M>(method: M) =>
-  (resp: ErrorResponse) => {
-    // TODO is this a valid failure condition?
-    if (!resp) throw 'unknown server error'
-
-    // if logged out, hit /login to trigger login redirect
-    if (resp.status === 401) {
-      // TODO-usability: for background requests, a redirect to login without
-      // warning could come as a surprise to the user, especially because
-      // sometimes background requests are not directly triggered by a user
-      // action, e.g., polling or refetching when window regains focus
-      navToLogin({ includeCurrent: true })
-    }
-    // we need to rethrow because that's how react-query knows it's an error
-    throw formatServerError(resp, methodCodeMap[method as unknown as keyof ApiMethods])
+export const handleErrors = (method: keyof ApiMethods) => (resp: ErrorResponse) => {
+  // TODO is this a valid failure condition?
+  if (!resp) throw 'unknown server error'
+
+  // if logged out, hit /login to trigger login redirect
+  if (resp.status === 401) {
+    // TODO-usability: for background requests, a redirect to login without
+    // warning could come as a surprise to the user, especially because
+    // sometimes background requests are not directly triggered by a user
+    // action, e.g., polling or refetching when window regains focus
+    navToLogin({ includeCurrent: true })
   }
+  // we need to rethrow because that's how react-query knows it's an error
+  throw formatServerError(resp, methodCodeMap[method])
+}
 
 function formatServerError(
   resp: ErrorResponse,

libs/api/hooks.ts

@@ -5,7 +5,6 @@ import type {
   QueryKey,
 } from 'react-query'
 import { useMutation, useQuery, useQueryClient } from 'react-query'
-import { handleErrors } from './errors'
 
 import type { ErrorResponse, ApiResponse } from './__generated__/Api'
 
@@ -29,7 +28,10 @@ type ApiClient = Record<string, (...args: any) => Promise<ApiResponse<any>>>
 /* eslint-enable @typescript-eslint/no-explicit-any */
 
 export const getUseApiQuery =
-  <A extends ApiClient>(api: A) =>
+  <A extends ApiClient>(
+    api: A,
+    handleErrors: (M: keyof A) => (resp: ErrorResponse) => void
+  ) =>
   <M extends keyof A>(
     method: M,
     params: Params<A[M]>,
@@ -65,7 +67,10 @@ export const getUseApiQuery =
   }
 
 export const getUseApiMutation =
-  <A extends ApiClient>(api: A) =>
+  <A extends ApiClient>(
+    api: A,
+    handleErrors: (M: keyof A) => (resp: ErrorResponse) => void
+  ) =>
   <M extends keyof A>(
     method: M,
     options?: UseMutationOptions<Result<A[M]>, ErrorResponse, Params<A[M]>>

libs/api/index.ts

@@ -1,5 +1,6 @@
 import type { ResultItem } from './hooks'
 import { getUseApiMutation, getUseApiQuery, getUseApiQueryClient } from './hooks'
+import { handleErrors } from './errors'
 import { Api } from './__generated__/Api'
 
 const api = new Api({
@@ -20,8 +21,8 @@ export type ApiListMethods = {
     : M]: ApiMethods[M]
 }
 
-export const useApiQuery = getUseApiQuery(api.methods)
-export const useApiMutation = getUseApiMutation(api.methods)
+export const useApiQuery = getUseApiQuery(api.methods, handleErrors)
+export const useApiMutation = getUseApiMutation(api.methods, handleErrors)
 export const useApiQueryClient = getUseApiQueryClient<ApiMethods>()
 
 export * from './util'