feat(dashboard): direct link to single chart/tab/header in dashboard (#6964)

* direct display for pre-selected tab

* update parents

* add AnchorLink component

* add unit tests
This commit is contained in:
Grace Guo
2019-04-09 15:42:46 -07:00
committed by GitHub
parent 139f299ab3
commit c50e6bc981
33 changed files with 813 additions and 26 deletions

View File

@@ -0,0 +1,85 @@
/**
* 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 findTabIndexByComponentId from '../../../../src/dashboard/util/findTabIndexByComponentId';
describe('findTabIndexByComponentId', () => {
const topLevelTabsComponent = {
children: ['TAB-0g-5l347I2', 'TAB-qrwN_9VB5'],
id: 'TABS-MNQQSW-kyd',
meta: {},
parents: ['ROOT_ID'],
type: 'TABS',
};
const rowLevelTabsComponent = {
children: [
'TAB-TwyUUGp2Bg',
'TAB-Zl1BQAUvN',
'TAB-P0DllxzTU',
'TAB---e53RNei',
],
id: 'TABS-Oduxop1L7I',
meta: {},
parents: ['ROOT_ID', 'TABS-MNQQSW-kyd', 'TAB-qrwN_9VB5'],
type: 'TABS',
};
const goodPathToChild = [
'ROOT_ID',
'TABS-MNQQSW-kyd',
'TAB-qrwN_9VB5',
'TABS-Oduxop1L7I',
'TAB-P0DllxzTU',
'ROW-JXhrFnVP8',
'CHART-dUIVg-ENq6',
];
const badPath = ['ROOT_ID', 'TABS-MNQQSW-kyd', 'TAB-ABC', 'TABS-Oduxop1L7I'];
it('should return 0 if no directPathToChild', () => {
expect(
findTabIndexByComponentId({
currentComponent: topLevelTabsComponent,
directPathToChild: [],
}),
).toBe(0);
});
it('should return 0 if not found tab id', () => {
expect(
findTabIndexByComponentId({
currentComponent: topLevelTabsComponent,
directPathToChild: badPath,
}),
).toBe(0);
});
it('should return children index if matched an id in the path', () => {
expect(
findTabIndexByComponentId({
currentComponent: topLevelTabsComponent,
directPathToChild: goodPathToChild,
}),
).toBe(1);
expect(
findTabIndexByComponentId({
currentComponent: rowLevelTabsComponent,
directPathToChild: goodPathToChild,
}),
).toBe(2);
});
});

View File

@@ -0,0 +1,97 @@
/**
* 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 updateComponentParentsList from '../../../../src/dashboard/util/updateComponentParentsList';
import { DASHBOARD_ROOT_ID } from '../../../../src/dashboard/util/constants';
import {
dashboardLayout,
dashboardLayoutWithTabs,
} from '../fixtures/mockDashboardLayout';
describe('updateComponentParentsList', () => {
const emptyLayout = {
DASHBOARD_VERSION_KEY: 'v2',
GRID_ID: {
children: [],
id: 'GRID_ID',
type: 'GRID',
},
ROOT_ID: {
children: ['GRID_ID'],
id: 'ROOT_ID',
type: 'ROOT',
},
};
const gridLayout = {
...dashboardLayout.present,
};
const tabsLayout = {
...dashboardLayoutWithTabs.present,
};
it('should handle empty layout', () => {
const nextState = {
...emptyLayout,
};
updateComponentParentsList({
currentComponent: nextState[DASHBOARD_ROOT_ID],
layout: nextState,
});
expect(nextState.GRID_ID.parents).toEqual(['ROOT_ID']);
});
it('should handle grid layout', () => {
const nextState = {
...gridLayout,
};
updateComponentParentsList({
currentComponent: nextState[DASHBOARD_ROOT_ID],
layout: nextState,
});
expect(nextState.GRID_ID.parents).toEqual(['ROOT_ID']);
expect(nextState.CHART_ID.parents).toEqual([
'ROOT_ID',
'GRID_ID',
'ROW_ID',
'COLUMN_ID',
]);
});
it('should handle root level tabs', () => {
const nextState = {
...tabsLayout,
};
updateComponentParentsList({
currentComponent: nextState[DASHBOARD_ROOT_ID],
layout: nextState,
});
expect(nextState.GRID_ID.parents).toEqual(['ROOT_ID']);
expect(nextState.CHART_ID2.parents).toEqual([
'ROOT_ID',
'TABS_ID',
'TAB_ID2',
'ROW_ID2',
]);
});
});