Scenes: Update scenes to v6 (#67110)

* Scenes: Update scenes to v6

* Fix test

public/app/features/scenes/ScenePage.tsx

@@ -1,6 +1,7 @@
 // Libraries
 import React, { useEffect, useState } from 'react';
 
+import { getUrlSyncManager } from '@grafana/scenes';
 import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
 
 import { getSceneByTitle } from './scenes';
@@ -13,7 +14,7 @@ export const ScenePage = (props: Props) => {
 
   useEffect(() => {
     if (scene && !isInitialized) {
-      scene.initUrlSync();
+      getUrlSyncManager().initSync(scene);
       setInitialized(true);
     }
   }, [isInitialized, scene]);

public/app/features/scenes/dashboard/DashboardScene.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 
 import { GrafanaTheme2, PageLayoutType } from '@grafana/data';
 import { locationService } from '@grafana/runtime';
-import { UrlSyncManager, SceneObjectBase, SceneComponentProps, SceneObject, SceneObjectState } from '@grafana/scenes';
+import { SceneObjectBase, SceneComponentProps, SceneObject, SceneObjectState } from '@grafana/scenes';
 import { ToolbarButton, useStyles2 } from '@grafana/ui';
 import { AppChromeUpdate } from 'app/core/components/AppChrome/AppChromeUpdate';
 import { Page } from 'app/core/components/Page/Page';
@@ -18,18 +18,6 @@ interface DashboardSceneState extends SceneObjectState {
 
 export class DashboardScene extends SceneObjectBase<DashboardSceneState> {
   public static Component = DashboardSceneRenderer;
-  private urlSyncManager?: UrlSyncManager;
-
-  /**
-   * It's better to do this before activate / mount to not trigger unnessary re-renders
-   */
-  public initUrlSync() {
-    if (!this.urlSyncManager) {
-      this.urlSyncManager = new UrlSyncManager(this);
-    }
-
-    this.urlSyncManager.initSync();
-  }
 }
 
 function DashboardSceneRenderer({ model }: SceneComponentProps<DashboardScene>) {

public/app/features/scenes/dashboard/DashboardsLoader.ts

@@ -23,6 +23,7 @@ import {
   SceneDataTransformer,
   SceneGridItem,
   SceneDataProvider,
+  getUrlSyncManager,
 } from '@grafana/scenes';
 import { StateManagerBase } from 'app/core/services/StateManagerBase';
 import { dashboardLoaderSrv } from 'app/features/dashboard/services/DashboardLoaderSrv';
@@ -75,7 +76,7 @@ export class DashboardLoader extends StateManagerBase<DashboardLoaderState> {
 
     // We initialize URL sync here as it better to do that before mounting and doing any rendering.
     // But would be nice to have a conditional around this so you can pre-load dashboards without url sync.
-    dashboard.initUrlSync();
+    getUrlSyncManager().initSync(dashboard);
 
     this.cache[rsp.dashboard.uid] = dashboard;
     this.setState({ dashboard, isLoading: false });