Mise en place de l'anglais comme deuxième langue pour l'application

web/src/app/campaigns/arc/arc-edit/arc-edit.component.html

@@ -2,24 +2,24 @@
 
   <div class="page-header">
     <div>
-      <h1>{{ arc?.name || 'Arc' }}</h1>
-      <p class="subtitle">Arc narratif</p>
+      <h1>{{ arc?.name || ('arcEdit.fallbackTitle' | translate) }}</h1>
+      <p class="subtitle">{{ 'arcEdit.subtitle' | translate }}</p>
     </div>
     <div class="header-actions">
       <button type="button" class="btn-ai"
         (click)="toggleChat()"
         [class.active]="chatOpen"
-        title="Ouvrir l'Assistant IA pour dialoguer autour de cet arc">
+        [title]="'arcEdit.aiAssistantTitle' | translate">
         <lucide-icon [img]="Sparkles" [size]="14"></lucide-icon>
-        Assistant IA
+        {{ 'arcEdit.aiAssistant' | translate }}
       </button>
-      <button type="button" class="btn-secondary" (click)="cancel()">Annuler</button>
+      <button type="button" class="btn-secondary" (click)="cancel()">{{ 'common.cancel' | translate }}</button>
       <button type="button" class="btn-danger" (click)="delete()">
         <lucide-icon [img]="Trash2" [size]="14"></lucide-icon>
-        Supprimer
+        {{ 'common.delete' | translate }}
       </button>
       <button type="button" class="btn-primary" (click)="submit()" [disabled]="form.invalid">
-        Sauvegarder
+        {{ 'common.save' | translate }}
       </button>
     </div>
   </div>
@@ -28,118 +28,118 @@
 
     <!-- Illustrations (galerie editable, rendu editorial) -->
     <div class="field">
-      <label>Illustrations</label>
+      <label>{{ 'arcEdit.illustrationsLabel' | translate }}</label>
       <app-image-gallery
         [imageIds]="illustrationImageIds"
         [editable]="true"
         [layout]="'EDITORIAL'"
         (imageIdsChange)="illustrationImageIds = $event">
       </app-image-gallery>
-      <small class="field-hint">Ambiances, portraits, visuels evocateurs de l'arc. JPEG, PNG, WebP ou GIF, 10 Mo max.</small>
+      <small class="field-hint">{{ 'arcEdit.illustrationsHint' | translate }}</small>
     </div>
 
     <!-- Cartes & plans -->
     <div class="field">
-      <label>Cartes &amp; plans</label>
+      <label>{{ 'arcEdit.mapsLabel' | translate }}</label>
       <app-image-gallery
         [imageIds]="mapImageIds"
         [editable]="true"
         [layout]="'MAPS'"
         (imageIdsChange)="mapImageIds = $event">
       </app-image-gallery>
-      <small class="field-hint">Cartes regionales et plans utiles aux joueurs pour situer l'action.</small>
+      <small class="field-hint">{{ 'arcEdit.mapsHint' | translate }}</small>
     </div>
 
     <div class="field">
-      <label for="arc-edit-name">Titre de l'arc *</label>
+      <label for="arc-edit-name">{{ 'arcEdit.nameLabel' | translate }}</label>
       <input
         id="arc-edit-name"
         type="text"
         formControlName="name"
-        placeholder="Ex: L'Ombre du Nord"
+        [placeholder]="'arcEdit.namePlaceholder' | translate"
         [class.invalid]="form.get('name')?.invalid && form.get('name')?.touched"
         />
     </div>
 
     <div class="field">
-      <label for="arc-edit-description">Synopsis de l'arc</label>
+      <label for="arc-edit-description">{{ 'arcEdit.synopsisLabel' | translate }}</label>
       <textarea
         id="arc-edit-description"
         formControlName="description"
-        placeholder="Décrivez l'histoire principale de cet arc narratif..."
+        [placeholder]="'arcEdit.synopsisPlaceholder' | translate"
         rows="5">
       </textarea>
     </div>
 
     <div class="field">
-      <label>Structure de l'arc</label>
+      <label>{{ 'arcEdit.structureLabel' | translate }}</label>
       <div class="arc-type-choice">
         <label class="arc-type-option" [class.selected]="form.get('type')?.value === 'LINEAR'">
           <input type="radio" formControlName="type" value="LINEAR" />
