From 6ec45bb772057945caaaef0cec799cb581d437eb Mon Sep 17 00:00:00 2001
From: Nathan Vasse <nathan.vasse@gmail.com>
Date: Fri, 28 Mar 2025 16:38:10 +0100
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F(front)=20add=20AppError?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The current errorToString was showing complete javascript errors.
Which is not what we want, it those cases we want to show generic
errors, technical informations are not needed to users. So to
make sure some error are shown to the users, use AppError.
---
 .../apps/drive/src/features/api/APIError.ts   | 28 +++++++++----------
 .../drive/src/features/errors/AppError.ts     |  1 +
 2 files changed, 15 insertions(+), 14 deletions(-)
 create mode 100644 src/frontend/apps/drive/src/features/errors/AppError.ts

diff --git a/src/frontend/apps/drive/src/features/api/APIError.ts b/src/frontend/apps/drive/src/features/api/APIError.ts
index e93dcda6..24fb6f5e 100644
--- a/src/frontend/apps/drive/src/features/api/APIError.ts
+++ b/src/frontend/apps/drive/src/features/api/APIError.ts
@@ -1,5 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import i18n from "@/features/i18n/initI18n";
+import { AppError } from "../errors/AppError";
 
 export class APIError extends Error {
   data?: any;
@@ -19,25 +20,24 @@ export const errorToString = (error: unknown): string => {
   if (error instanceof APIError) {
     // If there is a data, it means that the error is a JSON object
     if (error.data) {
-      return errorToString(error.data);
+      /**
+       * This is made to handle full text errors from the API like:
+       *
+       * "title": [
+       *   "The title field is required."
+       *  ]
+       */
+      return Object.entries(error.data)
+        .map(([, value]) => `${value}`)
+        .join("\n");
     }
     // If there is no data, it means that the error is a string, probably a complicated html error.
     return i18n.t("api.error.unexpected");
   }
-  if (error instanceof Error) {
+  // We want to show the error message from the AppError only. Not message from the Error class as they
+  // can be really technical and not helpful for the user. For those we show the generic error message.
+  if (error instanceof AppError) {
     return error.message;
   }
-  if (typeof error === "object" && error !== null) {
-    /**
-     * This is made to handle full text errors from the API like:
-     *
-     * "title": [
-     *   "The title field is required."
-     *  ]
-     */
-    return Object.entries(error)
-      .map(([, value]) => `${errorToString(value)}`)
-      .join("\n");
-  }
   return i18n.t("api.error.unexpected");
 };
diff --git a/src/frontend/apps/drive/src/features/errors/AppError.ts b/src/frontend/apps/drive/src/features/errors/AppError.ts
new file mode 100644
index 00000000..56ee6854
--- /dev/null
+++ b/src/frontend/apps/drive/src/features/errors/AppError.ts
@@ -0,0 +1 @@
+export class AppError extends Error {}