[Custom threshold rule] Fix error loading alert details page (elastic…

…#175526) Fixes elastic#175525
lcawl · Jan 26, 2024 · 6066396 · 6066396
1 parent 7973f75
commit 6066396
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/...nents/custom_threshold/components/alert_details_app_section/alert_details_app_section.tsx b/...nents/custom_threshold/components/alert_details_app_section/alert_details_app_section.tsx
@@ -83,6 +83,9 @@ export default function AlertDetailsAppSection({
   };
   const timeRange = getPaddedAlertTimeRange(alert.fields[ALERT_START]!, alert.fields[ALERT_END]);
   const alertEnd = alert.fields[ALERT_END] ? moment(alert.fields[ALERT_END]).valueOf() : undefined;
+  const groups = alert.fields[ALERT_GROUP];
+  const tags = alert.fields[TAGS];
+
   const annotations = [
     <AlertAnnotation
       alertStart={alert.start}
@@ -101,8 +104,6 @@ export default function AlertDetailsAppSection({
   ];
 
   useEffect(() => {
-    const groups = alert.fields[ALERT_GROUP];
-    const tags = alert.fields[TAGS];
     const alertSummaryFields = [];
     if (groups) {
       alertSummaryFields.push({
@@ -141,7 +142,7 @@ export default function AlertDetailsAppSection({
     });
 
     setAlertSummaryFields(alertSummaryFields);
-  }, [alert, rule, ruleLink, setAlertSummaryFields]);
+  }, [groups, tags, rule, ruleLink, setAlertSummaryFields]);
 
   const derivedIndexPattern = useMemo<DataViewBase>(
     () => ({

diff --git a/x-pack/plugins/observability/public/pages/alert_details/alert_details.tsx b/x-pack/plugins/observability/public/pages/alert_details/alert_details.tsx
@@ -161,9 +161,9 @@ export function AlertDetails() {
       <HeaderMenu />
       <AlertSummary alertSummaryFields={summaryFields} />
       <EuiSpacer size="l" />
-      {AlertDetailsAppSection && rule && (
+      {AlertDetailsAppSection && rule && alertDetail?.formatted && (
         <AlertDetailsAppSection
-          alert={alertDetail}
+          alert={alertDetail.formatted}
           rule={rule}
           timeZone={timeZone}
           setAlertSummaryFields={setSummaryFields}