feat(native-filters): Show/Hide filter bar by metdata ff (#14261)

* fix:fix get permission function * feat: hide native filters by metadata * fix: fix show_native_filters name * fix: metadata * chore: add migration to hide native_filters in all existing dashboards * chore: fix pre-commit * fix: make migration migration dashboard with filter_box only * fix: pre-commit * feat: hide filter bar if no permission edit and no filters * fix: remove migration Co-authored-by: amitmiran137 <[email protected]> (cherry picked from commit 2486fd4)
apache · Apr 28, 2021 · d63c637 · d63c637
1 parent 6a5330b
commit d63c637
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 8 deletions.
diff --git a/superset-frontend/src/dashboard/actions/hydrate.js b/superset-frontend/src/dashboard/actions/hydrate.js
@@ -302,6 +302,13 @@ export const hydrateDashboard = (dashboardData, chartData, datasourcesData) => (
     filterSetsConfig: metadata?.filter_sets_configuration || [],
   });
 
+  if (!metadata) {
+    metadata = {};
+  }
+
+  metadata.show_native_filters =
+    dashboardData?.metadata?.show_native_filters ?? true;
+
   if (isFeatureEnabled(FeatureFlag.DASHBOARD_CROSS_FILTERS)) {
     // If user just added cross filter to dashboard it's not saving it scope on server,
     // so we tweak it until user will update scope and will save it in server
@@ -314,10 +321,6 @@ export const hydrateDashboard = (dashboardData, chartData, datasourcesData) => (
           ) ?? {}
         )?.behaviors ?? [];
 
-      if (!metadata) {
-        metadata = {};
-      }
-
       if (!metadata.chart_configuration) {
         metadata.chart_configuration = {};
       }

diff --git a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
@@ -102,6 +102,12 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
   const dashboardLayout = useSelector<RootState, DashboardLayout>(
     state => state.dashboardLayout.present,
   );
+  const showNativeFilters = useSelector<RootState, boolean>(
+    state => state.dashboardInfo.metadata?.show_native_filters,
+  );
+  const canEdit = useSelector<RootState, boolean>(
+    ({ dashboardInfo }) => dashboardInfo.dash_edit_perm,
+  );
   const editMode = useSelector<RootState, boolean>(
     state => state.dashboardState.editMode,
   );
@@ -112,9 +118,10 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
   const filters = useFilters();
   const filterValues = Object.values<Filter>(filters);
 
-  const nativeFiltersEnabled = isFeatureEnabled(
-    FeatureFlag.DASHBOARD_NATIVE_FILTERS,
-  );
+  const nativeFiltersEnabled =
+    showNativeFilters &&
+    isFeatureEnabled(FeatureFlag.DASHBOARD_NATIVE_FILTERS) &&
+    (canEdit || (!canEdit && filterValues.length !== 0));
 
   const [dashboardFiltersOpen, setDashboardFiltersOpen] = useState(true);
 

diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/index.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Header/index.tsx
@@ -28,6 +28,7 @@ import FilterConfigurationLink from 'src/dashboard/components/nativeFilters/Filt
 import { useFilters } from 'src/dashboard/components/nativeFilters/FilterBar/state';
 import { Filter } from 'src/dashboard/components/nativeFilters/types';
 import { getFilterBarTestId } from '..';
+import { RootState } from '../../../../types';
 
 const TitleArea = styled.h4`
   display: flex;
@@ -79,7 +80,7 @@ const Header: FC<HeaderProps> = ({
 }) => {
   const filters = useFilters();
   const filterValues = Object.values<Filter>(filters);
-  const canEdit = useSelector<any, boolean>(
+  const canEdit = useSelector<RootState, boolean>(
     ({ dashboardInfo }) => dashboardInfo.dash_edit_perm,
   );
 

diff --git a/superset-frontend/src/dashboard/types.ts b/superset-frontend/src/dashboard/types.ts
@@ -44,6 +44,10 @@ export type Chart = {
 export type DashboardLayout = { [key: string]: LayoutItem };
 export type DashboardLayoutState = { present: DashboardLayout };
 export type DashboardState = { editMode: boolean; directPathToChild: string[] };
+export type DashboardInfo = {
+  dash_edit_perm: boolean;
+  metadata: { show_native_filters: boolean };
+};
 
 /** Root state of redux */
 export type RootState = {
@@ -53,6 +57,7 @@ export type RootState = {
   dashboardLayout: DashboardLayoutState;
   dashboardFilters: {};
   dashboardState: DashboardState;
+  dashboardInfo: DashboardInfo;
   dataMask: DataMaskStateWithId;
   dashboardInfo: JsonObject;
   impressionId: string;

diff --git a/superset/dashboards/schemas.py b/superset/dashboards/schemas.py
@@ -106,6 +106,7 @@ def validate_json_metadata(value: Union[bytes, bytearray, str]) -> None:
 
 
 class DashboardJSONMetadataSchema(Schema):
+    show_native_filters = fields.Boolean()
     # native_filter_configuration is for dashboard-native filters
     native_filter_configuration = fields.List(fields.Dict(), allow_none=True)
     # chart_configuration for now keeps data about cross-filter scoping for charts