From 11429c8689de42d84f9307b5b8965f4b740ea64f Mon Sep 17 00:00:00 2001
From: Walter Rafelsberger <walter@rafelsberger.at>
Date: Thu, 1 Nov 2018 11:50:27 +0100
Subject: [PATCH] [ML] Fixes bug with category filtering flag for
 rare/population charts. (#24901) (#24920)

Fixes a bug where the filtering limit of categories for the rare chart was actually applied to the population chart variant.
---
 .../__snapshots__/explorer_chart_label.test.js.snap       | 8 ++++++--
 .../explorer_chart_label/explorer_chart_label.test.js     | 5 +++--
 .../explorer_charts/explorer_chart_distribution.js        | 4 ++--
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/x-pack/plugins/ml/public/explorer/explorer_charts/components/explorer_chart_label/__snapshots__/explorer_chart_label.test.js.snap b/x-pack/plugins/ml/public/explorer/explorer_charts/components/explorer_chart_label/__snapshots__/explorer_chart_label.test.js.snap
index 3054cc4cf3957..aed47581bfc7a 100644
--- a/x-pack/plugins/ml/public/explorer/explorer_charts/components/explorer_chart_label/__snapshots__/explorer_chart_label.test.js.snap
+++ b/x-pack/plugins/ml/public/explorer/explorer_charts/components/explorer_chart_label/__snapshots__/explorer_chart_label.test.js.snap
@@ -8,7 +8,9 @@ exports[`ExplorerChartLabelBadge Render the chart label in one line. 1`] = `
     <span
       className="ml-explorer-chart-label-detector"
     >
-      high_sum(nginx.access.body_sent.bytes) over nginx.access.remote_ip (population-03)
+      <React.Fragment>
+        high_sum(nginx.access.body_sent.bytes) over nginx.access.remote_ip (population-03)
+      </React.Fragment>
       <React.Fragment>
          – 
       </React.Fragment>
@@ -64,7 +66,9 @@ exports[`ExplorerChartLabelBadge Render the chart label in two lines. 1`] = `
     <span
       className="ml-explorer-chart-label-detector"
     >
-      high_sum(nginx.access.body_sent.bytes) over nginx.access.remote_ip (population-03)
+      <React.Fragment>
+        high_sum(nginx.access.body_sent.bytes) over nginx.access.remote_ip (population-03)
+      </React.Fragment>
       <React.Fragment>
          
       </React.Fragment>
diff --git a/x-pack/plugins/ml/public/explorer/explorer_charts/components/explorer_chart_label/explorer_chart_label.test.js b/x-pack/plugins/ml/public/explorer/explorer_charts/components/explorer_chart_label/explorer_chart_label.test.js
index f0ff2b53a3c18..0a56c63248265 100644
--- a/x-pack/plugins/ml/public/explorer/explorer_charts/components/explorer_chart_label/explorer_chart_label.test.js
+++ b/x-pack/plugins/ml/public/explorer/explorer_charts/components/explorer_chart_label/explorer_chart_label.test.js
@@ -11,6 +11,7 @@ import React from 'react';
 
 import { ExplorerChartLabel } from './explorer_chart_label';
 
+const DetectorLabel = <React.Fragment>{seriesConfig.detectorLabel}</React.Fragment>;
 
 describe('ExplorerChartLabelBadge', () => {
 
@@ -18,7 +19,7 @@ describe('ExplorerChartLabelBadge', () => {
 
     const wrapper = shallow(
       <ExplorerChartLabel
-        detectorLabel={seriesConfig.detectorLabel}
+        detectorLabel={DetectorLabel}
         entityFields={seriesConfig.entityFields}
         infoTooltip={seriesConfig.infoTooltip}
         wrapLabel={false}
@@ -32,7 +33,7 @@ describe('ExplorerChartLabelBadge', () => {
 
     const wrapper = shallow(
       <ExplorerChartLabel
-        detectorLabel={seriesConfig.detectorLabel}
+        detectorLabel={DetectorLabel}
         entityFields={seriesConfig.entityFields}
         infoTooltip={seriesConfig.infoTooltip}
         wrapLabel={true}
diff --git a/x-pack/plugins/ml/public/explorer/explorer_charts/explorer_chart_distribution.js b/x-pack/plugins/ml/public/explorer/explorer_charts/explorer_chart_distribution.js
index 151bd60ad4c6e..c1eb487af782d 100644
--- a/x-pack/plugins/ml/public/explorer/explorer_charts/explorer_chart_distribution.js
+++ b/x-pack/plugins/ml/public/explorer/explorer_charts/explorer_chart_distribution.js
@@ -124,9 +124,9 @@ export class ExplorerChartDistribution extends React.Component {
         .filter((d, i) => {
           // only filter for rare charts
           if (chartType === CHART_TYPE.EVENT_DISTRIBUTION) {
-            return true;
+            return (i < categoryLimit || d.key === highlight);
           }
-          return (i < categoryLimit || d.key === highlight);
+          return true;
         })
         .map(d => d.key);