fix(explore): CUSTOM SQL tab should automatically update (#14194)

* fix(explore): CUSTOM SQL tab should automatically update * fix(explore): CUSTOM SQL tab should automatically update * fix: lint * fix(explore): default value Co-authored-by: Yongjie Zhao <yongjiezhao@apache.org> Co-authored-by: liuyaozong <liuyaozong@baijiahulian.com> Co-authored-by: stephenLYZ <vueact@gmail.com> Co-authored-by: Yongjie Zhao <yongjiezhao@apache.org>
apache · Apr 21, 2021 · 852e840 · 852e840
1 parent 0dfb32c
commit 852e840
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 0 deletions.
diff --git a/...t-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopover/index.jsx b/...t-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopover/index.jsx
@@ -64,11 +64,13 @@ export default class AdhocFilterEditPopover extends React.Component {
     this.onMouseUp = this.onMouseUp.bind(this);
     this.onAdhocFilterChange = this.onAdhocFilterChange.bind(this);
     this.adjustHeight = this.adjustHeight.bind(this);
+    this.onTabChange = this.onTabChange.bind(this);
 
     this.state = {
       adhocFilter: this.props.adhocFilter,
       width: startingWidth,
       height: startingHeight,
+      activeKey: this.props?.adhocFilter?.expressionType || 'SIMPLE',
     };
 
     this.popoverContentRef = React.createRef();
@@ -118,6 +120,12 @@ export default class AdhocFilterEditPopover extends React.Component {
     document.removeEventListener('mousemove', this.onMouseMove);
   }
 
+  onTabChange(activeKey) {
+    this.setState({
+      activeKey,
+    });
+  }
+
   adjustHeight(heightDifference) {
     this.setState(state => ({ height: state.height + heightDifference }));
   }
@@ -154,6 +162,7 @@ export default class AdhocFilterEditPopover extends React.Component {
           data-test="adhoc-filter-edit-tabs"
           style={{ minHeight: this.state.height, width: this.state.width }}
           allowOverflow
+          onChange={this.onTabChange}
         >
           <Tabs.TabPane
             className="adhoc-filter-edit-tab"
@@ -185,6 +194,7 @@ export default class AdhocFilterEditPopover extends React.Component {
                   onChange={this.onAdhocFilterChange}
                   options={this.props.options}
                   height={this.state.height}
+                  activeKey={this.state.activeKey}
                 />
               ) : (
                 <div className="custom-sql-disabled-message">

diff --git a/...c/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent/index.jsx b/...c/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent/index.jsx
@@ -42,6 +42,7 @@ const propTypes = {
     ]),
   ).isRequired,
   height: PropTypes.number.isRequired,
+  activeKey: PropTypes.string.isRequired,
 };
 
 export default class AdhocFilterEditPopoverSqlTabContent extends React.Component {