[ADF-3864] Create library - no error is displayed when name contains white spaces only (#4101)

* only spaces error message

* title custom error support

* tests

* validate title against only spaces

* generate id only when title is valid

lib/content-services/dialogs/library/library.dialog.html

@@ -18,6 +18,10 @@
       <mat-error *ngIf="form.controls['title'].hasError('maxlength')">
         {{ 'LIBRARY.ERRORS.TITLE_TOO_LONG' | translate }}
       </mat-error>
+
+      <mat-error *ngIf="form.controls['title'].errors?.message">
+        {{ form.controls['title'].errors?.message | translate }}
+      </mat-error>
     </mat-form-field>
 
     <mat-form-field>

lib/content-services/dialogs/library/library.dialog.spec.ts

@@ -214,4 +214,46 @@ describe('LibraryDialogComponent', () => {
       message: 'LIBRARY.ERRORS.CONFLICT'
     });
   }));
+
+  it('should not translate library title if value is not a valid id', fakeAsync(() => {
+    spyOn(alfrescoApi.sitesApi, 'getSite').and.callFake(() => {
+      return new Promise((resolve, reject) => reject());
+    });
+
+    fixture.detectChanges();
+    component.form.controls.title.setValue('@@@####');
+    tick(500);
+    flush();
+    fixture.detectChanges();
+
+    expect(component.form.controls.id.value).toBe(null);
+  }));
+
+  it('should translate library title partially for library id', fakeAsync(() => {
+    spyOn(alfrescoApi.sitesApi, 'getSite').and.callFake(() => {
+      return new Promise((resolve, reject) => reject());
+    });
+
+    fixture.detectChanges();
+    component.form.controls.title.setValue('@@@####library');
+    tick(500);
+    flush();
+    fixture.detectChanges();
+
+    expect(component.form.controls.id.value).toBe('library');
+  }));
+
+  it('should translate library title multiple space character to one dash for library id', fakeAsync(() => {
+    spyOn(alfrescoApi.sitesApi, 'getSite').and.callFake(() => {
+      return new Promise((resolve, reject) => reject());
+    });
+
+    fixture.detectChanges();
+    component.form.controls.title.setValue('library     title');
+    tick(500);
+    flush();
+    fixture.detectChanges();
+
+    expect(component.form.controls.id.value).toBe('library-title');
+  }));
 });

lib/content-services/dialogs/library/library.dialog.ts

@@ -84,13 +84,17 @@ export class LibraryDialogComponent implements OnInit, OnDestroy {
         Validators.maxLength(72),
         this.forbidSpecialCharacters
       ],
-      title: [Validators.required, Validators.maxLength(256)],
+      title: [
+        Validators.required,
+        this.forbidOnlySpaces,
+        Validators.maxLength(256)
+      ],
       description: [Validators.maxLength(512)]
     };
 
     this.form = this.formBuilder.group({
-      title: ['', validators.title],
+      title: [null, validators.title],
-      id: ['', validators.id, this.createSiteIdValidator()],
+      id: [null, validators.id, this.createSiteIdValidator()],
       description: ['', validators.description]
     });
 
@@ -106,11 +110,7 @@ export class LibraryDialogComponent implements OnInit, OnDestroy {
         takeUntil(this.onDestroy$)
       )
       .subscribe((title: string) => {
-        if (!title.trim().length) {
+        if (!this.form.controls['id'].dirty && this.canGenerateId(title)) {
-          return;
-        }
-
-        if (!this.form.controls['id'].dirty) {
           this.form.patchValue({ id: this.sanitize(title.trim()) });
           this.form.controls['id'].markAsTouched();
         }
@@ -177,7 +177,11 @@ export class LibraryDialogComponent implements OnInit, OnDestroy {
   }
 
   private sanitize(input: string) {
-    return input.replace(/[\s]/g, '-').replace(/[^A-Za-z0-9-]/g, '');
+    return input.replace(/[\s\s]+/g, '-').replace(/[^A-Za-z0-9-]/g, '');
+  }
+
+  private canGenerateId(title) {
+    return Boolean(title.replace(/[^A-Za-z0-9-]/g, '').length);
   }
 
   private handleError(error: any): any {
@@ -215,6 +219,10 @@ export class LibraryDialogComponent implements OnInit, OnDestroy {
   }
 
   private forbidSpecialCharacters({ value }: FormControl) {
+    if (value === null || value.length === 0) {
+      return null;
+    }
+
     const validCharacters: RegExp = /[^A-Za-z0-9-]/;
     const isValid: boolean = !validCharacters.test(value);
 
@@ -225,6 +233,20 @@ export class LibraryDialogComponent implements OnInit, OnDestroy {
         };
   }
 
+  private forbidOnlySpaces({ value }: FormControl) {
+    if (value === null || value.length === 0) {
+      return null;
+    }
+
+    const isValid: boolean = !!(value || '').trim();
+
+    return isValid
+      ? null
+      : {
+          message: 'LIBRARY.ERRORS.ONLY_SPACES'
+        };
+  }
+
   private createSiteIdValidator() {
     let timer;
 

lib/content-services/i18n/en.json

@@ -323,6 +323,7 @@
       "DESCRIPTION_TOO_LONG": "Use 512 characters or less for description",
       "TITLE_TOO_LONG": "Use 256 characters or less for title",
       "ILLEGAL_CHARACTERS": "Use numbers and letters only",
+      "ONLY_SPACES": "Library name can't contain only spaces",
       "LIBRARY_UPDATE_ERROR": "There was an error updating library properties"
     },
     "SUCCESS": {