diff --git a/superset-frontend/src/explore/components/ControlPanelsContainer.jsx b/superset-frontend/src/explore/components/ControlPanelsContainer.jsx index 8c82d460a5379..b084505debc98 100644 --- a/superset-frontend/src/explore/components/ControlPanelsContainer.jsx +++ b/superset-frontend/src/explore/components/ControlPanelsContainer.jsx @@ -92,6 +92,28 @@ class ControlPanelsContainer extends React.Component { this.renderControlPanelSection = this.renderControlPanelSection.bind(this); } + componentDidUpdate(prevProps) { + const { + actions: { setControlValue }, + } = this.props; + if (this.props.form_data.datasource !== prevProps.form_data.datasource) { + const defaultValues = [ + 'MetricsControl', + 'AdhocFilterControl', + 'TextControl', + 'SelectControl', + 'CheckboxControl', + 'AnnotationLayerControl', + ]; + Object.entries(this.props.controls).forEach(([controlName, control]) => { + const { type, default: defaultValue } = control; + if (defaultValues.includes(type)) { + setControlValue(controlName, defaultValue); + } + }); + } + } + sectionsToRender() { return sectionsToRender( this.props.form_data.viz_type, @@ -253,7 +275,6 @@ class ControlPanelsContainer extends React.Component { const expandedCustomSections = this.sectionsToExpand( displaySectionsToRender, ); - return ( {this.props.alert && ( diff --git a/superset-frontend/src/explore/components/controls/CollectionControl.jsx b/superset-frontend/src/explore/components/controls/CollectionControl.jsx index 198df6d5cc515..46b096605f163 100644 --- a/superset-frontend/src/explore/components/controls/CollectionControl.jsx +++ b/superset-frontend/src/explore/components/controls/CollectionControl.jsx @@ -69,6 +69,12 @@ export default class CollectionControl extends React.Component { this.onAdd = this.onAdd.bind(this); } + componentDidUpdate(prevProps) { + if (prevProps.datasource.name !== this.props.datasource.name) { + this.props.onChange([]); + } + } + onChange(i, value) { Object.assign(this.props.value[i], value); this.props.onChange(this.props.value); diff --git a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx index 63ae310105e37..40d8445565a02 100644 --- a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx +++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx @@ -123,6 +123,9 @@ export default class AdhocMetricEditPopover extends React.PureComponent { adhocMetricLabel: this.state.adhocMetric?.getDefaultLabel(), }); } + if (prevProps.datasource !== this.props.datasource) { + this.props.onChange(null); + } } componentWillUnmount() { @@ -272,7 +275,6 @@ export default class AdhocMetricEditPopover extends React.PureComponent { datasourceType, ...popoverProps } = this.props; - const { adhocMetric, savedMetric } = this.state; const keywords = sqlKeywords.concat( columns.map(column => ({ diff --git a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx index 7aa8a05dc76ba..7d3e4c17eba40 100644 --- a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx +++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx @@ -60,7 +60,9 @@ class AdhocMetricOption extends React.PureComponent { onMoveLabel, onDropLabel, index, + datasource, } = this.props; + return ( savedMetrics.find(metric => metric.metric_name === metricName); @@ -77,6 +79,7 @@ export default function MetricDefinitionValue({ onDropLabel, index, savedMetric: savedMetric ?? {}, + datasource, }; return ; diff --git a/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx b/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx index 8e2283bbe6e2a..89bec2457a913 100644 --- a/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx +++ b/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx @@ -144,6 +144,7 @@ class MetricsControl extends React.PureComponent { onMetricEdit={this.onMetricEdit} onRemoveMetric={() => this.onRemoveMetric(index)} columns={this.props.columns} + datasource={this.props.datasource} savedMetrics={this.props.savedMetrics} savedMetricsOptions={getOptionsForSavedMetrics( this.props.savedMetrics, @@ -292,6 +293,7 @@ class MetricsControl extends React.PureComponent { this.props.value, null, )} + datasource={this.props.datasource} savedMetric={{}} datasourceType={this.props.datasourceType} createNew @@ -375,7 +377,6 @@ class MetricsControl extends React.PureComponent { render() { const { theme } = this.props; - return (
diff --git a/superset-frontend/src/explore/components/controls/SelectControl.jsx b/superset-frontend/src/explore/components/controls/SelectControl.jsx index e192c179da68f..2b032c531434c 100644 --- a/superset-frontend/src/explore/components/controls/SelectControl.jsx +++ b/superset-frontend/src/explore/components/controls/SelectControl.jsx @@ -82,7 +82,10 @@ const defaultProps = { export default class SelectControl extends React.PureComponent { constructor(props) { super(props); - this.state = { options: this.getOptions(props) }; + this.state = { + options: this.getOptions(props), + value: this.props.value, + }; this.onChange = this.onChange.bind(this); this.createMetaSelectAllOption = this.createMetaSelectAllOption.bind(this); this.select = null; // pointer to the react-select instance @@ -240,7 +243,12 @@ export default class SelectControl extends React.PureComponent { const isMulti = this.props.isMulti || this.props.multi; let assistiveText; - if (isMulti && optionsRemaining && Array.isArray(value) && !!value.length) { + if ( + isMulti && + optionsRemaining && + Array.isArray(this.state.value) && + !!value.length + ) { assistiveText = optionRemaingText; } @@ -262,12 +270,12 @@ export default class SelectControl extends React.PureComponent { onChange: this.onChange, onFocus, optionRenderer, + value, options: this.state.options, placeholder, assistiveText, promptTextCreator, selectRef: this.getSelectRef, - value, valueKey, valueRenderer, }; diff --git a/superset-frontend/src/explore/components/controls/TextControl.tsx b/superset-frontend/src/explore/components/controls/TextControl.tsx index ffc1f56d7c22a..136b1f1dd6864 100644 --- a/superset-frontend/src/explore/components/controls/TextControl.tsx +++ b/superset-frontend/src/explore/components/controls/TextControl.tsx @@ -32,6 +32,7 @@ interface TextControlProps { value?: string | number; controlId?: string; renderTrigger?: boolean; + datasource?: string; } interface TextControlState { @@ -50,6 +51,16 @@ export default class TextControl extends React.Component< this.onChange(inputValue); }, 500); + static getDerivedStateFromProps( + props: TextControlProps, + state: TextControlState, + ) { + if (props.value !== state.value) { + return { value: props.value }; + } + return null; + } + constructor(props: TextControlProps) { super(props); @@ -61,6 +72,10 @@ export default class TextControl extends React.Component< }; } + defaultInput = () => { + this.setState({ value: '' }); + }; + onChange = (inputValue: string) => { let parsedValue: string | number = inputValue; // Validation & casting @@ -103,7 +118,6 @@ export default class TextControl extends React.Component< typeof rawValue !== 'undefined' && rawValue !== null ? rawValue.toString() : ''; - return (