diff --git a/apps/backend/src/errors/DashboardError.ts b/apps/backend/src/errors/DashboardError.ts index a696a66..41a6fb8 100644 --- a/apps/backend/src/errors/DashboardError.ts +++ b/apps/backend/src/errors/DashboardError.ts @@ -10,7 +10,7 @@ class DashboardError extends Error { "CRITICAL"; constructor(options: DashboardErrorParameter) { - super(); + super(options.message); this.errorCode = options.errorCode; this.statusCode = options.statusCode ?? this.statusCode; diff --git a/apps/frontend/src/errors/FormResponseError.ts b/apps/frontend/src/errors/FormResponseError.ts new file mode 100644 index 0000000..227927e --- /dev/null +++ b/apps/frontend/src/errors/FormResponseError.ts @@ -0,0 +1,15 @@ +class FormResponseError extends Error { + public readonly message: string; + public readonly formErrors: Record; + + constructor(message: string, formErrors: Record) { + super(message); + + this.message = message; + this.formErrors = formErrors; + + Object.setPrototypeOf(this, new.target.prototype); + } +} + +export default FormResponseError; diff --git a/apps/frontend/src/modules/usersManagement/modals/UserFormModal.tsx b/apps/frontend/src/modules/usersManagement/modals/UserFormModal.tsx index 8cdb1e2..ae0472e 100644 --- a/apps/frontend/src/modules/usersManagement/modals/UserFormModal.tsx +++ b/apps/frontend/src/modules/usersManagement/modals/UserFormModal.tsx @@ -19,6 +19,7 @@ import { TbDeviceFloppy } from "react-icons/tb"; import client from "../../../honoClient"; import { useEffect } from "react"; import { notifications } from "@mantine/notifications"; +import FormResponseError from "@/errors/FormResponseError"; const routeApi = getRouteApi("/_dashboardLayout/users/"); @@ -82,11 +83,19 @@ export default function UserFormModal() { ? await updateUser(options.data) : await createUser(options.data); }, - onError: (error) => { - try { - form.setErrors(JSON.parse(JSON.parse(error.message).message)); - } catch (e) { - console.error(e); + onError: (error: unknown) => { + console.log(error); + + if (error instanceof FormResponseError) { + form.setErrors(error.formErrors); + return; + } + + if (error instanceof Error) { + notifications.show({ + message: error.message, + color: "red", + }); } }, }); diff --git a/apps/frontend/src/utils/fetchRPC.ts b/apps/frontend/src/utils/fetchRPC.ts index 56c0aff..57a7552 100644 --- a/apps/frontend/src/utils/fetchRPC.ts +++ b/apps/frontend/src/utils/fetchRPC.ts @@ -1,3 +1,4 @@ +import FormResponseError from "@/errors/FormResponseError"; import { ClientResponse } from "hono/client"; // eslint-disable-next-line @typescript-eslint/no-explicit-any @@ -21,7 +22,17 @@ async function fetchRPC( //TODO: Add error reporting - const data = (await res.json()) as unknown as { message?: string }; + const data = (await res.json()) as unknown as { + message?: string; + formErrors?: Record; + }; + + if (res.status === 422 && data.formErrors) { + throw new FormResponseError( + data.message ?? "Something is gone wrong", + data.formErrors + ); + } throw new Error(data.message ?? "Something is gone wrong"); }