Moved getSettings call to hide Data source panel for cluster metrics …

…monitors when remote monitoring is disabled. Signed-off-by: AWSHurneyt <[email protected]>
AWSHurneyt · Feb 5, 2024 · 9dd22cc · 9dd22cc
1 parent fb41a75
commit 9dd22cc
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 45 deletions.
diff --git a/public/pages/CreateMonitor/containers/DataSource/DataSource.js b/public/pages/CreateMonitor/containers/DataSource/DataSource.js
@@ -33,15 +33,20 @@ class DataSource extends Component {
   }
 
   render() {
-    const { isMinimal } = this.props;
+    const { isMinimal, remoteMonitoringEnabled } = this.props;
     const { monitor_type, searchType } = this.props.values;
     const displayTimeField =
       searchType === SEARCH_TYPE.GRAPH &&
       monitor_type !== MONITOR_TYPE.DOC_LEVEL &&
       monitor_type !== MONITOR_TYPE.CLUSTER_METRICS;
     const monitorIndexDisplay = (
       <>
-        <MonitorIndex httpClient={this.props.httpClient} monitorType={monitor_type} />
+        <MonitorIndex
+          httpClient={this.props.httpClient}
+          monitorType={monitor_type}
+          remoteMonitoringEnabled={remoteMonitoringEnabled}
+        />
+
         {displayTimeField && (
           <>
             <EuiSpacer />

diff --git a/public/pages/CreateMonitor/containers/DefineMonitor/DefineMonitor.js b/public/pages/CreateMonitor/containers/DefineMonitor/DefineMonitor.js
@@ -39,6 +39,7 @@ import ConfigureDocumentLevelQueries from '../../components/DocumentLevelMonitor
 import FindingsDashboard from '../../../Dashboard/containers/FindingsDashboard';
 import { validDocLevelGraphQueries } from '../../components/DocumentLevelMonitorQueries/utils/helpers';
 import { validateWhereFilters } from '../../components/MonitorExpressions/expressions/utils/whereHelpers';
+import { REMOTE_MONITORING_ENABLED_SETTING_PATH } from '../../components/CrossClusterConfigurations/components/ExperimentalBanner';
 
 function renderEmptyMessage(message) {
   return (
@@ -74,6 +75,7 @@ class DefineMonitor extends Component {
       plugins: [],
       loadingResponse: false,
       PanelComponent: props.flyoutMode ? ({ children }) => <>{children}</> : ContentPanel,
+      remoteMonitoringEnabled: false,
     };
 
     this.renderGraph = this.renderGraph.bind(this);
@@ -88,6 +90,7 @@ class DefineMonitor extends Component {
     this.getPlugins = this.getPlugins.bind(this);
     this.getSupportedApiList = this.getSupportedApiList.bind(this);
     this.showPluginWarning = this.showPluginWarning.bind(this);
+    this.getSettings = this.getSettings.bind(this);
   }
 
   componentDidMount() {
@@ -96,6 +99,7 @@ class DefineMonitor extends Component {
     const isGraph = searchType === SEARCH_TYPE.GRAPH;
     const hasIndices = !!index.length;
     const hasTimeField = !!timeField;
+    this.getSettings();
     if (isGraph && hasIndices) {
       this.onQueryMappings();
       if (hasTimeField || !this.requiresTimeField()) this.onRunQuery();
@@ -175,6 +179,34 @@ class DefineMonitor extends Component {
     }
   }
 
+  async getSettings() {
+    try {
+      const { httpClient } = this.props;
+      const response = await httpClient.get('../api/alerting/_settings');
+      if (response.ok) {
+        const { defaults, transient, persistent } = response.resp;
+        let remoteMonitoringEnabled = _.get(
+          // If present, take the 'transient' setting.
+          transient,
+          REMOTE_MONITORING_ENABLED_SETTING_PATH,
+          // Else take the 'persistent' setting.
+          _.get(
+            persistent,
+            REMOTE_MONITORING_ENABLED_SETTING_PATH,
+            // Else take the 'default' setting.
+            _.get(defaults, REMOTE_MONITORING_ENABLED_SETTING_PATH, false)
+          )
+        );
+        // Boolean settings are returned as strings (e.g., `"true"`, and `"false"`). Constructing boolean value from the string.
+        if (typeof remoteMonitoringEnabled === 'string')
+          remoteMonitoringEnabled = JSON.parse(remoteMonitoringEnabled);
+        this.setState({ remoteMonitoringEnabled: remoteMonitoringEnabled });
+      }
+    } catch (e) {
+      console.log('Error while retrieving settings', e);
+    }
+  }
+
   requiresTimeField() {
     const {
       values: { monitor_type, searchType },
@@ -614,19 +646,27 @@ class DefineMonitor extends Component {
   }
 
   render() {
-    const { values, errors, httpClient, detectorId, notifications, isDarkMode, flyoutMode } =
-      this.props;
-    const { dataTypes, PanelComponent } = this.state;
+    const {
+      values,
+      values: { monitor_type },
+      errors,
+      httpClient,
+      detectorId,
+      notifications,
+      isDarkMode,
+      flyoutMode,
+    } = this.props;
+    const { dataTypes, PanelComponent, remoteMonitoringEnabled } = this.state;
     const monitorContent = this.getMonitorContent();
     const { searchType } = this.props.values;
-    const isGraphOrQuery =
+    const displayDataSourcePanel =
       searchType === SEARCH_TYPE.GRAPH ||
       searchType === SEARCH_TYPE.QUERY ||
-      this.props.values.monitor_type === MONITOR_TYPE.CLUSTER_METRICS;
+      (remoteMonitoringEnabled && monitor_type === MONITOR_TYPE.CLUSTER_METRICS);
 
     return (
       <div>
-        {!flyoutMode && isGraphOrQuery && (
+        {!flyoutMode && displayDataSourcePanel && (
           <div>
             <DataSource
               values={values}
@@ -636,6 +676,7 @@ class DefineMonitor extends Component {
               detectorId={detectorId}
               notifications={notifications}
               isDarkMode={isDarkMode}
+              remoteMonitoringEnabled={remoteMonitoringEnabled}
             />
             <EuiSpacer />
           </div>

diff --git a/public/pages/CreateMonitor/containers/MonitorIndex/MonitorIndex.js b/public/pages/CreateMonitor/containers/MonitorIndex/MonitorIndex.js
@@ -13,7 +13,6 @@ import { validateIndex, hasError, isInvalid } from '../../../../utils/validate';
 import { canAppendWildcard, createReasonableWait, getMatchedOptions } from './utils/helpers';
 import { MONITOR_TYPE } from '../../../../utils/constants';
 import CrossClusterConfiguration from '../../components/CrossClusterConfigurations/containers';
-import { REMOTE_MONITORING_ENABLED_SETTING_PATH } from '../../components/CrossClusterConfigurations/components/ExperimentalBanner';
 
 const CustomOption = ({ option, searchValue, contentClassName }) => {
   const { health, label, index } = option;
@@ -55,52 +54,18 @@ class MonitorIndex extends React.Component {
       allAliases: [],
       partialMatchedAliases: [],
       exactMatchedAliases: [],
-      remoteMonitoringEnabled: false,
     };
 
     this.onCreateOption = this.onCreateOption.bind(this);
     this.onSearchChange = this.onSearchChange.bind(this);
     this.handleQueryIndices = this.handleQueryIndices.bind(this);
     this.handleQueryAliases = this.handleQueryAliases.bind(this);
     this.onFetch = this.onFetch.bind(this);
-    this.getSettings = this.getSettings.bind(this);
   }
 
   componentDidMount() {
     // Simulate initial load.
     this.onSearchChange('');
-    this.getSettings();
-  }
-
-  async getSettings() {
-    this.setState({ isLoading: true });
-    try {
-      const { httpClient } = this.props;
-      const response = await httpClient.get('../api/alerting/_settings');
-      console.info(`hurnneyt getSettings::response = ${JSON.stringify(response, null, 4)}`);
-      if (response.ok) {
-        const { defaults, transient, persistent } = response.resp;
-        let remoteMonitoringEnabled = _.get(
-          // If present, take the 'transient' setting.
-          transient,
-          REMOTE_MONITORING_ENABLED_SETTING_PATH,
-          // Else take the 'persistent' setting.
-          _.get(
-            persistent,
-            REMOTE_MONITORING_ENABLED_SETTING_PATH,
-            // Else take the 'default' setting.
-            _.get(defaults, REMOTE_MONITORING_ENABLED_SETTING_PATH, false)
-          )
-        );
-        // Boolean settings are returned as strings (e.g., `"true"`, and `"false"`). Constructing boolean value from the string.
-        if (typeof remoteMonitoringEnabled === 'string')
-          remoteMonitoringEnabled = JSON.parse(remoteMonitoringEnabled);
-        this.setState({ remoteMonitoringEnabled: remoteMonitoringEnabled });
-      }
-    } catch (e) {
-      console.log('Error while retrieving settings', e);
-    }
-    this.setState({ isLoading: false });
   }
 
   onCreateOption(searchValue, selectedOptions, setFieldValue, supportMultipleIndices) {
@@ -233,7 +198,7 @@ class MonitorIndex extends React.Component {
   }
 
   render() {
-    const { httpClient } = this.props;
+    const { httpClient, remoteMonitoringEnabled } = this.props;
     const {
       isLoading,
       allIndices,
@@ -242,7 +207,6 @@ class MonitorIndex extends React.Component {
       allAliases,
       partialMatchedAliases,
       exactMatchedAliases,
-      remoteMonitoringEnabled,
     } = this.state;
 
     const { visibleOptions } = getMatchedOptions(