mirror of https://github.com/apache/superset.git
fix(Explore): Clear filter value when changing columns (#16871)
* Clear filter value onChange * Clear filter value on user change action
This commit is contained in:
parent
1a38ec6c43
commit
c8db435730
|
@ -211,41 +211,12 @@ const AdhocFilterEditPopoverSimpleTabContent: React.FC<Props> = props => {
|
|||
onComparatorChange,
|
||||
} = useSimpleTabFilterProps(props);
|
||||
const [suggestions, setSuggestions] = useState<Record<string, any>>([]);
|
||||
const [comparator, setComparator] = useState(props.adhocFilter.comparator);
|
||||
const [
|
||||
loadingComparatorSuggestions,
|
||||
setLoadingComparatorSuggestions,
|
||||
] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const refreshComparatorSuggestions = () => {
|
||||
const { datasource } = props;
|
||||
const col = props.adhocFilter.subject;
|
||||
const having = props.adhocFilter.clause === CLAUSES.HAVING;
|
||||
|
||||
if (col && datasource && datasource.filter_select && !having) {
|
||||
const controller = new AbortController();
|
||||
const { signal } = controller;
|
||||
if (loadingComparatorSuggestions) {
|
||||
controller.abort();
|
||||
}
|
||||
setLoadingComparatorSuggestions(true);
|
||||
SupersetClient.get({
|
||||
signal,
|
||||
endpoint: `/superset/filter/${datasource.type}/${datasource.id}/${col}/`,
|
||||
})
|
||||
.then(({ json }) => {
|
||||
setSuggestions(json);
|
||||
setLoadingComparatorSuggestions(false);
|
||||
})
|
||||
.catch(() => {
|
||||
setSuggestions([]);
|
||||
setLoadingComparatorSuggestions(false);
|
||||
});
|
||||
}
|
||||
};
|
||||
refreshComparatorSuggestions();
|
||||
}, [props.adhocFilter.subject]);
|
||||
|
||||
const onInputComparatorChange = (
|
||||
event: React.ChangeEvent<HTMLInputElement>,
|
||||
) => {
|
||||
|
@ -257,7 +228,6 @@ const AdhocFilterEditPopoverSimpleTabContent: React.FC<Props> = props => {
|
|||
);
|
||||
|
||||
const getOptionsRemaining = () => {
|
||||
const { comparator } = props.adhocFilter;
|
||||
// if select is multi/value is array, we show the options not selected
|
||||
const valuesFromSuggestionsLength = Array.isArray(comparator)
|
||||
? comparator.filter(v => suggestions.includes(v)).length
|
||||
|
@ -270,13 +240,18 @@ const AdhocFilterEditPopoverSimpleTabContent: React.FC<Props> = props => {
|
|||
return optionsRemaining ? placeholder : '';
|
||||
};
|
||||
|
||||
const handleSubjectChange = (subject: string) => {
|
||||
setComparator(undefined);
|
||||
onSubjectChange(subject);
|
||||
};
|
||||
|
||||
let columns = props.options;
|
||||
const { subject, operator, comparator, operatorId } = props.adhocFilter;
|
||||
const { subject, operator, operatorId } = props.adhocFilter;
|
||||
|
||||
const subjectSelectProps = {
|
||||
ariaLabel: t('Select subject'),
|
||||
value: subject ?? undefined,
|
||||
onChange: onSubjectChange,
|
||||
onChange: handleSubjectChange,
|
||||
notFoundContent: t(
|
||||
'No such column found. To filter on a metric, try the Custom SQL tab.',
|
||||
),
|
||||
|
@ -345,6 +320,40 @@ const AdhocFilterEditPopoverSimpleTabContent: React.FC<Props> = props => {
|
|||
}
|
||||
`;
|
||||
|
||||
useEffect(() => {
|
||||
const refreshComparatorSuggestions = () => {
|
||||
const { datasource } = props;
|
||||
const col = props.adhocFilter.subject;
|
||||
const having = props.adhocFilter.clause === CLAUSES.HAVING;
|
||||
|
||||
if (col && datasource && datasource.filter_select && !having) {
|
||||
const controller = new AbortController();
|
||||
const { signal } = controller;
|
||||
if (loadingComparatorSuggestions) {
|
||||
controller.abort();
|
||||
}
|
||||
setLoadingComparatorSuggestions(true);
|
||||
SupersetClient.get({
|
||||
signal,
|
||||
endpoint: `/superset/filter/${datasource.type}/${datasource.id}/${col}/`,
|
||||
})
|
||||
.then(({ json }) => {
|
||||
setSuggestions(json);
|
||||
setLoadingComparatorSuggestions(false);
|
||||
})
|
||||
.catch(() => {
|
||||
setSuggestions([]);
|
||||
setLoadingComparatorSuggestions(false);
|
||||
});
|
||||
}
|
||||
};
|
||||
refreshComparatorSuggestions();
|
||||
}, [props.adhocFilter.subject]);
|
||||
|
||||
useEffect(() => {
|
||||
setComparator(props.adhocFilter.comparator);
|
||||
}, [props.adhocFilter.comparator]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Select
|
||||
|
|
Loading…
Reference in New Issue