From 580345306bd799db7619bbe1502ad674444a6a30 Mon Sep 17 00:00:00 2001
From: Ashley Harrison <ashley.harrison@grafana.com>
Date: Wed, 12 Jul 2023 11:07:16 +0100
Subject: [PATCH] Nested folders: Only show edit title button if user has
 permissions (#71426)

only show edit title button if user has permissions
---
 .../BrowseDashboardsPage.test.tsx             | 24 ++++++++++++++++++
 .../BrowseDashboardsPage.tsx                  | 25 +++++++++----------
 2 files changed, 36 insertions(+), 13 deletions(-)

diff --git a/public/app/features/browse-dashboards/BrowseDashboardsPage.test.tsx b/public/app/features/browse-dashboards/BrowseDashboardsPage.test.tsx
index 4e93e386e83..bd15896c0b1 100644
--- a/public/app/features/browse-dashboards/BrowseDashboardsPage.test.tsx
+++ b/public/app/features/browse-dashboards/BrowseDashboardsPage.test.tsx
@@ -185,6 +185,12 @@ describe('browse-dashboards BrowseDashboardsPage', () => {
       expect(screen.queryByRole('button', { name: 'Folder actions' })).not.toBeInTheDocument();
     });
 
+    it('does not show an "Edit title" button', async () => {
+      render(<BrowseDashboardsPage {...props} />);
+      expect(await screen.findByRole('heading', { name: 'Dashboards' })).toBeInTheDocument();
+      expect(screen.queryByRole('button', { name: 'Edit title' })).not.toBeInTheDocument();
+    });
+
     it('does not show any tabs', async () => {
       render(<BrowseDashboardsPage {...props} />);
       expect(await screen.findByRole('heading', { name: 'Dashboards' })).toBeInTheDocument();
@@ -289,6 +295,24 @@ describe('browse-dashboards BrowseDashboardsPage', () => {
       expect(screen.queryByRole('button', { name: 'Folder actions' })).not.toBeInTheDocument();
     });
 
+    it('shows an "Edit title" button', async () => {
+      render(<BrowseDashboardsPage {...props} />);
+      expect(await screen.findByRole('button', { name: 'Edit title' })).toBeInTheDocument();
+    });
+
+    it('does not show the "Edit title" button if the user does not have permissions', async () => {
+      jest.spyOn(permissions, 'getFolderPermissions').mockImplementation(() => {
+        return {
+          canEditInFolder: false,
+          canCreateDashboards: false,
+          canCreateFolder: false,
+        };
+      });
+      render(<BrowseDashboardsPage {...props} />);
+      expect(await screen.findByRole('heading', { name: folderA.item.title })).toBeInTheDocument();
+      expect(screen.queryByRole('button', { name: 'Edit title' })).not.toBeInTheDocument();
+    });
+
     it('displays all the folder tabs and shows the "Dashboards" tab as selected', async () => {
       render(<BrowseDashboardsPage {...props} />);
       expect(await screen.findByRole('tab', { name: 'Tab Dashboards' })).toBeInTheDocument();
diff --git a/public/app/features/browse-dashboards/BrowseDashboardsPage.tsx b/public/app/features/browse-dashboards/BrowseDashboardsPage.tsx
index 0401dd92c60..909b95153a8 100644
--- a/public/app/features/browse-dashboards/BrowseDashboardsPage.tsx
+++ b/public/app/features/browse-dashboards/BrowseDashboardsPage.tsx
@@ -80,25 +80,24 @@ const BrowseDashboardsPage = memo(({ match }: Props) => {
 
   const { canEditInFolder, canCreateDashboards, canCreateFolder } = getFolderPermissions(folderDTO);
 
-  const onEditTitle = folderUID
-    ? async (newValue: string) => {
-        if (folderDTO) {
-          const result = await saveFolder({
-            ...folderDTO,
-            title: newValue,
-          });
-          if ('error' in result) {
-            throw result.error;
-          }
-        }
+  const showEditTitle = canEditInFolder && folderUID;
+  const onEditTitle = async (newValue: string) => {
+    if (folderDTO) {
+      const result = await saveFolder({
+        ...folderDTO,
+        title: newValue,
+      });
+      if ('error' in result) {
+        throw result.error;
       }
-    : undefined;
+    }
+  };
 
   return (
     <Page
       navId="dashboards/browse"
       pageNav={navModel}
-      onEditTitle={onEditTitle}
+      onEditTitle={showEditTitle ? onEditTitle : undefined}
       actions={
         <>
           {folderDTO && <FolderActionsButton folder={folderDTO} />}