fix: Removes Redux state mutations - iteration 2 (#23535)

superset-frontend/src/dashboard/actions/nativeFilters.ts

@@ -25,6 +25,7 @@ import {
   makeApi,
 } from '@superset-ui/core';
 import { Dispatch } from 'redux';
+import { cloneDeep } from 'lodash';
 import {
   SET_DATA_MASK_FOR_FILTER_CONFIG_FAIL,
   setDataMaskForFilterConfigComplete,
@@ -189,7 +190,7 @@ export const setInScopeStatusOfFilters =
       filterConfig: filtersWithScopes,
     });
     // need to update native_filter_configuration in the dashboard metadata
-    const { metadata } = getState().dashboardInfo;
+    const metadata = cloneDeep(getState().dashboardInfo.metadata);
     const filterConfig: FilterConfiguration =
       metadata.native_filter_configuration;
     const mergedFilterConfig = filterConfig.map(filter => {
@@ -394,6 +395,23 @@ export function unsetHoveredNativeFilter(): UnsetHoveredNativeFilter {
   };
 }
 
+export const UPDATE_CASCADE_PARENT_IDS = 'UPDATE_CASCADE_PARENT_IDS';
+export interface UpdateCascadeParentIds {
+  type: typeof UPDATE_CASCADE_PARENT_IDS;
+  id: string;
+  parentIds: string[];
+}
+export function updateCascadeParentIds(
+  id: string,
+  parentIds: string[],
+): UpdateCascadeParentIds {
+  return {
+    type: UPDATE_CASCADE_PARENT_IDS,
+    id,
+    parentIds,
+  };
+}
+
 export type AnyFilterAction =
   | SetFilterConfigBegin
   | SetFilterConfigComplete
@@ -415,4 +433,5 @@ export type AnyFilterAction =
   | DeleteFilterSetFail
   | UpdateFilterSetBegin
   | UpdateFilterSetComplete
-  | UpdateFilterSetFail;
+  | UpdateFilterSetFail
+  | UpdateCascadeParentIds;

superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/FiltersConfigModal.tsx

@@ -33,10 +33,12 @@ import {
   SLOW_DEBOUNCE,
   t,
 } from '@superset-ui/core';
+import { useDispatch } from 'react-redux';
 import { AntdForm } from 'src/components';
 import ErrorBoundary from 'src/components/ErrorBoundary';
 import { StyledModal } from 'src/components/Modal';
 import { testWithId } from 'src/utils/testUtils';
+import { updateCascadeParentIds } from 'src/dashboard/actions/nativeFilters';
 import { useFilterConfigMap, useFilterConfiguration } from '../state';
 import FilterConfigurePane from './FilterConfigurePane';
 import FiltersConfigForm, {
@@ -116,6 +118,8 @@ function FiltersConfigModal({
   onSave,
   onCancel,
 }: FiltersConfigModalProps) {
+  const dispatch = useDispatch();
+
   const [form] = AntdForm.useForm<NativeFiltersForm>();
 
   const configFormRef = useRef<any>();
@@ -309,8 +313,11 @@ function FiltersConfigModal({
       }
       const { cascadeParentIds } = filter;
       if (cascadeParentIds) {
-        filter.cascadeParentIds = cascadeParentIds.filter(id =>
-          canBeUsedAsDependency(id),
+        dispatch(
+          updateCascadeParentIds(
+            key,
+            cascadeParentIds.filter(id => canBeUsedAsDependency(id)),
+          ),
         );
       }
     });

superset-frontend/src/dashboard/reducers/nativeFilters.ts

@@ -25,6 +25,7 @@ import {
   UNSET_FOCUSED_NATIVE_FILTER,
   SET_HOVERED_NATIVE_FILTER,
   UNSET_HOVERED_NATIVE_FILTER,
+  UPDATE_CASCADE_PARENT_IDS,
 } from 'src/dashboard/actions/nativeFilters';
 import {
   FilterSet,
@@ -116,6 +117,18 @@ export default function nativeFilterReducer(
         ...state,
         hoveredFilterId: undefined,
       };
+
+    case UPDATE_CASCADE_PARENT_IDS:
+      return {
+        ...state,
+        filters: {
+          ...state.filters,
+          [action.id]: {
+            ...state.filters[action.id],
+            cascadeParentIds: action.parentIds,
+          },
+        },
+      };
     // TODO handle SET_FILTER_CONFIG_FAIL action
     default:
       return state;