Merge pull request #1151 from eclipse/CHE-1087

CHE-1087: [dashboard] improve workspace name exists error message

dashboard/src/app/projects/create-project/create-project.controller.js

@@ -154,6 +154,8 @@ export class CreateProjectCtrl {
     this.projectName = null;
     this.projectDescription = null;
     this.defaultWorkspaceName = null;
+
+    cheAPI.cheWorkspace.getWorkspaces();
   }
 
   /**

dashboard/src/app/projects/create-project/create-project.html

@@ -169,6 +169,7 @@
                      che-place-holder="Name of the workspace"
                      ng-model="createProjectCtrl.workspaceName"
                      required
+                     unique-workspace-name="createProjectCtrl.workspaceName"
                      ng-minlength="3"
                      ng-maxlength="20"
                      ng-pattern="/^[A-Za-z0-9_\-\.]+$/">
@@ -178,6 +179,7 @@
             </div>
             <div ng-message="minlength">The name has to be more then 3 characters long.</div>
             <div ng-message="maxlength">The name has to be less than 20 characters long.</div>
+            <div ng-message="uniqueWorkspaceName">This workspace name is already used.</div>
           </che-input>
         </che-label-container>
         <che-workspace-ram-allocation-slider ng-model="createProjectCtrl.workspaceRam"></che-workspace-ram-allocation-slider>

dashboard/src/app/workspaces/create-workspace/create-workspace.controller.js

@@ -54,6 +54,8 @@ export class CreateWorkspaceCtrl {
     this.recipeScript = null;
     this.importWorkspace = '';
     this.defaultWorkspaceName = null;
+
+    cheAPI.cheWorkspace.fetchWorkspaces();
   }
 
   /**

dashboard/src/app/workspaces/create-workspace/create-workspace.html

@@ -44,6 +44,7 @@
                  che-place-holder="Name of the workspace"
                  ng-model="createWorkspaceCtrl.workspaceName"
                  required
+                 unique-workspace-name="createWorkspaceCtrl.workspaceName"
                  ng-minlength="3"
                  ng-maxlength="20"
                  ng-pattern="/^[A-Za-z0-9_\-\.]+$/">
@@ -53,6 +54,7 @@
         </div>
         <div ng-message="minlength">The name has to be more then 3 characters long.</div>
         <div ng-message="maxlength">The name has to be less than 20 characters long.</div>
+        <div ng-message="uniqueWorkspaceName">This workspace name is already used.</div>
       </che-input>
       <che-workspace-ram-allocation-slider ng-model="createWorkspaceCtrl.workspaceRam"></che-workspace-ram-allocation-slider>
     </che-panel>

dashboard/src/components/validator/unique-workspace-name-validator.directive.js

@@ -0,0 +1,64 @@
+/*
+ * Copyright (c) 2015-2016 Codenvy, S.A.
+ * All rights reserved. This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v1.0
+ * which accompanies this distribution, and is available at
+ * http://www.eclipse.org/legal/epl-v10.html
+ *
+ * Contributors:
+ *   Codenvy, S.A. - initial API and implementation
+ */
+'use strict';
+
+/**
+ * Defines a directive for checking if the workspace name is not already taken
+ * @author Oleksii Kurinnyi
+ */
+export class UniqueWorkspaceNameValidator {
+
+  /**
+   * Default constructor that is using resource
+   * @ngInject for Dependency injection
+   */
+  constructor (cheAPI, $q) {
+    this.cheAPI = cheAPI;
+    this.$q = $q;
+    this.restrict='A';
+    this.require = 'ngModel';
+  }
+
+  /**
+   * Check that the name of workspace is unique
+   */
+  link($scope, element, attributes, ngModel) {
+
+    // validate only input element
+    if ('input' === element[0].localName) {
+
+      ngModel.$asyncValidators.uniqueWorkspaceName = (modelValue) => {
+
+        // create promise
+        var deferred = this.$q.defer();
+
+        let workspaces = this.cheAPI.getWorkspace().getWorkspaces();
+        if (workspaces.length) {
+
+          for (let i=0; i<workspaces.length; i++) {
+            if (workspaces[i].config.name === modelValue) {
+              deferred.reject(false);
+            }
+          }
+          deferred.resolve(true);
+        } else {
+          // no workspaces so it's ok
+          deferred.resolve(true);
+        }
+
+        // return promise
+        return deferred.promise;
+      };
+    }
+  }
+
+
+}

dashboard/src/components/validator/unique-workspace-name-validator.spec.js

