dashfolders: show/hide create folder or dashboard buttons

depending on the user role and the permissions the user has for a folder.

dashfolders: show/hide create folder or dashboard buttons
depending on the user role and the permissions the user has for a folder.
e1aff1d5 · Daniel Lee · a8e9a499 · e1aff1d5 · e1aff1d5 · e1aff1d5
Commit e1aff1d5 authored Jan 09, 2018 by Daniel Lee
5 changed files
--- a/public/app/core/components/manage_dashboards/manage_dashboards.html
+++ b/public/app/core/components/manage_dashboards/manage_dashboards.html
@@ -5,11 +5,11 @@
      <i class="gf-form-input-icon fa fa-search"></i>
    </label>
    <div class="page-action-bar__spacer"></div>
-    <a class="btn btn-success" ng-href="{{ctrl.createDashboardUrl()}}">
+    <a class="btn btn-success" ng-href="{{ctrl.createDashboardUrl()}}" ng-if="ctrl.isEditor || ctrl.canSaveFolder">
      <i class="fa fa-plus"></i>
      Dashboard
    </a>
-    <a class="btn btn-success" href="dashboards/folder/new" ng-if="!ctrl.folderId">
+    <a class="btn btn-success" href="dashboards/folder/new" ng-if="!ctrl.folderId && ctrl.isEditor">
      <i class="fa fa-plus"></i>
      Folder
    </a>
@@ -104,7 +104,7 @@
  </div>
 </div>
-<div ng-if="ctrl.folderId && !ctrl.hasFilters && ctrl.sections.length === 0">
+<div ng-if="ctrl.canSaveFolder && ctrl.folderId && !ctrl.hasFilters && ctrl.sections.length === 0">
  <empty-list-cta model="{
    title: 'This folder doesn\'t have any dashboards yet',
    buttonIcon: 'gicon gicon-dashboard-new',

--- a/public/app/core/components/manage_dashboards/manage_dashboards.ts
+++ b/public/app/core/components/manage_dashboards/manage_dashboards.ts
@@ -3,22 +3,49 @@ import coreModule from 'app/core/core_module';
 import appEvents from 'app/core/app_events';
 import { SearchSrv } from 'app/core/services/search_srv';
