[Explore] highlighting run query when chart is stale on explore view (#4459)

* highlighting run query when chart is stale on explore view

* refactoring control changed code
This commit is contained in:
Gabe Lyons
2018-02-26 10:57:20 -08:00
committed by Maxime Beauchemin
parent 2932585c65
commit 56f65158a2
2 changed files with 31 additions and 8 deletions

View File

@@ -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 />