@@ -0,0 +1,127 @@
+/*
+ * Copyright (c) 2015-2016 Codenvy, S.A.
+ * All rights reserved. This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v1.0
+ * which accompanies this distribution, and is available at
+ * http://www.eclipse.org/legal/epl-v10.html
+ *
+ * Contributors:
+ *   Codenvy, S.A. - initial API and implementation
+ */
+'use strict';
+
+/**
+ * Test the workspace name uniqueness
+ * @author Oleksii Kurinnyi
+ */
+
+describe('unique-workspace-name-validator', function() {
+  var $scope, form, $compiler;
+
+  /**
+   * Workspace API
+   */
+  var factoryWorkspace;
+
+  /**
+   * API builder.
+   */
+  var apiBuilder;
+
+  /**
+   * Backend for handling http operations
+   */
+  var httpBackend;
+
+  /**
+   * Che backend
+   */
+  var cheBackend;
+
+
+  beforeEach(angular.mock.module('userDashboard'));
+
+
+  beforeEach(inject(function($compile, $rootScope, cheWorkspace, cheAPIBuilder, cheHttpBackend, $document) {
+    $scope = $rootScope;
+    $compiler = $compile;
+    factoryWorkspace = cheWorkspace;
+    apiBuilder = cheAPIBuilder;
+    cheBackend = cheHttpBackend;
+    httpBackend = cheHttpBackend.getHttpBackend();
+    this.$document = $document;
+
+  }));
+
+  describe('Validate Workspace Name', function() {
+
+    it('workspaceAlready exists', function() {
+
+      // setup tests objects
+      var idWorkspace1 = 'idOfMyWorkspace1';
+      var nameWorkspace1 = 'testWorkspace1';
+      var workspace1 = apiBuilder.getWorkspaceBuilder().withName(nameWorkspace1).withId(idWorkspace1).build();
+
+      factoryWorkspace.fetchWorkspaces();
+
+      // add into backend
+      cheBackend.addWorkspaces([workspace1]);
+      cheBackend.setup();
+
+      // flush HTTP backend
+      httpBackend.flush();
+
+      $scope.model = { workspaceName: null};
+
+      var element = angular.element(
+        '<form name="form">' +
+        '<input ng-model="model.workspaceName" name="name" unique-workspace-name="model.workspaceName" />' +
+        '</form>'
+      );
+      $compiler(element)($scope);
+      form = $scope.form;
+
+      form.name.$setViewValue(nameWorkspace1);
+
+      // check form (expect invalid)
+      expect(form.name.$invalid).toBe(true);
+      expect(form.name.$valid).toBe(false);
+    });
+
+    it('workspace not yet defined', function() {
+
+      // setup tests objects
+      var idWorkspace1 = 'idOfMyWorkspace1';
+      var nameWorkspace1 = 'testWorkspace1';
+      var workspace1 = apiBuilder.getWorkspaceBuilder().withName(nameWorkspace1).withId(idWorkspace1).build();
+
+      factoryWorkspace.fetchWorkspaces();
+
+      // add into backend
+      cheBackend.addWorkspaces([workspace1]);
+
+      // setup backend
+      cheBackend.setup();
+
+      // flush HTTP backend
+      httpBackend.flush();
+
+      $scope.model = { workspaceName: null };
+
+      var element = angular.element(
+        '<form name="form">' +
+        '<input ng-model="model.workspaceName" name="name" unique-workspace-name="model.workspaceName" />' +
+        '</form>'
+      );
+      $compiler(element)($scope);
+      form = $scope.form;
+
+      form.name.$setViewValue('dummyWorkspace');
+
+      // check form valid
+      expect(form.name.$invalid).toBe(false);
+      expect(form.name.$valid).toBe(true);
+
+    });
+  });
+});

dashboard/src/components/validator/validator-config.js

@@ -12,14 +12,16 @@
 
 import {GitUrlValidator} from './git-url-validator.directive';
 import {UniqueProjectNameValidator} from './unique-project-name-validator.directive';
+import {UniqueWorkspaceNameValidator} from './unique-workspace-name-validator.directive';
 
 
 export class ValidatorConfig {
 
   constructor(register) {
 
     register.directive('gitUrl', GitUrlValidator)
-      .directive('uniqueProjectName', UniqueProjectNameValidator);
+      .directive('uniqueProjectName', UniqueProjectNameValidator)
+      .directive('uniqueWorkspaceName', UniqueWorkspaceNameValidator);
 
   }
 }