From 91e1cbbdf0e94453958033571a73d1ce397fca98 Mon Sep 17 00:00:00 2001
From: Luciano Gorza <lucianogorza@gmail.com>
Date: Fri, 15 Mar 2024 10:09:46 -0300
Subject: [PATCH] Add tooltipo to timeout status

---
 .../table/upgrade-task-details-modal.tsx      | 40 ++++++++++++++-----
 1 file changed, 30 insertions(+), 10 deletions(-)

diff --git a/plugins/main/public/components/endpoints-summary/table/upgrade-task-details-modal.tsx b/plugins/main/public/components/endpoints-summary/table/upgrade-task-details-modal.tsx
index 16b2122e51..4172e6d2dc 100644
--- a/plugins/main/public/components/endpoints-summary/table/upgrade-task-details-modal.tsx
+++ b/plugins/main/public/components/endpoints-summary/table/upgrade-task-details-modal.tsx
@@ -16,6 +16,10 @@ import {
   EuiModalBody,
   EuiModalFooter,
   EuiButton,
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiToolTip,
+  EuiButtonIcon,
 } from '@elastic/eui';
 
 interface AgentUpgradesTaskDetailsModalProps {
@@ -100,14 +104,36 @@ export const AgentUpgradesTaskDetailsModal = ({
             {
               field: 'status',
               name: 'Status',
-              width: '120px',
+              width: '130px',
               sortable: true,
               searchable: true,
               show: true,
               render: value => (
-                <EuiHealth color={UI_TASK_STATUS_COLORS[value]}>
-                  {value}
-                </EuiHealth>
+                <EuiFlexGroup
+                  alignItems='center'
+                  gutterSize='xs'
+                  responsive={false}
+                >
+                  <EuiFlexItem grow={false}>
+                    <EuiHealth color={UI_TASK_STATUS_COLORS[value]}>
+                      {value}
+                    </EuiHealth>
+                  </EuiFlexItem>
+                  {value === API_NAME_TASK_STATUS.TIMEOUT ? (
+                    <EuiFlexItem grow={false}>
+                      <EuiToolTip
+                        position='top'
+                        content='Upgrade task has appears to be done but the notification has never reached the manager'
+                      >
+                        <EuiButtonIcon
+                          color='primary'
+                          iconType='questionInCircle'
+                          aria-label='Info about the error'
+                        />
+                      </EuiToolTip>
+                    </EuiFlexItem>
+                  ) : null}
+                </EuiFlexGroup>
               ),
             },
             {
@@ -116,12 +142,6 @@ export const AgentUpgradesTaskDetailsModal = ({
               show: true,
               searchable: true,
               width: '250px',
-              render: (value, task) => {
-                if (task.status === API_NAME_TASK_STATUS.TIMEOUT) {
-                  return 'Upgrade task has appears to be done but the notification has never reached the manager';
-                }
-                return value;
-              },
             },
           ]}
           tableInitialSortingField='last_update_time'