mirror of
https://github.com/apache/superset.git
synced 2024-09-16 10:39:55 -04:00
fix(dashboard): Don't switch to first tab when directPathToChild changes (#26340)
This commit is contained in:
parent
5bd7fd7990
commit
39ac45351b
@ -18,7 +18,7 @@
|
|||||||
*/
|
*/
|
||||||
// ParentSize uses resize observer so the dashboard will update size
|
// ParentSize uses resize observer so the dashboard will update size
|
||||||
// when its container size changes, due to e.g., builder side panel opening
|
// when its container size changes, due to e.g., builder side panel opening
|
||||||
import React, { FC, useCallback, useEffect, useMemo } from 'react';
|
import React, { FC, useCallback, useEffect, useMemo, useRef } from 'react';
|
||||||
import { useDispatch, useSelector } from 'react-redux';
|
import { useDispatch, useSelector } from 'react-redux';
|
||||||
import {
|
import {
|
||||||
FeatureFlag,
|
FeatureFlag,
|
||||||
@ -51,7 +51,7 @@ import { setColorScheme } from 'src/dashboard/actions/dashboardState';
|
|||||||
import jsonStringify from 'json-stringify-pretty-compact';
|
import jsonStringify from 'json-stringify-pretty-compact';
|
||||||
import { NATIVE_FILTER_DIVIDER_PREFIX } from '../nativeFilters/FiltersConfigModal/utils';
|
import { NATIVE_FILTER_DIVIDER_PREFIX } from '../nativeFilters/FiltersConfigModal/utils';
|
||||||
import { findTabsWithChartsInScope } from '../nativeFilters/utils';
|
import { findTabsWithChartsInScope } from '../nativeFilters/utils';
|
||||||
import { getRootLevelTabIndex, getRootLevelTabsComponent } from './utils';
|
import { getRootLevelTabsComponent } from './utils';
|
||||||
|
|
||||||
type DashboardContainerProps = {
|
type DashboardContainerProps = {
|
||||||
topLevelTabs?: LayoutItem;
|
topLevelTabs?: LayoutItem;
|
||||||
@ -89,15 +89,18 @@ const DashboardContainer: FC<DashboardContainerProps> = ({ topLevelTabs }) => {
|
|||||||
Object.values(state.charts).map(chart => chart.id),
|
Object.values(state.charts).map(chart => chart.id),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const prevTabIndexRef = useRef();
|
||||||
const tabIndex = useMemo(() => {
|
const tabIndex = useMemo(() => {
|
||||||
const nextTabIndex = findTabIndexByComponentId({
|
const nextTabIndex = findTabIndexByComponentId({
|
||||||
currentComponent: getRootLevelTabsComponent(dashboardLayout),
|
currentComponent: getRootLevelTabsComponent(dashboardLayout),
|
||||||
directPathToChild,
|
directPathToChild,
|
||||||
});
|
});
|
||||||
|
|
||||||
return nextTabIndex > -1
|
if (nextTabIndex === -1) {
|
||||||
? nextTabIndex
|
return prevTabIndexRef.current ?? 0;
|
||||||
: getRootLevelTabIndex(dashboardLayout, directPathToChild);
|
}
|
||||||
|
prevTabIndexRef.current = nextTabIndex;
|
||||||
|
return nextTabIndex;
|
||||||
}, [dashboardLayout, directPathToChild]);
|
}, [dashboardLayout, directPathToChild]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
@ -21,7 +21,6 @@ import {
|
|||||||
DASHBOARD_ROOT_ID,
|
DASHBOARD_ROOT_ID,
|
||||||
} from 'src/dashboard/util/constants';
|
} from 'src/dashboard/util/constants';
|
||||||
import { DashboardLayout } from 'src/dashboard/types';
|
import { DashboardLayout } from 'src/dashboard/types';
|
||||||
import findTabIndexByComponentId from 'src/dashboard/util/findTabIndexByComponentId';
|
|
||||||
|
|
||||||
export const getRootLevelTabsComponent = (dashboardLayout: DashboardLayout) => {
|
export const getRootLevelTabsComponent = (dashboardLayout: DashboardLayout) => {
|
||||||
const dashboardRoot = dashboardLayout[DASHBOARD_ROOT_ID];
|
const dashboardRoot = dashboardLayout[DASHBOARD_ROOT_ID];
|
||||||
@ -38,15 +37,3 @@ export const shouldFocusTabs = (
|
|||||||
// don't focus the tabs when we click on a tab
|
// don't focus the tabs when we click on a tab
|
||||||
event.target.className === 'ant-tabs-nav-wrap' ||
|
event.target.className === 'ant-tabs-nav-wrap' ||
|
||||||
container.contains(event.target);
|
container.contains(event.target);
|
||||||
|
|
||||||
export const getRootLevelTabIndex = (
|
|
||||||
dashboardLayout: DashboardLayout,
|
|
||||||
directPathToChild: string[],
|
|
||||||
): number =>
|
|
||||||
Math.max(
|
|
||||||
0,
|
|
||||||
findTabIndexByComponentId({
|
|
||||||
currentComponent: getRootLevelTabsComponent(dashboardLayout),
|
|
||||||
directPathToChild,
|
|
||||||
}),
|
|
||||||
);
|
|
||||||
|
Loading…
Reference in New Issue
Block a user