From 4d0623ee25b288609742ad6fd5e5776c0f71ccce Mon Sep 17 00:00:00 2001
From: Quynh Nguyen <43350163+qn895@users.noreply.github.com>
Date: Thu, 19 Aug 2021 00:28:52 -0500
Subject: [PATCH] [ML] Add tooltip help text for Transform filter query control
 (#108720)

* [ML] Add tooltip help text

* [ML] Remove unused import

* [ML] Update tooltip content to be clearer

Co-authored-by: Lisa Cawley <lcawley@elastic.co>

Co-authored-by: Lisa Cawley <lcawley@elastic.co>
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
---
 .../filter_agg/components/filter_agg_form.tsx | 22 ++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/x-pack/plugins/transform/public/app/sections/create_transform/components/step_define/common/filter_agg/components/filter_agg_form.tsx b/x-pack/plugins/transform/public/app/sections/create_transform/components/step_define/common/filter_agg/components/filter_agg_form.tsx
index e3e767a81b01d..543ecc7dee195 100644
--- a/x-pack/plugins/transform/public/app/sections/create_transform/components/step_define/common/filter_agg/components/filter_agg_form.tsx
+++ b/x-pack/plugins/transform/public/app/sections/create_transform/components/step_define/common/filter_agg/components/filter_agg_form.tsx
@@ -6,7 +6,7 @@
  */
 
 import React, { useContext, useMemo } from 'react';
-import { EuiFormRow, EuiSelect } from '@elastic/eui';
+import { EuiFormRow, EuiIcon, EuiSelect, EuiToolTip } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 import useUpdateEffect from 'react-use/lib/useUpdateEffect';
 import { CreateTransformWizardContext } from '../../../../wizard/wizard';
@@ -72,10 +72,22 @@ export const FilterAggForm: PivotAggsConfigFilter['AggFormComponent'] = ({
     <>
       <EuiFormRow
         label={
-          <FormattedMessage
-            id="xpack.transform.agg.popoverForm.filerAggLabel"
-            defaultMessage="Filter query"
-          />
+          <>
+            <FormattedMessage
+              id="xpack.transform.agg.popoverForm.filerAggLabel"
+              defaultMessage="Filter query"
+            />
+            <EuiToolTip
+              content={
+                <FormattedMessage
+                  id="xpack.transform.agg.popoverForm.filerQueryAdvancedSuggestionTooltip"
+                  defaultMessage="To add other filter query aggregations, edit the JSON config."
+                />
+              }
+            >
+              <EuiIcon size="s" color="subdued" type="questionInCircle" className="eui-alignTop" />
+            </EuiToolTip>
+          </>
         }
       >
         <EuiSelect