Dashboard SchemaV2: Use id in PanelSpec (#98069)

* PanelSpec: replace uid with id

* Update examples
This commit is contained in:
Haris Rozajac 2024-12-17 08:35:55 -07:00 committed by GitHub
parent 01666fc1ae
commit 27c979b0bf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 35 additions and 38 deletions

View File

@ -694,7 +694,7 @@ export const defaultGridLayoutKind = (): GridLayoutKind => ({
});
export interface PanelSpec {
uid: string;
id: number;
title: string;
description: string;
links: DataLink[];
@ -704,7 +704,7 @@ export interface PanelSpec {
}
export const defaultPanelSpec = (): PanelSpec => ({
uid: "",
id: 0,
title: "",
description: "",
links: [],

View File

@ -479,7 +479,7 @@ GridLayoutKind: {
}
PanelSpec: {
uid: string
id: number
title: string
description: string
links: [...DataLink]

View File

@ -108,7 +108,7 @@ export const handyTestingSchema: DashboardV2Spec = {
},
],
elements: {
'test-panel-uid': {
'panel-1': {
kind: 'Panel',
spec: {
data: {
@ -168,7 +168,7 @@ export const handyTestingSchema: DashboardV2Spec = {
{ title: 'Test Link 2', url: 'http://test2.com' },
],
title: 'Test Panel',
uid: 'test-panel-uid',
id: 1,
vizConfig: {
kind: 'timeseries',
spec: {
@ -192,7 +192,7 @@ export const handyTestingSchema: DashboardV2Spec = {
spec: {
element: {
kind: 'ElementReference',
name: 'test-panel-uid',
name: 'panel-1',
},
height: 100,
width: 200,

View File

@ -86,7 +86,7 @@ exports[`transformSceneToSaveModelSchemaV2 should transform scene to save model
"description": "Test Description",
"editable": true,
"elements": {
"test-panel-uid": {
"panel-1": {
"kind": "Panel",
"spec": {
"data": {
@ -98,6 +98,7 @@ exports[`transformSceneToSaveModelSchemaV2 should transform scene to save model
},
},
"description": "Test Description",
"id": 1,
"links": [
{
"targetBlank": true,
@ -110,7 +111,6 @@ exports[`transformSceneToSaveModelSchemaV2 should transform scene to save model
},
],
"title": "Test Panel",
"uid": "test-panel-uid",
"vizConfig": {
"kind": "timeseries",
"spec": {
@ -134,7 +134,7 @@ exports[`transformSceneToSaveModelSchemaV2 should transform scene to save model
"spec": {
"element": {
"kind": "ElementReference",
"name": "test-panel-uid",
"name": "panel-1",
},
"height": 0,
"width": 0,

View File

@ -213,7 +213,7 @@ describe('transformSaveModelSchemaV2ToScene', () => {
// Layout
const layout = scene.state.body as DefaultGridLayoutManager;
expect(layout.state.grid.state.children.length).toBe(1);
expect(layout.state.grid.state.children[0].state.key).toBe(`grid-item-${Object.keys(dash.elements)[0]}`);
expect(layout.state.grid.state.children[0].state.key).toBe(`grid-item-${dash.elements['panel-1'].spec.id}`);
const gridLayoutItemSpec = dash.layout.spec.items[0].spec;
expect(layout.state.grid.state.children[0].state.width).toBe(gridLayoutItemSpec.width);
expect(layout.state.grid.state.children[0].state.height).toBe(gridLayoutItemSpec.height);
@ -222,13 +222,13 @@ describe('transformSaveModelSchemaV2ToScene', () => {
// Transformations
expect((vizPanel.state.$data as SceneDataTransformer)?.state.transformations[0]).toEqual(
dash.elements['test-panel-uid'].spec.data.spec.transformations[0].spec
dash.elements['panel-1'].spec.data.spec.transformations[0].spec
);
});
it('should set panel ds if it is mixed DS', () => {
const dashboard = cloneDeep(defaultDashboard);
dashboard.spec.elements['test-panel-uid'].spec.data.spec.queries.push({
dashboard.spec.elements['panel-1'].spec.data.spec.queries.push({
kind: 'PanelQuery',
spec: {
refId: 'A',
@ -256,7 +256,7 @@ describe('transformSaveModelSchemaV2ToScene', () => {
it('should set panel ds as undefined if it is not mixed DS', () => {
const dashboard = cloneDeep(defaultDashboard);
dashboard.spec.elements['test-panel-uid'].spec.data.spec.queries.push({
dashboard.spec.elements['panel-1'].spec.data.spec.queries.push({
kind: 'PanelQuery',
spec: {
refId: 'A',
@ -284,7 +284,7 @@ describe('transformSaveModelSchemaV2ToScene', () => {
it('should set panel ds as mixed if one ds is undefined', () => {
const dashboard = cloneDeep(defaultDashboard);
dashboard.spec.elements['test-panel-uid'].spec.data.spec.queries.push({
dashboard.spec.elements['panel-1'].spec.data.spec.queries.push({
kind: 'PanelQuery',
spec: {
refId: 'A',

View File

@ -72,7 +72,7 @@ import { DashboardGridItem } from '../scene/layout-default/DashboardGridItem';
import { DefaultGridLayoutManager } from '../scene/layout-default/DefaultGridLayoutManager';
import { setDashboardPanelContext } from '../scene/setDashboardPanelContext';
import { preserveDashboardSceneStateInLocalStorage } from '../utils/dashboardSessionState';
import { getDashboardSceneFor, getIntervalsFromQueryString } from '../utils/utils';
import { getDashboardSceneFor, getIntervalsFromQueryString, getVizPanelKeyForPanelId } from '../utils/utils';
import { SnapshotVariable } from './custom-variables/SnapshotVariable';
import { registerPanelInteractionsReporter } from './transformSaveModelToScene';
@ -194,7 +194,7 @@ function createSceneGridLayoutForItems(dashboard: DashboardV2Spec): SceneGridIte
const vizPanel = buildVizPanel(panel);
return new DashboardGridItem({
key: `grid-item-${panel.spec.uid}`,
key: `grid-item-${panel.spec.id}`,
x: element.spec.x,
y: element.spec.y,
width: element.spec.width,
@ -231,7 +231,7 @@ function buildVizPanel(panel: PanelKind): VizPanel {
const timeOverrideShown = (queryOptions.timeFrom || queryOptions.timeShift) && !queryOptions.hideTimeOverride;
const vizPanelState: VizPanelState = {
key: panel.spec.uid,
key: getVizPanelKeyForPanelId(panel.spec.id),
title: panel.spec.title,
description: panel.spec.description,
pluginId: panel.spec.vizConfig.kind,
@ -341,8 +341,7 @@ export function createPanelDataProvider(panelKind: PanelKind): SceneDataProvider
queryCachingTTL: panel.data.spec.queryOptions.queryCachingTTL,
minInterval: panel.data.spec.queryOptions.interval ?? undefined,
dataLayerFilter: {
// FIXME: This is asking for a number as panel ID but here the uid of a panel is string
panelId: Number.isNaN(parseInt(panel.uid, 10)) ? 0 : parseInt(panel.uid, 10),
panelId: panel.id,
},
$behaviors: [new DashboardDatasourceBehaviour({})],
});

View File

@ -140,7 +140,7 @@ describe('transformSceneToSaveModelSchemaV2', () => {
children: [
new DashboardGridItem({
body: new VizPanel({
key: 'test-panel-uid',
key: 'panel-1',
pluginId: 'timeseries',
title: 'Test Panel',
titleItems: [

View File

@ -45,7 +45,7 @@ import { PanelTimeRange } from '../scene/PanelTimeRange';
import { DashboardGridItem } from '../scene/layout-default/DashboardGridItem';
import { DefaultGridLayoutManager } from '../scene/layout-default/DefaultGridLayoutManager';
import { dashboardSceneGraph } from '../utils/dashboardSceneGraph';
import { getQueryRunnerFor } from '../utils/utils';
import { getPanelIdForVizPanel, getQueryRunnerFor, getVizPanelKeyForPanelId } from '../utils/utils';
import { sceneVariablesSetToSchemaV2Variables } from './sceneVariablesSetToVariables';
import { transformCursorSynctoEnum } from './transformToV2TypesUtils';
@ -214,7 +214,7 @@ function getElements(state: DashboardSceneState) {
const elementSpec: PanelKind = {
kind: 'Panel',
spec: {
uid: vizPanel.state.key ?? '', // FIXME: why is key optional?
id: getPanelIdForVizPanel(vizPanel),
title: vizPanel.state.title,
description: vizPanel.state.description ?? '',
links: getPanelLinks(vizPanel),
@ -354,7 +354,7 @@ function getVizPanelQueryOptions(vizPanel: VizPanel): QueryOptionsSpec {
function createElements(panels: PanelKind[]): Record<string, PanelKind> {
return panels.reduce(
(acc, panel) => {
const key = panel.spec.uid;
const key = getVizPanelKeyForPanelId(panel.spec.id);
acc[key] = panel;
return acc;
},

View File

@ -15,7 +15,7 @@ import { DashboardV2Spec } from '@grafana/schema/dist/esm/schema/dashboard/v2alp
import { DashboardScene } from '../scene/DashboardScene';
import { VizPanelLinks } from '../scene/PanelLinks';
import { TypedVariableModelV2 } from '../serialization/transformSaveModelSchemaV2ToScene';
import { getQueryRunnerFor } from '../utils/utils';
import { getPanelIdForVizPanel, getQueryRunnerFor } from '../utils/utils';
type SceneVariableConstructor<T extends SceneVariableState, V extends SceneVariable<T>> = new (
initialState: Partial<T>
@ -60,19 +60,19 @@ export function validateVariable<
}
export function validateVizPanel(vizPanel: VizPanel, dash: DashboardV2Spec) {
expect(vizPanel.state.title).toBe(dash.elements['test-panel-uid'].spec.title);
expect(vizPanel.state.description).toBe(dash.elements['test-panel-uid'].spec.description);
expect(vizPanel.state.pluginId).toBe(dash.elements['test-panel-uid'].spec.vizConfig.kind);
expect(vizPanel.state.pluginVersion).toBe(dash.elements['test-panel-uid'].spec.vizConfig.spec.pluginVersion);
expect(vizPanel.state.options).toEqual(dash.elements['test-panel-uid'].spec.vizConfig.spec.options);
expect(vizPanel.state.fieldConfig).toEqual(dash.elements['test-panel-uid'].spec.vizConfig.spec.fieldConfig);
expect(vizPanel.state.key).toBe(dash.elements['test-panel-uid'].spec.uid);
expect(vizPanel.state.displayMode).toBe(dash.elements['test-panel-uid'].spec.transparent ? 'transparent' : 'default');
expect(vizPanel.state.title).toBe(dash.elements['panel-1'].spec.title);
expect(vizPanel.state.description).toBe(dash.elements['panel-1'].spec.description);
expect(vizPanel.state.pluginId).toBe(dash.elements['panel-1'].spec.vizConfig.kind);
expect(vizPanel.state.pluginVersion).toBe(dash.elements['panel-1'].spec.vizConfig.spec.pluginVersion);
expect(vizPanel.state.options).toEqual(dash.elements['panel-1'].spec.vizConfig.spec.options);
expect(vizPanel.state.fieldConfig).toEqual(dash.elements['panel-1'].spec.vizConfig.spec.fieldConfig);
expect(getPanelIdForVizPanel(vizPanel)).toBe(dash.elements['panel-1'].spec.id);
expect(vizPanel.state.displayMode).toBe(dash.elements['panel-1'].spec.transparent ? 'transparent' : 'default');
expect(vizPanel.state.$data).toBeInstanceOf(SceneDataTransformer);
const dataTransformer = vizPanel.state.$data as SceneDataTransformer;
expect(dataTransformer.state.transformations[0]).toEqual(
dash.elements['test-panel-uid'].spec.data.spec.transformations[0].spec
dash.elements['panel-1'].spec.data.spec.transformations[0].spec
);
expect(dataTransformer.state.$data).toBeInstanceOf(SceneQueryRunner);
@ -87,9 +87,7 @@ export function validateVizPanel(vizPanel: VizPanel, dash: DashboardV2Spec) {
expect(queryRunner.state.minInterval).toBe('1m');
const titleItems = vizPanel.state.titleItems as SceneObject[];
const vizPanelLinks = titleItems[0] as VizPanelLinks;
expect(vizPanelLinks.state.rawLinks).toHaveLength(dash.elements['test-panel-uid'].spec.links.length);
expect(vizPanelLinks.state.rawLinks).toEqual(dash.elements['test-panel-uid'].spec.links);
// FIXME: This is asking for a number as panel ID but here the uid of a panel is string
// will be fixed once scenes package is updated to support string panel ID
// expect(queryRunner.state.dataLayerFilter?.panelId).toBe(0);
expect(vizPanelLinks.state.rawLinks).toHaveLength(dash.elements['panel-1'].spec.links.length);
expect(vizPanelLinks.state.rawLinks).toEqual(dash.elements['panel-1'].spec.links);
expect(queryRunner.state.dataLayerFilter?.panelId).toBe(dash.elements['panel-1'].spec.id);
}