fix(native-filters): Fix indicators (#14334)

* fix:fix get permission function * fix: hide featured filters * test: fix FF in tests * test: fix FF in tests * fix: fix unset cross filters (cherry picked from commit 7ff35df)
apache · Apr 28, 2021 · e86ac0a · e86ac0a
1 parent 1c2acd4
commit e86ac0a
Show file tree

Hide file tree

Showing 2 changed files with 64 additions and 49 deletions.
diff --git a/superset-frontend/spec/javascripts/dashboard/components/FiltersBadge_spec.tsx b/superset-frontend/spec/javascripts/dashboard/components/FiltersBadge_spec.tsx
@@ -31,6 +31,7 @@ import {
 import { sliceId } from 'spec/fixtures/mockChartQueries';
 import { dashboardFilters } from 'spec/fixtures/mockDashboardFilters';
 import { dashboardWithFilter } from 'spec/fixtures/mockDashboardLayout';
+import { FeatureFlag } from 'src/featureFlags';
 
 describe('FiltersBadge', () => {
   // there's this bizarre "active filters" thing
@@ -158,6 +159,10 @@ describe('FiltersBadge', () => {
     });
 
     it('shows the indicator when filters have been applied', () => {
+      // @ts-ignore
+      global.featureFlags = {
+        [FeatureFlag.DASHBOARD_NATIVE_FILTERS]: true,
+      };
       const store = getMockStoreWithNativeFilters();
       // start with basic dashboard state, dispatch an event to simulate query completion
       store.dispatch({
@@ -182,6 +187,10 @@ describe('FiltersBadge', () => {
     });
 
     it("shows a warning when there's a rejected filter", () => {
+      // @ts-ignore
+      global.featureFlags = {
+        [FeatureFlag.DASHBOARD_NATIVE_FILTERS]: true,
+      };
       const store = getMockStoreWithNativeFilters();
       // start with basic dashboard state, dispatch an event to simulate query completion
       store.dispatch({

diff --git a/superset-frontend/src/dashboard/components/FiltersBadge/selectors.ts b/superset-frontend/src/dashboard/components/FiltersBadge/selectors.ts
@@ -23,6 +23,7 @@ import {
   NativeFiltersState,
 } from 'src/dashboard/reducers/types';
 import { DataMaskStateWithId, DataMaskType } from 'src/dataMask/types';
+import { FeatureFlag, isFeatureEnabled } from '@superset-ui/core';
 import { Layout } from '../../types';
 import { getTreeCheckedItems } from '../nativeFilters/FiltersConfigModal/FiltersConfigForm/FilterScope/utils';
 
@@ -220,57 +221,62 @@ export const selectNativeIndicatorsForChart = (
     return IndicatorStatus.Unset;
   };
 
-  const nativeFilterIndicators = Object.values(nativeFilters.filters).map(
-    nativeFilter => {
-      const isAffectedByScope = getTreeCheckedItems(
-        nativeFilter.scope,
-        dashboardLayout,
-      ).some(
-        layoutItem => dashboardLayout[layoutItem]?.meta?.chartId === chartId,
-      );
-      const column = nativeFilter.targets[0]?.column?.name;
-      let value = dataMask[nativeFilter.id]?.filterState?.value ?? null;
-      if (!Array.isArray(value) && value !== null) {
-        value = [value];
-      }
-      return {
-        column,
-        name: nativeFilter.name,
-        path: [nativeFilter.id],
-        status: getStatus({ value, isAffectedByScope, column }),
-        value,
-      };
-    },
-  );
+  let nativeFilterIndicators: any = [];
+  if (isFeatureEnabled(FeatureFlag.DASHBOARD_NATIVE_FILTERS)) {
+    nativeFilterIndicators = Object.values(nativeFilters.filters).map(
+      nativeFilter => {
+        const isAffectedByScope = getTreeCheckedItems(
+          nativeFilter.scope,
+          dashboardLayout,
+        ).some(
+          layoutItem => dashboardLayout[layoutItem]?.meta?.chartId === chartId,
+        );
+        const column = nativeFilter.targets[0]?.column?.name;
+        let value = dataMask[nativeFilter.id]?.filterState?.value ?? null;
+        if (!Array.isArray(value) && value !== null) {
+          value = [value];
+        }
+        return {
+          column,
+          name: nativeFilter.name,
+          path: [nativeFilter.id],
+          status: getStatus({ value, isAffectedByScope, column }),
+          value,
+        };
+      },
+    );
+  }
 
-  const crossFilterIndicators = Object.values(chartConfiguration).map(
-    chartConfig => {
-      const scope = chartConfig?.crossFilters?.scope;
-      const isAffectedByScope = getTreeCheckedItems(
-        scope,
-        dashboardLayout,
-      ).some(
-        layoutItem => dashboardLayout[layoutItem]?.meta?.chartId === chartId,
-      );
+  let crossFilterIndicators: any = [];
+  if (isFeatureEnabled(FeatureFlag.DASHBOARD_CROSS_FILTERS)) {
+    crossFilterIndicators = Object.values(chartConfiguration)
+      .map(chartConfig => {
+        const scope = chartConfig?.crossFilters?.scope;
+        const isAffectedByScope = getTreeCheckedItems(
+          scope,
+          dashboardLayout,
+        ).some(
+          layoutItem => dashboardLayout[layoutItem]?.meta?.chartId === chartId,
+        );
 
-      let value = dataMask[chartConfig.id]?.filterState?.value ?? null;
-      if (!Array.isArray(value) && value !== null) {
-        value = [value];
-      }
-      return {
-        name: Object.values(dashboardLayout).find(
-          layoutItem => layoutItem?.meta?.chartId === chartConfig.id,
-        )?.meta?.sliceName as string,
-        path: [`${chartConfig.id}`],
-        status: getStatus({
+        let value = dataMask[chartConfig.id]?.filterState?.value ?? null;
+        if (!Array.isArray(value) && value !== null) {
+          value = [value];
+        }
+        return {
+          name: Object.values(dashboardLayout).find(
+            layoutItem => layoutItem?.meta?.chartId === chartConfig.id,
+          )?.meta?.sliceName as string,
+          path: [`${chartConfig.id}`],
+          status: getStatus({
+            value,
+            isAffectedByScope,
+            type: DataMaskType.CrossFilters,
+          }),
           value,
-          isAffectedByScope,
-          type: DataMaskType.CrossFilters,
-        }),
-        value,
-      };
-    },
-  );
-
+        };
+      })
+      .filter(filter => filter.status === IndicatorStatus.CrossFilterApplied);
+  }
   return crossFilterIndicators.concat(nativeFilterIndicators);
 };