feat(front-end): traslation in italian

frontend/src/app/shared/components/app-dropzone/app-dropzone.component.html

@@ -12,8 +12,8 @@
     <div class="icon">
       <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-upload-cloud"><polyline points="16 16 12 12 8 16"></polyline><line x1="12" y1="12" x2="12" y2="21"></line><path d="M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3"></path><polyline points="16 16 12 12 8 16"></polyline></svg>
     </div>
-    <p class="text">{{ label() }}</p>
-    <p class="subtext">{{ subtext() }}</p>
+    <p class="text">{{ label() | translate }}</p>
+    <p class="subtext">{{ subtext() | translate }}</p>
     
     @if (fileNames().length > 0) {
         <div class="file-badges">

frontend/src/app/shared/components/app-dropzone/app-dropzone.component.ts

@@ -1,16 +1,17 @@
 import { Component, input, output, signal } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { TranslateModule } from '@ngx-translate/core';
 
 @Component({
   selector: 'app-dropzone',
   standalone: true,
-  imports: [CommonModule],
+  imports: [CommonModule, TranslateModule],
   templateUrl: './app-dropzone.component.html',
   styleUrl: './app-dropzone.component.scss'
 })
 export class AppDropzoneComponent {
-  label = input<string>('Drop files here or click to upload');
-  subtext = input<string>('Supports .stl, .3mf, .step');
+  label = input<string>('DROPZONE.DEFAULT_LABEL');
+  subtext = input<string>('DROPZONE.DEFAULT_SUBTEXT');
   accept = input<string>('.stl,.3mf,.step,.stp');
   multiple = input<boolean>(true);
   

frontend/src/app/shared/components/color-selector/color-selector.component.html

@@ -14,7 +14,7 @@
     <div class="color-popup">
       @for (category of categories(); track category.name) {
         <div class="category">
-          <div class="category-name">{{ category.name }}</div>
+          <div class="category-name">{{ category.name | translate }}</div>
           <div class="colors-grid">
             @for (color of category.colors; track color.value) {
               <div 
@@ -28,7 +28,7 @@
                      <div class="color-circle small" [style.background-color]="color.hex"></div>
                 </div>
                 
-                <span class="color-name">{{ color.label }}</span>
+                <span class="color-name">{{ color.label | translate }}</span>
               </div>
             }
           </div>

frontend/src/app/shared/components/color-selector/color-selector.component.ts

@@ -24,7 +24,7 @@ export class ColorSelectorComponent {
           // Flatten variants into a single category for now
           // We could try to group by extracting words, but "Colors" is fine.
           return [{
-              name: 'Available Colors',
+              name: 'COLOR.AVAILABLE_COLORS',
               colors: vars.map(v => ({
                   label: v.colorName, // Display "Red"
                   value: v.colorName, // Send "Red" to backend

frontend/src/app/shared/components/stl-viewer/stl-viewer.component.html

@@ -2,7 +2,7 @@
   @if (loading) {
     <div class="loading-overlay">
       <div class="spinner"></div>
-      <span>Loading 3D Model...</span>
+      <span>{{ 'STL_VIEWER.LOADING' | translate }}</span>
     </div>
   }
   @if (file && !loading) {

frontend/src/app/shared/components/stl-viewer/stl-viewer.component.ts

@@ -1,5 +1,6 @@
 import { Component, ElementRef, Input, OnChanges, OnDestroy, OnInit, ViewChild, SimpleChanges } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { TranslateModule } from '@ngx-translate/core';
 import * as THREE from 'three';
 // @ts-ignore
 import { STLLoader } from 'three/examples/jsm/loaders/STLLoader.js';
@@ -9,7 +10,7 @@ import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
 @Component({
   selector: 'app-stl-viewer',
   standalone: true,
-  imports: [CommonModule],
+  imports: [CommonModule, TranslateModule],
   templateUrl: './stl-viewer.component.html',
   styleUrl: './stl-viewer.component.scss'
 })