Schema v2: Reason about new dashboard based on UID (#98800)

* Schema v2: Reason about new dashboard based on UID

* Fix test
This commit is contained in:
Dominik Prokop
2025-01-13 12:16:35 +01:00
committed by GitHub
parent e0cfd12fb3
commit 72846e3431
12 changed files with 26 additions and 73 deletions
-2
View File
@@ -50,7 +50,6 @@ export const AnnoKeySavedFromUI = 'grafana.app/saved-from-ui';
export const AnnoKeyDashboardNotFound = 'grafana.app/dashboard-not-found';
export const AnnoKeyDashboardIsSnapshot = 'grafana.app/dashboard-is-snapshot';
export const AnnoKeyDashboardSnapshotOriginalUrl = 'grafana.app/dashboard-snapshot-original-url';
export const AnnoKeyDashboardIsNew = 'grafana.app/dashboard-is-new';
export const AnnoKeyDashboardGnetId = 'grafana.app/dashboard-gnet-id';
// Annotations provided by the API
@@ -79,7 +78,6 @@ type GrafanaClientAnnotations = {
[AnnoKeyDashboardNotFound]?: boolean;
[AnnoKeyDashboardIsSnapshot]?: boolean;
[AnnoKeyDashboardSnapshotOriginalUrl]?: string;
[AnnoKeyDashboardIsNew]?: boolean;
// TODO: This should be provided by the API
// This is the dashboard ID for the Gcom API. This set when a dashboard is created through importing a dashboard from Grafana.com.
@@ -93,6 +93,7 @@ export class PanelInspectDrawer extends SceneObjectBase<PanelInspectDrawerState>
onClose = () => {
const dashboard = getDashboardSceneFor(this);
const meta = dashboard.state.meta;
const isNew = dashboard.state.uid === '';
locationService.push(
getDashboardUrl({
@@ -103,7 +104,7 @@ export class PanelInspectDrawer extends SceneObjectBase<PanelInspectDrawerState>
inspect: null,
inspectTab: null,
},
isHomeDashboard: !meta.url && !meta.slug && !meta.isNew,
isHomeDashboard: !meta.url && !meta.slug && !isNew,
})
);
};
@@ -136,13 +136,12 @@ describe('DashboardScenePageStateManager v1', () => {
});
describe('New dashboards', () => {
it('Should have new empty model with meta.isNew and should not be cached', async () => {
it('Should have new empty model and should not be cached', async () => {
const loader = new DashboardScenePageStateManager({});
await loader.loadDashboard({ uid: '', route: DashboardRoutes.New });
const dashboard = loader.state.dashboard!;
expect(dashboard.state.meta.isNew).toBe(true);
expect(dashboard.state.isEditing).toBe(undefined);
expect(dashboard.state.isDirty).toBe(false);
@@ -434,13 +433,12 @@ describe('DashboardScenePageStateManager v2', () => {
});
describe('New dashboards', () => {
it('Should have new empty model with meta.isNew and should not be cached', async () => {
it('Should have new empty model and should not be cached', async () => {
const loader = new DashboardScenePageStateManagerV2({});
await loader.loadDashboard({ uid: '', route: DashboardRoutes.New });
const dashboard = loader.state.dashboard!;
expect(dashboard.state.meta.isNew).toBe(true);
expect(dashboard.state.isEditing).toBe(undefined);
expect(dashboard.state.isDirty).toBe(false);
@@ -237,7 +237,7 @@ describe('PanelAlertTabContent', () => {
}),
];
renderAlertTab(dashboard);
renderAlertTab(dashboard, dashboard);
const defaults = await clickNewButton();
@@ -264,7 +264,7 @@ describe('PanelAlertTabContent', () => {
}),
];
renderAlertTab(dashboard);
renderAlertTab(dashboard, dashboard);
const defaults = await clickNewButton();
expect(defaults.queries[0].model).toEqual({
@@ -290,7 +290,7 @@ describe('PanelAlertTabContent', () => {
}),
];
renderAlertTab(dashboard);
renderAlertTab(dashboard, dashboard);
const defaults = await clickNewButton();
expect(defaults.queries[0].model).toEqual({
@@ -310,7 +310,7 @@ describe('PanelAlertTabContent', () => {
it('Will render alerts belonging to panel and a button to create alert from panel queries', async () => {
dashboard.panels = [panel];
renderAlertTab(dashboard);
renderAlertTab(dashboard, dashboard);
const rows = await ui.row.findAll();
expect(rows).toHaveLength(2);
@@ -334,8 +334,8 @@ describe('PanelAlertTabContent', () => {
});
});
function renderAlertTab(dashboard: DashboardModel) {
const model = createModel(dashboard);
function renderAlertTab(dashboard: DashboardModel, dto: DashboardDataDTO) {
const model = createModel(dashboard, dto);
renderAlertTabContent(model);
}
@@ -353,8 +353,8 @@ async function clickNewButton() {
return defaults;
}
function createModel(dashboard: DashboardModel) {
const scene = createDashboardSceneFromDashboardModel(dashboard, {} as DashboardDataDTO);
function createModel(dashboard: DashboardModel, dto: DashboardDataDTO) {
const scene = createDashboardSceneFromDashboardModel(dashboard, dto);
const vizPanel = findVizPanelByKey(scene, getVizPanelKeyForPanelId(34))!;
const model = new PanelDataAlertingTab({ panelRef: vizPanel.getRef() });
jest.spyOn(utils, 'getDashboardSceneFor').mockReturnValue(scene);
@@ -110,27 +110,6 @@ describe('DashboardScene', () => {
});
});
describe('Given new dashboard in edit mode', () => {
it('when saving it should clear isNew state', () => {
const scene = buildTestScene({
meta: { isNew: true },
});
scene.activate();
scene.onEnterEditMode();
scene.saveCompleted({} as Dashboard, {
id: 1,
slug: 'slug',
uid: 'dash-1',
url: 'sss',
version: 2,
status: 'aaa',
});
expect(scene.state.meta.isNew).toBeFalsy();
});
});
describe('Given scene in edit mode', () => {
let scene: DashboardScene;
let deactivateScene: () => void;
@@ -112,7 +112,7 @@ export interface DashboardSceneState extends SceneObjectState {
/** True when user made a change */
isDirty?: boolean;
/** meta flags */
meta: DashboardMeta;
meta: Omit<DashboardMeta, 'isNew'>;
/** Version of the dashboard */
version?: number;
/** Panel to inspect */
@@ -200,7 +200,7 @@ export class DashboardScene extends SceneObjectBase<DashboardSceneState> {
private _activationHandler() {
let prevSceneContext = window.__grafanaSceneContext;
const isNew = this.state.uid === '';
window.__grafanaSceneContext = this;
this._initializePanelSearch();
@@ -210,7 +210,7 @@ export class DashboardScene extends SceneObjectBase<DashboardSceneState> {
this._changeTracker.startTrackingChanges();
}
if (this.state.meta.isNew) {
if (isNew) {
this.onEnterEditMode();
this.setState({ isDirty: true });
}
@@ -284,7 +284,6 @@ export class DashboardScene extends SceneObjectBase<DashboardSceneState> {
url: result.url,
slug: result.slug,
folderUid: folderUid,
isNew: false,
version: result.version,
},
});
@@ -413,6 +412,7 @@ export class DashboardScene extends SceneObjectBase<DashboardSceneState> {
public getPageNav(location: H.Location, navIndex: NavIndex) {
const { meta, viewPanelScene, editPanel, title, uid } = this.state;
const isNew = uid === '';
if (meta.dashboardNotFound) {
return { text: 'Not found' };
@@ -425,7 +425,7 @@ export class DashboardScene extends SceneObjectBase<DashboardSceneState> {
slug: meta.slug,
currentQueryParams: location.search,
updateQuery: { viewPanel: null, inspect: null, editview: null, editPanel: null, tab: null, shareView: null },
isHomeDashboard: !meta.url && !meta.slug && !meta.isNew && !meta.isSnapshot,
isHomeDashboard: !meta.url && !meta.slug && !isNew && !meta.isSnapshot,
isSnapshot: meta.isSnapshot,
}),
};
@@ -68,6 +68,7 @@ export function ToolbarActions({ dashboard }: Props) {
const isEditedPanelDirty = usePanelEditDirty(editPanel);
const isEditingLibraryPanel = editPanel && isLibraryPanel(editPanel.state.panelRef.resolve());
const isNotFound = Boolean(meta.dashboardNotFound);
const isNew = uid === '';
const hasCopiedPanel = store.exists(LS_PANEL_COPY_KEY);
// Means we are not in settings view, fullscreen panel or edit panel
const isShowingDashboard = !editview && !isViewingPanel && !isEditingPanel;
@@ -467,7 +468,7 @@ export function ToolbarActions({ dashboard }: Props) {
toolbarActions.push({
group: 'main-buttons',
condition: isEditing && !meta.isNew && isShowingDashboard,
condition: isEditing && !isNew && isShowingDashboard,
render: () => (
<Button
onClick={() => dashboard.exitEditMode({ skipConfirm: false })}
@@ -561,7 +562,7 @@ export function ToolbarActions({ dashboard }: Props) {
condition: isEditing && !isEditingLibraryPanel && (meta.canSave || canSaveAs),
render: () => {
// if we only can save
if (meta.isNew) {
if (isNew) {
return (
<Button
onClick={() => {
@@ -155,7 +155,7 @@ export class V2DashboardSerializer
);
const hasFolderChanges = scene.getInitialState()?.meta.folderUid !== scene.state.meta.folderUid;
const isNew = scene.getInitialState()?.meta.isNew;
const isNew = scene.getInitialState()?.uid === '';
return {
...changeInfo,
@@ -9,7 +9,7 @@ import {
defaultTimeSettingsSpec,
GroupByVariableKind,
} from '@grafana/schema/dist/esm/schema/dashboard/v2alpha0/dashboard.gen';
import { AnnoKeyDashboardIsNew, AnnoKeyFolder } from 'app/features/apiserver/types';
import { AnnoKeyFolder } from 'app/features/apiserver/types';
import { DashboardWithAccessInfo } from 'app/features/dashboard/api/types';
import { getDatasourceSrv } from 'app/features/plugins/datasource_srv';
import { DashboardDTO } from 'app/types';
@@ -129,7 +129,6 @@ export async function buildNewDashboardSaveModelV2(
creationTimestamp: '0',
annotations: {
[AnnoKeyFolder]: '',
[AnnoKeyDashboardIsNew]: true,
},
},
};
@@ -26,7 +26,6 @@ import {
TextVariableKind,
} from '@grafana/schema/dist/esm/schema/dashboard/v2alpha0/dashboard.gen';
import { handyTestingSchema } from '@grafana/schema/dist/esm/schema/dashboard/v2alpha0/examples';
import { AnnoKeyDashboardIsNew } from 'app/features/apiserver/types';
import { DashboardWithAccessInfo } from 'app/features/dashboard/api/types';
import { MIXED_DATASOURCE_NAME } from 'app/plugins/datasource/mixed/MixedDataSource';
@@ -471,26 +470,5 @@ describe('transformSaveModelSchemaV2ToScene', () => {
expect(scene.state.meta.canDelete).toBe(true);
});
});
describe('is new dashboard handling', () => {
it('handles undefined is new dashbaord annotation', () => {
const scene = transformSaveModelSchemaV2ToScene(defaultDashboard);
expect(scene.state.meta.isNew).toBe(false);
});
it('handles defined is new dashbaord annotation', () => {
const dashboard: DashboardWithAccessInfo<DashboardV2Spec> = {
...defaultDashboard,
metadata: {
...defaultDashboard.metadata,
annotations: {
...defaultDashboard.metadata.annotations,
[AnnoKeyDashboardIsNew]: true,
},
},
};
const scene = transformSaveModelSchemaV2ToScene(dashboard);
expect(scene.state.meta.isNew).toBe(true);
});
});
});
});
@@ -58,7 +58,6 @@ import {
AnnoKeyFolder,
AnnoKeyUpdatedBy,
AnnoKeyUpdatedTimestamp,
AnnoKeyDashboardIsNew,
AnnoKeyDashboardIsSnapshot,
} from 'app/features/apiserver/types';
import { DashboardWithAccessInfo } from 'app/features/dashboard/api/types';
@@ -149,7 +148,6 @@ export function transformSaveModelSchemaV2ToScene(dto: DashboardWithAccessInfo<D
hasUnsavedFolderChange: false,
dashboardNotFound: Boolean(dto.metadata.annotations?.[AnnoKeyDashboardNotFound]),
version: parseInt(metadata.resourceVersion, 10),
isNew: Boolean(dto.metadata.annotations?.[AnnoKeyDashboardIsNew]),
};
// Ref: DashboardModel.initMeta
@@ -175,6 +175,7 @@ export function createDashboardSceneFromDashboardModel(oldModel: DashboardModel,
let variables: SceneVariableSet | undefined;
let annotationLayers: SceneDataLayerProvider[] = [];
let alertStatesLayer: AlertStatesDataLayer | undefined;
const uid = dto.uid;
if (oldModel.templating?.list?.length) {
if (oldModel.meta.isSnapshot) {
@@ -228,15 +229,16 @@ export function createDashboardSceneFromDashboardModel(oldModel: DashboardModel,
addPanelsOnLoadBehavior,
new DashboardScopesFacade({
reloadOnParamsChange: config.featureToggles.reloadDashboardsOnParamsChange && oldModel.meta.reloadOnParamsChange,
uid: oldModel.uid,
uid,
}),
new DashboardReloadBehavior({
reloadOnParamsChange: config.featureToggles.reloadDashboardsOnParamsChange && oldModel.meta.reloadOnParamsChange,
uid: oldModel.uid,
uid,
version: oldModel.version,
}),
];
const dashboardScene = new DashboardScene({
uid,
description: oldModel.description,
editable: oldModel.editable,
preload: dto.preload ?? false,
@@ -246,7 +248,6 @@ export function createDashboardSceneFromDashboardModel(oldModel: DashboardModel,
meta: oldModel.meta,
tags: oldModel.tags || [],
title: oldModel.title,
uid: oldModel.uid,
version: oldModel.version,
body: new DefaultGridLayoutManager({
grid: new SceneGridLayout({