fix(project-validation): updates the regex and error style

src/app/launcher/create-app/project-summary-createapp-step/project-summary-createapp-step.component.html

@@ -247,7 +247,7 @@ <h2 class="card-pf-title">
                            [(ngModel)]="dependencyCheck.projectName" lowercase validateProjectName required
                            (keyup.enter)="$event.target.blur();">
                   </div>
-                  <div *ngIf="projectName.invalid && (projectName.dirty || projectName.touched)">
+                  <div *ngIf="projectName.invalid && (projectName.dirty || projectName.touched)" class="col-xs-8 col-xs-offset-4 has-error">
                     <span *ngIf="projectName.errors.pattern" class="help-block f8launcher-vertical-bar_application-name-help-text">
                       Please enter a valid Application Name.
                     </span>

src/app/launcher/shared/project-name.validator.spec.ts

@@ -0,0 +1,70 @@
+import { ProjectNameValidatorDirective } from './project-name.validator';
+
+describe('should check pattern to valdidate Project name', () => {
+
+  it('validate Project Name to be falsy if start with special character', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('#app-may-11-2018-1');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('validate Project Name to be falsy if ends with special character', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('app-may-11-2018-1@');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('validate Project Name to be falsy if has any special character apart from - and _', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('app-may-11-2018@1');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('validate Project Name to be falsy if ends with  _', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('app-may-11-2018-1_');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('validate Project Name to be falsy if ends with  -', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('app-may-11-2018-1-');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('validate Project Name to be truthy', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('app-may-11-2018-1');
+    expect(valProjectName).toBeTruthy();
+  });
+
+  it('validate Project Name to be falsy as length is not satisfied', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('ap');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('validate Project Name to be falsy as length is not satisfied', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('12345678901234567890123456789012345678901');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('validate Project Name to be truthy as length is satisfied', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('a123456789012345678901234567890123456789');
+    expect(valProjectName).toBeTruthy();
+  });
+
+  it('should return false if the project name has continous hyphens (-)', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('app_name--name');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('should return false if the project name has continous underscores (_)', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('app_name__name');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('should not allow project name with spaces', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('app_name name');
+    expect(valProjectName).toBeFalsy();
+  });
+
+  it('should not allow project name starting with a number', () => {
+    let valProjectName = ProjectNameValidatorDirective.pattern.test('1app_namename');
+    expect(valProjectName).toBeFalsy();
+  });
+
+});

src/app/launcher/shared/project-name.validator.ts

@@ -10,7 +10,9 @@ import { DependencyCheckService } from '../service/dependency-check.service';
     forwardRef(() => ProjectNameValidatorDirective), multi: true }]
 })
 export class ProjectNameValidatorDirective implements Validator {
-  private pattern = /^[a-z][a-z0-9-]{3,63}$/;
+  // allows only '-', '_' and 4-40 characters (must start with alphabetic and end with alphanumeric)
+  // no continuous '-' or '_' is allowed
+  public static readonly pattern = new RegExp('^[a-zA-Z](?!.*--)(?!.*__)[a-zA-Z0-9-_]{2,38}[a-zA-Z0-9]$');
 
   constructor(private dependencyCheckService: DependencyCheckService) { }
 
@@ -20,7 +22,7 @@ export class ProjectNameValidatorDirective implements Validator {
 
   validRepositoryName(value: any): Observable<{ [key: string]: any }> {
     return new Observable((resolve) => {
-      const valid = this.pattern.test(value);
+      const valid = ProjectNameValidatorDirective.pattern.test(value);
       if (!valid) {
         resolve.next(this.createError('pattern', value));
       } else {