Apache Superset 6.0.0 - fix(native-filters): clear all functionality

[ypandey-fluidata]

Bug description

Hi I have found this issue #36882 , in which the user correct the functionality of clear all button for native filters in Superset 5.0+ --

#Original Code:

`const handleClearAll = useCallback(() => {
const newClearAllTriggers = { ...clearAllTriggers };
// Clear all native filters, not just those in scope
// This ensures dependent filters are cleared even if parent was cleared first
nativeFilterValues.forEach(filter => {
const { id } = filter;
if (dataMaskSelected[id]) {
setDataMaskSelected(draft => {
if (draft[id].filterState?.value !== undefined) {
draft[id].filterState!.value = undefined;
}
draft[id].extraFormData = {};
});
newClearAllTriggers[id] = true;
}
});

let hasChartCustomizationsToClear = false;

const allDataMasks = { ...dataMaskSelected, ...dataMaskApplied };

Object.keys(allDataMasks).forEach(key => {
  if (key.startsWith('chart_customization_')) {
    hasChartCustomizationsToClear = true;
  }
});

if (!hasChartCustomizationsToClear && chartCustomizationItems.length > 0) {
  chartCustomizationItems.forEach(item => {
    if (item.customization?.column) {
      const customizationFilterId = `chart_customization_${item.id}`;
      const dataMask = {
        filterState: {
          value: item.customization.column,
        },
        ownState: {
          column: item.customization.column,
        },
        extraFormData: {},
      };

      dispatch(updateDataMask(customizationFilterId, dataMask));
      hasChartCustomizationsToClear = true;
    }
  });
}

if (hasChartCustomizationsToClear) {
  dispatch(clearAllPendingChartCustomizations());
  dispatch(clearAllChartCustomizationsFromMetadata());
  setHasClearedChartCustomizations(true);
}

setClearAllTriggers(newClearAllTriggers);

}, [
dataMaskSelected,
nativeFilterValues,
setDataMaskSelected,
clearAllTriggers,
dataMaskApplied,
chartCustomizationItems,
dispatch,
]);

const handleClearAllComplete = useCallback((filterId: string) => {
setClearAllTriggers(prev => {
const newTriggers = { ...prev };
delete newTriggers[filterId];
return newTriggers;
});
}, []);`

#Corrected Code:

`const handleClearAll = useCallback(() => {
dispatch(logEvent(LOG_ACTIONS_CHANGE_DASHBOARD_FILTER, {}));
setUpdateKey(1);
const newClearAllTriggers = { ...clearAllTriggers };
// Clear all native filters, not just those in scope
const updates: Record<string, DataMaskWithId> = {};
nativeFilterValues.forEach(filter => {
const { id } = filter;
if (dataMaskSelected[id]) {
updates[id] = {
...dataMaskSelected[id],
filterState: {
...dataMaskSelected[id].filterState,
value: null,
},
extraFormData: {},
};
newClearAllTriggers[id] = true;
}
});

setDataMaskSelected(draft => {
  Object.entries(updates).forEach(([id, mask]) => {
    draft[id] = mask;
  });
});

Object.entries(updates).forEach(([id, mask]) => {
  dispatch(updateDataMask(id, mask));
});

let hasChartCustomizationsToClear = false;

const allDataMasks = { ...dataMaskSelected, ...dataMaskApplied };

Object.keys(allDataMasks).forEach(key => {
  if (key.startsWith('chart_customization_')) {
    hasChartCustomizationsToClear = true;
  }
});

if (!hasChartCustomizationsToClear && chartCustomizationItems.length > 0) {
  chartCustomizationItems.forEach(item => {
    if (item.customization?.column) {
      const customizationFilterId = `chart_customization_${item.id}`;
      const dataMask = {
        filterState: {
          value: item.customization.column,
        },
        ownState: {
          column: item.customization.column,
        },
        extraFormData: {},
      };

      dispatch(updateDataMask(customizationFilterId, dataMask));
      hasChartCustomizationsToClear = true;
    }
  });
}

if (hasChartCustomizationsToClear) {
  dispatch(clearAllPendingChartCustomizations());
  dispatch(clearAllChartCustomizationsFromMetadata());
  setHasClearedChartCustomizations(true);

  const clearedChartCustomizations = chartCustomizationItems.map(item => ({
    ...item,
    customization: {
      ...item.customization,
      column: null,
    },
  }));

  dispatch(saveChartCustomization(clearedChartCustomizations));
}

setClearAllTriggers(newClearAllTriggers);

}, [
dataMaskSelected,
nativeFilterValues,
setDataMaskSelected,
clearAllTriggers,
dataMaskApplied,
chartCustomizationItems,
dispatch,
]);

const handleClearAllComplete = useCallback((filterId: string) => {
setClearAllTriggers(prev => {
const newTriggers = { ...prev };
delete newTriggers[filterId];
return newTriggers;
});
}, []);`