-          <span class="arc-type-title">Linéaire</span>
-          <span class="arc-type-desc">Chapitres joués dans l'ordre — narration séquentielle.</span>
+          <span class="arc-type-title">{{ 'arcEdit.linearTitle' | translate }}</span>
+          <span class="arc-type-desc">{{ 'arcEdit.linearDesc' | translate }}</span>
         </label>
         <label class="arc-type-option" [class.selected]="form.get('type')?.value === 'HUB'">
           <input type="radio" formControlName="type" value="HUB" />
-          <span class="arc-type-title">Hub</span>
-          <span class="arc-type-desc">Quêtes parallèles débloquées par des conditions (sandbox).</span>
+          <span class="arc-type-title">{{ 'arcEdit.hubTitle' | translate }}</span>
+          <span class="arc-type-desc">{{ 'arcEdit.hubDesc' | translate }}</span>
         </label>
       </div>
     </div>
 
     <div class="field">
-      <label>Icône</label>
+      <label>{{ 'arcEdit.iconLabel' | translate }}</label>
       <app-icon-picker [options]="campaignIconOptions" [(selected)]="selectedIcon"></app-icon-picker>
     </div>
 
     <div class="field-row">
       <div class="field">
-        <label for="arc-edit-themes">Thèmes principaux</label>
+        <label for="arc-edit-themes">{{ 'arcEdit.themesLabel' | translate }}</label>
         <textarea
           id="arc-edit-themes"
           formControlName="themes"
-          placeholder="Quels sont les thèmes explorés dans cet arc ? (trahison, rédemption...)"
+          [placeholder]="'arcEdit.themesPlaceholder' | translate"
           rows="4">
         </textarea>
       </div>
       <div class="field">
-        <label for="arc-edit-stakes">Enjeux globaux</label>
+        <label for="arc-edit-stakes">{{ 'arcEdit.stakesLabel' | translate }}</label>
         <textarea
           id="arc-edit-stakes"
           formControlName="stakes"
-          placeholder="Quels sont les enjeux majeurs de cet arc pour les personnages ?"
+          [placeholder]="'arcEdit.stakesPlaceholder' | translate"
           rows="4">
         </textarea>
       </div>
     </div>
 
     <div class="field">
-      <label for="arc-edit-gm-notes">Notes et planification du MJ</label>
+      <label for="arc-edit-gm-notes">{{ 'arcEdit.gmNotesLabel' | translate }}</label>
       <textarea
         id="arc-edit-gm-notes"
         formControlName="gmNotes"
-        placeholder="Vos notes sur la direction de l'arc, les twists prévus, les révélations importantes..."
+        [placeholder]="'arcEdit.gmNotesPlaceholder' | translate"
         rows="5">
       </textarea>
-      <small class="field-hint">Ces notes sont privées et ne seront pas exportées vers FoundryVTT.</small>
+      <small class="field-hint">{{ 'arcEdit.gmNotesHint' | translate }}</small>
     </div>
 
     <div class="field">
-      <label for="arc-edit-rewards">Récompenses et progression</label>
+      <label for="arc-edit-rewards">{{ 'arcEdit.rewardsLabel' | translate }}</label>
       <textarea
         id="arc-edit-rewards"
         formControlName="rewards"
-        placeholder="Quelles récompenses les joueurs obtiendront-ils ? Objets, niveaux, connaissances, contacts..."
+        [placeholder]="'arcEdit.rewardsPlaceholder' | translate"
         rows="4">
       </textarea>
     </div>
 
     <div class="field">
-      <label for="arc-edit-resolution">Dénouement prévu</label>
+      <label for="arc-edit-resolution">{{ 'arcEdit.resolutionLabel' | translate }}</label>
       <textarea
         id="arc-edit-resolution"
         formControlName="resolution"
-        placeholder="Comment cet arc devrait-il se terminer ? Quelles sont les issues possibles ?"
+        [placeholder]="'arcEdit.resolutionPlaceholder' | translate"
         rows="4">
       </textarea>
     </div>
@@ -147,7 +147,7 @@
     <!-- ===== Pages Lore associées (phase B2 cross-context) ===== -->
     @if (loreId) {
       <div class="field">
-        <label>Pages Lore associées</label>
+        <label>{{ 'arcEdit.relatedPagesLabel' | translate }}</label>
         <app-lore-link-picker
           [value]="relatedPageIds"
           [availablePages]="availablePages"
@@ -155,7 +155,7 @@
           (valueChange)="relatedPageIds = $event">
         </app-lore-link-picker>
         <small class="field-hint">
-          Liez cet arc à des PNJ, lieux ou éléments du Lore. Cliquez sur un chip pour ouvrir la page associée.
+          {{ 'arcEdit.relatedPagesHint' | translate }}
         </small>
       </div>
     }
