diff --git a/superset-frontend/packages/superset-ui-core/src/chart/types/Base.ts b/superset-frontend/packages/superset-ui-core/src/chart/types/Base.ts index b3884a8488..1c4d278f6c 100644 --- a/superset-frontend/packages/superset-ui-core/src/chart/types/Base.ts +++ b/superset-frontend/packages/superset-ui-core/src/chart/types/Base.ts @@ -58,6 +58,7 @@ export enum AppSection { export type FilterState = { value?: any; [key: string]: any }; export type DataMask = { + __cache?: FilterState; extraFormData?: ExtraFormData; filterState?: FilterState; ownState?: JsonObject; diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/state.ts b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/state.ts index a710281459..bb5b5c2672 100644 --- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/state.ts +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/state.ts @@ -17,7 +17,7 @@ * under the License. */ import { useMemo } from 'react'; -import { useSelector } from 'react-redux'; +import { shallowEqual, useSelector } from 'react-redux'; import { DataMaskStateWithId, ensureIsArray, @@ -32,6 +32,7 @@ export function useFilterDependencies( ): ExtraFormData { const dependencyIds = useSelector( state => state.nativeFilters.filters[id]?.cascadeParentIds, + shallowEqual, ); return useMemo(() => { let dependencies = {}; diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx index fe3a8e21d2..546742c6dd 100644 --- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx +++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx @@ -18,7 +18,13 @@ */ /* eslint-disable no-param-reassign */ -import React, { useEffect, useState, useCallback, createContext } from 'react'; +import React, { + useEffect, + useState, + useCallback, + createContext, + useRef, +} from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { DataMaskStateWithId, @@ -144,6 +150,8 @@ const FilterBar: React.FC = ({ const [filtersInScope] = useSelectFiltersInScope(nativeFilterValues); + const dataMaskSelectedRef = useRef(dataMaskSelected); + dataMaskSelectedRef.current = dataMaskSelected; const handleFilterSelectionChange = useCallback( ( filter: Pick & Partial, @@ -154,19 +162,19 @@ const FilterBar: React.FC = ({ if ( // filterState.value === undefined - means that value not initialized dataMask.filterState?.value !== undefined && - dataMaskSelected[filter.id]?.filterState?.value === undefined && + dataMaskSelectedRef.current[filter.id]?.filterState?.value === + undefined && filter.requiredFirst ) { dispatch(updateDataMask(filter.id, dataMask)); } - draft[filter.id] = { ...(getInitialDataMask(filter.id) as DataMaskWithId), ...dataMask, }; }); }, - [dataMaskSelected, dispatch, setDataMaskSelected], + [dispatch, setDataMaskSelected], ); useEffect(() => { diff --git a/superset-frontend/src/dataMask/reducer.ts b/superset-frontend/src/dataMask/reducer.ts index f2163a54a4..6e9a5fae54 100644 --- a/superset-frontend/src/dataMask/reducer.ts +++ b/superset-frontend/src/dataMask/reducer.ts @@ -56,6 +56,7 @@ export function getInitialDataMask( } return { ...otherProps, + __cache: {}, extraFormData: {}, filterState: {}, ownState: {},