refactor and unify with mutations.onError handling in _app.tsx

ZdruzenieSTROM · Dec 14, 2024 · ddbf267 · ddbf267
1 parent cccb983
commit ddbf267
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 25 deletions.
diff --git a/src/components/Admin/dataProvider.ts b/src/components/Admin/dataProvider.ts
@@ -1,4 +1,4 @@
-import axios, {AxiosError, AxiosResponse} from 'axios'
+import axios, {isAxiosError} from 'axios'
 import {stringify} from 'querystring'
 import {DataProvider, RaRecord} from 'react-admin'
 // TODO: BE chysta search, filter, pagination a sort. ked to bude ready,
@@ -27,10 +27,23 @@ const dynamicSort = (key: string, order: string) => {
 }
 
 /* field errors by mali byt zachytene uz FE validaciou, dumpujem do 'Nastala neznáma chyba' */
-const parseError = (response: any) => {
-  if (typeof response === 'undefined') return 'Nastala neznáma chyba'
-  if (typeof response.detail !== 'undefined') return response.detail
-  if (response.non_field_errors?.constructor.name === 'Array') return response.non_field_errors.join('\n')
+const parseError = (error: unknown) => {
+  // povacsine matchuje `mutations.onError` v `_app.tsx`
+  if (isAxiosError(error)) {
+    const data = error.response?.data as unknown
+    if (typeof data === 'object' && data) {
+      const detail = 'detail' in data && data.detail
+      if (typeof detail === 'string') return detail
+
+      const nonFieldErrors = 'non_field_errors' in data && data.non_field_errors
+      const nonFieldErrorsUnknown = Array.isArray(nonFieldErrors) ? (nonFieldErrors as unknown[]) : []
+      const nonFieldErrorsJoined = nonFieldErrorsUnknown.every((e) => typeof e === 'string')
+        ? nonFieldErrorsUnknown.join('\n')
+        : ''
+      if (nonFieldErrorsJoined) return nonFieldErrorsJoined
+    }
+  }
+
   return 'Nastala neznáma chyba'
 }
 
@@ -94,23 +107,26 @@ export const dataProvider: DataProvider = {
         total: filteredData.length,
       }
     } catch (e) {
-      throw new Error(parseError((e as AxiosError).response?.data))
+      if (isAxiosError(e)) {
+        throw new Error(parseError(e))
+      }
+      throw e
     }
   },
   getOne: async (resource, params) => {
     try {
       const {data} = await axios.get(`${apiUrl}/${resource}/${params.id}`)
       return {data}
-    } catch (e: any) {
-      throw new Error(parseError(e.response.data))
+    } catch (e) {
+      throw new Error(parseError(e))
     }
   },
   getMany: async (resource, params) => {
     try {
       const data = await Promise.all(params.ids.map((id) => axios.get(`${apiUrl}/${resource}/${id}`)))
       return {data: data.map(({data}) => data)}
-    } catch (e: any) {
-      throw new Error(parseError(e.response.data))
+    } catch (e) {
+      throw new Error(parseError(e))
     }
   },
   // TODO: ak budeme pouzivat tuto funkciu, upravime podla getList (pagination, sort, filter). uprimne este neviem, pri com sa pouziva
@@ -125,8 +141,8 @@ export const dataProvider: DataProvider = {
         data: data,
         total: data.length,
       }
-    } catch (e: any) {
-      throw new Error(parseError(e.response.data))
+    } catch (e) {
+      throw new Error(parseError(e))
     }
   },
   update: async (resource, params) => {
@@ -139,16 +155,16 @@ export const dataProvider: DataProvider = {
     try {
       const {data} = await axios.patch(`${apiUrl}/${resource}/${id}`, body)
       return {data}
-    } catch (e: any) {
-      throw new Error(parseError(e.response.data))
+    } catch (e) {
+      throw new Error(parseError(e))
     }
   },
   updateMany: async (resource, params) => {
     try {
       const data = await Promise.all(params.ids.map((id) => axios.patch(`${apiUrl}/${resource}/${id}`, params.data)))
       return {data: data.map(({data}) => data)}
-    } catch (e: any) {
-      throw new Error(parseError(e.response.data))
+    } catch (e) {
+      throw new Error(parseError(e))
     }
   },
   create: async (resource, params) => {
@@ -159,24 +175,24 @@ export const dataProvider: DataProvider = {
     try {
       const {data} = await axios.post(`${apiUrl}/${resource}`, body)
       return {data}
-    } catch (e: any) {
-      throw new Error(parseError(e.response.data))
+    } catch (e) {
+      throw new Error(parseError(e))
     }
   },
   delete: async (resource, params) => {
     try {
       const {data} = await axios.delete(`${apiUrl}/${resource}/${params.id}`)
       return {data}
-    } catch (e: any) {
-      throw new Error(parseError(e.response.data))
+    } catch (e) {
+      throw new Error(parseError(e))
     }
   },
   deleteMany: async (resource, params) => {
     try {
       const data = await Promise.all(params.ids.map((id) => axios.delete(`${apiUrl}/${resource}/${id}`)))
       return {data: data.map(({data}) => data.id)}
-    } catch (e: any) {
-      throw new Error(parseError(e.response.data))
+    } catch (e) {
+      throw new Error(parseError(e))
     }
   },
 }
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
@@ -111,9 +111,12 @@ const ReactQueryProvider: FC<PropsWithChildren> = ({children}) => {
 
                   // ak nie, ale mame message v `.non_field_errors`, ukazeme ten
                   const nonFieldErrors = 'non_field_errors' in data && data.non_field_errors
-                  const nonFieldError = Array.isArray(nonFieldErrors) && (nonFieldErrors as unknown[])[0]
-                  if (typeof nonFieldError === 'string') {
-                    alert(nonFieldError)
+                  const nonFieldErrorsUnknown = Array.isArray(nonFieldErrors) ? (nonFieldErrors as unknown[]) : []
+                  const nonFieldErrorsJoined = nonFieldErrorsUnknown.every((e) => typeof e === 'string')
+                    ? nonFieldErrorsUnknown.join('\n')
+                    : ''
+                  if (nonFieldErrorsJoined) {
+                    alert(nonFieldErrorsJoined)
                     return
                   }