---

Now as i am trying to implement the same in Superset 6.0 but it is having a different code structure--

#Apache Superset 6.0 Native Filters:

` const handleClearAll = useCallback(() => {
const newClearAllTriggers = { ...clearAllTriggers };
filtersInScope.filter(isNativeFilter).forEach(filter => {
const { id } = filter;
if (dataMaskSelected[id]) {
setDataMaskSelected(draft => {
if (draft[id].filterState?.value !== undefined) {
draft[id].filterState!.value = undefined;
}
draft[id].extraFormData = {};
});
newClearAllTriggers[id] = true;
}
});
setClearAllTriggers(newClearAllTriggers);
}, [dataMaskSelected, filtersInScope, setDataMaskSelected, clearAllTriggers]);

const handleClearAllComplete = useCallback((filterId: string) => {
setClearAllTriggers(prev => {
const newTriggers = { ...prev };
delete newTriggers[filterId];
return newTriggers;
});
}, []);

useFilterUpdates(dataMaskSelected, setDataMaskSelected);
const isApplyDisabled = checkIsApplyDisabled(
dataMaskSelected,
dataMaskApplied,
filtersInScope.filter(isNativeFilter),
);
const isInitialized = useInitialization();

const actions = useMemo(
() => (

),
[
orientation,
verticalConfig?.width,
handleApply,
handleClearAll,
dataMaskSelected,
dataMaskAppliedText,
isApplyDisabled,
],
);

const filterBarComponent =
orientation === FilterBarOrientation.Horizontal ? (

) : verticalConfig ? (

) : null;

return hidden ? (
{filterBarComponent}
) : (
filterBarComponent
);
};
export default memo(FilterBar);`

Screenshots/recordings

No response

Superset version

master / latest-dev

Python version

3.9

Node version

16

Browser

Chrome

Additional context

No response

Checklist

• I have searched Superset docs and Slack and didn't find a solution to my problem.
• I have searched the GitHub issue tracker and didn't find a similar bug report.
• I have checked Superset's logs for errors and if I found a relevant Python stacktrace, I included it here as text in the "additional context" section.

[dosubot]

In Superset 6.0, the "Clear All" functionality for native filters was updated to address issues from earlier versions. The current implementation clears all native filters—including dependent ones—by iterating over all nativeFilterValues and resetting their values and extraFormData in local state. The SelectFilterPlugin was also updated to prevent default values from being reapplied during a clear-all operation, ensuring that dependent filters don't revert to defaults after clearing. This fix is included in PR #35303 and is now the standard behavior in 6.0 (details and code).

Unlike in 5.x, the 6.0 handleClearAll does not dispatch updateDataMask actions immediately for each filter; instead, it relies on local state updates, and the actual Redux/global state is updated when the user clicks "Apply". This separation means that clearing and applying filters are distinct actions: clearing resets the UI, and applying pushes those changes to the store and triggers chart reloads (see code).

Chart customization clearing logic, which was present in the 5.x fix, is no longer part of the native filters "Clear All" flow in 6.0. Repository-wide searches confirm that this logic has been removed or refactored out of the native filters area.

If you want "Clear All" to immediately update the Redux store and reload charts (without requiring a separate "Apply" click), you can adapt handleClearAll to dispatch updateDataMask for each cleared filter, similar to the handleApply logic. Otherwise, the current pattern is to clear locally and apply when the user confirms.

If you need to extend "Clear All" to other dashboard state elements, you'll need to add that logic separately, as the current implementation is focused solely on native filters.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[ypandey-fluidata]

The filter values get cleared when I hit the clear all button but the application of filter over the visuals does not get clear as it happens in #36882. The issue is persistent, if we hit clear all it should clear filter values as well as the visuals should get back to initial state.

[dosubot]

