Ajout diagram de gantt

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

@@ -341,6 +341,16 @@
   </div>
 }
 
+<!-- Gantt de l'Epic -->
+@if (isEpicIssue && !isNewIssueRoute) {
+  <div class="card shadow-sm mb-3">
+    <div class="card-header section-header">Diagramme Gantt</div>
+    <div class="card-body">
+      <app-gantt-diagram [tasks]="epicGanttTasks" />
+    </div>
+  </div>
+}
+
 <!-- Commentaires -->
 @if (!isNewIssueRoute) {
   <app-issue-comments [issueId]="issue.id" />

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

@@ -88,6 +88,8 @@ const makeMilestone = (overrides: Partial<MilestoneEntity> = {}): MilestoneEntit
   id: 1,
   name: 'Sprint 1',
   description: '',
+  startDate: '',
+  endDate: '',
   dueDate: '',
   issueIds: [],
   ...overrides,

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

@@ -9,10 +9,11 @@ import { IssueComments } from '../issue-comments/issue-comments';
 import { handleImagePaste, insertAtSelection } from '../paste-image.util';
 import { MilestoneEntity, MilestonesStore } from '../../milestones/milestones.store';
 import { StatusEntity, StatusesStore } from '../../statuses/statuses.store';
+import { GanttDiagram, GanttTask } from '../../shared/gantt-diagram/gantt-diagram';
 
 @Component({
   selector: 'app-issue-detail',
-  imports: [FormsModule, IssueComments],
+  imports: [FormsModule, IssueComments, GanttDiagram],
   templateUrl: './issue-detail.html',
   styleUrl: './issue-detail.css',
 })
@@ -233,6 +234,39 @@ export class IssueDetail {
     return this.issueTypeValue === 'Epic';
   }
 
+  protected get epicGanttTasks(): GanttTask[] {
+    const tasks: GanttTask[] = [];
+
+    if (this.issue.startDate && this.issue.endDate) {
+      tasks.push({
+        id: `issue-${this.issue.id}`,
+        name: this.issue.name || 'Epic',
+        start: this.issue.startDate,
+        end: this.issue.endDate,
+        progress: this.composedIssues.length === 0
+          ? this.issue.progress
+          : Math.round(
+              (this.composedIssues.filter((i) => i.status === 'done').length /
+                this.composedIssues.length) * 100,
+            ),
+        custom_class: 'bar-epic',
+      });
+    }
+
+    for (const child of this.composedIssues) {
+      if (!child.startDate || !child.endDate) continue;
+      tasks.push({
+        id: `issue-${child.id}`,
+        name: `#${child.id} ${child.name}`,
+        start: child.startDate,
+        end: child.endDate,
+        progress: child.progress,
+      });
+    }
+
+    return tasks;
+  }
+
   protected get isChildOfEpic(): boolean {
     return !!this.issue.epic;
   }

src/app/issues/issues.spec.ts

@@ -95,6 +95,8 @@ const makeMilestone = (overrides: Partial<MilestoneEntity> = {}): MilestoneEntit
   id: 1,
   name: 'Sprint 1',
   description: '',
+  startDate: '',
+  endDate: '',
   dueDate: '',
   issueIds: [],
   ...overrides,