Fix bugs on dashboard live chart

* Fix bug when over 10000 results are hit for dashboard live chart 1st time fetching anomalies, although 1 result is needed; * Use fixed height for loading spinner, instead of live chart panel
opendistro-for-elasticsearch · May 10, 2020 · f5c399a · f5c399a
1 parent d93607a
commit f5c399a
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 19 deletions.
diff --git a/public/pages/Dashboard/Components/AnomaliesDistribution.tsx b/public/pages/Dashboard/Components/AnomaliesDistribution.tsx
@@ -71,7 +71,8 @@ export const AnomaliesDistributionChart = (
       dispatch,
       0,
       MAX_ANOMALIES,
-      MAX_DETECTORS
+      MAX_DETECTORS,
+      false
     );
 
     const nonZeroAnomalyResult = latestAnomalyResult.filter(

diff --git a/public/pages/Dashboard/Components/AnomaliesLiveChart.tsx b/public/pages/Dashboard/Components/AnomaliesLiveChart.tsx
@@ -101,7 +101,8 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {
       '30m',
       dispatch,
       -1,
-      1
+      1,
+      true
     );
 
     setHasLatestAnomalyResult(!isEmpty(latestSingleLiveAnomalyResult));
@@ -114,7 +115,8 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {
       dispatch,
       0,
       MAX_ANOMALIES,
-      MAX_LIVE_DETECTORS
+      MAX_LIVE_DETECTORS,
+      false
     );
 
     setLiveAnomalyData(latestLiveAnomalyResult);
@@ -227,10 +229,12 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {
       }
       actions={[fullScreenButton()]}
       contentPanelClassName={isFullScreen ? 'full-screen' : undefined}
-      panelStyles={{ height: !isFullScreen ? '390px' : undefined }}
     >
       {isLoadingAnomalies ? (
-        <EuiFlexGroup justifyContent="center">
+        <EuiFlexGroup
+          justifyContent="center"
+          style={{ height: '353px', paddingTop: '175px' }}
+        >
           <EuiFlexItem grow={false}>
             <EuiLoadingChart size="xl" />
           </EuiFlexItem>

diff --git a/public/pages/Dashboard/utils/utils.tsx b/public/pages/Dashboard/utils/utils.tsx
@@ -439,10 +439,13 @@ export const buildGetAnomalyResultQueryByRange = (
   timeRange: string,
   from: number,
   size: number,
-  threshold: number
+  threshold: number,
+  checkLastIndexOnly: boolean
 ) => {
   return {
-    index: `${ANOMALY_RESULT_INDEX}*`,
+    index: checkLastIndexOnly
+      ? ANOMALY_RESULT_INDEX
+      : `${ANOMALY_RESULT_INDEX}*`,
     size: size,
     from: from,
     query: {
@@ -483,26 +486,28 @@ export const getLatestAnomalyResultsByTimeRange = async (
   timeRange: string,
   dispatch: Dispatch<any>,
   threshold: number,
-  anomalySize: number
+  anomalySize: number,
+  checkLastIndexOnly: boolean
 ): Promise<object[]> => {
   let from = 0;
-  let numResults: number;
   let anomalyResults = [] as object[];
+  let numSingleBatchResults: number;
   do {
     const searchResponse = await dispatch(
       func(
         buildGetAnomalyResultQueryByRange(
           timeRange,
           from,
           anomalySize,
-          threshold
+          threshold,
+          checkLastIndexOnly
         )
       )
     );
     const searchAnomalyResponse = searchResponse.data.response;
 
-    numResults = get(searchAnomalyResponse, 'hits.total.value', 0);
-    if (numResults === 0) {
+    const numHits = get(searchAnomalyResponse, 'hits.total.value', 0);
+    if (numHits === 0) {
       break;
     }
 
@@ -518,7 +523,8 @@ export const getLatestAnomalyResultsByTimeRange = async (
     );
     anomalyResults = [...anomalyResults, ...anomalies];
     from += anomalySize;
-  } while (numResults === MAX_ANOMALIES);
+    numSingleBatchResults = anomalies.length;
+  } while (numSingleBatchResults === MAX_ANOMALIES);
 
   return anomalyResults;
 };
@@ -530,27 +536,29 @@ export const getLatestAnomalyResultsForDetectorsByTimeRange = async (
   dispatch: Dispatch<any>,
   threshold: number,
   anomalySize: number,
-  detectorNum: number
+  detectorNum: number,
+  checkLastIndexOnly: boolean
 ): Promise<object[]> => {
   const detectorAndIdMap = buildDetectorAndIdMap(selectedDetectors);
   let from = 0;
-  let numResults: number;
   let anomalyResults = [] as object[];
+  let numSingleBatchResults: number;
   do {
     const searchResponse = await dispatch(
       func(
         buildGetAnomalyResultQueryByRange(
           timeRange,
           from,
           anomalySize,
-          threshold
+          threshold,
+          checkLastIndexOnly
         )
       )
     );
     const searchAnomalyResponse = searchResponse.data.response;
 
-    numResults = get(searchAnomalyResponse, 'hits.total.value', 0);
-    if (numResults === 0) {
+    const numHits = get(searchAnomalyResponse, 'hits.total.value', 0);
+    if (numHits === 0) {
       break;
     }
 
@@ -572,7 +580,8 @@ export const getLatestAnomalyResultsForDetectorsByTimeRange = async (
     );
     anomalyResults = [...anomalyResults, ...anomalies];
     from += anomalySize;
-  } while (numResults === MAX_ANOMALIES);
+    numSingleBatchResults = anomalies.length;
+  } while (numSingleBatchResults === MAX_ANOMALIES);
 
   const filteredAnomalyResults = anomalyResults.filter(anomaly =>
     detectorAndIdMap.has(get(anomaly, AD_DOC_FIELDS.DETECTOR_ID, ''))