From: Nizamudeen A <nia@localhost.localdomain>
Date: Wed, 22 Apr 2020 11:23:41 +0000 (+0530)
Subject: mgr/dashboard: Asynchronous unique username validation for User Component
X-Git-Tag: v15.2.4~11^2
X-Git-Url: http://git-server-git.apps.pok.os.sepia.ceph.com/?a=commitdiff_plain;h=6b6a2e934e2476e1ea5891f3f50a396851569784;p=ceph.git

mgr/dashboard: Asynchronous unique username validation for User Component

Implements an asynchronous validation for the username field in the Create User form which immediately display an error message if the username already exists.

Fixes: https://tracker.ceph.com/issues/36375
Signed-off-by: Nizamudeen <nia@redhat.com>
(cherry picked from commit c4dfe20c08ecb9e50b7cb7bef6eb603e04d56387)
---

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-form/user-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-form/user-form.component.html
index cee443800104..78b12deebe73 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-form/user-form.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-form/user-form.component.html
@@ -29,6 +29,9 @@
             <span class="invalid-feedback"
                   *ngIf="userForm.showError('username', formDir, 'required')"
                   i18n>This field is required.</span>
+            <span class="invalid-feedback"
+                  *ngIf="userForm.showError('username', formDir, 'notUnique')"
+                  i18n>The username already exists.</span>
           </div>
         </div>
 
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-form/user-form.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-form/user-form.component.ts
index 75e14e330361..952508ca0d01 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-form/user-form.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-form/user-form.component.ts
@@ -84,7 +84,11 @@ export class UserFormComponent implements OnInit {
     });
     this.userForm = this.formBuilder.group(
       {
-        username: ['', [Validators.required]],
+        username: [
+          '',
+          [Validators.required],
+          [CdValidators.unique(this.userService.validateUserName, this.userService)]
+        ],
         name: [''],
         password: [
           '',
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/api/user.service.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/api/user.service.ts
index 05c53de0cca2..c0b7acdb6de5 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/api/user.service.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/api/user.service.ts
@@ -1,5 +1,7 @@
 import { HttpClient, HttpParams } from '@angular/common/http';
 import { Injectable } from '@angular/core';
+import { Observable, of as observableOf } from 'rxjs';
+import { catchError, mapTo } from 'rxjs/operators';
 
 import { UserFormModel } from '../../core/auth/user-form/user-form.model';
 import { ApiModule } from './api.module';
@@ -40,6 +42,16 @@ export class UserService {
     });
   }
 
+  validateUserName(user_name: string): Observable<boolean> {
+    return this.get(user_name).pipe(
+      mapTo(true),
+      catchError((error) => {
+        error.preventDefault();
+        return observableOf(false);
+      })
+    );
+  }
+
   validatePassword(password: string, username: string = null, oldPassword: string = null) {
     let params = new HttpParams();
     params = params.append('password', password);