From da8e47648511f2b4150b20b90b37c4e46ac56237 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joe=20K=C3=BCng?= <joekueng05@gmail.com>
Date: Wed, 4 Feb 2026 16:31:38 +0100
Subject: [PATCH] fix(web): traslation error

---
 frontend/src/app/app.config.ts                         | 10 +++++++---
 .../components/contact-form/contact-form.component.ts  | 10 +++++-----
 frontend/src/assets/i18n/en.json                       |  2 ++
 frontend/src/assets/i18n/it.json                       |  2 ++
 4 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/frontend/src/app/app.config.ts b/frontend/src/app/app.config.ts
index bb34c85..e17af19 100644
--- a/frontend/src/app/app.config.ts
+++ b/frontend/src/app/app.config.ts
@@ -2,8 +2,8 @@ import { ApplicationConfig, provideZoneChangeDetection, importProvidersFrom } fr
 import { provideRouter, withComponentInputBinding, withViewTransitions } from '@angular/router';
 import { routes } from './app.routes';
 import { provideHttpClient } from '@angular/common/http';
-import { TranslateModule } from '@ngx-translate/core';
-import { provideTranslateHttpLoader } from '@ngx-translate/http-loader';
+import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
+import { provideTranslateHttpLoader, TranslateHttpLoader } from '@ngx-translate/http-loader';
 
 export const appConfig: ApplicationConfig = {
   providers: [
@@ -16,7 +16,11 @@ export const appConfig: ApplicationConfig = {
     }),
     importProvidersFrom(
       TranslateModule.forRoot({
-        defaultLanguage: 'it'
+        defaultLanguage: 'it',
+        loader: {
+          provide: TranslateLoader,
+          useClass: TranslateHttpLoader
+        }
       })
     )
   ]
diff --git a/frontend/src/app/features/contact/components/contact-form/contact-form.component.ts b/frontend/src/app/features/contact/components/contact-form/contact-form.component.ts
index af24bbb..7770e6c 100644
--- a/frontend/src/app/features/contact/components/contact-form/contact-form.component.ts
+++ b/frontend/src/app/features/contact/components/contact-form/contact-form.component.ts
@@ -1,7 +1,7 @@
 import { Component, signal, effect } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ReactiveFormsModule, FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { TranslateModule } from '@ngx-translate/core';
+import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import { AppInputComponent } from '../../../../shared/components/app-input/app-input.component';
 import { AppButtonComponent } from '../../../../shared/components/app-button/app-button.component';
 
@@ -29,7 +29,7 @@ interface FilePreview {
 
       <div class="row">
         <!-- Phone -->
-        <app-input formControlName="email" type="email" label="Email *" [placeholder]="'CONTACT.PLACEHOLDER_EMAIL' | translate" class="col"></app-input>
+        <app-input formControlName="email" type="email" [label]="'CONTACT.LABEL_EMAIL' | translate" [placeholder]="'CONTACT.PLACEHOLDER_EMAIL' | translate" class="col"></app-input>
         <!-- Phone -->
         <app-input formControlName="phone" type="tel" [label]="('CONTACT.PHONE' | translate)" [placeholder]="'CONTACT.PLACEHOLDER_PHONE' | translate" class="col"></app-input>
       </div>
@@ -45,7 +45,7 @@ interface FilePreview {
       </div>
 
       <!-- Personal Name (Only if NOT Company) -->
-      <app-input *ngIf="!isCompany" formControlName="name" label="Nome *" [placeholder]="'CONTACT.PLACEHOLDER_NAME' | translate"></app-input>
+      <app-input *ngIf="!isCompany" formControlName="name" [label]="'CONTACT.LABEL_NAME' | translate" [placeholder]="'CONTACT.PLACEHOLDER_NAME' | translate"></app-input>
 
       <!-- Company Fields (Only if Company) -->
       <div *ngIf="isCompany" class="company-fields">
@@ -242,7 +242,7 @@ export class ContactFormComponent {
     { value: 'question', label: 'CONTACT.REQ_TYPE_QUESTION' }
   ];
 
-  constructor(private fb: FormBuilder) {
+  constructor(private fb: FormBuilder, private translate: TranslateService) {
     this.form = this.fb.group({
       requestType: ['custom', Validators.required],
       name: ['', Validators.required],
@@ -302,7 +302,7 @@ export class ContactFormComponent {
   handleFiles(newFiles: File[]) {
     const currentFiles = this.files();
     if (currentFiles.length + newFiles.length > 15) {
-      alert("Max 15 files limit reached.");
+      alert(this.translate.instant('CONTACT.ERR_MAX_FILES'));
       return;
     }
 
diff --git a/frontend/src/assets/i18n/en.json b/frontend/src/assets/i18n/en.json
index e68cbbf..826df25 100644
--- a/frontend/src/assets/i18n/en.json
+++ b/frontend/src/assets/i18n/en.json
@@ -85,6 +85,8 @@
     "PLACEHOLDER_COMPANY": "Company Name",
     "PLACEHOLDER_REF_PERSON": "Reference Person",
     "LABEL_MESSAGE": "Message *",
+    "LABEL_EMAIL": "Email *",
+    "LABEL_NAME": "Name *",
     "MSG_SENT": "Sent!",
     "ERR_MAX_FILES": "Max 15 files limit reached."
   }
diff --git a/frontend/src/assets/i18n/it.json b/frontend/src/assets/i18n/it.json
index f45eda5..c7abd1b 100644
--- a/frontend/src/assets/i18n/it.json
+++ b/frontend/src/assets/i18n/it.json
@@ -90,6 +90,8 @@
     "PLACEHOLDER_COMPANY": "Nome Azienda",
     "PLACEHOLDER_REF_PERSON": "Persona di Riferimento",
     "LABEL_MESSAGE": "Messaggio *",
+    "LABEL_EMAIL": "Email *",
+    "LABEL_NAME": "Nome *",
     "MSG_SENT": "Inviato!",
     "ERR_MAX_FILES": "Limite massimo di 15 file raggiunto."
   }