+class Query {
+  query: string;
+  mode: string;
+  tag: any[];
+  starred: boolean;
+  skipRecent: boolean;
+  skipStarred: boolean;
+  folderIds: number[];
+}
 export class ManageDashboardsCtrl {
  public sections: any[];
-  tagFilterOptions: any[];
-  selectedTagFilter: any;
+  query: Query;
-  query: any;
  navModel: any;
+  selectAllChecked = false;
+  // enable/disable actions depending on the folders or dashboards selected
  canDelete = false;
  canMove = false;
+  // filter variables
  hasFilters = false;
-  selectAllChecked = false;
+  tagFilterOptions: any[];
+  selectedTagFilter: any;
  starredFilterOptions = [{ text: 'Filter by Starred', disabled: true }, { text: 'Yes' }, { text: 'No' }];
  selectedStarredFilter: any;
+  // used when managing dashboards for a specific folder
  folderId?: number;
+  folderSlug?: string;
+  // if user can add new folders and/or add new dashboards
+  canSave: boolean;
+  // if user has editor role or higher
+  isEditor: boolean;
  /** @ngInject */
-  constructor(private backendSrv, navModelSrv, private searchSrv: SearchSrv) {
+  constructor(private backendSrv, navModelSrv, private searchSrv: SearchSrv, private contextSrv) {
+    this.isEditor = this.contextSrv.isEditor;
    this.query = {
      query: '',
      mode: 'tree',
@@ -26,6 +53,7 @@ export class ManageDashboardsCtrl {
      starred: false,
      skipRecent: true,
      skipStarred: true,
+      folderIds: [],
    };
    if (this.folderId) {
@@ -34,15 +62,26 @@ export class ManageDashboardsCtrl {
    this.selectedStarredFilter = this.starredFilterOptions[0];
-    this.getDashboards().then(() => {
+    this.refreshList().then(() => {
-      this.getTags();
+      this.initTagFilter();
    });
  }
-  getDashboards() {
+  refreshList() {
-    return this.searchSrv.search(this.query).then(result => {
+    return this.searchSrv
-      return this.initDashboardList(result);
+      .search(this.query)
-    });
+      .then(result => {
+        return this.initDashboardList(result);
+      })
+      .then(() => {
+        if (!this.folderSlug) {
+          return;
+        }
+        return this.backendSrv.getDashboard('db', this.folderSlug).then(dash => {
+          this.canSave = dash.meta.canSave;
+        });
+      });
  }
  initDashboardList(result: any) {
@@ -176,7 +215,7 @@ export class ManageDashboardsCtrl {
        appEvents.emit('alert-success', [header, msg]);
      }
-      this.getDashboards();
+      this.refreshList();
    });
  }
@@ -203,12 +242,12 @@ export class ManageDashboardsCtrl {
      modalClass: 'modal--narrow',
      model: {
        dashboards: selectedDashboards,
-        afterSave: this.getDashboards.bind(this),
+        afterSave: this.refreshList.bind(this),
      },
    });
  }
-  getTags() {
+  initTagFilter() {
    return this.searchSrv.getDashboardTags().then(results => {
      this.tagFilterOptions = [{ term: 'Filter By Tag', disabled: true }].concat(results);
      this.selectedTagFilter = this.tagFilterOptions[0];
@@ -220,11 +259,11 @@ export class ManageDashboardsCtrl {
      this.query.tag.push(tag);
    }
-    return this.getDashboards();
+    return this.refreshList();
  }
  onQueryChange() {
-    return this.getDashboards();
+    return this.refreshList();
  }
  onTagFilterChange() {
@@ -235,7 +274,7 @@ export class ManageDashboardsCtrl {
  removeTag(tag, evt) {
    this.query.tag = _.without(this.query.tag, tag);
-    this.getDashboards();
+    this.refreshList();
    if (evt) {
      evt.stopPropagation();
      evt.preventDefault();
@@ -244,13 +283,13 @@ export class ManageDashboardsCtrl {
  removeStarred() {
    this.query.starred = false;
-    return this.getDashboards();
+    return this.refreshList();
  }
  onStarredFilterChange() {
    this.query.starred = this.selectedStarredFilter.text === 'Yes';
    this.selectedStarredFilter = this.starredFilterOptions[0];
-    return this.getDashboards();
+    return this.refreshList();
  }
  onSelectAllChanged() {
@@ -272,7 +311,7 @@ export class ManageDashboardsCtrl {
    this.query.query = '';
    this.query.tag = [];
    this.query.starred = false;
-    this.getDashboards();
+    this.refreshList();
  }
  createDashboardUrl() {
@@ -295,6 +334,7 @@ export function manageDashboardsDirective() {
    controllerAs: 'ctrl',
    scope: {
      folderId: '=',
+      folderSlug: '=',
    },
  };
 }

--- a/public/app/core/specs/manage_dashboards.jest.ts
+++ b/public/app/core/specs/manage_dashboards.jest.ts
@@ -49,7 +49,7 @@ describe('ManageDashboards', () => {
        },
      ];
      ctrl = createCtrlWithStubs(response);
-      return ctrl.getDashboards();
+      return ctrl.refreshList();
    });
    it('should set checked to false on all sections and children', () => {
@@ -88,7 +88,7 @@ describe('ManageDashboards', () => {
      ];
      ctrl = createCtrlWithStubs(response);
      ctrl.folderId = 410;
-      return ctrl.getDashboards();
+      return ctrl.refreshList();
    });
    it('should set hide header to true on section', () => {
@@ -137,7 +137,7 @@ describe('ManageDashboards', () => {
        ctrl.canMove = true;
        ctrl.canDelete = true;
        ctrl.selectAllChecked = true;
-        return ctrl.getDashboards();
+        return ctrl.refreshList();
      });
      it('should set checked to false on all sections and children', () => {
@@ -567,5 +567,5 @@ function createCtrlWithStubs(searchResponse: any, tags?: any) {
    },
  };
-  return new ManageDashboardsCtrl({}, { getNav: () => {} }, <SearchSrv>searchSrvStub);
+  return new ManageDashboardsCtrl({}, { getNav: () => {} }, <SearchSrv>searchSrvStub, { isEditor: true });
 }
--- a/public/app/features/dashboard/folder_dashboards_ctrl.ts
+++ b/public/app/features/dashboard/folder_dashboards_ctrl.ts
@@ -3,6 +3,7 @@ import { FolderPageLoader } from './folder_page_loader';
 export class FolderDashboardsCtrl {
  navModel: any;
  folderId: number;
+  folderSlug: string;
  /** @ngInject */
  constructor(private backendSrv, navModelSrv, private $routeParams) {
@@ -11,7 +12,9 @@ export class FolderDashboardsCtrl {
      const loader = new FolderPageLoader(this.backendSrv, this.$routeParams);
-      loader.load(this, this.folderId, 'manage-folder-dashboards');
+      loader.load(this, this.folderId, 'manage-folder-dashboards').then(result => {
+        this.folderSlug = result.meta.slug;
+      });
    }
  }
 }
--- a/public/app/features/dashboard/partials/folder_dashboards.html
+++ b/public/app/features/dashboard/partials/folder_dashboards.html
 <page-header ng-if="ctrl.navModel" model="ctrl.navModel"></page-header>
 <div class="page-container page-body">
-    <manage-dashboards ng-if="ctrl.folderId" folder-id="ctrl.folderId" />
+    <manage-dashboards ng-if="ctrl.folderId && ctrl.folderSlug" folder-id="ctrl.folderId" folder-slug="ctrl.folderSlug" />
 </div>