feat(back-end front-end): integration with twint

frontend/src/app/features/calculator/calculator-page.component.ts

@@ -49,7 +49,11 @@ export class CalculatorPageComponent implements OnInit {
     this.route.queryParams.subscribe(params => {
         const sessionId = params['session'];
         if (sessionId) {
-            this.loadSession(sessionId);
+            // Avoid reloading if we just calculated this session
+            const currentRes = this.result();
+            if (!currentRes || currentRes.sessionId !== sessionId) {
+                this.loadSession(sessionId);
+            }
         }
     });
   }

frontend/src/app/features/calculator/services/quote-estimator.service.ts

@@ -215,7 +215,7 @@ export class QuoteEstimatorService {
                      
                      const settings = {
                          complexityMode: request.mode.toUpperCase(),
-                         material: this.mapMaterial(request.material),
+                         material: request.material,
                          quality: request.quality,
                          supportsEnabled: request.supportEnabled,
                          color: item.color || '#FFFFFF',
@@ -317,14 +317,6 @@ export class QuoteEstimatorService {
     });
   }
 
-  private mapMaterial(mat: string): string {
-    const m = mat.toUpperCase();
-    if (m.includes('PLA')) return 'pla_basic';
-    if (m.includes('PETG')) return 'petg_basic';
-    if (m.includes('TPU')) return 'tpu_95a';
-    return 'pla_basic';
-  }
-
   // Consultation Data Transfer
   private pendingConsultation = signal<{files: File[], message: string} | null>(null);
 

frontend/src/app/features/order/order.component.html

@@ -71,10 +71,17 @@
                 <img *ngIf="twintQrUrl()" class="twint-qr" [src]="getTwintQrUrl()" (error)="onTwintQrError()" alt="TWINT payment QR" />
                 <p>{{ 'PAYMENT.TWINT_DESC' | translate }}</p>
                 <p class="billing-hint">{{ 'PAYMENT.BILLING_INFO_HINT' | translate }}</p>
-                <div class="twint-mobile-action">
-                  <app-button (click)="openTwintPayment()" [fullWidth]="true">
-                    {{ 'PAYMENT.TWINT_OPEN' | translate }}
-                  </app-button>
+                <div class="twint-mobile-action twint-button-container">
+                  <button style="width: auto; height: 58px;
+border-radius: 6px;
+display: flex;
+justify-content: center;
+cursor: pointer;
+background-color: transparent;
+border: none;
+align-items: center;" (click)="openTwintPayment()">
+                    <img style="width: auto; height: 58px" alt="Embedded TWINT button" [src]="getTwintButtonImageUrl()"/>
+                  </button>
                 </div>
                 <p class="amount">{{ 'PAYMENT.TOTAL' | translate }}: {{ o.totalChf | currency:'CHF' }}</p>
               </div>

frontend/src/app/features/order/order.component.scss

@@ -150,6 +150,8 @@
     width: 100%;
     max-width: 320px;
     margin-top: var(--space-3);
+    display: flex;
+    justify-content: center;
   }
 
   .amount {

frontend/src/app/features/order/order.component.ts

@@ -4,7 +4,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 import { AppButtonComponent } from '../../shared/components/app-button/app-button.component';
 import { AppCardComponent } from '../../shared/components/app-card/app-card.component';
 import { QuoteEstimatorService } from '../calculator/services/quote-estimator.service';
-import { TranslateModule } from '@ngx-translate/core';
+import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import { environment } from '../../../environments/environment';
 
 @Component({
@@ -18,6 +18,7 @@ export class OrderComponent implements OnInit {
   private route = inject(ActivatedRoute);
   private router = inject(Router);
   private quoteService = inject(QuoteEstimatorService);
+  private translate = inject(TranslateService);
 
   orderId: string | null = null;
   selectedPaymentMethod: 'twint' | 'bill' | null = 'twint';
@@ -101,6 +102,15 @@ export class OrderComponent implements OnInit {
     return this.twintQrUrl() ?? '';
   }
 
+  getTwintButtonImageUrl(): string {
+    const lang = this.translate.currentLang;
+    if (lang === 'de') {
+      return 'https://go.twint.ch/static/img/button_dark_de.svg';
+    }
+    // Default to EN for everything else (it, fr, en) as instructed or if not DE
+    return 'https://go.twint.ch/static/img/button_dark_en.svg';
+  }
+
   onTwintQrError(): void {
     this.twintQrUrl.set(null);
   }

frontend/src/assets/i18n/it.json

@@ -262,7 +262,7 @@
     "BANK_OWNER": "Titolare",
     "BANK_IBAN": "IBAN",
     "BANK_REF": "Riferimento",
-    "BILLING_INFO_HINT": "Aggiungi le informazioni uguali a quelle della fatturazione.",
+    "BILLING_INFO_HINT": "Abbiamo compilato i campi per te, per favore non modificare il motivo del pagamento",
     "DOWNLOAD_QR": "Scarica QR-Fattura (PDF)",
     "CONFIRM": "Ho completato il pagamento",
     "SUMMARY_TITLE": "Riepilogo Ordine",