.

client/src/app/quotes/create.tsx

@@ -1,6 +1,5 @@
 import {
   BackHistoryButton,
-  ErrorOverlay,
   FormDatePickerField,
   FormTextAreaField,
   FormTextField,
@@ -11,7 +10,10 @@ import { t } from "i18next";
 import { SubmitButton } from "@/components";
 import { useUnsavedChangesNotifier } from "@/lib/hooks";
 import { Button, Form } from "@/ui";
+import { joiResolver } from "@hookform/resolvers/joi";
 import { ICreateQuote_Request_DTO } from "@shared/contexts";
+import Joi from "joi";
+import { useMemo } from "react";
 import { SubmitHandler, useForm } from "react-hook-form";
 import { useNavigate } from "react-router-dom";
 import { toast } from "react-toastify";
@@ -22,14 +24,30 @@ interface QuoteDataForm extends ICreateQuote_Request_DTO {}
 export const QuoteCreate = () => {
   const navigate = useNavigate();
   const { useCreate } = useQuotes();
-  const { mutate, error: mutateError, isError, isPending } = useCreate();
+  const { mutate, isPending } = useCreate();
 
-  const form = useForm<QuoteDataForm>({
+  const defaultValues = useMemo(
-    defaultValues: {
+    () => ({
       date: new Date(Date.now()).toUTCString(),
       customer_information: "",
       reference: "",
-    },
+    }),
+    []
+  );
+
+  const form = useForm<QuoteDataForm>({
+    mode: "onBlur",
+    defaultValues,
+    resolver: joiResolver(
+      Joi.object({
+        reference: Joi.string().required(),
+        date: Joi.string().required(),
+        customer_information: Joi.string().required(),
+      }),
+      {
+        //messages: SpanishJoiMessages,
+      }
+    ),
   });
 
   const { formState, reset, getValues, handleSubmit } = form;
@@ -61,9 +79,9 @@ export const QuoteCreate = () => {
     return <LoadingOverlay title='Guardando ajustes' />;
   }
 
-  if (isError) {
+  /*if (isError) {
     return <ErrorOverlay errorMessage={mutateError?.message} />;
-  }
+  }*/
 
   if (isPending) {
     return <LoadingOverlay />;

client/src/lib/axios/setupInterceptors.ts

@@ -43,23 +43,62 @@ const onResponse = (response: AxiosResponse): AxiosResponse => {
 };
 
 const onResponseError = (error: AxiosError): Promise<AxiosError> => {
-  console.group("[response error]");
+  console.log("[response error]");
   console.log(error);
 
   if (error.response) {
     // La respuesta fue hecha y el servidor respondió con un código de estado
     // que esta fuera del rango de 2xx
     console.log("1 => El servidor respondió con un código de estado > 200");
-    console.log(error.response.data);
-    console.log(error.response.status);
 
-    switch (error.response.status) {
+    const data = error.response.data;
+    const status = error.response.status;
+
+    console.log(data);
+    console.log(status);
+
+    /*
+
+      {
+        detail: "Quote data not valid",
+        instance: "/api/v1/quotes",
+        status: 422,
+        title: "Unprocessable Entity",
+        type: "about:blank",
+        context: {
+          params: {
+          },
+          query: {
+          },
+          body: {
+            date: "2024-08-13",
+            customer_information: "",
+            reference: "",
+            status: "draft",
+            id: "9c1c6073-127a-4bde-a73c-6229efb51ad0",
+          },
+        },
+        extra: {
+          errors: [
+            {
+              reference: "{reference} is not allowed to be empty",
+            },
+            {
+              customer_information: "{customer_information} is not allowed to be empty",
+            },
+          ],
+        },
+      }
+  
+  */
+
+    switch (status) {
       case 400:
         console.error("Bad Request");
         break;
       case 401:
         console.error("UnAuthorized");
-        return (window.location.href = "/logout");
+        window.location.href = "/logout";
         break;
       case 403:
         console.error("Forbidden");
@@ -74,9 +113,9 @@ const onResponseError = (error: AxiosError): Promise<AxiosError> => {
 
       case 422:
         console.error("Unprocessable Content");
-        throw error.response.data;
+        break;
     }
-    console.error(error.response.status);
+    return Promise.reject(data);
   } else if (error.request) {
     // La petición fue hecha pero no se recibió respuesta
     console.log("2 => El servidor no respondió");
@@ -87,7 +126,7 @@ const onResponseError = (error: AxiosError): Promise<AxiosError> => {
     console.error(error);
   }
   console.groupEnd();
-  throw error;
+  return Promise.reject(error);
 };
 
 export function setupInterceptorsTo(axiosInstance: AxiosInstance): AxiosInstance {