Update the name checking for the robot account (#19645)

1. Fixes #19612

Signed-off-by: AllForNothing <shijun.sun@broadcom.com>

src/portal/src/app/base/left-side-nav/system-robot-accounts/new-robot/new-robot.component.html

@@ -269,7 +269,7 @@
         <ng-template clrPageTitle>{{
             'ROBOT_ACCOUNT.SELECT_PROJECT_PERMISSIONS' | translate
         }}</ng-template>
-        <inline-alert class="modal-title"></inline-alert>
+        <inline-alert></inline-alert>
         <form class="clr-form clr-form-horizontal pb-0 pt-0">
             <section class="form-block">
                 <div class="clr-form-control mt-1">

src/portal/src/app/base/left-side-nav/system-robot-accounts/new-robot/new-robot.component.ts

@@ -16,6 +16,7 @@ import {
     distinctUntilChanged,
     filter,
     finalize,
+    map,
     switchMap,
 } from 'rxjs/operators';
 import {
@@ -119,7 +120,6 @@ export class NewRobotComponent implements OnInit, OnDestroy {
         if (!this._nameSubscription) {
             this._nameSubscription = this._nameSubject
                 .pipe(
-                    debounceTime(500),
                     distinctUntilChanged(),
                     filter(name => {
                         if (
@@ -131,6 +131,11 @@ export class NewRobotComponent implements OnInit, OnDestroy {
                         }
                         return name?.length > 0;
                     }),
+                    map(name => {
+                        this.checkNameOnGoing = !!name;
+                        return name;
+                    }),
+                    debounceTime(500),
                     switchMap(name => {
                         this.isNameExisting = false;
                         this.checkNameOnGoing = true;
@@ -490,6 +495,7 @@ export class NewRobotComponent implements OnInit, OnDestroy {
     }
 
     clrWizardPageOnLoad() {
+        this.inlineAlertComponent.close();
         this.showPage3 = true;
     }
 

src/portal/src/app/base/project/robot-account/add-robot/add-robot.component.html

@@ -235,13 +235,14 @@
     </clr-wizard-page>
 
     <clr-wizard-page
+        (clrWizardPageOnLoad)="clrWizardPageOnLoad()"
         (clrWizardPageOnCommit)="save()"
         [clrWizardPagePreventDefaultNext]="true"
         [clrWizardPageNextDisabled]="disabled()">
         <ng-template clrPageTitle>{{
             'ROBOT_ACCOUNT.SELECT_PERMISSIONS' | translate
         }}</ng-template>
-        <inline-alert class="modal-title"></inline-alert>
+        <inline-alert></inline-alert>
         <form class="clr-form clr-form-horizontal mt-1">
             <section class="form-block">
                 <robot-permissions-panel

src/portal/src/app/base/project/robot-account/add-robot/add-robot.component.ts

@@ -12,6 +12,7 @@ import {
     distinctUntilChanged,
     filter,
     finalize,
+    map,
     switchMap,
 } from 'rxjs/operators';
 import { MessageHandlerService } from '../../../../shared/services/message-handler.service';
@@ -87,7 +88,6 @@ export class AddRobotComponent implements OnInit, OnDestroy {
         if (!this._nameSubscription) {
             this._nameSubscription = this._nameSubject
                 .pipe(
-                    debounceTime(500),
                     distinctUntilChanged(),
                     filter(name => {
                         if (
@@ -99,6 +99,11 @@ export class AddRobotComponent implements OnInit, OnDestroy {
                         }
                         return name?.length > 0;
                     }),
+                    map(name => {
+                        this.checkNameOnGoing = !!name;
+                        return name;
+                    }),
+                    debounceTime(500),
                     switchMap(name => {
                         this.isNameExisting = false;
                         this.checkNameOnGoing = true;
@@ -295,5 +300,9 @@ export class AddRobotComponent implements OnInit, OnDestroy {
         return new Date() >= this.calculateExpiresAt();
     }
 
+    clrWizardPageOnLoad() {
+        this.inlineAlertComponent.close();
+    }
+
     protected readonly PermissionSelectPanelModes = PermissionSelectPanelModes;
 }