fix(native-filters): chartsInScope were not recalculated in some cases (#15498)

* fix(native-filters): chartsInScope were not recalculated in some cases

* Small refactor
This commit is contained in:
Kamil Gabryjelski 2021-07-01 14:47:14 +02:00 committed by GitHub
parent baf42bc2c5
commit 0ff3253afd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 11 deletions

View File

@ -68,22 +68,24 @@ const DashboardContainer: FC<DashboardContainerProps> = ({ topLevelTabs }) => {
}, [getLeafComponentIdFromPath(directPathToChild)]); }, [getLeafComponentIdFromPath(directPathToChild)]);
// recalculate charts and tabs in scopes of native filters only when a scope or dashboard layout changes // recalculate charts and tabs in scopes of native filters only when a scope or dashboard layout changes
const nativeFiltersValues = Object.values(nativeFilters); const filterScopes = Object.values(nativeFilters).map(filter => ({
const scopes = nativeFiltersValues.map(filter => filter.scope); id: filter.id,
scope: filter.scope,
}));
useEffect(() => { useEffect(() => {
if ( if (
!isFeatureEnabled(FeatureFlag.DASHBOARD_NATIVE_FILTERS) || !isFeatureEnabled(FeatureFlag.DASHBOARD_NATIVE_FILTERS) ||
nativeFiltersValues.length === 0 filterScopes.length === 0
) { ) {
return; return;
} }
const filterScopes = nativeFiltersValues.map(filter => { const scopes = filterScopes.map(filterScope => {
const filterScope = filter.scope; const { scope } = filterScope;
const chartsInScope: number[] = getChartIdsInFilterScope({ const chartsInScope: number[] = getChartIdsInFilterScope({
filterScope: { filterScope: {
scope: filterScope.rootPath, scope: scope.rootPath,
// @ts-ignore // @ts-ignore
immune: filterScope.excluded, immune: scope.excluded,
}, },
}); });
const tabsInScope = findTabsWithChartsInScope( const tabsInScope = findTabsWithChartsInScope(
@ -91,13 +93,13 @@ const DashboardContainer: FC<DashboardContainerProps> = ({ topLevelTabs }) => {
chartsInScope, chartsInScope,
); );
return { return {
filterId: filter.id, filterId: filterScope.id,
tabsInScope: Array.from(tabsInScope), tabsInScope: Array.from(tabsInScope),
chartsInScope, chartsInScope,
}; };
}); });
dispatch(setInScopeStatusOfFilters(filterScopes)); dispatch(setInScopeStatusOfFilters(scopes));
}, [JSON.stringify(scopes), JSON.stringify(dashboardLayout)]); }, [JSON.stringify(filterScopes), dashboardLayout, dispatch]);
const childIds: string[] = topLevelTabs const childIds: string[] = topLevelTabs
? topLevelTabs.children ? topLevelTabs.children

View File

@ -130,7 +130,7 @@ const FilterFocusHighlight = React.forwardRef(
if (focusedNativeFilterId) { if (focusedNativeFilterId) {
if ( if (
nativeFilters.filters[focusedNativeFilterId].chartsInScope.includes( nativeFilters.filters[focusedNativeFilterId].chartsInScope?.includes(
chartId, chartId,
) )
) { ) {