felix-bedag commented on PR #37065:
URL: https://github.com/apache/superset/pull/37065#issuecomment-3990219440
For those that can't yet update to Superset 6 but need a fix for Superset 5,
I can confirm that this fix works if introduced into the codebase.
Our repo is not visible to the internet, so here's the `state.ts` file that
we use until we can upgrade to Superset 6:
```TypeScript
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import { useSelector } from 'react-redux';
import { useCallback, useMemo } from 'react';
import {
Filter,
FilterConfiguration,
Divider,
NativeFilterType,
} from '@superset-ui/core';
import { ActiveTabs, DashboardLayout, RootState } from '../../types';
import { CHART_TYPE, TAB_TYPE } from '../../util/componentTypes';
import { DASHBOARD_ROOT_ID } from '../../util/constants';
const defaultFilterConfiguration: Filter[] = [];
export function useFilterConfiguration() {
return useSelector<any, FilterConfiguration>(
state =>
state.dashboardInfo?.metadata?.native_filter_configuration ||
defaultFilterConfiguration,
);
}
/**
* returns the dashboard's filter configuration,
* converted into a map of id -> filter
*/
export function useFilterConfigMap() {
const filterConfig = useFilterConfiguration();
return useMemo(
() =>
filterConfig.reduce<Record<string, Filter | Divider>>(
(acc: Record<string, Filter | Divider>, filter: Filter) => {
acc[filter.id] = filter;
return acc;
},
{},
),
[filterConfig],
);
}
export function useDashboardLayout() {
return useSelector<any, DashboardLayout>(
state => state.dashboardLayout?.present,
);
}
export function useDashboardHasTabs() {
const dashboardLayout = useDashboardLayout();
return useMemo(
() =>
Object.values(dashboardLayout).some(element => element.type ===
TAB_TYPE),
[dashboardLayout],
);
}
function useActiveDashboardTabs() {
return useSelector<RootState, ActiveTabs>(
state => state.dashboardState?.activeTabs,
);
}
function useSelectChartTabParents() {
const dashboardLayout = useDashboardLayout();
const layoutChartItems = useMemo(
() =>
Object.values(dashboardLayout).filter(item => item.type ===
CHART_TYPE),
[dashboardLayout],
);
return useCallback(
(chartId: number) => {
const chartLayoutItem = layoutChartItems.find(
layoutItem => layoutItem.meta?.chartId === chartId,
);
return chartLayoutItem?.parents?.filter(
(parent: string) => dashboardLayout[parent]?.type === TAB_TYPE,
);
},
[dashboardLayout, layoutChartItems],
);
}
export function useIsFilterInScope() {
const activeTabs = useActiveDashboardTabs();
const selectChartTabParents = useSelectChartTabParents();
// Filter is in scope if any of its charts is visible.
// Chart is visible if it's placed in an active tab tree or if it's not
attached to any tab.
// Chart is in an active tab tree if all of its ancestors of type TAB are
active
// Dividers are always in scope
return useCallback(
(filter: Filter | Divider) => {
if (filter.type === NativeFilterType.Divider) return true;
const hasChartsInScope =
Array.isArray(filter.chartsInScope) && filter.chartsInScope.length >
0;
let isChartInScope = false;
if (hasChartsInScope) {
isChartInScope = filter.chartsInScope!.some((chartId: number) => {
const tabParents = selectChartTabParents(chartId);
return (
!tabParents ||
tabParents.length === 0 ||
tabParents.every(tab => activeTabs.includes(tab))
);
});
}
if (hasChartsInScope) {
return isChartInScope;
}
return (
filter.scope?.rootPath?.some(tab => activeTabs.includes(tab)) ??
false
);
},
[selectChartTabParents, activeTabs],
);
}
export function useSelectFiltersInScope(filters: (Filter | Divider)[]) {
const dashboardHasTabs = useDashboardHasTabs();
const dashboardLayout = useDashboardLayout();
const isFilterInScope = useIsFilterInScope();
return useMemo(() => {
let filtersInScope: (Filter | Divider)[] = [];
const filtersOutOfScope: (Filter | Divider)[] = [];
// we check native filters scopes only on dashboards with tabs
if (!dashboardHasTabs) {
filtersInScope = filters;
} else {
filters.forEach(filter => {
const filterInScope = isFilterInScope(filter);
if (filterInScope) {
filtersInScope.push(filter);
} else {
// Hide tab-scoped filters when their tab exists but is not active.
// Show in "Out of Scope" if it's a global filter or scoped to
non-existent tabs.
const hasExplicitTabScope =
filter.type !== NativeFilterType.Divider &&
filter.scope?.rootPath &&
filter.scope.rootPath.length > 0 &&
filter.scope.rootPath.some(
id =>
id !== DASHBOARD_ROOT_ID &&
dashboardLayout[id]?.type === TAB_TYPE,
);
if (!hasExplicitTabScope) {
filtersOutOfScope.push(filter);
}
}
});
}
return [filtersInScope, filtersOutOfScope];
}, [filters, dashboardHasTabs, dashboardLayout, isFilterInScope]);
}
```
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
