Ajout diagram de gantt

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;
   }