From aa450d6e4bbd81d97775e3f83f5118c0b67d1dab Mon Sep 17 00:00:00 2001
From: Piyush Bhaskar <102078527+Piyush-r-bhaskar@users.noreply.github.com>
Date: Thu, 16 Jan 2025 15:10:50 +0530
Subject: [PATCH] chore(ui): mark taskruns with multiple attemps in gantt view
 (#6721)

---
 ui/src/components/executions/Gantt.vue | 23 +++++++++++++++++++++--
 1 file changed, 21 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/executions/Gantt.vue b/ui/src/components/executions/Gantt.vue
index c936da54731..5ffd6fb03f0 100644
--- a/ui/src/components/executions/Gantt.vue
+++ b/ui/src/components/executions/Gantt.vue
@@ -39,6 +39,17 @@
                                         <small v-if="item.task && item.task.value"> {{ item.task.value }}</small>
                                     </span>
                                 </el-tooltip>
+                                <div>
+                                    <el-tooltip placement="right" :persistent="false" :hide-after="0" effect="light">
+                                        <template #content>
+                                            <span>This task has {{ item.attempts }} attempts.</span>
+                                        </template>
+                                        <Warning 
+                                            v-if="item.attempts > 1" 
+                                            class="attempt_warn me-3" 
+                                        />
+                                    </el-tooltip>
+                                </div>
                                 <div :style="'width: ' + (100 / (dates.length + 1)) * dates.length + '%'">
                                     <el-tooltip placement="top" :persistent="false" transition="" :hide-after="0" effect="light">
                                         <template #content>
@@ -92,11 +103,13 @@
     import {DynamicScroller, DynamicScrollerItem} from "vue-virtual-scroller";
     import ChevronRight from "vue-material-design-icons/ChevronRight.vue";
     import ChevronDown from "vue-material-design-icons/ChevronDown.vue";
+    import Warning from "vue-material-design-icons/Alert.vue"
+
 
     const ts = date => new Date(date).getTime();
     const TASKRUN_THRESHOLD = 50
     export default {
-        components: {DynamicScroller, DynamicScrollerItem, TaskRunDetails, Duration, ChevronRight, ChevronDown},
+        components: {DynamicScroller,Warning, DynamicScrollerItem, TaskRunDetails, Duration, ChevronRight, ChevronDown},
         data() {
             return {
                 colors: State.colorClass(),
@@ -287,7 +300,8 @@
                         task,
                         flowId: task.flowId,
                         namespace: task.namespace,
-                        executionId: task.outputs && task.outputs.executionId
+                        executionId: task.outputs && task.outputs.executionId,
+                        attempts: task.attempts ? task.attempts.length : 1
                     });
                 }
                 this.series = series;
@@ -396,6 +410,11 @@
                         color: var(--ks-content-primary);
                     }
                 }
+                
+                .attempt_warn{
+                    color: var(--el-color-warning);
+                    vertical-align: middle;
+                }
 
                 .task-progress {
                     position: relative;