Grid, fix toast for axios errors (#25703)
diff --git a/airflow/www/static/js/utils/useErrorToast.test.tsx b/airflow/www/static/js/utils/useErrorToast.test.tsx
index 39256b3..2cbdade 100644
--- a/airflow/www/static/js/utils/useErrorToast.test.tsx
+++ b/airflow/www/static/js/utils/useErrorToast.test.tsx
@@ -19,19 +19,35 @@
/* global describe, test, expect */
+import type { AxiosError } from 'axios';
import { getErrorDescription } from './useErrorToast';
describe('Test getErrorDescription()', () => {
test('Returns expected results', () => {
let description;
- // is response.data is defined
- description = getErrorDescription({ response: { data: 'uh oh' } });
- expect(description).toBe('uh oh');
+ // @ts-ignore
+ const axiosError: AxiosError = new Error('Error message');
- // if it is not, use default message
- description = getErrorDescription({ response: { data: '' } });
- expect(description).toBe('Something went wrong.');
+ axiosError.toJSON = () => ({});
+ axiosError.response = {
+ data: 'Not available for this Executor',
+ status: 400,
+ statusText: 'BadRequest',
+ headers: {},
+ config: {},
+ };
+ axiosError.isAxiosError = true;
+
+ // if response.data is defined
+ description = getErrorDescription(axiosError);
+ expect(description).toBe('Not available for this Executor');
+
+ axiosError.response.data = '';
+
+ // if it is not, use the error message
+ description = getErrorDescription(axiosError);
+ expect(description).toBe('Error message');
// if error object, return the message
description = getErrorDescription(new Error('no no'));
diff --git a/airflow/www/static/js/utils/useErrorToast.ts b/airflow/www/static/js/utils/useErrorToast.ts
index 4fdfd1a..f361af0 100644
--- a/airflow/www/static/js/utils/useErrorToast.ts
+++ b/airflow/www/static/js/utils/useErrorToast.ts
@@ -19,20 +19,18 @@
import { useToast } from '@chakra-ui/react';
import type { ReactNode } from 'react';
+import axios from 'axios';
-interface ErrorObj {
- response: {
- data: string,
- }
-}
-
-type ErrorType = Error | string | ErrorObj | null;
+type ErrorType = Error | string | null;
export const getErrorDescription = (error?: ErrorType, fallbackMessage?: string) => {
if (typeof error === 'string') return error;
- if (error instanceof Error) return error.message;
- if (error?.response?.data) {
- return error.response.data;
+ if (error instanceof Error) {
+ let { message } = error;
+ if (axios.isAxiosError(error)) {
+ message = error.response?.data || error.message;
+ }
+ return message;
}
return fallbackMessage || 'Something went wrong.';
};