@@ -163,8 +163,7 @@
     @if (!loreId) {
       <div class="field lore-hint">
         <small class="field-hint">
-          💡 Cette campagne n'est associée à aucun univers. Associez-la à un Lore dans l'écran de la campagne
-          pour pouvoir lier cet arc à des pages du Lore (PNJ, lieux, etc.).
+          {{ 'arcEdit.noLoreHint' | translate }}
         </small>
       </div>
     }
@@ -179,7 +178,7 @@
   entityType="arc"
   [entityId]="arcId"
   [isOpen]="chatOpen"
-  welcomeMessage="Je vois cet arc. Demande-moi d'enrichir ses thèmes, ses enjeux ou son dénouement."
+  [welcomeMessage]="'arcEdit.chatWelcome' | translate"
   [quickSuggestions]="chatQuickSuggestions"
   (close)="chatOpen = false">
 </app-ai-chat-drawer>

web/src/app/campaigns/arc/arc-edit/arc-edit.component.ts

@@ -5,6 +5,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 import { forkJoin, of } from 'rxjs';
 import { switchMap } from 'rxjs/operators';
 import { LucideAngularModule, Trash2, Sparkles } from 'lucide-angular';
+import { TranslatePipe, TranslateService } from '@ngx-translate/core';
 import { CampaignService } from '../../../services/campaign.service';
 import { CharacterService } from '../../../services/character.service';
 import { NpcService } from '../../../services/npc.service';
@@ -34,7 +35,7 @@ import { ConfirmDialogService } from '../../../shared/confirm-dialog/confirm-dia
  */
 @Component({
     selector: 'app-arc-edit',
-    imports: [ReactiveFormsModule, LucideAngularModule, LoreLinkPickerComponent, AiChatDrawerComponent, ImageGalleryComponent, IconPickerComponent],
+    imports: [ReactiveFormsModule, LucideAngularModule, LoreLinkPickerComponent, AiChatDrawerComponent, ImageGalleryComponent, IconPickerComponent, TranslatePipe],
     templateUrl: './arc-edit.component.html',
     styleUrls: ['./arc-edit.component.scss']
 })
@@ -46,11 +47,13 @@ export class ArcEditComponent implements OnInit, OnDestroy {
 
   /** État drawer chat IA (b5.7 — intégration Campagne). */
   chatOpen = false;
-  readonly chatQuickSuggestions = [
-    'Propose 3 thèmes majeurs pour cet arc',
-    'Imagine des enjeux qui mettent la pression sur les joueurs',
-    'Suggère un dénouement en deux actes'
-  ];
+  get chatQuickSuggestions(): string[] {
+    return [
+      this.translate.instant('arcEdit.chatSuggestion1'),
+      this.translate.instant('arcEdit.chatSuggestion2'),
+      this.translate.instant('arcEdit.chatSuggestion3')
+    ];
+  }
 
   toggleChat(): void { this.chatOpen = !this.chatOpen; }
 
@@ -83,7 +86,8 @@ export class ArcEditComponent implements OnInit, OnDestroy {
     private pageService: PageService,
     private layoutService: LayoutService,
     private pageTitleService: PageTitleService,
-    private confirmDialog: ConfirmDialogService
+    private confirmDialog: ConfirmDialogService,
+    private translate: TranslateService
   ) {
     this.form = this.fb.group({
       name:        ['', Validators.required],
@@ -149,7 +153,7 @@ export class ArcEditComponent implements OnInit, OnDestroy {
         resolution:  arc.resolution ?? ''
       });
 
-      this.layoutService.show(buildCampaignSidebarConfig(campaign, allCampaigns, treeData, this.campaignId));
+      this.layoutService.show(buildCampaignSidebarConfig(campaign, allCampaigns, treeData, this.campaignId, this.translate));
     });
   }
 
@@ -178,10 +182,10 @@ export class ArcEditComponent implements OnInit, OnDestroy {
 
   delete(): void {
     this.confirmDialog.confirm({
-      title: 'Supprimer l\'arc',
-      message: `Supprimer l'arc "${this.arc?.name}" ?`,
-      details: ['Cette action est irréversible.'],
-      confirmLabel: 'Supprimer',
+      title: this.translate.instant('arcEdit.deleteTitle'),
+      message: this.translate.instant('arcEdit.deleteMessage', { name: this.arc?.name }),
+      details: [this.translate.instant('arcEdit.irreversible')],
+      confirmLabel: this.translate.instant('common.delete'),
       variant: 'danger'
     }).then(ok => {
       if (!ok) return;