In Superset 6.0, clicking "Clear All" only resets the filter values in the UI—it doesn't immediately update the visuals or charts. This is different from the behavior in PR #36882 for 5.x, where "Clear All" both cleared the filters and instantly applied the changes to the dashboard visuals by dispatching updateDataMask for each filter.

In 6.0, the logic is split: "Clear All" updates local state, and you must click "Apply" to push those changes to the Redux store and trigger chart reloads. This separation is intentional and confirmed by maintainers—there's no built-in setting to make "Clear All" auto-apply changes out of the box (source, source).

If you want "Clear All" to immediately reset visuals, you can modify handleClearAll in the FilterBar component to dispatch updateDataMask for each cleared filter, just like handleApply does. Here’s a simplified example of how you might adapt your handleClearAll:

const handleClearAll = useCallback(() => {
  dispatch(logEvent(LOG_ACTIONS_CHANGE_DASHBOARD_FILTER, {}));
  setUpdateKey(1);
  const newClearAllTriggers = { ...clearAllTriggers };
  const updates = {};
  nativeFilterValues.forEach(filter => {
    const { id } = filter;
    if (dataMaskSelected[id]) {
      updates[id] = {
        ...dataMaskSelected[id],
        filterState: {
          ...dataMaskSelected[id].filterState,
          value: null,
        },
        extraFormData: {},
      };
      newClearAllTriggers[id] = true;
    }
  });

  setDataMaskSelected(draft => {
    Object.entries(updates).forEach(([id, mask]) => {
      draft[id] = mask;
    });
  });

  Object.entries(updates).forEach(([id, mask]) => {
    dispatch(updateDataMask(id, mask));
  });

  setClearAllTriggers(newClearAllTriggers);
}, [dataMaskSelected, nativeFilterValues, setDataMaskSelected, clearAllTriggers, dispatch]);

This will clear the filters and immediately apply the changes, so the visuals reset without needing to click "Apply" (reference).

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[ypandey-fluidata]

I implemented the above code in index.tsx with the corrected function --

