diff --git a/package.json b/package.json index 8fe59538160..716ebae7447 100644 --- a/package.json +++ b/package.json @@ -255,7 +255,7 @@ "@grafana/prometheus": "workspace:*", "@grafana/runtime": "workspace:*", "@grafana/saga-icons": "workspace:*", - "@grafana/scenes": "4.1.2", + "@grafana/scenes": "^4.2.0", "@grafana/schema": "workspace:*", "@grafana/sql": "workspace:*", "@grafana/ui": "workspace:*", diff --git a/public/app/features/dashboard-scene/embedding/EmbeddedDashboardTestPage.tsx b/public/app/features/dashboard-scene/embedding/EmbeddedDashboardTestPage.tsx index 065469b08c6..747979ea6e3 100644 --- a/public/app/features/dashboard-scene/embedding/EmbeddedDashboardTestPage.tsx +++ b/public/app/features/dashboard-scene/embedding/EmbeddedDashboardTestPage.tsx @@ -1,5 +1,6 @@ import React, { useState } from 'react'; +import { PageLayoutType } from '@grafana/data'; import { Box } from '@grafana/ui'; import { Page } from 'app/core/components/Page/Page'; @@ -12,6 +13,7 @@ export function EmbeddedDashboardTestPage() { Internal url state: {state} diff --git a/public/app/features/dashboard-scene/scene/DashboardSceneUrlSync.test.ts b/public/app/features/dashboard-scene/scene/DashboardSceneUrlSync.test.ts index dc0ecacfd7c..72843c523fd 100644 --- a/public/app/features/dashboard-scene/scene/DashboardSceneUrlSync.test.ts +++ b/public/app/features/dashboard-scene/scene/DashboardSceneUrlSync.test.ts @@ -25,6 +25,20 @@ describe('DashboardSceneUrlSync', () => { scene.urlSync?.updateFromUrl({ viewPanel: '2' }); expect(scene.state.viewPanelScene!.getUrlKey()).toBe('panel-2'); }); + + it('Should set UNSAFE_fitPanels when url has autofitpanels', () => { + const scene = buildTestScene(); + scene.urlSync?.updateFromUrl({ autofitpanels: '' }); + expect((scene.state.body as SceneGridLayout).state.UNSAFE_fitPanels).toBe(true); + }); + + it('Should get the autofitpanels from the scene state', () => { + const scene = buildTestScene(); + + expect(scene.urlSync?.getUrlState().autofitpanels).toBeUndefined(); + (scene.state.body as SceneGridLayout).setState({ UNSAFE_fitPanels: true }); + expect(scene.urlSync?.getUrlState().autofitpanels).toBe('true'); + }); }); describe('Given a viewPanelKey with clone that is not found', () => { diff --git a/public/app/features/dashboard-scene/scene/DashboardSceneUrlSync.ts b/public/app/features/dashboard-scene/scene/DashboardSceneUrlSync.ts index d46bf382f61..99acc84e760 100644 --- a/public/app/features/dashboard-scene/scene/DashboardSceneUrlSync.ts +++ b/public/app/features/dashboard-scene/scene/DashboardSceneUrlSync.ts @@ -3,6 +3,7 @@ import { Unsubscribable } from 'rxjs'; import { AppEvents } from '@grafana/data'; import { locationService } from '@grafana/runtime'; import { + SceneGridLayout, SceneObjectBase, SceneObjectState, SceneObjectUrlSyncHandler, @@ -27,13 +28,14 @@ export class DashboardSceneUrlSync implements SceneObjectUrlSyncHandler { constructor(private _scene: DashboardScene) {} getKeys(): string[] { - return ['inspect', 'viewPanel', 'editPanel', 'editview']; + return ['inspect', 'viewPanel', 'editPanel', 'editview', 'autofitpanels']; } getUrlState(): SceneObjectUrlValues { const state = this._scene.state; return { inspect: state.inspectPanelKey, + autofitpanels: state.body instanceof SceneGridLayout && !!state.body.state.UNSAFE_fitPanels ? 'true' : undefined, viewPanel: state.viewPanelScene?.getUrlKey(), editview: state.editview?.getUrlKey(), editPanel: state.editPanel?.getUrlKey() || undefined, @@ -138,6 +140,14 @@ export class DashboardSceneUrlSync implements SceneObjectUrlSyncHandler { update.editPanel = undefined; } + if (this._scene.state.body instanceof SceneGridLayout) { + const UNSAFE_fitPanels = typeof values.autofitpanels === 'string'; + + if (!!this._scene.state.body.state.UNSAFE_fitPanels !== UNSAFE_fitPanels) { + this._scene.state.body.setState({ UNSAFE_fitPanels }); + } + } + if (Object.keys(update).length > 0) { this._scene.setState(update); } diff --git a/yarn.lock b/yarn.lock index cf65d940851..aab3b712a56 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4170,9 +4170,9 @@ __metadata: languageName: unknown linkType: soft -"@grafana/scenes@npm:4.1.2": - version: 4.1.2 - resolution: "@grafana/scenes@npm:4.1.2" +"@grafana/scenes@npm:^4.2.0": + version: 4.2.0 + resolution: "@grafana/scenes@npm:4.2.0" dependencies: "@grafana/e2e-selectors": "npm:10.3.3" react-grid-layout: "npm:1.3.4" @@ -4186,7 +4186,7 @@ __metadata: "@grafana/ui": ^10.0.3 react: ^18.0.0 react-dom: ^18.0.0 - checksum: 10/3627d1f200b30872615d9427af3bdac534f8a39a5dd1ba1b3a55b9e6664cf5f0e9750fd9c0d36d1e54d7dd20f7e74a8f5e56f3e145e02f315bd9f104cdb448bd + checksum: 10/546bc27da9bde69dce23da4907014b8e0ff630a1dd43c87152f6537cebfeb31c4b3c475d05db7a93d241f7c9865cc0b1a16cc068c48dac2f4d589ecca11362de languageName: node linkType: hard @@ -18652,7 +18652,7 @@ __metadata: "@grafana/prometheus": "workspace:*" "@grafana/runtime": "workspace:*" "@grafana/saga-icons": "workspace:*" - "@grafana/scenes": "npm:4.1.2" + "@grafana/scenes": "npm:^4.2.0" "@grafana/schema": "workspace:*" "@grafana/sql": "workspace:*" "@grafana/tsconfig": "npm:^1.3.0-rc1" @@ -23550,7 +23550,21 @@ __metadata: languageName: node linkType: hard -"node-fetch@npm:^2.0.0, node-fetch@npm:^2.6.1, node-fetch@npm:^2.6.7": +"node-fetch@npm:^2.0.0, node-fetch@npm:^2.6.7": + version: 2.6.12 + resolution: "node-fetch@npm:2.6.12" + dependencies: + whatwg-url: "npm:^5.0.0" + peerDependencies: + encoding: ^0.1.0 + peerDependenciesMeta: + encoding: + optional: true + checksum: 10/370ed4d906edad9709a81b54a0141d37d2973a27dc80c723d8ac14afcec6dc67bc6c70986a96992b64ec75d08159cc4b65ce6aa9063941168ea5ac73b24df9f8 + languageName: node + linkType: hard + +"node-fetch@npm:^2.6.1": version: 2.7.0 resolution: "node-fetch@npm:2.7.0" dependencies: