fix(dashboard): native filters highlight with multiple tabs jumps to first tab (#15455)

This commit is contained in:
Kamil Gabryjelski 2021-06-29 19:26:55 +02:00 committed by GitHub
parent 4630abb5a8
commit 4a394cd6fb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 3 deletions

View File

@ -30,9 +30,10 @@ import {
DASHBOARD_GRID_ID,
DASHBOARD_ROOT_DEPTH,
} from 'src/dashboard/util/constants';
import { getRootLevelTabIndex } from './utils';
import { getRootLevelTabIndex, getRootLevelTabsComponent } from './utils';
import { Filters } from '../../reducers/types';
import { getChartIdsInFilterScope } from '../../util/activeDashboardFilters';
import findTabIndexByComponentId from '../../util/findTabIndexByComponentId';
import { findTabsWithChartsInScope } from '../nativeFilters/utils';
import { setInScopeStatusOfFilters } from '../../actions/nativeFilters';
@ -57,7 +58,13 @@ const DashboardContainer: FC<DashboardContainerProps> = ({ topLevelTabs }) => {
const dispatch = useDispatch();
useEffect(() => {
setTabIndex(getRootLevelTabIndex(dashboardLayout, directPathToChild));
const nextTabIndex = findTabIndexByComponentId({
currentComponent: getRootLevelTabsComponent(dashboardLayout),
directPathToChild,
});
if (nextTabIndex > -1) {
setTabIndex(nextTabIndex);
}
}, [getLeafComponentIdFromPath(directPathToChild)]);
// recalculate charts and tabs in scopes of native filters only when a scope or dashboard layout changes

View File

@ -185,7 +185,10 @@ export class Tabs extends React.PureComponent {
// make sure nextFocusComponent is under this tabs component
if (nextTabIndex > -1 && nextTabIndex !== this.state.tabIndex) {
this.setState(() => ({ tabIndex: nextTabIndex }));
this.setState(() => ({
tabIndex: nextTabIndex,
activeKey: nextTabsIds[nextTabIndex],
}));
}
}
}