#index.tsx
/*
import {
FC,
memo,
useEffect,
useState,
useCallback,
useRef,
useMemo,
} from 'react';

import { useDispatch, useSelector } from 'react-redux';
import {
DataMaskStateWithId,
DataMaskWithId,
Filter,
DataMask,
isNativeFilter,
usePrevious,
styled,
} from '@superset-ui/core';
import { Constants } from '@superset-ui/core/components';
import { useHistory } from 'react-router-dom';
import { updateDataMask } from 'src/dataMask/actions';
import { useImmer } from 'use-immer';
import { isEmpty, isEqual, debounce } from 'lodash';
import { getInitialDataMask } from 'src/dataMask/reducer';
import { URL_PARAMS } from 'src/constants';
import { applicationRoot } from 'src/utils/getBootstrapData';
import { getUrlParam } from 'src/utils/urlUtils';
import { useTabId } from 'src/hooks/useTabId';
import { logEvent } from 'src/logger/actions';
import { LOG_ACTIONS_CHANGE_DASHBOARD_FILTER } from 'src/logger/LogUtils';
import { FilterBarOrientation, RootState } from 'src/dashboard/types';
import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes';
import { checkIsApplyDisabled } from './utils';
import { FiltersBarProps } from './types';
import {
useNativeFiltersDataMask,
useFilters,
useFilterUpdates,
useInitialization,
} from './state';
import { createFilterKey, updateFilterKey } from './keyValue';
import ActionButtons from './ActionButtons';
import Horizontal from './Horizontal';
import Vertical from './Vertical';
import { useSelectFiltersInScope } from '../state';

// FilterBar is just being hidden as it must still
// render fully due to encapsulated logics
const HiddenFilterBar = styled.divdisplay: none;;

const EXCLUDED_URL_PARAMS: string[] = [
URL_PARAMS.nativeFilters.name,
URL_PARAMS.permalinkKey.name,
];

const publishDataMask = debounce(
async (
history,
dashboardId,
updateKey,
dataMaskSelected: DataMaskStateWithId,
tabId,
) => {
const { location } = history;
const { search } = location;
const previousParams = new URLSearchParams(search);
const newParams = new URLSearchParams();
let dataMaskKey: string | null;
previousParams.forEach((value, key) => {
if (!EXCLUDED_URL_PARAMS.includes(key)) {
newParams.append(key, value);
}
});

const nativeFiltersCacheKey = getUrlParam(URL_PARAMS.nativeFiltersKey);
const dataMask = JSON.stringify(dataMaskSelected);
if (
  updateKey &&
  nativeFiltersCacheKey &&
  (await updateFilterKey(
    dashboardId,
    dataMask,
    nativeFiltersCacheKey,
    tabId,
  ))
) {
  dataMaskKey = nativeFiltersCacheKey;
} else {
  dataMaskKey = await createFilterKey(dashboardId, dataMask, tabId);
}
if (dataMaskKey) {
  newParams.set(URL_PARAMS.nativeFiltersKey.name, dataMaskKey);
}

// pathname could be updated somewhere else through window.history
// keep react router history in sync with window history
// replace params only when current page is /superset/dashboard
// this prevents a race condition between updating filters and navigating to Explore
if (window.location.pathname.includes('/superset/dashboard')) {
  // The history API is part of React router and understands that a basename may exist.
  // Internally it treats all paths as if they are relative to the root and appends
  // it when necessary. We strip any prefix so that history.replace adds it back and doesn't
  // double it up.
  const appRoot = applicationRoot();
  let replacement_pathname = window.location.pathname;
  if (appRoot !== '/' && replacement_pathname.startsWith(appRoot)) {
    replacement_pathname = replacement_pathname.substring(appRoot.length);
  }
  history.location.pathname = replacement_pathname;
  history.replace({
    search: newParams.toString(),
  });
}

},
Constants.SLOW_DEBOUNCE,
);

const FilterBar: FC = ({
orientation = FilterBarOrientation.Vertical,
verticalConfig,
hidden = false,
}) => {
const history = useHistory();
const dataMaskApplied: DataMaskStateWithId = useNativeFiltersDataMask();
const [dataMaskSelected, setDataMaskSelected] =
useImmer(dataMaskApplied);
const dispatch = useDispatch();
const [updateKey, setUpdateKey] = useState(0);
const tabId = useTabId();
const filters = useFilters();
const previousFilters = usePrevious(filters);
const filterValues = useMemo(() => Object.values(filters), [filters]);
const nativeFilterValues = useMemo(
() => filterValues.filter(isNativeFilter),
[filterValues],
);
const dashboardId = useSelector<any, number>(
({ dashboardInfo }) => dashboardInfo?.id,
);
const previousDashboardId = usePrevious(dashboardId);
const canEdit = useSelector<RootState, boolean>(
({ dashboardInfo }) => dashboardInfo.dash_edit_perm,
);
const user: UserWithPermissionsAndRoles = useSelector<
RootState,
UserWithPermissionsAndRoles

(state => state.user);

const [filtersInScope] = useSelectFiltersInScope(nativeFilterValues);
const [clearAllTriggers, setClearAllTriggers] = useState<
Record<string, boolean>

({});
const [initializedFilters, setInitializedFilters] = useState<Set>(
new Set(),
);

const dataMaskSelectedRef = useRef(dataMaskSelected);
dataMaskSelectedRef.current = dataMaskSelected;
const handleFilterSelectionChange = useCallback(
(
filter: Pick<Filter, 'id'> & Partial,
dataMask: Partial,
) => {
setDataMaskSelected(draft => {
const isFirstTimeInitialization =
!initializedFilters.has(filter.id) &&
dataMaskSelectedRef.current[filter.id]?.filterState?.value ===
undefined;

    // force instant updating on initialization for filters with `requiredFirst` is true or instant filters
    if (
      // filterState.value === undefined - means that value not initialized
      dataMask.filterState?.value !== undefined &&
      isFirstTimeInitialization &&
      filter.requiredFirst
    ) {
      dispatch(updateDataMask(filter.id, dataMask));
    }

    // Mark filter as initialized after getting its first value
    if (
      dataMask.filterState?.value !== undefined &&
      !initializedFilters.has(filter.id)
    ) {
      setInitializedFilters(prev => new Set(prev).add(filter.id));
    }

    const baseDataMask = {
      ...(getInitialDataMask(filter.id) as DataMaskWithId),
      ...dataMask,
    };

    // Recalculate validation status
    const hasRequiredValue =
      filter.controlValues?.enableEmptyFilter &&
      baseDataMask.filterState?.value == null;

    draft[filter.id] = {
      ...baseDataMask,
      filterState: {
        ...baseDataMask.filterState,
        validateStatus: hasRequiredValue ? 'error' : undefined,
      },
    };
  });
},
[dispatch, setDataMaskSelected, initializedFilters, setInitializedFilters],

);

useEffect(() => {
if (previousFilters && dashboardId === previousDashboardId) {
const updates: Record<string, DataMaskWithId> = {};
Object.values(filters).forEach(currentFilter => {
const previousFilter = previousFilters?.[currentFilter.id];
if (!previousFilter) {
return;
}
const currentType = currentFilter.filterType;
const currentTargets = currentFilter.targets;
const currentDataMask = currentFilter.defaultDataMask;
const previousType = previousFilter?.filterType;
const previousTargets = previousFilter?.targets;
const previousDataMask = previousFilter?.defaultDataMask;
const typeChanged = currentType !== previousType;
const targetsChanged = !isEqual(currentTargets, previousTargets);
const dataMaskChanged = !isEqual(currentDataMask, previousDataMask);

    if (typeChanged || targetsChanged || dataMaskChanged) {
      updates[currentFilter.id] = getInitialDataMask(
        currentFilter.id,
      ) as DataMaskWithId;
    }
  });

  if (!isEmpty(updates)) {
    setDataMaskSelected(draft => ({ ...draft, ...updates }));
  }
}

}, [dashboardId, filters, previousDashboardId, setDataMaskSelected]);

const dataMaskAppliedText = JSON.stringify(dataMaskApplied);

useEffect(() => {
setDataMaskSelected(() => dataMaskApplied);
}, [dataMaskAppliedText, setDataMaskSelected]);

useEffect(() => {
// embedded users can't persist filter combinations
if (user?.userId) {
publishDataMask(history, dashboardId, updateKey, dataMaskApplied, tabId);
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [dashboardId, dataMaskAppliedText, history, updateKey, tabId]);

const handleApply = useCallback(() => {
dispatch(logEvent(LOG_ACTIONS_CHANGE_DASHBOARD_FILTER, {}));
const filterIds = Object.keys(dataMaskSelected);
setUpdateKey(1);
filterIds.forEach(filterId => {
if (dataMaskSelected[filterId]) {
dispatch(updateDataMask(filterId, dataMaskSelected[filterId]));
}
});
}, [dataMaskSelected, dispatch]);

const handleClearAll = useCallback(() => {
dispatch(logEvent(LOG_ACTIONS_CHANGE_DASHBOARD_FILTER, {}));
setUpdateKey(1);
const newClearAllTriggers = { ...clearAllTriggers };
const updates = {};
nativeFilterValues.forEach(filter => {
const { id } = filter;
if (dataMaskSelected[id]) {
updates[id] = {
...dataMaskSelected[id],
filterState: {
...dataMaskSelected[id].filterState,
value: null,
},
extraFormData: {},
};
newClearAllTriggers[id] = true;
}
});

setDataMaskSelected(draft => {
Object.entries(updates).forEach(([id, mask]) => {
draft[id] = mask;
});
});

Object.entries(updates).forEach(([id, mask]) => {
dispatch(updateDataMask(id, mask));
});

setClearAllTriggers(newClearAllTriggers);
}, [dataMaskSelected, nativeFilterValues, setDataMaskSelected, clearAllTriggers, dispatch]);

const handleClearAllComplete = useCallback((filterId: string) => {
setClearAllTriggers(prev => {
const newTriggers = { ...prev };
delete newTriggers[filterId];
return newTriggers;
});
}, []);

useFilterUpdates(dataMaskSelected, setDataMaskSelected);
const isApplyDisabled = checkIsApplyDisabled(
dataMaskSelected,
dataMaskApplied,
filtersInScope.filter(isNativeFilter),
);
const isInitialized = useInitialization();

const actions = useMemo(
() => (

),
[
orientation,
verticalConfig?.width,
handleApply,
handleClearAll,
dataMaskSelected,
dataMaskAppliedText,
isApplyDisabled,
],
);

const filterBarComponent =
orientation === FilterBarOrientation.Horizontal ? (

) : verticalConfig ? (

) : null;

return hidden ? (
{filterBarComponent}
) : (
filterBarComponent
);
};
export default memo(FilterBar);
*/

