Merge branch '7.x' into backport/7.x/pr-55068

docs/setup/upgrade.asciidoc

@@ -51,7 +51,7 @@ instructions.
 [[upgrade-6x]]
 === Upgrading from 6.x
 
-The recommended path is to upgrade to 6.7 before upgrading to 7.0. This makes it 
+The recommended path is to upgrade to 6.8 before upgrading to 7.0. This makes it 
 easier to identify the required changes, and enables you to use the Upgrade 
 Assistant to prepare for your upgrade to 7.0.
 
@@ -60,11 +60,11 @@ dashboards is supported.
 
 [float]
 [[upgrade-67]]
-=== Upgrading from 6.7
-To help you prepare for your upgrade to 7.0, 6.7 includes an https://www.elastic.co/guide/en/kibana/6.7/upgrade-assistant.html[Upgrade Assistant] 
-To access the assistant, go to *Management > 7.0 Upgrade Assistant*. 
+=== Upgrading from 6.8
+To help you prepare for your upgrade to 7.0, 6.8 includes an https://www.elastic.co/guide/en/kibana/6.8/upgrade-assistant.html[Upgrade Assistant] 
+To access the assistant, go to *Management > 7.0 Upgrade Assistant*.
 
-After you have addressed any issues that were identified by the Upgrade 
+After you have addressed any issues that were identified by the Upgrade
 Assistant, <<upgrade-standard,upgrade to 7.0>>.
 
 [float]

x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals_histogram_panel/helpers.test.tsx

@@ -0,0 +1,35 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { showInitialLoadingSpinner } from './helpers';
+
+describe('helpers', () => {
+  describe('showInitialLoadingSpinner', () => {
+    test('it should (only) show the spinner during initial loading, while we are fetching data', () => {
+      expect(showInitialLoadingSpinner({ isInitialLoading: true, isLoadingSignals: true })).toBe(
+        true
+      );
+    });
+
+    test('it should STOP showing the spinner (during initial loading) when the first data fetch completes', () => {
+      expect(showInitialLoadingSpinner({ isInitialLoading: true, isLoadingSignals: false })).toBe(
+        false
+      );
+    });
+
+    test('it should NOT show the spinner after initial loading has completed, even if the user requests more data (e.g. by clicking Refresh)', () => {
+      expect(showInitialLoadingSpinner({ isInitialLoading: false, isLoadingSignals: true })).toBe(
+        false
+      );
+    });
+
+    test('it should NOT show the spinner after initial loading has completed', () => {
+      expect(showInitialLoadingSpinner({ isInitialLoading: false, isLoadingSignals: false })).toBe(
+        false
+      );
+    });
+  });
+});

x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals_histogram_panel/helpers.tsx

@@ -76,3 +76,17 @@ export const getSignalsHistogramQuery = (
     },
   },
 });
+
+/**
+ * Returns `true` when the signals histogram initial loading spinner should be shown
+ *
+ * @param isInitialLoading The loading spinner will only be displayed if this value is `true`, because after initial load, a different, non-spinner loading indicator is displayed
+ * @param isLoadingSignals When `true`, IO is being performed to request signals (for rendering in the histogram)
+ */
+export const showInitialLoadingSpinner = ({
+  isInitialLoading,
+  isLoadingSignals,
+}: {
+  isInitialLoading: boolean;
+  isLoadingSignals: boolean;
+}): boolean => isInitialLoading && isLoadingSignals;

x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals_histogram_panel/index.tsx

@@ -23,7 +23,7 @@ import { InspectButtonContainer } from '../../../../components/inspect';
 import { useQuerySignals } from '../../../../containers/detection_engine/signals/use_query';
 import { MatrixLoader } from '../../../../components/matrix_histogram/matrix_loader';
 
-import { formatSignalsData, getSignalsHistogramQuery } from './helpers';
+import { formatSignalsData, getSignalsHistogramQuery, showInitialLoadingSpinner } from './helpers';
 import * as i18n from './translations';
 
 const DEFAULT_PANEL_HEIGHT = 300;
@@ -54,7 +54,6 @@ interface SignalsHistogramPanelProps {
   from: number;
   query?: Query;
   legendPosition?: Position;
-  loadingInitial?: boolean;
   panelHeight?: number;
   signalIndexName: string | null;
   setQuery: (params: RegisterQuery) => void;
@@ -75,7 +74,6 @@ export const SignalsHistogramPanel = memo<SignalsHistogramPanelProps>(
     query,
     from,
     legendPosition = 'right',
-    loadingInitial = false,
     panelHeight = DEFAULT_PANEL_HEIGHT,
     setQuery,
     signalIndexName,
@@ -86,7 +84,7 @@ export const SignalsHistogramPanel = memo<SignalsHistogramPanelProps>(
     title = i18n.HISTOGRAM_HEADER,
     updateDateRange,
   }) => {
-    const [isInitialLoading, setIsInitialLoading] = useState(loadingInitial || true);
+    const [isInitialLoading, setIsInitialLoading] = useState(true);
     const [defaultNumberFormat] = useUiSetting$<string>(DEFAULT_NUMBER_FORMAT);
     const [totalSignalsObj, setTotalSignalsObj] = useState<SignalsTotal>(defaultTotalSignalsObj);
     const [selectedStackByOption, setSelectedStackByOption] = useState<SignalsHistogramOption>(
@@ -124,10 +122,16 @@ export const SignalsHistogramPanel = memo<SignalsHistogramPanelProps>(
     const formattedSignalsData = useMemo(() => formatSignalsData(signalsData), [signalsData]);
 
     useEffect(() => {
-      if (!loadingInitial && isInitialLoading && !isLoadingSignals && signalsData) {
+      let canceled = false;
+
+      if (!canceled && !showInitialLoadingSpinner({ isInitialLoading, isLoadingSignals })) {
         setIsInitialLoading(false);
       }
-    }, [loadingInitial, isLoadingSignals, signalsData]);
+
+      return () => {
+        canceled = true; // prevent long running data fetches from updating state after unmounting
+      };
+    }, [isInitialLoading, isLoadingSignals, setIsInitialLoading]);
 
     useEffect(() => {
       return () => {

x-pack/legacy/plugins/siem/public/pages/detection_engine/detection_engine.tsx

@@ -177,7 +177,6 @@ const DetectionEnginePageComponent: React.FC<DetectionEnginePageComponentProps>
                             deleteQuery={deleteQuery}
                             filters={filters}
                             from={from}
-                            loadingInitial={loading}
                             query={query}
                             setQuery={setQuery}
                             showTotalSignalsCount={true}