Edition des issues

src/app/issues/issue-detail/issue-detail.ts

@@ -1,82 +1,64 @@
-import { Component, inject, signal } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-
-type IssueStatus = 'draft' | 'todo' | 'done' | 'in-progress';
-
-type IssueDetailModel = {
-  id: number;
-  assignee: string;
-  epic: string;
-  name: string;
-  dueDate: string;
-  description: string;
-  priority: 'Basse' | 'Moyenne' | 'Haute';
-  status: IssueStatus;
-  progress: number;
-};
+import { Component, inject } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+import { IssueEntity, IssuesStore } from '../issues.store';
 
 @Component({
   selector: 'app-issue-detail',
-  imports: [],
+  imports: [FormsModule],
   templateUrl: './issue-detail.html',
   styleUrl: './issue-detail.css',
 })
 export class IssueDetail {
   private readonly route = inject(ActivatedRoute);
+  private readonly router = inject(Router);
+  private readonly issuesStore = inject(IssuesStore);
 
-  protected readonly issue = signal<IssueDetailModel>(this.buildIssue());
+  protected issue: IssueEntity = this.buildIssue();
+  protected isEditing = this.route.snapshot.queryParamMap.get('mode') === 'edit';
 
-  private buildIssue(): IssueDetailModel {
+  protected toggleEdit(): void {
+    this.isEditing = !this.isEditing;
+  }
+
+  protected saveIssue(): void {
+    this.issuesStore.upsert(this.issue);
+    this.isEditing = false;
+    this.router.navigate(['/issues']);
+  }
+
+  private buildIssue(): IssueEntity {
     const idParam = this.route.snapshot.paramMap.get('id');
     const draftId = this.route.snapshot.queryParamMap.get('draftId');
+    const isNewIssueRoute = this.route.snapshot.routeConfig?.path === 'issues/new';
 
-    const resolvedId = Number(idParam ?? draftId ?? 1);
-    const safeId = Number.isNaN(resolvedId) ? 1 : resolvedId;
+    const resolvedId = Number(idParam ?? draftId ?? 0);
+    const safeId = Number.isNaN(resolvedId) ? 0 : resolvedId;
 
-    const existingIssues: Record<number, IssueDetailModel> = {
-      1: {
-        id: 1,
-        assignee: 'Marie',
-        epic: 'EPIC-UI',
-        name: 'Bug affichage menu mobile',
-        dueDate: '2026-06-10',
-        description: 'Corriger le comportement du menu sur petits ecrans.',
-        priority: 'Haute',
-        status: 'in-progress',
-        progress: 35,
-      },
-      2: {
-        id: 2,
-        assignee: 'Nabil',
-        epic: 'EPIC-FORM',
-        name: 'Erreur validation formulaire projet',
-        dueDate: '2026-06-12',
-        description: 'Fiabiliser les regles de validation du formulaire projet.',
+    if (isNewIssueRoute) {
+      return {
+        id: safeId,
+        assignee: '',
+        epic: '',
+        name: '',
+        dueDate: '',
+        description: '',
         priority: 'Moyenne',
-        status: 'todo',
-        progress: 20,
-      },
-      3: {
-        id: 3,
-        assignee: 'Sonia',
-        epic: 'EPIC-CONTENT',
-        name: 'Mise a jour message de bienvenue',
-        dueDate: '2026-06-18',
-        description: 'Mettre a jour le wording d accueil selon la charte produit.',
-        priority: 'Basse',
-        status: 'done',
-        progress: 100,
-      },
-    };
+        status: 'draft',
+        progress: 0,
+      };
+    }
+
+    const existingIssue = this.issuesStore.getById(safeId);
 
     return (
-      existingIssues[safeId] ?? {
+      existingIssue ?? {
         id: safeId,
-        assignee: 'A definir',
-        epic: 'EPIC-WEBAPP',
-        name: `Nouvelle issue ${safeId}`,
-        dueDate: '2026-06-15',
-        description: 'Decrire ici le contexte, les attentes et les criteres d acceptation.',
+        assignee: '',
+        epic: '',
+        name: '',
+        dueDate: '',
+        description: '',
         priority: 'Moyenne',
         status: 'draft',
         progress: 0,