add checkbox to join UI

elastic · Nov 13, 2019 · 645f3c4 · 645f3c4
1 parent a7efb25
commit 645f3c4
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 6 deletions.
diff --git a/x-pack/legacy/plugins/maps/public/components/global_filter_checkbox.js b/x-pack/legacy/plugins/maps/public/components/global_filter_checkbox.js
@@ -8,7 +8,11 @@ import React from 'react';
 import { EuiFormRow, EuiSwitch } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 
-export function GlobalFilterCheckbox({ applyGlobalQuery, setApplyGlobalQuery }) {
+const label = i18n.translate('xpack.maps.layerPanel.applyGlobalQueryCheckboxLabel', {
+  defaultMessage: `Apply global filter to source`,
+});
+
+export function GlobalFilterCheckbox({ applyGlobalQuery, customLabel, setApplyGlobalQuery }) {
   const onApplyGlobalQueryChange = event => {
     setApplyGlobalQuery(event.target.checked);
   };
@@ -18,9 +22,7 @@ export function GlobalFilterCheckbox({ applyGlobalQuery, setApplyGlobalQuery })
       display="columnCompressedSwitch"
     >
       <EuiSwitch
-        label={i18n.translate('xpack.maps.layerPanel.applyGlobalQueryCheckboxLabel', {
-          defaultMessage: `Apply global filter to source`,
-        })}
+        label={customLabel ? customLabel : label}
         checked={applyGlobalQuery}
         onChange={onApplyGlobalQueryChange}
         data-test-subj="mapLayerPanelApplyGlobalQueryCheckbox"

diff --git a/...legacy/plugins/maps/public/connected_components/layer_panel/join_editor/resources/join.js b/...legacy/plugins/maps/public/connected_components/layer_panel/join_editor/resources/join.js
@@ -15,6 +15,7 @@ import { i18n } from '@kbn/i18n';
 import { JoinExpression } from './join_expression';
 import { MetricsExpression } from './metrics_expression';
 import { WhereExpression } from './where_expression';
+import { GlobalFilterCheckbox } from '../../../../components/global_filter_checkbox';
 
 import {
   indexPatternService,
@@ -168,6 +169,16 @@ export class Join extends Component {
     });
   }
 
+  _onApplyGlobalQueryChange = applyGlobalQuery => {
+    this.props.onChange({
+      leftField: this.props.join.leftField,
+      right: {
+        ...this.props.join.right,
+        applyGlobalQuery,
+      },
+    });
+  }
+
   render() {
     const {
       join,
@@ -184,6 +195,7 @@ export class Join extends Component {
     const isJoinConfigComplete = join.leftField && right.indexPatternId && right.term;
 
     let metricsExpression;
+    let globalFilterCheckbox;
     if (isJoinConfigComplete) {
       metricsExpression = (
         <EuiFlexItem grow={false}>
@@ -194,6 +206,15 @@ export class Join extends Component {
           />
         </EuiFlexItem>
       );
+      globalFilterCheckbox = (
+        <GlobalFilterCheckbox
+          applyGlobalQuery={right.applyGlobalQuery}
+          setApplyGlobalQuery={this._onApplyGlobalQueryChange}
+          customLabel={i18n.translate('xpack.maps.layerPanel.join.applyGlobalQueryCheckboxLabel', {
+            defaultMessage: `Apply global filter to join`,
+          })}
+        />
+      );
     }
 
     let whereExpression;
@@ -234,6 +255,8 @@ export class Join extends Component {
 
           {whereExpression}
 
+          {globalFilterCheckbox}
+
           <EuiButtonIcon
             className="mapJoinItem__delete"
             iconType="trash"

diff --git a/x-pack/legacy/plugins/maps/public/connected_components/layer_panel/join_editor/view.js b/x-pack/legacy/plugins/maps/public/connected_components/layer_panel/join_editor/view.js
@@ -58,7 +58,8 @@ export function JoinEditor({ joins, layer, onChange }) {
       ...joins,
       {
         right: {
-          id: uuid()
+          id: uuid(),
+          applyGlobalQuery: true,
         }
       }
     ]);

diff --git a/x-pack/legacy/plugins/maps/public/layers/sources/source.js b/x-pack/legacy/plugins/maps/public/layers/sources/source.js
@@ -96,7 +96,6 @@ export class AbstractSource {
   }
 
   getApplyGlobalQuery() {
-    console.log(this._descriptor.applyGlobalQuery);
     return !!this._descriptor.applyGlobalQuery;
   }