From 17f94f49799aacf99f10bc5d587a51b333cf2cd6 Mon Sep 17 00:00:00 2001 From: Jiawei Wu <74562234+JiaweiWu@users.noreply.github.com> Date: Fri, 5 Aug 2022 13:59:15 -0700 Subject: [PATCH] [RAM] Add helper tooltip to certain rule details event log columns (#137905) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Add helper tooltip to certain event log columns * Update x-pack/plugins/triggers_actions_ui/public/application/sections/rule_details/components/rule_event_log_data_grid.tsx Co-authored-by: István Zoltán Szabó * Update x-pack/plugins/triggers_actions_ui/public/application/sections/rule_details/components/rule_event_log_data_grid.tsx Co-authored-by: István Zoltán Szabó * Update x-pack/plugins/triggers_actions_ui/public/application/sections/rule_details/components/rule_event_log_data_grid.tsx Co-authored-by: István Zoltán Szabó * Update x-pack/plugins/triggers_actions_ui/public/application/sections/rule_details/components/rule_event_log_data_grid.tsx Co-authored-by: István Zoltán Szabó Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: István Zoltán Szabó --- .../components/rule_event_log_data_grid.tsx | 117 ++++++++++++++---- 1 file changed, 93 insertions(+), 24 deletions(-) diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/rule_details/components/rule_event_log_data_grid.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/rule_details/components/rule_event_log_data_grid.tsx index b936f55c4597..5145b1aa2cd6 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/rule_details/components/rule_event_log_data_grid.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/rule_details/components/rule_event_log_data_grid.tsx @@ -23,6 +23,7 @@ import { useEuiTheme, EuiToolTip, EuiText, + EuiIcon, } from '@elastic/eui'; import { IExecutionLog, @@ -66,6 +67,90 @@ export interface RuleEventLogDataGrid { setSortingColumns: (sortingColumns: EuiDataGridSorting['columns']) => void; } +const numTriggeredActionsDisplay = i18n.translate( + 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.triggeredActions', + { + defaultMessage: 'Triggered actions', + } +); +const numTriggeredActionsToolTip = i18n.translate( + 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.triggeredActionsToolTip', + { + defaultMessage: 'The subset of generated actions that will run.', + } +); + +const numGeneratedActionsDisplay = i18n.translate( + 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.scheduledActions', + { + defaultMessage: 'Generated actions', + } +); +const numGeneratedActionsToolTip = i18n.translate( + 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.scheduledActionsToolTip', + { + defaultMessage: 'The total number of actions generated when the rule ran.', + } +); + +const numSucceededActionsDisplay = i18n.translate( + 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.succeededActions', + { + defaultMessage: 'Succeeded actions', + } +); +const numSucceededActionsToolTip = i18n.translate( + 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.succeededActionsToolTip', + { + defaultMessage: 'The number of actions that were completed successfully.', + } +); + +const numErroredActionsDisplay = i18n.translate( + 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.erroredActions', + { + defaultMessage: 'Errored actions', + } +); +const numErroredActionsToolTip = i18n.translate( + 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.erroredActionsToolTip', + { + defaultMessage: 'The number of failed actions.', + } +); + +const columnsWithToolTipMap: Record> = { + num_triggered_actions: { + display: numTriggeredActionsDisplay, + toolTip: numTriggeredActionsToolTip, + }, + num_generated_actions: { + display: numGeneratedActionsDisplay, + toolTip: numGeneratedActionsToolTip, + }, + num_succeeded_actions: { + display: numSucceededActionsDisplay, + toolTip: numSucceededActionsToolTip, + }, + num_errored_actions: { + display: numErroredActionsDisplay, + toolTip: numErroredActionsToolTip, + }, +}; + +const ColumnHeaderWithToolTip = ({ id }: { id: string }) => { + return ( + + + {columnsWithToolTipMap[id].display} + + + + + + ); +}; + export const RuleEventLogDataGrid = (props: RuleEventLogDataGrid) => { const { logs = [], @@ -242,32 +327,20 @@ export const RuleEventLogDataGrid = (props: RuleEventLogDataGrid) => { }, { id: 'num_triggered_actions', - displayAsText: i18n.translate( - 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.triggeredActions', - { - defaultMessage: 'Triggered actions', - } - ), + displayAsText: numTriggeredActionsDisplay, + display: , isSortable: getIsColumnSortable('num_triggered_actions'), }, { id: 'num_generated_actions', - displayAsText: i18n.translate( - 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.scheduledActions', - { - defaultMessage: 'Generated actions', - } - ), + displayAsText: numGeneratedActionsDisplay, + display: , isSortable: getIsColumnSortable('num_generated_actions'), }, { id: 'num_succeeded_actions', - displayAsText: i18n.translate( - 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.succeededActions', - { - defaultMessage: 'Succeeded actions', - } - ), + displayAsText: numSucceededActionsDisplay, + display: , isSortable: getIsColumnSortable('num_succeeded_actions'), }, { @@ -276,12 +349,8 @@ export const RuleEventLogDataGrid = (props: RuleEventLogDataGrid) => { showSortAsc: false, showSortDesc: false, }, - displayAsText: i18n.translate( - 'xpack.triggersActionsUI.sections.ruleDetails.eventLogColumn.erroredActions', - { - defaultMessage: 'Errored actions', - } - ), + displayAsText: numErroredActionsDisplay, + display: , isSortable: getIsColumnSortable('num_errored_actions'), }, {