Disabling search textbox initially

polterguy · Dec 14, 2023 · a3104d8 · a3104d8
1 parent b7ee339
commit a3104d8
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 1 deletion.
diff --git a/frontend/src/app/_general/components/searchbox/searchbox.component.ts b/frontend/src/app/_general/components/searchbox/searchbox.component.ts
@@ -31,13 +31,27 @@ export class SearchboxComponent implements OnInit {
   @Input() buttonDisabled: boolean = false;
   @Input() button2Disabled: boolean = false;
   @Input() button3Disabled: boolean = false;
+  @Input() set disableSearchTextBox( condition : boolean ) {
+    this.disabledInitially = condition;
+    if (this.filterControl) {
+      if (condition) {
+        this.filterControl.disable();
+      } else {
+        this.filterControl.enable();
+      }
+    }
+  }
 
   filterControl: FormControl;
   checked: boolean = false;
+  disabledInitially: boolean = false;
 
   ngOnInit() {
 
     this.filterControl = new FormControl('');
+    if (this.disabledInitially) {
+      this.filterControl.disable();
+    }
     this.filterControl.valueChanges
       .pipe(debounceTime(400), distinctUntilChanged())
       .subscribe(() => {

diff --git a/frontend/src/app/_protected/pages/manage/endpoints/endpoints.component.html b/frontend/src/app/_protected/pages/manage/endpoints/endpoints.component.html
@@ -18,6 +18,7 @@ <h3 class="my-0 fw-bold">
           <div class="col-12">
             <app-searchbox
               (filterList)="filterList($event)"
+              [disableSearchTextBox]="isLoading | async"
               checkBoxText="System endpoints">
             </app-searchbox>
           </div>

diff --git a/frontend/src/app/_protected/pages/manage/endpoints/endpoints.component.ts b/frontend/src/app/_protected/pages/manage/endpoints/endpoints.component.ts
@@ -25,7 +25,7 @@ export class EndpointsComponent implements OnInit  {
   defaultListToShow: string = '';
   searchKey: string = '';
   itemToBeTried = new BehaviorSubject<any>({});
-  isLoading: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(true);
+  isLoading: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
 
   constructor(
     private generalService: GeneralService,
@@ -64,6 +64,8 @@ export class EndpointsComponent implements OnInit  {
 
   private getEndpoints() {
 
+    this.isLoading.next(true);
+    this.generalService.showLoading();
     this.endpointsService.endpoints().subscribe({
 
       next: (endpoints: Endpoint[]) => {
@@ -105,11 +107,13 @@ export class EndpointsComponent implements OnInit  {
 
           this.isLoading.next(false);
         }
+        this.generalService.hideLoading();
       },
 
       error: (error: any) => {
 
         this.isLoading.next(false);
+        this.generalService.hideLoading();
         this.generalService.showFeedback(error?.error?.message ?? error, 'errorMessage');
       }
     });