then in my Dockerfile i added this--

-----------------------------------------------------

COPY frontend_overrides/native_filters/index.tsx
src/dashboard/components/nativeFilters/FilterBar/index.tsx

then i run this command to rebuilt the image-- DOCKER_BUILDKIT=0 docker compose -f docker-compose-test.yml build --no-cache

ERROR in ./src/dashboard/components/nativeFilters/FilterBar/index.tsx:298:7
TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
No index signature with a parameter of type 'string' was found on type '{}'.
296 | const { id } = filter;
297 | if (dataMaskSelected[id]) {

298 | updates[id] = {
| ^^^^^^^^^^^
299 | ...dataMaskSelected[id],
300 | filterState: {
301 | ...dataMaskSelected[id].filterState,

ERROR in ./src/dashboard/components/nativeFilters/FilterBar/index.tsx:312:7
TS2322: Type 'unknown' is not assignable to type 'WritableDraft'.
310 | setDataMaskSelected(draft => {
311 | Object.entries(updates).forEach(([id, mask]) => {

312 | draft[id] = mask;
| ^^^^^^^^^
313 | });
314 | });
315 |

ERROR in ./src/dashboard/components/nativeFilters/FilterBar/index.tsx:317:33
TS2345: Argument of type 'unknown' is not assignable to parameter of type 'DataMask'.
315 |
316 | Object.entries(updates).forEach(([id, mask]) => {

317 | dispatch(updateDataMask(id, mask));
| ^^^^
318 | });
319 |
320 | setClearAllTriggers(newClearAllTriggers);
[+] Building 0/1
⠧ Service superset_test Building

[dosubot]

Your TypeScript errors are because updates is declared as an untyped {} object, so TypeScript doesn't allow string indexing or assignment of DataMaskWithId values. To fix all three errors (TS7053, TS2322, TS2345), explicitly type updates as Record<string, DataMaskWithId> in your handleClearAll function. Here’s how you should declare and use it:

const updates: Record<string, DataMaskWithId> = {};
nativeFilterValues.forEach(filter => {
  const { id } = filter;
  if (dataMaskSelected[id]) {
    updates[id] = {
      ...dataMaskSelected[id],
      filterState: {
        ...dataMaskSelected[id].filterState,
        value: null,
      },
      extraFormData: {},
    };
    newClearAllTriggers[id] = true;
  }
});

setDataMaskSelected(draft => {
  Object.entries(updates).forEach(([id, mask]) => {
    draft[id] = mask;
  });
});

Object.entries(updates).forEach(([id, mask]) => {
  dispatch(updateDataMask(id, mask));
});

This ensures TypeScript knows updates is a dictionary of DataMaskWithId, so string indexing and assignments are valid, and the masks are the correct type for both Immer and Redux dispatch. This pattern matches how Superset’s own code handles these types (reference).

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[ypandey-fluidata]

Great ! the issue is resolved. But I need one for customization for my visuals and also my big-number legacy chart as if there is no data right now it is showing No Data or No Data to be displayed after filtering or something. I want to modify this such it shows what i want it to show and not something predefined in superset setup files of frontend or legacy chart plugins.

[dosubot]

You can customize the "No Data" or empty state messages in Superset, but the approach depends on whether you want a global change or a per-chart customization.

For the big-number legacy chart, the default "No data" and related messages are defined in the chart's React component. If you're embedding the chart programmatically (using SuperChart or similar), you can pass a custom subtitle prop to override the default empty state message. Otherwise, to change the message for all big-number charts, you can edit the relevant strings in the plugin code (see BigNumberViz.tsx) or override the translation string for "No data" and the subtitle messages in your locale files. The relevant messages are: "No data", "No data after filtering or data is NULL for the latest time record", and "Try applying different filters or ensuring your datasource has data" source.

For other visuals, the "No Data" message is also typically defined as a translatable string in the chart plugin/component code. You can globally override these messages by editing your Superset translation files (messages.po) for your language and rebuilding the frontend assets. For example, search for and change the msgstr for msgid "No Data" in your locale's messages.po file source.

There is no built-in per-chart UI option in the dashboard editor to set a custom empty state message for individual charts. For more granular control, you would need to modify the chart plugin code to accept a custom message via formData or props.

Summary:

• For global changes, override the translation strings and rebuild assets.
• For the big-number chart, you can pass a custom subtitle prop if embedding, or edit the plugin code for a global change.
• For other charts, edit the plugin/component code or translation files as needed.

Let me know if you want a step-by-step for any of these approaches!

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[sfirke]

Hi @ypandey-fluidata - I see you wrote "Great ! the issue is resolved." after back and forth with Dosu. Does this mean we can close this issue? And then I see you opened another one for the "No data" message (which is great, thank you for making it a new issue).