From 42f85ad4a223c08b1aa4bc56169237906f95ee72 Mon Sep 17 00:00:00 2001
From: Walter Rafelsberger <walter.rafelsberger@elastic.co>
Date: Wed, 2 Nov 2022 13:08:08 +0100
Subject: [PATCH] Adds SavedObjectsWarning to analytics results pages.
 (#144109) (#144401)

- Fixes the saved object sync warning that should be shown on the analytics result pages.
- Adds a check if the jobs description is an empty string to avoid unnecessary whitespace rendering.

(cherry picked from commit a602fa8924041a48bb71552c7282f0d3c63826c9)
---
 .../exploration_page_wrapper.tsx              |  2 +-
 .../outlier_exploration.tsx                   |  2 +-
 .../pages/analytics_exploration/page.tsx      | 27 ++++++++++++++++++-
 3 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/exploration_page_wrapper/exploration_page_wrapper.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/exploration_page_wrapper/exploration_page_wrapper.tsx
index 17453dd87b0d0..4ad200ceea57a 100644
--- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/exploration_page_wrapper/exploration_page_wrapper.tsx
+++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/exploration_page_wrapper/exploration_page_wrapper.tsx
@@ -152,7 +152,7 @@ export const ExplorationPageWrapper: FC<Props> = ({
 
   return (
     <>
-      {typeof jobConfig?.description !== 'undefined' && (
+      {typeof jobConfig?.description !== 'undefined' && jobConfig?.description !== '' && (
         <>
           <EuiText>{jobConfig?.description}</EuiText>
           <EuiSpacer size="m" />
diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/outlier_exploration/outlier_exploration.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/outlier_exploration/outlier_exploration.tsx
index 8086ee4f573bc..8c321ae2fe0fc 100644
--- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/outlier_exploration/outlier_exploration.tsx
+++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/components/outlier_exploration/outlier_exploration.tsx
@@ -109,7 +109,7 @@ export const OutlierExploration: FC<ExplorationProps> = React.memo(({ jobId }) =
 
   return (
     <>
-      {typeof jobConfig?.description !== 'undefined' && (
+      {typeof jobConfig?.description !== 'undefined' && jobConfig?.description !== '' && (
         <>
           <EuiText>{jobConfig?.description}</EuiText>
           <EuiSpacer size="m" />
diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/page.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/page.tsx
index b8ed840397675..0550226599eb1 100644
--- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/page.tsx
+++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_exploration/page.tsx
@@ -25,6 +25,7 @@ import {
 } from '../components/analytics_selector';
 import { AnalyticsEmptyPrompt } from '../analytics_management/components/empty_prompt';
 import { useUrlState } from '../../../util/url_state';
+import { SavedObjectsWarning } from '../../../components/saved_objects_warning';
 
 export const Page: FC<{
   jobId: string;
@@ -41,7 +42,9 @@ export const Page: FC<{
   } = useMlApiContext();
   const helpLink = docLinks.links.ml.dataFrameAnalytics;
   const jobIdToUse = jobId ?? analyticsId?.job_id;
-  const analysisTypeToUse = analysisType || analyticsId?.analysis_type;
+  const [analysisTypeToUse, setAnalysisTypeToUse] = useState<
+    DataFrameAnalysisConfigType | undefined
+  >(analysisType || analyticsId?.analysis_type);
 
   const [, setGlobalState] = useUrlState('_g');
 
@@ -55,6 +58,25 @@ export const Page: FC<{
     }
   };
 
+  // The inner components of the results page don't have a concept of reloading the full page.
+  // Because we might want to refresh though if a user has to fix unsynced saved objects,
+  // we achieve this here by unmounting the inner pages first by setting `analysisTypeToUse`
+  // to `undefined`. The `useEffect()` below will then check if `analysisTypeToUse` doesn't
+  // match the passed in analyis type and will update it once again, the re-mounted
+  // page will then again fetch the most recent results.
+  const refresh = () => {
+    setAnalysisTypeToUse(undefined);
+  };
+
+  useEffect(
+    function checkRefresh() {
+      if (analysisTypeToUse !== analysisType || analyticsId?.analysis_type) {
+        setAnalysisTypeToUse(analysisType || analyticsId?.analysis_type);
+      }
+    },
+    [analyticsId, analysisType, analysisTypeToUse]
+  );
+
   useEffect(function checkJobs() {
     checkJobsExist();
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -126,6 +148,9 @@ export const Page: FC<{
           />
         </MlPageHeader>
       )}
+
+      <SavedObjectsWarning onCloseFlyout={refresh} />
+
       {jobIdToUse && analysisTypeToUse ? (
         <div data-test-subj="mlPageDataFrameAnalyticsExploration">
           {analysisTypeToUse === ANALYSIS_CONFIG_TYPE.OUTLIER_DETECTION && (