From 9a03464edca0e1571f296a9fc34b21fc96bee7cc Mon Sep 17 00:00:00 2001
From: Ludovic DEHON <tchiot.ludo@gmail.com>
Date: Mon, 12 Jun 2023 16:11:06 +0200
Subject: [PATCH] fix(ui): icon are not displayed correctly

---
 ui/src/components/graph/TreeTaskNode.vue    | 18 +++++++++---------
 ui/src/components/graph/TreeTriggerNode.vue |  6 +++---
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/ui/src/components/graph/TreeTaskNode.vue b/ui/src/components/graph/TreeTaskNode.vue
index f48b0e4a94..0de9583b08 100644
--- a/ui/src/components/graph/TreeTaskNode.vue
+++ b/ui/src/components/graph/TreeTaskNode.vue
@@ -3,7 +3,7 @@
         :id="task.id"
         :type="task.type"
         :disabled="task.disabled"
-        :state="this.state"
+        :state="state"
     >
         <template #content>
             <div v-if="task.state" class="status-wrapper">
@@ -13,7 +13,7 @@
         <template #info>
             <span class="bottom">
                 <el-tag
-                    v-if="this.execution"
+                    v-if="execution"
                     type="info"
                     class="me-1"
                     size="small"
@@ -65,7 +65,7 @@
                     :flow-id="task.flowId"
                 />
 
-                <el-tooltip v-if="isFlowable && !this.execution && !isReadOnly && isAllowedEdit" content="Handle errors" transition="" :hide-after="0" :persistent="false">
+                <el-tooltip v-if="isFlowable && !execution && !isReadOnly && isAllowedEdit" content="Handle errors" transition="" :hide-after="0" :persistent="false">
                     <el-button
                         class="node-action"
                         size="small"
@@ -74,19 +74,19 @@
                     />
                 </el-tooltip>
 
-                <el-tooltip v-if="!this.execution && !isReadOnly && isAllowedEdit" content="Delete" transition="" :hide-after="0" :persistent="false">
+                <el-tooltip v-if="!execution && !isReadOnly && isAllowedEdit" content="Delete" transition="" :hide-after="0" :persistent="false">
                     <el-button
                         class="node-action"
                         size="small"
-                        @click="forwardEvent('delete', {id: this.task.id, section: SECTIONS.TASK})"
+                        @click="forwardEvent('delete', {id: task.id, section: SECTIONS.TASK})"
                         :icon="Delete"
                     />
                 </el-tooltip>
 
-                <el-tooltip v-if="this.execution" :content="$t('show task logs')" :persistent="false" transition="" :hide-after="0">
+                <el-tooltip v-if="execution" :content="$t('show task logs')" :persistent="false" transition="" :hide-after="0">
                     <el-button
                         class="node-action"
-                        :disabled="this.taskRuns.length === 0"
+                        :disabled="taskRuns.length === 0"
                         size="small"
                         @click="onTaskSelect()"
                     >
@@ -96,7 +96,7 @@
 
                 <el-tooltip content="Edit task" :persistent="false" transition="" :hide-after="0">
                     <task-edit
-                        v-if="!this.isReadOnly && isAllowedEdit"
+                        v-if="!isReadOnly && isAllowedEdit"
                         class="node-action"
                         :section="SECTIONS.TASK"
                         :task="task"
@@ -127,7 +127,7 @@
                 </collapse>
                 <log-list
                     :task-id="task.id"
-                    :filter="this.filter"
+                    :filter="filter"
                     :exclude-metas="['namespace', 'flowId', 'taskId', 'executionId']"
                     :level="logLevel"
                     @follow="forwardEvent('follow', $event)"
diff --git a/ui/src/components/graph/TreeTriggerNode.vue b/ui/src/components/graph/TreeTriggerNode.vue
index 2da56e1e2e..0fe93dde11 100644
--- a/ui/src/components/graph/TreeTriggerNode.vue
+++ b/ui/src/components/graph/TreeTriggerNode.vue
@@ -21,17 +21,17 @@
                     />
                 </el-button>
 
-                <el-tooltip v-if="!this.execution && !this.isReadOnly && isAllowedEdit" content="Delete" transition="" :hide-after="0" :persistent="false">
+                <el-tooltip v-if="!execution && !isReadOnly && isAllowedEdit" content="Delete" transition="" :hide-after="0" :persistent="false">
                     <el-button
                         class="node-action"
                         size="small"
-                        @click="forwardEvent('delete', {id: this.trigger.id, section: SECTIONS.TRIGGER})"
+                        @click="forwardEvent('delete', {id: trigger.id, section: SECTIONS.TRIGGER})"
                         :icon="Delete"
                     />
                 </el-tooltip>
 
                 <task-edit
-                    v-if="!this.isReadOnly && isAllowedEdit"
+                    v-if="!isReadOnly && isAllowedEdit"
                     class="node-action"
                     :modal-id="`modal-source-${hash}`"
                     :task="trigger"