Scenes: Migrate permissions settings page (#81781)

* Migrate permissions settings page

* fix

public/app/features/dashboard-scene/settings/PermissionsEditView.test.tsx

@@ -0,0 +1,62 @@
+import { SceneGridItem, SceneGridLayout, SceneTimeRange } from '@grafana/scenes';
+
+import { DashboardScene } from '../scene/DashboardScene';
+import { activateFullSceneTree } from '../utils/test-utils';
+
+import { PermissionsEditView } from './PermissionsEditView';
+
+describe('PermissionsEditView', () => {
+  describe('Dashboard permissions state', () => {
+    let dashboard: DashboardScene;
+    let permissionsView: PermissionsEditView;
+
+    beforeEach(async () => {
+      const result = await buildTestScene();
+      dashboard = result.dashboard;
+      permissionsView = result.permissionsView;
+    });
+
+    it('should return the correct urlKey', () => {
+      expect(permissionsView.getUrlKey()).toBe('permissions');
+    });
+
+    it('should return the dashboard', () => {
+      expect(permissionsView.getDashboard()).toBe(dashboard);
+    });
+  });
+});
+
+async function buildTestScene() {
+  const permissionsView = new PermissionsEditView({});
+  const dashboard = new DashboardScene({
+    $timeRange: new SceneTimeRange({}),
+    title: 'hello',
+    uid: 'dash-1',
+    version: 4,
+    meta: {
+      canEdit: true,
+    },
+    body: new SceneGridLayout({
+      children: [
+        new SceneGridItem({
+          key: 'griditem-1',
+          x: 0,
+          y: 0,
+          width: 10,
+          height: 12,
+          body: undefined,
+        }),
+      ],
+    }),
+    editview: permissionsView,
+  });
+
+  activateFullSceneTree(dashboard);
+
+  await new Promise((r) => setTimeout(r, 1));
+
+  dashboard.onEnterEditMode();
+  permissionsView.activate();
+
+  return { dashboard, permissionsView };
+}

public/app/features/dashboard-scene/settings/PermissionsEditView.tsx

@@ -0,0 +1,46 @@
+import React from 'react';
+
+import { PageLayoutType } from '@grafana/data';
+import { SceneComponentProps, SceneObjectBase } from '@grafana/scenes';
+import { Permissions } from 'app/core/components/AccessControl';
+import { Page } from 'app/core/components/Page/Page';
+import { contextSrv } from 'app/core/core';
+import { AccessControlAction } from 'app/types';
+
+import { DashboardScene } from '../scene/DashboardScene';
+import { NavToolbarActions } from '../scene/NavToolbarActions';
+import { getDashboardSceneFor } from '../utils/utils';
+
+import { DashboardEditView, DashboardEditViewState, useDashboardEditPageNav } from './utils';
+
+interface PermissionsEditViewState extends DashboardEditViewState {}
+
+export class PermissionsEditView extends SceneObjectBase<PermissionsEditViewState> implements DashboardEditView {
+  public static Component = PermissionsEditorSettings;
+
+  private get _dashboard(): DashboardScene {
+    return getDashboardSceneFor(this);
+  }
+
+  public getUrlKey(): string {
+    return 'permissions';
+  }
+
+  public getDashboard(): DashboardScene {
+    return this._dashboard;
+  }
+}
+
+function PermissionsEditorSettings({ model }: SceneComponentProps<PermissionsEditView>) {
+  const dashboard = model.getDashboard();
+  const { uid } = dashboard.useState();
+  const { navModel, pageNav } = useDashboardEditPageNav(dashboard, model.getUrlKey());
+  const canSetPermissions = contextSrv.hasPermission(AccessControlAction.DashboardsPermissionsWrite);
+
+  return (
+    <Page navModel={navModel} pageNav={pageNav} layout={PageLayoutType.Standard}>
+      <NavToolbarActions dashboard={dashboard} />
+      <Permissions resource={'dashboards'} resourceId={uid ?? ''} canSetPermissions={canSetPermissions} />
+    </Page>
+  );
+}

public/app/features/dashboard-scene/settings/utils.ts

@@ -12,6 +12,7 @@ import { AnnotationsEditView } from './AnnotationsEditView';
 import { DashboardLinksEditView } from './DashboardLinksEditView';
 import { GeneralSettingsEditView } from './GeneralSettingsEditView';
 import { JsonModelEditView } from './JsonModelEditView';
+import { PermissionsEditView } from './PermissionsEditView';
 import { VariablesEditView } from './VariablesEditView';
 import { VersionsEditView } from './VersionsEditView';
 
@@ -61,6 +62,11 @@ export function useDashboardEditPageNav(dashboard: DashboardScene, currentEditVi
         url: locationUtil.getUrlForPartial(location, { editview: 'versions', editIndex: null }),
         active: currentEditView === 'versions',
       },
+      {
+        text: t('dashboard-settings.permissions.title', 'Permissions'),
+        url: locationUtil.getUrlForPartial(location, { editview: 'permissions', editIndex: null }),
+        active: currentEditView === 'permissions',
+      },
       {
         text: t('dashboard-settings.json-editor.title', 'JSON Model'),
         url: locationUtil.getUrlForPartial(location, { editview: 'json-model', editIndex: null }),
@@ -85,6 +91,8 @@ export function createDashboardEditViewFor(editview: string): DashboardEditView
       return new VersionsEditView({});
     case 'json-model':
       return new JsonModelEditView({});
+    case 'permissions':
+      return new PermissionsEditView({});
     case 'settings':
     default:
       return new GeneralSettingsEditView({});