[superset] 11/19: fix(native-filters): Fix clear all button (#15438)

[am...@apache.org]

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

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

commit 77a9cf6c6f1f3fc3aa96c19d117a64879d44c0a7
Author: simcha90 <56...@users.noreply.github.com>
AuthorDate: Wed Jun 30 14:59:04 2021 +0300

    fix(native-filters): Fix clear all button (#15438)
    
    * fix:fix get permission function
    
    * fix: "clear all" async flow
    
    * lint: fix lint
    
    * Update superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/index.tsx
    
    Co-authored-by: Ville Brofeldt <33...@users.noreply.github.com>
    
    * lint: fix lint
    
    Co-authored-by: Ville Brofeldt <33...@users.noreply.github.com>
    (cherry picked from commit 5f96e63bbb7ffa82da618b8a815d25de86966039)
---
 .../nativeFilters/FilterBar/Header/Header.test.tsx |  1 -
 .../nativeFilters/FilterBar/Header/index.tsx       | 28 +++++++++++++---------
 .../components/nativeFilters/FilterBar/index.tsx   |  5 ++--
 3 files changed, 19 insertions(+), 15 deletions(-)

diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/Header.test.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/Header.test.tsx
index 4b6418e..1591780 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/Header.test.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/Header.test.tsx
@@ -24,7 +24,6 @@ import Header from './index';
 const createProps = () => ({
   toggleFiltersBar: jest.fn(),
   onApply: jest.fn(),
-  setDataMaskSelected: jest.fn(),
   dataMaskSelected: {
     DefaultsID: {
       filterState: {
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/index.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/index.tsx
index 0ff53bf..cc10572 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/index.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/index.tsx
@@ -21,7 +21,8 @@ import { styled, t, useTheme } from '@superset-ui/core';
 import React, { FC } from 'react';
 import Icons from 'src/components/Icons';
 import Button from 'src/components/Button';
-import { useSelector } from 'react-redux';
+import { updateDataMask } from 'src/dataMask/actions';
+import { useDispatch, useSelector } from 'react-redux';
 import { getInitialDataMask } from 'src/dataMask/reducer';
 import { DataMaskState, DataMaskStateWithId } from 'src/dataMask/types';
 import FilterConfigurationLink from 'src/dashboard/components/nativeFilters/FilterBar/FilterConfigurationLink';
@@ -68,7 +69,6 @@ const Wrapper = styled.div`
 type HeaderProps = {
   toggleFiltersBar: (arg0: boolean) => void;
   onApply: () => void;
-  setDataMaskSelected: (arg0: (draft: DataMaskState) => void) => void;
   dataMaskSelected: DataMaskState;
   dataMaskApplied: DataMaskStateWithId;
   isApplyDisabled: boolean;
@@ -79,25 +79,31 @@ const Header: FC<HeaderProps> = ({
   isApplyDisabled,
   dataMaskSelected,
   dataMaskApplied,
-  setDataMaskSelected,
   toggleFiltersBar,
 }) => {
   const theme = useTheme();
   const filters = useFilters();
+  const dispatch = useDispatch();
   const filterValues = Object.values<Filter>(filters);
   const canEdit = useSelector<RootState, boolean>(
     ({ dashboardInfo }) => dashboardInfo.dash_edit_perm,
   );
 
   const handleClearAll = () => {
-    filterValues.forEach(filter => {
-      setDataMaskSelected(draft => {
-        draft[filter.id] = getInitialDataMask(filter.id, {
-          filterState: {
-            value: null,
-          },
-        });
-      });
+    const filterIds = Object.keys(dataMaskSelected);
+    filterIds.forEach(filterId => {
+      if (dataMaskSelected[filterId]) {
+        dispatch(
+          updateDataMask(
+            filterId,
+            getInitialDataMask(filterId, {
+              filterState: {
+                value: null,
+              },
+            }),
+          ),
+        );
+      }
     });
   };
 
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx
index f7d528c..84d4b56 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx
@@ -145,9 +145,10 @@ const FilterBar: React.FC<FiltersBarProps> = ({
   height,
   offset,
 }) => {
+  const dataMaskApplied: DataMaskStateWithId = useNativeFiltersDataMask();
   const [editFilterSetId, setEditFilterSetId] = useState<string | null>(null);
   const [dataMaskSelected, setDataMaskSelected] = useImmer<DataMaskStateWithId>(
-    {},
+    dataMaskApplied,
   );
   const dispatch = useDispatch();
   const filterSets = useFilterSets();
@@ -156,7 +157,6 @@ const FilterBar: React.FC<FiltersBarProps> = ({
   const filters = useFilters();
   const previousFilters = usePrevious(filters);
   const filterValues = Object.values<Filter>(filters);
-  const dataMaskApplied: DataMaskStateWithId = useNativeFiltersDataMask();
   const [isFilterSetChanged, setIsFilterSetChanged] = useState(false);
   const preselectNativeFilters = usePreselectNativeFilters();
   const [initializedFilters, setInitializedFilters] = useState<any[]>([]);
@@ -271,7 +271,6 @@ const FilterBar: React.FC<FiltersBarProps> = ({
         <Header
           toggleFiltersBar={toggleFiltersBar}
           onApply={handleApply}
-          setDataMaskSelected={setDataMaskSelected}
           isApplyDisabled={isApplyDisabled}
           dataMaskSelected={dataMaskSelected}
           dataMaskApplied={dataMaskApplied}