Merge branch 'master' into tooling/storybook-poc

public/app/features/folders/CreateFolderCtrl.ts

@@ -0,0 +1,41 @@
+import appEvents from 'app/core/app_events';
+import locationUtil from 'app/core/utils/location_util';
+
+export default class CreateFolderCtrl {
+  title = '';
+  navModel: any;
+  titleTouched = false;
+  hasValidationError: boolean;
+  validationError: any;
+
+  /** @ngInject */
+  constructor(private backendSrv, private $location, private validationSrv, navModelSrv) {
+    this.navModel = navModelSrv.getNav('dashboards', 'manage-dashboards', 0);
+  }
+
+  create() {
+    if (this.hasValidationError) {
+      return;
+    }
+
+    return this.backendSrv.createFolder({ title: this.title }).then(result => {
+      appEvents.emit('alert-success', ['Folder Created', 'OK']);
+      this.$location.url(locationUtil.stripBaseFromUrl(result.url));
+    });
+  }
+
+  titleChanged() {
+    this.titleTouched = true;
+
+    this.validationSrv
+      .validateNewFolderName(this.title)
+      .then(() => {
+        this.hasValidationError = false;
+      })
+      .catch(err => {
+        this.hasValidationError = true;
+        this.validationError = err.message;
+      });
+  }
+}
+

public/app/features/folders/FolderDashboardsCtrl.ts

@@ -0,0 +1,26 @@
+import { FolderPageLoader } from './services/FolderPageLoader';
+import locationUtil from 'app/core/utils/location_util';
+
+export default class FolderDashboardsCtrl {
+  navModel: any;
+  folderId: number;
+  uid: string;
+
+  /** @ngInject */
+  constructor(private backendSrv, navModelSrv, private $routeParams, $location) {
+    if (this.$routeParams.uid) {
+      this.uid = $routeParams.uid;
+
+      const loader = new FolderPageLoader(this.backendSrv);
+
+      loader.load(this, this.uid, 'manage-folder-dashboards').then(folder => {
+        const url = locationUtil.stripBaseFromUrl(folder.url);
+
+        if (url !== $location.path()) {
+          $location.path(url).replace();
+        }
+      });
+    }
+  }
+}
+

public/app/features/folders/partials/create_folder.html

@@ -0,0 +1,34 @@
+<page-header model="ctrl.navModel"></page-header>
+
+<div class="page-container page-body" ng-cloak>
+
+	<h3 class="page-sub-heading">New Dashboard Folder</h3>
+
+  <form name="ctrl.saveForm" ng-submit="ctrl.create()" novalidate>
+		<div class="gf-form-inline">
+			<div class="gf-form gf-form--grow">
+				<label class="gf-form-label width-10">Name</label>
+				<input type="text" class="gf-form-input" ng-model="ctrl.title" give-focus="true" ng-change="ctrl.titleChanged()" ng-model-options="{ debounce: 400 }" ng-class="{'validation-error': ctrl.nameExists || !ctrl.dash.title}">
+				<label class="gf-form-label text-success" ng-if="ctrl.titleTouched && !ctrl.hasValidationError">
+					<i class="fa fa-check"></i>
+				</label>
+			</div>
+		</div>
+
+		<div class="gf-form-inline" ng-if="ctrl.hasValidationError">
+			<div class="gf-form offset-width-10 gf-form--grow">
+				<label class="gf-form-label text-warning gf-form-label--grow">
+					<i class="fa fa-warning"></i>
+					{{ctrl.validationError}}
+				</label>
+			</div>
+		</div>
+
+		<div class="gf-form-button-row">
+			<button type="submit" class="btn btn-success width-12" ng-disabled="!ctrl.titleTouched || ctrl.hasValidationError">
+				<i class="fa fa-save"></i> Create
+			</button>
+		</div>
+	</form>
+
+</div>

public/app/features/folders/partials/folder_dashboards.html

@@ -0,0 +1,5 @@
+<page-header ng-if="ctrl.navModel" model="ctrl.navModel"></page-header>
+
+<div class="page-container page-body">
+    <manage-dashboards ng-if="ctrl.folderId && ctrl.uid" folder-id="ctrl.folderId" folder-uid="ctrl.uid" />
+</div>

public/app/features/folders/services/FolderPageLoader.ts

@@ -0,0 +1,61 @@
+export class FolderPageLoader {
+  constructor(private backendSrv) {}
+
+  load(ctrl, uid, activeChildId) {
+    ctrl.navModel = {
+      main: {
+        icon: 'fa fa-folder-open',
+        id: 'manage-folder',
+        subTitle: 'Manage folder dashboards & permissions',
+        url: '',
+        text: '',
+        breadcrumbs: [{ title: 'Dashboards', url: 'dashboards' }],
+        children: [
+          {
+            active: activeChildId === 'manage-folder-dashboards',
+            icon: 'fa fa-fw fa-th-large',
+            id: 'manage-folder-dashboards',
+            text: 'Dashboards',
+            url: 'dashboards',
+          },
+          {
+            active: activeChildId === 'manage-folder-permissions',
+            icon: 'fa fa-fw fa-lock',
+            id: 'manage-folder-permissions',
+            text: 'Permissions',
+            url: 'dashboards/permissions',
+          },
+          {
+            active: activeChildId === 'manage-folder-settings',
+            icon: 'fa fa-fw fa-cog',
+            id: 'manage-folder-settings',
+            text: 'Settings',
+            url: 'dashboards/settings',
+          },
+        ],
+      },
+    };
+
+    return this.backendSrv.getFolderByUid(uid).then(folder => {
+      ctrl.folderId = folder.id;
+      const folderTitle = folder.title;
+      const folderUrl = folder.url;
+      ctrl.navModel.main.text = folderTitle;
+
+      const dashTab = ctrl.navModel.main.children.find(child => child.id === 'manage-folder-dashboards');
+      dashTab.url = folderUrl;
+
+      if (folder.canAdmin) {
+        const permTab = ctrl.navModel.main.children.find(child => child.id === 'manage-folder-permissions');
+        permTab.url = folderUrl + '/permissions';
+
+        const settingsTab = ctrl.navModel.main.children.find(child => child.id === 'manage-folder-settings');
+        settingsTab.url = folderUrl + '/settings';
+      } else {
+        ctrl.navModel.main.children = [dashTab];
+      }
+
+      return folder;
+    });
+  }
+}