From 08f01e2b3b7fb9de466cfa10095559b6ad89b2a8 Mon Sep 17 00:00:00 2001
From: David Arranz <darranz@rodax-software.com>
Date: Thu, 8 Oct 2026 12:35:37 +0200
Subject: [PATCH] =?UTF-8?q?Selector=20para=20idioma=20al=20genera=20el=20P?=
 =?UTF-8?q?DF,=20tanto=20en=20alta=20como=20en=20modificaci=C3=B3n=20de=20?=
 =?UTF-8?q?cotizaciones.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../auth/LoginPageWithLanguageSelector.tsx    | 23 ++++------
 .../editors/QuoteGeneralCardEditor.tsx        | 42 ++++++++++++++-----
 client/src/app/quotes/create.tsx              | 30 ++++++++++++-
 client/src/lib/languages.tsx                  |  7 ++++
 client/src/locales/en.json                    |  7 ++--
 client/src/locales/es.json                    |  7 ++--
 .../application/Quote/CreateQuote.useCase.ts  |  2 +-
 .../application/Quote/UpdateQuote.useCase.ts  |  4 +-
 .../infrastructure/mappers/quote.mapper.ts    |  6 ++-
 9 files changed, 93 insertions(+), 35 deletions(-)
 create mode 100644 client/src/lib/languages.tsx

diff --git a/client/src/app/auth/LoginPageWithLanguageSelector.tsx b/client/src/app/auth/LoginPageWithLanguageSelector.tsx
index 732d428..480f660 100644
--- a/client/src/app/auth/LoginPageWithLanguageSelector.tsx
+++ b/client/src/app/auth/LoginPageWithLanguageSelector.tsx
@@ -2,6 +2,7 @@ import { Container, FormTextField } from "@/components";
 import { FormSubmitButton } from "@/components/Forms/FormSubmitButton";
 import { UeckoLogo } from "@/components/UeckoLogo/UeckoLogo";
 import { useLogin } from "@/lib/hooks";
