[8.8] Fix the charts and group by section on the Log Threshold alert detail page (#155327) (#157410)

# Backport This will backport the following commits from `main` to `8.8`: - [Fix the charts and group by section on the Log Threshold alert detail page (#155327)](https://github.com/elastic/kibana/pull/155327)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport)  Co-authored-by: Chris Cowan <chris@elastic.co>
2025-04-24 01:38:56 -04:00 · 2023-05-11 13:03:34 -04:00 · 2023-05-11 13:03:34 -04:00 · f6ac3f4ca3
commit f6ac3f4ca3
parent d927533c49
6 changed files with 30 additions and 7 deletions
--- a/packages/kbn-alerts-as-data-utils/src/field_maps/legacy_experimental_field_map.ts
+++ b/packages/kbn-alerts-as-data-utils/src/field_maps/legacy_experimental_field_map.ts
@ -7,6 +7,7 @@
 */

 import {
+  ALERT_CONTEXT,
  ALERT_EVALUATION_THRESHOLD,
  ALERT_EVALUATION_VALUE,
  ALERT_EVALUATION_VALUES,
@ -19,6 +20,7 @@ export const legacyExperimentalFieldMap = {
    required: false,
  },
  [ALERT_EVALUATION_VALUE]: { type: 'scaled_float', scaling_factor: 100, required: false },
+  [ALERT_CONTEXT]: { type: 'object', array: false, required: false },
  [ALERT_EVALUATION_VALUES]: {
    type: 'scaled_float',
    scaling_factor: 100,
--- a/packages/kbn-rule-data-utils/src/technical_field_names.ts
+++ b/packages/kbn-rule-data-utils/src/technical_field_names.ts
@ -85,6 +85,7 @@ const EVENT_MODULE = 'event.module' as const;
 const ALERT_BUILDING_BLOCK_TYPE = `${ALERT_NAMESPACE}.building_block_type` as const;
 const ALERT_EVALUATION_THRESHOLD = `${ALERT_NAMESPACE}.evaluation.threshold` as const;
 const ALERT_EVALUATION_VALUE = `${ALERT_NAMESPACE}.evaluation.value` as const;
+const ALERT_CONTEXT = `${ALERT_NAMESPACE}.context` as const;
 const ALERT_EVALUATION_VALUES = `${ALERT_NAMESPACE}.evaluation.values` as const;

 // Fields pertaining to the rule associated with the alert
@ -133,6 +134,7 @@ const fields = {
  ALERT_RULE_CONSUMER,
  ALERT_RULE_PRODUCER,
  ALERT_REASON,
+  ALERT_CONTEXT,
  ALERT_RISK_SCORE,
  ALERT_CASE_IDS,
  ALERT_RULE_AUTHOR,
@ -194,6 +196,7 @@ export {
  ALERT_BUILDING_BLOCK_TYPE,
  ALERT_EVALUATION_THRESHOLD,
  ALERT_EVALUATION_VALUE,
+  ALERT_CONTEXT,
  ALERT_EVALUATION_VALUES,
  ALERT_RULE_EXCEPTIONS_LIST,
  ALERT_RULE_NAMESPACE_FIELD,
--- a/x-pack/plugins/infra/public/alerting/log_threshold/components/alert_details_app_section/components/logs_ratio_chart.tsx
+++ b/x-pack/plugins/infra/public/alerting/log_threshold/components/alert_details_app_section/components/logs_ratio_chart.tsx
@ -131,6 +131,7 @@ const LogsRatioChart: React.FC<ChartProps> = ({
  const barSeries = useMemo(() => {
    return series.flatMap(({ points, id }) => points.map((point) => ({ ...point, groupBy: id })));
  }, [series]);
+
  if (isLoading) {
    return <LoadingState />;
  } else if (hasError) {
--- a/x-pack/plugins/infra/public/alerting/log_threshold/components/alert_details_app_section/index.tsx
+++ b/x-pack/plugins/infra/public/alerting/log_threshold/components/alert_details_app_section/index.tsx
@ -8,7 +8,12 @@ import React, { useEffect, useState } from 'react';
 import { EuiFlexGroup, EuiFlexItem, EuiSpacer } from '@elastic/eui';
 import { LIGHT_THEME } from '@elastic/charts';
 import { EuiPanel } from '@elastic/eui';
-import { ALERT_END, ALERT_EVALUATION_VALUE, ALERT_START } from '@kbn/rule-data-utils';
+import {
+  ALERT_CONTEXT,
+  ALERT_END,
+  ALERT_EVALUATION_VALUE,
+  ALERT_START,
+} from '@kbn/rule-data-utils';
 import moment from 'moment';
 import { useTheme } from '@emotion/react';
 import { EuiTitle } from '@elastic/eui';
@ -20,6 +25,7 @@ import {
 } from '@kbn/observability-alert-details';
 import { useEuiTheme } from '@elastic/eui';
 import { UI_SETTINGS } from '@kbn/data-plugin/public';
+import { get } from 'lodash';
 import { useKibanaContextForPlugin } from '../../../../hooks/use_kibana';
 import { getChartGroupNames } from '../../../../../common/utils/get_chart_group_names';
 import {
@ -61,7 +67,9 @@ const AlertDetailsAppSection = ({
      rule.params.groupBy?.reduce(
        (selectedFields: Record<string, any>, field) => ({
          ...selectedFields,
-          ...{ [field]: alert.fields[field] },
+          ...{
+            [field]: get(alert.fields[ALERT_CONTEXT], ['groupByKeys', ...field.split('.')], null),
+          },
        }),
        {}
      ) || {};
@ -232,7 +240,9 @@ const AlertDetailsAppSection = ({
      rule &&
      rule.params.criteria.length === 1 && (
        <EuiFlexItem>
-          <LogsHistoryChart rule={rule} />
+          <LogsHistoryChart
+            rule={{ ...rule, params: { ...rule.params, timeSize: 12, timeUnit: 'h' } }}
+          />
        </EuiFlexItem>
      )
    );
--- a/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/hooks/use_chart_preview_data.tsx
+++ b/x-pack/plugins/infra/public/alerting/log_threshold/components/expression_editor/hooks/use_chart_preview_data.tsx
@ -68,7 +68,7 @@ export const useChartPreviewData = ({
          let seriesQueryB = ratio[1].data.series[0].points;
          let seriesId = 'ratio';
          // When groupBy and a filter is applied, return the ratio only for the filtered grouped-by
-          if (ruleParams.groupBy.length && filterSeriesByGroupName) {
+          if (ruleParams.groupBy?.length && filterSeriesByGroupName) {
            seriesId = filterSeriesByGroupName;
            seriesQueryA =
              ratio[0].data.series.find((series) => series.id === filterSeriesByGroupName)
--- a/x-pack/plugins/infra/server/lib/alerting/log_threshold/log_threshold_executor.ts
+++ b/x-pack/plugins/infra/server/lib/alerting/log_threshold/log_threshold_executor.ts
@ -8,6 +8,7 @@
 import type * as estypes from '@elastic/elasticsearch/lib/api/typesWithBodyKey';
 import { i18n } from '@kbn/i18n';
 import {
+  ALERT_CONTEXT,
  ALERT_EVALUATION_THRESHOLD,
  ALERT_EVALUATION_VALUE,
  ALERT_REASON,
@ -86,7 +87,7 @@ export type LogThresholdAlertFactory = (
  value: number,
  threshold: number,
  actions?: Array<{ actionGroup: LogThresholdActionGroups; context: AlertContext }>,
-  additionalContext?: AdditionalContext
+  rootLevelContext?: AdditionalContext
 ) => LogThresholdAlert;
 export type LogThresholdAlertLimit = RuleExecutorServices<
  LogThresholdAlertState,
@ -134,15 +135,21 @@ export const createLogThresholdExecutor = (libs: InfraBackendLibs) =>
      value,
      threshold,
      actions,
-      additionalContext
+      rootLevelContext
    ) => {
+      const alertContext =
+        actions != null
+          ? actions.reduce((next, action) => ({ ...next, ...action.context }), {})
+          : {};
+
      const alert = alertWithLifecycle({
        id,
        fields: {
          [ALERT_EVALUATION_THRESHOLD]: threshold,
          [ALERT_EVALUATION_VALUE]: value,
          [ALERT_REASON]: reason,
-          ...flattenAdditionalContext(additionalContext),
+          [ALERT_CONTEXT]: alertContext,
+          ...flattenAdditionalContext(rootLevelContext),
        },
      });