[GitHub] mistercrunch closed pull request #4459: [Explore] highlighting run query when chart is stale on explore view

[GitBox <gi...@apache.org>]

mistercrunch closed pull request #4459: [Explore] highlighting run query when chart is stale on explore view
URL: https://github.com/apache/incubator-superset/pull/4459
 
 
   

This is a PR merged from a forked repository.
As GitHub hides the original diff on merge, it is displayed below for
the sake of provenance:

As this is a foreign pull request (from a fork), the diff is supplied
below (as it won't show otherwise due to GitHub magic):

diff --git a/superset/assets/javascripts/explore/components/ExploreViewContainer.jsx b/superset/assets/javascripts/explore/components/ExploreViewContainer.jsx
index 9d1c7ac591..c4b9fe525f 100644
--- a/superset/assets/javascripts/explore/components/ExploreViewContainer.jsx
+++ b/superset/assets/javascripts/explore/components/ExploreViewContainer.jsx
@@ -49,6 +49,7 @@ class ExploreViewContainer extends React.Component {
       height: this.getHeight(),
       width: this.getWidth(),
       showModal: false,
+      chartIsStale: false,
     };
 
     this.addHistory = this.addHistory.bind(this);
@@ -75,19 +76,24 @@ class ExploreViewContainer extends React.Component {
     if (np.controls.datasource.value !== this.props.controls.datasource.value) {
       this.props.actions.fetchDatasourceMetadata(np.form_data.datasource, true);
     }
-    // if any control value changed and it's an instant control
-    if (this.instantControlChanged(this.props.controls, np.controls)) {
+
+    const changedControlKeys = this.findChangedControlKeys(this.props.controls, np.controls);
+    if (this.hasDisplayControlChanged(changedControlKeys, np.controls)) {
       this.props.actions.updateQueryFormData(
         getFormDataFromControls(np.controls), this.props.chart.chartKey);
       this.props.actions.renderTriggered(new Date().getTime(), this.props.chart.chartKey);
     }
+    if (this.hasQueryControlChanged(changedControlKeys, np.controls)) {
+      this.setState({ chartIsStale: true });
+    }
   }
 
   /* eslint no-unused-vars: 0 */
   componentDidUpdate(prevProps, prevState) {
     this.triggerQueryIfNeeded();
 
-    if (this.instantControlChanged(prevProps.controls, this.props.controls)) {
+    const changedControlKeys = this.findChangedControlKeys(prevProps.controls, this.props.controls);
+    if (this.hasDisplayControlChanged(changedControlKeys, this.props.controls)) {
       this.addHistory({});
     }
   }
@@ -102,6 +108,7 @@ class ExploreViewContainer extends React.Component {
     this.props.actions.removeControlPanelAlert();
     this.props.actions.triggerQuery(true, this.props.chart.chartKey);
 
+    this.setState({ chartIsStale: false });
     this.addHistory({});
   }
 
@@ -121,14 +128,21 @@ class ExploreViewContainer extends React.Component {
     return `${window.innerHeight - navHeight}px`;
   }
 
-  instantControlChanged(prevControls, currentControls) {
-    return Object.keys(currentControls).some(key => (
-      currentControls[key].renderTrigger &&
+  findChangedControlKeys(prevControls, currentControls) {
+    return Object.keys(currentControls).filter(key => (
       typeof prevControls[key] !== 'undefined' &&
       !areObjectsEqual(currentControls[key].value, prevControls[key].value)
     ));
   }
 
+  hasDisplayControlChanged(changedControlKeys, currentControls) {
+    return changedControlKeys.some(key => (currentControls[key].renderTrigger));
+  }
+
+  hasQueryControlChanged(changedControlKeys, currentControls) {
+    return changedControlKeys.some(key => !currentControls[key].renderTrigger);
+  }
+
   triggerQueryIfNeeded() {
     if (this.props.chart.triggerQuery && !this.hasErrors()) {
       this.props.actions.runQuery(this.props.form_data, false,
@@ -245,6 +259,7 @@ class ExploreViewContainer extends React.Component {
               onSave={this.toggleModal.bind(this)}
               onStop={this.onStop.bind(this)}
               loading={this.props.chart.chartStatus === 'loading'}
+              chartIsStale={this.state.chartIsStale}
               errorMessage={this.renderErrorMessage()}
             />
             <br />
diff --git a/superset/assets/javascripts/explore/components/QueryAndSaveBtns.jsx b/superset/assets/javascripts/explore/components/QueryAndSaveBtns.jsx
index 6926e16fc4..cb823ff8e7 100644
--- a/superset/assets/javascripts/explore/components/QueryAndSaveBtns.jsx
+++ b/superset/assets/javascripts/explore/components/QueryAndSaveBtns.jsx
@@ -11,6 +11,7 @@ const propTypes = {
   onSave: PropTypes.func,
   onStop: PropTypes.func,
   loading: PropTypes.bool,
+  chartIsStale: PropTypes.bool,
   errorMessage: PropTypes.node,
 };
 
@@ -21,11 +22,18 @@ const defaultProps = {
 };
 
 export default function QueryAndSaveBtns(
-  { canAdd, onQuery, onSave, onStop, loading, errorMessage }) {
+  { canAdd, onQuery, onSave, onStop, loading, chartIsStale, errorMessage }) {
   const saveClasses = classnames({
     'disabled disabledButton': canAdd !== 'True',
   });
-  const qryButtonStyle = errorMessage ? 'danger' : 'primary';
+
+  let qryButtonStyle = 'default';
+  if (errorMessage) {
+    qryButtonStyle = 'danger';
+  } else if (chartIsStale) {
+    qryButtonStyle = 'primary';
+  }
+
   const saveButtonDisabled = errorMessage ? true : loading;
   const qryOrStopButton = loading ? (
     <Button


 

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services