(superset) branch master updated: fix(native-filter): infinite filter loading by deps (#39175)

[mi...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

michaelsmolina pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git


The following commit(s) were added to refs/heads/master by this push:
     new 499e27ea54e fix(native-filter): infinite filter loading by deps (#39175)
499e27ea54e is described below

commit 499e27ea54e7be5cd07fc8ef5c41954e36894de5
Author: JUST.in DO IT <ju...@airbnb.com>
AuthorDate: Tue Apr 14 05:06:36 2026 -0700

    fix(native-filter): infinite filter loading by deps (#39175)
---
 .../FilterBar/FilterControls/FilterValue.tsx       | 35 +++++++++++++++-------
 1 file changed, 25 insertions(+), 10 deletions(-)

diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterValue.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterValue.tsx
index 5a71656a958..f2ee5fc5acf 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterValue.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterValue.tsx
@@ -46,7 +46,7 @@ import { useDispatch, useSelector } from 'react-redux';
 import { isEqual, isEqualWith } from 'lodash';
 import { getChartDataRequest } from 'src/components/Chart/chartAction';
 import { ErrorAlert, ErrorMessageWithStackTrace } from 'src/components';
-import { Loading, Constants } from '@superset-ui/core/components';
+import { Loading, Constants, Flex } from '@superset-ui/core/components';
 import { waitForAsyncData } from 'src/middleware/asyncEvent';
 import { FilterBarOrientation, RootState } from 'src/dashboard/types';
 import {
@@ -128,6 +128,8 @@ const FilterValue: FC<FilterValueProps> = ({
     [isCustomization],
   );
   const [state, setState] = useState<ChartDataResponseResult[]>([]);
+  const hasDeps = Boolean(filter.cascadeParentIds?.length);
+  const [hasDepsFilterValue, setHasDepsFilterValue] = useState(hasDeps);
   const dashboardId = useSelector<RootState, number>(
     state => state.dashboardInfo.id,
   );
@@ -160,6 +162,10 @@ const FilterValue: FC<FilterValueProps> = ({
     }
   }, [dispatch, shouldRefresh]);
 
+  useEffect(() => {
+    setHasDepsFilterValue(hasDeps);
+  }, [hasDeps]);
+
   useEffect(() => {
     if (!inViewFirstTime && inView) {
       setInViewFirstTime(true);
@@ -185,28 +191,31 @@ const FilterValue: FC<FilterValueProps> = ({
       // Prevent unnecessary backend requests by validating parent filter selections first
 
       let selectedParentFilterValueCounts = 0;
-
+      let isTimeRangeSelected = false;
       (filter.cascadeParentIds ?? []).forEach(pId => {
         const extraFormData = dataMaskSelected?.[pId]?.extraFormData;
         if (extraFormData?.filters?.length) {
           selectedParentFilterValueCounts += extraFormData.filters.length;
-        } else if (extraFormData?.time_range) {
-          selectedParentFilterValueCounts += 1;
+        }
+        if (extraFormData?.time_range) {
+          isTimeRangeSelected = true;
         }
       });
 
       // check if all parent filters with defaults have a value selected
 
-      let depsCount = dependencies.filters?.length ?? 0;
+      const depsCount = dependencies.filters?.length ?? 0;
+      const hasTimeRangeDeps = Boolean(dependencies?.time_range);
 
-      if (dependencies?.time_range) {
-        depsCount += 1;
-      }
-      if (selectedParentFilterValueCounts !== depsCount) {
+      if (
+        selectedParentFilterValueCounts !== depsCount ||
+        (hasTimeRangeDeps && !isTimeRangeSelected)
+      ) {
         // child filter should not request backend until it
         // has all the required information from parent filters
         return;
       }
+      setHasDepsFilterValue(false);
     }
 
     // TODO: We should try to improve our useEffect hooks to depend more on
@@ -281,6 +290,7 @@ const FilterValue: FC<FilterValueProps> = ({
     isRefreshing,
     shouldRefresh,
     dataMaskSelected,
+    setHasDepsFilterValue,
   ]);
 
   useEffect(() => {
@@ -397,7 +407,12 @@ const FilterValue: FC<FilterValueProps> = ({
       overflow={overflow}
     >
       {isLoading ? (
-        <Loading position="inline-centered" size="s" muted />
+        <Flex align="center">
+          <Loading position="inline" size="s" muted />
+          {hasDepsFilterValue
+            ? t('Awaiting filter selection')
+            : t('Loading filter values')}
+        </Flex>
       ) : (
         <SuperChart
           height={HEIGHT}