+import { documentedLanguages } from "@/lib/languages";
 import {
   Alert,
   AlertDescription,
@@ -29,17 +30,8 @@ import { SubmitHandler, useForm } from "react-hook-form";
 import { Trans, useTranslation } from "react-i18next";
 import { Link, useNavigate } from "react-router-dom";
 import SpanishJoiMessages from "../../spanish-joi-messages.json";
-import "/node_modules/flag-icons/css/flag-icons.min.css";
-
 type LoginDataForm = ILogin_DTO;
 
-const languages = [
-  { code: "en", name: "English", flag: () => <span className='fi fi-gb'></span> },
-  { code: "es", name: "Español", flag: () => <span className='fi fi-es'></span> },
-  //{ code: "fr", name: "Français", flag: () => <span className='fi fi-fr'></span> },
-  //{ code: "it", name: "Italiano", flag: () => <span className='fi fi-it'></span> },
-];
-
 export const LoginPageWithLanguageSelector = () => {
   const { t, i18n } = useTranslation();
 
@@ -49,7 +41,7 @@ export const LoginPageWithLanguageSelector = () => {
 
   useEffect(() => {
     const browserLang = navigator.language.split("-")[0];
-    const supportedLang = languages.find((lang) => lang.code === browserLang);
+    const supportedLang = documentedLanguages.find((lang) => lang.code === browserLang);
     if (supportedLang) {
       changeLanguage(supportedLang.code);
     }
@@ -113,16 +105,19 @@ export const LoginPageWithLanguageSelector = () => {
               <DropdownMenuTrigger asChild>
                 <Button variant='outline' className='w-[140px] justify-start'>
                   <span className='mr-2'>
-                    {languages.find((lang) => lang.code === language)?.flag()}
+                    <span
+                      aria-hidden='true'
+                      className={documentedLanguages.find((lang) => lang.code === language)?.flagClassName}
+                    />
                   </span>
-                  {languages.find((lang) => lang.code === language)?.name}
+                  {documentedLanguages.find((lang) => lang.code === language)?.name}
                   <ChevronDownIcon className='w-4 h-4 ml-auto opacity-50' />
                 </Button>
               </DropdownMenuTrigger>
               <DropdownMenuContent className='w-[140px]'>
-                {languages.map((lang) => (
+                {documentedLanguages.map((lang) => (
                   <DropdownMenuItem key={lang.code} onSelect={() => changeLanguage(lang.code)}>
-                    <span className='mr-2'>{lang.flag()}</span>
+                    <span aria-hidden='true' className={`mr-2 ${lang.flagClassName}`} />
                     {lang.name}
                   </DropdownMenuItem>
                 ))}
diff --git a/client/src/app/quotes/components/editors/QuoteGeneralCardEditor.tsx b/client/src/app/quotes/components/editors/QuoteGeneralCardEditor.tsx
index db16ac4..f7c8d43 100644
--- a/client/src/app/quotes/components/editors/QuoteGeneralCardEditor.tsx
+++ b/client/src/app/quotes/components/editors/QuoteGeneralCardEditor.tsx
@@ -1,10 +1,11 @@
 import { FormDatePickerField, FormGroup, FormTextAreaField, FormTextField } from "@/components";
 import { Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui";
+import { documentedLanguages } from "@/lib/languages";
 import { t } from "i18next";
-import { useFormContext } from "react-hook-form";
+import { Controller, useFormContext } from "react-hook-form";
 
 export const QuoteGeneralCardEditor = () => {
-  const { formState } = useFormContext();
+  const { formState, control } = useFormContext();
 
   return (
     <div className='grid gap-6 md:grid-cols-6'>
@@ -12,6 +13,35 @@ export const QuoteGeneralCardEditor = () => {
         className='md:col-span-6'
         title={t("quotes.create.form_groups.general.title")}
         description={t("quotes.create.form_groups.general.desc")}
+        actions={
+          <div className='grid min-w-48 gap-1'>
+            <Label htmlFor='lang_code' className='text-xs text-muted-foreground'>
+              {t("quotes.form_fields.lang_code.label")}
+            </Label>
+            <Controller
+              control={control}
+              name='lang_code'
+              render={({ field }) => (
+                <Select value={field.value || "es"} onValueChange={field.onChange}>
+                  <SelectTrigger
+                    id='lang_code'
+                    aria-label={t("quotes.form_fields.lang_code.label")}
+                  >
+                    <SelectValue placeholder={t("quotes.form_fields.lang_code.placeholder")} />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {documentedLanguages.map((language) => (
+                      <SelectItem key={language.code} value={language.code}>
+                        <span aria-hidden='true' className={`mr-2 ${language.flagClassName}`} />
+                        {language.name}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              )}
+            />
+          </div>
+        }
       >
         <div className='grid grid-cols-6 gap-6'>
           <FormTextField
@@ -89,14 +119,6 @@ export const QuoteGeneralCardEditor = () => {
               </SelectContent>
             </Select>
           </div>
-          <FormTextField
-            required
-            label={t("quotes.form_fields.lang_code.label")}
-            description={t("quotes.form_fields.lang_code.desc")}
-            //disabled={formState.disabled}
-            placeholder={t("quotes.form_fields.lang_code.placeholder")}
-            name='lang_code'
-          />
           <FormTextField
             required
             label={t("quotes.form_fields.currency_code.label")}
diff --git a/client/src/app/quotes/create.tsx b/client/src/app/quotes/create.tsx
index eba08c3..ba737f4 100644
--- a/client/src/app/quotes/create.tsx
+++ b/client/src/app/quotes/create.tsx
@@ -10,16 +10,17 @@ import { t } from "i18next";
 
 import { SubmitButton } from "@/components";
 import { useUnsavedChangesNotifier } from "@/lib/hooks";
-import { Button, Form, Separator } from "@/ui";
+import { Button, Form, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Separator } from "@/ui";
 import { useToast } from "@/ui/use-toast";
 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 { Controller, SubmitHandler, useForm } from "react-hook-form";
 import { useNavigate } from "react-router-dom";
 import SpanishJoiMessages from "../../spanish-joi-messages.json";
 import { useQuotes } from "./hooks";
+import { documentedLanguages } from "@/lib/languages";
 
 interface QuoteDataForm extends ICreateQuote_Request_DTO {}
 
@@ -32,6 +33,7 @@ export const QuoteCreate = () => {
   const defaultValues = useMemo(
     () => ({
       date: new Date(Date.now()).toUTCString(),
+      lang_code: "es",
       customer_reference: "",
       customer_information: "",
       //reference: "",
@@ -141,6 +143,30 @@ export const QuoteCreate = () => {
                 name='date'
               />
 
+              <div className='grid gap-2'>
+                <Label htmlFor='lang_code'>{t("quotes.form_fields.lang_code.label")}</Label>
+                <Controller
+                  control={form.control}
+                  name='lang_code'
+                  render={({ field }) => (
+                    <Select value={field.value || "es"} onValueChange={field.onChange}>
+                      <SelectTrigger id='lang_code' aria-label={t("quotes.form_fields.lang_code.label")}>
+                        <SelectValue />
+                      </SelectTrigger>
+                      <SelectContent>
+                        {documentedLanguages.map((language) => (
+                          <SelectItem key={language.code} value={language.code}>
+                            <span aria-hidden='true' className={`mr-2 ${language.flagClassName}`} />
+                            {language.name}
+                          </SelectItem>
+                        ))}
+                      </SelectContent>
+                    </Select>
+                  )}
+                />
+                <p className='text-sm text-muted-foreground'>{t("quotes.form_fields.lang_code.desc")}</p>
+              </div>
+
               <Separator />
 
               <FormTextAreaField
diff --git a/client/src/lib/languages.tsx b/client/src/lib/languages.tsx
new file mode 100644
index 0000000..e75006a
--- /dev/null
+++ b/client/src/lib/languages.tsx
@@ -0,0 +1,7 @@
+import "/node_modules/flag-icons/css/flag-icons.min.css";
+
+/** Presentation-only options shared by selectors for supported document languages. */
+export const documentedLanguages = [
+  { code: "es", name: "Español", flagClassName: "fi fi-es" },
+  { code: "en", name: "English", flagClassName: "fi fi-gb" },
+] as const;
diff --git a/client/src/locales/en.json b/client/src/locales/en.json
index 71c8529..39801ee 100644
--- a/client/src/locales/en.json
+++ b/client/src/locales/en.json
@@ -339,9 +339,10 @@
           "placeholder": ""
         },
         "lang_code": {
-          "label": "Language",
-          "desc": "Quote language",
-          "placeholder": ""
+          "label": "Document language",
+          "desc": "Language used to generate the quote PDF",
+          "placeholder": "",
+          "options": { "es": "Spanish", "en": "English" }
         },
         "currency_code": {
           "label": "Currency",
diff --git a/client/src/locales/es.json b/client/src/locales/es.json
index 31d3464..aff0d9c 100644
--- a/client/src/locales/es.json
+++ b/client/src/locales/es.json
@@ -339,9 +339,10 @@
           "placeholder": ""
         },
         "lang_code": {
-          "label": "Idioma",
-          "desc": "Idioma de la cotización",
-          "placeholder": ""
+          "label": "Idioma del documento",
+          "desc": "Idioma utilizado para generar el presupuesto en PDF",
+          "placeholder": "",
+          "options": { "es": "Español", "en": "Inglés" }
         },
         "currency_code": {
           "label": "Moneda",
diff --git a/server/src/contexts/sales/application/Quote/CreateQuote.useCase.ts b/server/src/contexts/sales/application/Quote/CreateQuote.useCase.ts
index 19874f1..c151bc7 100644
--- a/server/src/contexts/sales/application/Quote/CreateQuote.useCase.ts
+++ b/server/src/contexts/sales/application/Quote/CreateQuote.useCase.ts
@@ -150,7 +150,7 @@ export class CreateQuoteUseCase
     }
 
     const languageOrError = Language.createFromCode(
-      quoteDTO.lang_code ?? this._dealer?.language.code
+      quoteDTO.lang_code || Language.DEFAULT_LANGUAGE_CODE
     );
     if (languageOrError.isFailure) {
       return Result.fail(languageOrError.error);
diff --git a/server/src/contexts/sales/application/Quote/UpdateQuote.useCase.ts b/server/src/contexts/sales/application/Quote/UpdateQuote.useCase.ts
index 03e392d..170388a 100644
--- a/server/src/contexts/sales/application/Quote/UpdateQuote.useCase.ts
+++ b/server/src/contexts/sales/application/Quote/UpdateQuote.useCase.ts
@@ -165,7 +165,9 @@ export class UpdateQuoteUseCase
       return Result.fail(referenceOrError.error);
     }
 
-    const languageOrError = Language.createFromCode(quoteDTO.lang_code);
+    const languageOrError = Language.createFromCode(
+      quoteDTO.lang_code || Language.DEFAULT_LANGUAGE_CODE
+    );
     if (languageOrError.isFailure) {
       return Result.fail(languageOrError.error);
     }
diff --git a/server/src/contexts/sales/infrastructure/mappers/quote.mapper.ts b/server/src/contexts/sales/infrastructure/mappers/quote.mapper.ts
index 35baf38..3a928c6 100644
--- a/server/src/contexts/sales/infrastructure/mappers/quote.mapper.ts
+++ b/server/src/contexts/sales/infrastructure/mappers/quote.mapper.ts
@@ -50,7 +50,11 @@ class QuoteMapper
       date: this.mapsValue(source, "date", UTCDateValue.create),
       reference: this.mapsValue(source, "reference", QuoteReference.create),
       currency: this.mapsValue(source, "currency_code", CurrencyData.createFromCode),
-      language: this.mapsValue(source, "lang_code", Language.createFromCode),
+      language: this.mapsValue(
+        source,
+        "lang_code",
+        (value) => Language.createFromCode(value || Language.DEFAULT_LANGUAGE_CODE)
+      ),
       customerReference: this.mapsValue(
         source,
         "customer_reference",