fix: display the response error message instead of the axios error

queue-manager/rango-preset/src/shared-errors.ts

@@ -2,12 +2,14 @@ import type {
   APIErrorCode,
   SignerErrorCode as SignerErrorCodeType,
 } from 'rango-types';
+
 import {
-  SignerErrorCode,
-  SignerError,
-  isSignerErrorCode,
   isAPIErrorCode,
+  isSignerErrorCode,
+  SignerError,
+  SignerErrorCode,
 } from 'rango-types';
+
 import { DEFAULT_ERROR_CODE } from './constants';
 
 export type ErrorDetail = {
@@ -23,10 +25,10 @@ const ERROR_INPUT_WALLET_NOT_FOUND = 'Input wallet not found';
 type ErrorRoot = string | Record<string, string> | null;
 
 export class PrettyError extends Error {
+  public _isPrettyError = true;
   private readonly detail?: string;
   private readonly root?: ErrorRoot;
   private readonly code?: APIErrorCode;
-  public _isPrettyError = true;
 
   constructor(
     code: APIErrorCode,
@@ -49,24 +51,6 @@ export class PrettyError extends Error {
     );
   }
 
-  getErrorDetail(): ErrorDetail {
-    const rawMessage =
-      typeof this.root === 'object' && this.root && this.root.error
-        ? this.root.error
-        : JSON.stringify(this.root);
-    const rootStr =
-      typeof this.root === 'string'
-        ? this.root
-        : this.root instanceof Error
-        ? this.root.message
-        : rawMessage;
-    return {
-      extraMessage: this.message,
-      extraMessageDetail: this.detail || rootStr,
-      extraMessageErrorCode: this.code || null,
-    };
-  }
-
   static AssertionFailed(m: string): PrettyError {
     return new PrettyError(
       'CLIENT_UNEXPECTED_BEHAVIOUR',
@@ -114,14 +98,36 @@ export class PrettyError extends Error {
       'Server requested for a blockchain or address not selected by user'
     );
   }
+
+  getErrorDetail(): ErrorDetail {
+    const rawMessage =
+      typeof this.root === 'object' && this.root && this.root.error
+        ? this.root.error
+        : JSON.stringify(this.root);
+    const rootStr =
+      typeof this.root === 'string'
+        ? this.root
+        : this.root instanceof Error
+        ? this.root.message
+        : rawMessage;
+    return {
+      extraMessage: this.message,
+      extraMessageDetail: this.detail || rootStr,
+      extraMessageErrorCode: this.code || null,
+    };
+  }
 }
 
 export function mapAppErrorCodesToAPIErrorCode(
   errorCode: string | null
 ): APIErrorCode {
   try {
-    if (!errorCode) return DEFAULT_ERROR_CODE;
-    if (isAPIErrorCode(errorCode)) return errorCode;
+    if (!errorCode) {
+      return DEFAULT_ERROR_CODE;
+    }
+    if (isAPIErrorCode(errorCode)) {
+      return errorCode;
+    }
     if (isSignerErrorCode(errorCode)) {
       const t: { [key in SignerErrorCodeType]: APIErrorCode } = {
         [SignerErrorCode.REJECTED_BY_USER]: 'USER_REJECT',
@@ -135,14 +141,40 @@ export function mapAppErrorCodesToAPIErrorCode(
       return t[errorCode];
     }
     return DEFAULT_ERROR_CODE;
-  } catch (err) {
+  } catch {
     return DEFAULT_ERROR_CODE;
   }
 }
 
+type AxiosError = {
+  isAxiosError: true;
+  response?: {
+    data?: { error?: string };
+  };
+};
+
+export function isAxiosError(obj: unknown): obj is AxiosError {
+  return (
+    !!obj &&
+    typeof obj === 'object' &&
+    'isAxiosError' in obj &&
+    obj.isAxiosError === true
+  );
+}
+
 export const prettifyErrorMessage = (obj: unknown): ErrorDetail => {
-  if (!obj) return { extraMessage: '', extraMessageErrorCode: null };
-  if (PrettyError.isPrettyError(obj)) return obj.getErrorDetail();
+  if (!obj) {
+    return { extraMessage: '', extraMessageErrorCode: null };
+  }
+  if (isAxiosError(obj)) {
+    return {
+      extraMessage: obj.response?.data?.error || 'Unknown error',
+      extraMessageErrorCode: null,
+    };
+  }
+  if (PrettyError.isPrettyError(obj)) {
+    return obj.getErrorDetail();
+  }
   if (SignerError.isSignerError(obj)) {
     const t = obj.getErrorDetail();
     return {
@@ -151,15 +183,18 @@ export const prettifyErrorMessage = (obj: unknown): ErrorDetail => {
       extraMessageErrorCode: t.code,
     };
   }
-  if (obj instanceof Error)
+  if (obj instanceof Error) {
     return {
       extraMessage: obj.toString(),
       extraMessageErrorCode: null,
     };
-  if (typeof obj !== 'string')
+  }
+  if (typeof obj !== 'string') {
     return {
       extraMessage: JSON.stringify(obj),
       extraMessageErrorCode: null,
     };
+  }
+
   return { extraMessage: obj, extraMessageErrorCode: null };
 };

widget/embedded/src/hooks/useFetchAllQuotes.ts

@@ -14,7 +14,10 @@ export function useFetchAllQuotes(): UseFetchResult<
     MultiRouteResponse
   >({
     request: async (requestBody, options) =>
-      await httpService().getAllRoutes(requestBody, options),
+      await httpService().getAllRoutes(
+        { ...requestBody, enableCentralizedSwappers: true },
+        options
+      ),
   });
 
   return { fetch, loading, cancelFetch };