From 06aca62109445ffd20e780d5efc2497006b0289f Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Tue, 10 Oct 2023 20:56:56 +0000 Subject: [PATCH 1/5] fix(site): ensure empty string error shows default message --- site/src/api/errors.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/site/src/api/errors.ts b/site/src/api/errors.ts index b7fbd0c7d76b2..2d281ce751028 100644 --- a/site/src/api/errors.ts +++ b/site/src/api/errors.ts @@ -65,7 +65,8 @@ export const getErrorMessage = ( if (isApiError(error)) { return error.response.data.message; } - if (typeof error === "string") { + // if error is a non-empty string + if (error && typeof error === "string") { return error; } return defaultMessage; From d5dae66d624293caf8381dae3ca8bff392318e16 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Tue, 10 Oct 2023 21:12:59 +0000 Subject: [PATCH 2/5] added test --- site/src/api/errors.test.ts | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/site/src/api/errors.test.ts b/site/src/api/errors.test.ts index d3612b254e99d..5f01394624b58 100644 --- a/site/src/api/errors.test.ts +++ b/site/src/api/errors.test.ts @@ -3,6 +3,7 @@ import { getValidationErrorMessage, isApiError, mapApiErrorToFieldErrors, + getErrorMessage, } from "./errors"; describe("isApiError", () => { @@ -82,4 +83,10 @@ describe("getValidationErrorMessage", () => { ), ).toEqual(""); }); + + it("returns default message for error that is empty string", () => { + expect(getErrorMessage("", "Something went wrong.")).toBe( + "Something went wrong.", + ); + }); }); From 15b9ff0f3e66a780f102a7b2ed0a854506fdb6ee Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 11 Oct 2023 15:21:17 +0000 Subject: [PATCH 3/5] added logging --- site/src/api/api.ts | 2 ++ site/src/api/errors.ts | 2 ++ site/src/components/Alert/ErrorAlert.tsx | 3 +++ 3 files changed, 7 insertions(+) diff --git a/site/src/api/api.ts b/site/src/api/api.ts index 8ff9169c162b0..85a4f1d9037ed 100644 --- a/site/src/api/api.ts +++ b/site/src/api/api.ts @@ -462,6 +462,8 @@ export const getWorkspaces = async ( const url = getURLWithSearchParams("/api/v2/workspaces", options); const response = await axios.get(url); return response.data; + console.log("response", response); + console.log("response.data", response.data); }; export const getWorkspaceByOwnerAndName = async ( diff --git a/site/src/api/errors.ts b/site/src/api/errors.ts index 2d281ce751028..bab04e2f10dd3 100644 --- a/site/src/api/errors.ts +++ b/site/src/api/errors.ts @@ -63,10 +63,12 @@ export const getErrorMessage = ( defaultMessage: string, ): string => { if (isApiError(error)) { + console.log("in first error block"); return error.response.data.message; } // if error is a non-empty string if (error && typeof error === "string") { + console.log("in second error block"); return error; } return defaultMessage; diff --git a/site/src/components/Alert/ErrorAlert.tsx b/site/src/components/Alert/ErrorAlert.tsx index 40b125fdf4596..8a275c4889fe9 100644 --- a/site/src/components/Alert/ErrorAlert.tsx +++ b/site/src/components/Alert/ErrorAlert.tsx @@ -9,6 +9,9 @@ export const ErrorAlert: FC< const message = getErrorMessage(error, "Something went wrong."); const detail = getErrorDetail(error); + console.log("message", message); + console.log("detail", detail); + // For some reason, the message and detail can be the same on the BE, but does // not make sense in the FE to showing them duplicated const shouldDisplayDetail = message !== detail; From cd82e8d613005752adb0354796828328bc0de845 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 11 Oct 2023 15:45:03 +0000 Subject: [PATCH 4/5] asserting axios message --- site/src/api/api.ts | 2 +- site/src/api/errors.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/site/src/api/api.ts b/site/src/api/api.ts index 85a4f1d9037ed..58a558b6c54e9 100644 --- a/site/src/api/api.ts +++ b/site/src/api/api.ts @@ -461,9 +461,9 @@ export const getWorkspaces = async ( ): Promise => { const url = getURLWithSearchParams("/api/v2/workspaces", options); const response = await axios.get(url); - return response.data; console.log("response", response); console.log("response.data", response.data); + return response.data; }; export const getWorkspaceByOwnerAndName = async ( diff --git a/site/src/api/errors.ts b/site/src/api/errors.ts index bab04e2f10dd3..cbb1fd744ff64 100644 --- a/site/src/api/errors.ts +++ b/site/src/api/errors.ts @@ -62,7 +62,7 @@ export const getErrorMessage = ( error: unknown, defaultMessage: string, ): string => { - if (isApiError(error)) { + if (isApiError(error) && error.response.data.message) { console.log("in first error block"); return error.response.data.message; } From f5849bc0526ac1c04aea300b2ce61499ee373a57 Mon Sep 17 00:00:00 2001 From: Kira Pilot Date: Wed, 11 Oct 2023 16:10:01 +0000 Subject: [PATCH 5/5] cleanup and add test --- site/src/api/api.ts | 2 -- site/src/api/errors.test.ts | 11 +++++++++++ site/src/api/errors.ts | 4 ++-- site/src/components/Alert/ErrorAlert.tsx | 3 --- 4 files changed, 13 insertions(+), 7 deletions(-) diff --git a/site/src/api/api.ts b/site/src/api/api.ts index 58a558b6c54e9..8ff9169c162b0 100644 --- a/site/src/api/api.ts +++ b/site/src/api/api.ts @@ -461,8 +461,6 @@ export const getWorkspaces = async ( ): Promise => { const url = getURLWithSearchParams("/api/v2/workspaces", options); const response = await axios.get(url); - console.log("response", response); - console.log("response.data", response.data); return response.data; }; diff --git a/site/src/api/errors.test.ts b/site/src/api/errors.test.ts index 5f01394624b58..f17a1787112fd 100644 --- a/site/src/api/errors.test.ts +++ b/site/src/api/errors.test.ts @@ -89,4 +89,15 @@ describe("getValidationErrorMessage", () => { "Something went wrong.", ); }); + + it("returns default message for 404 API response", () => { + expect( + getErrorMessage( + mockApiError({ + message: "", + }), + "Something went wrong.", + ), + ).toBe("Something went wrong."); + }); }); diff --git a/site/src/api/errors.ts b/site/src/api/errors.ts index cbb1fd744ff64..953eefa47b5d5 100644 --- a/site/src/api/errors.ts +++ b/site/src/api/errors.ts @@ -62,13 +62,13 @@ export const getErrorMessage = ( error: unknown, defaultMessage: string, ): string => { + // if error is API error + // 404s result in the default message being returned if (isApiError(error) && error.response.data.message) { - console.log("in first error block"); return error.response.data.message; } // if error is a non-empty string if (error && typeof error === "string") { - console.log("in second error block"); return error; } return defaultMessage; diff --git a/site/src/components/Alert/ErrorAlert.tsx b/site/src/components/Alert/ErrorAlert.tsx index 8a275c4889fe9..40b125fdf4596 100644 --- a/site/src/components/Alert/ErrorAlert.tsx +++ b/site/src/components/Alert/ErrorAlert.tsx @@ -9,9 +9,6 @@ export const ErrorAlert: FC< const message = getErrorMessage(error, "Something went wrong."); const detail = getErrorDetail(error); - console.log("message", message); - console.log("detail", detail); - // For some reason, the message and detail can be the same on the BE, but does // not make sense in the FE to showing them duplicated const shouldDisplayDetail = message !== detail;