From 9124c1f2847e67b44655e6a7d5a8b21b07c13468 Mon Sep 17 00:00:00 2001
From: Dan Percic <dan@devplant.ro>
Date: Thu, 16 Mar 2023 19:25:03 +0200
Subject: [PATCH] check also form value changes when using autocomplete

---
 src/lib/dialog/base-dialog.component.ts | 30 ++++++++++---------------
 1 file changed, 12 insertions(+), 18 deletions(-)

diff --git a/src/lib/dialog/base-dialog.component.ts b/src/lib/dialog/base-dialog.component.ts
index 46aacc1..c73b6a1 100644
--- a/src/lib/dialog/base-dialog.component.ts
+++ b/src/lib/dialog/base-dialog.component.ts
@@ -4,7 +4,7 @@ import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
 import { hasFormChanged, IqserEventTarget } from '../utils';
 import { ConfirmOptions } from '.';
 import { ConfirmationDialogService } from './confirmation-dialog.service';
-import { debounceTime, firstValueFrom, from, fromEvent, mergeMap, Subscription } from 'rxjs';
+import { debounceTime, firstValueFrom, fromEvent, merge, Subscription } from 'rxjs';
 import { LoadingService } from '../loading';
 import { Toaster } from '../services';
 import { IconButtonTypes } from '../buttons';
@@ -32,23 +32,6 @@ export abstract class BaseDialogComponent implements OnInit, OnDestroy {
 
     protected constructor(protected readonly _dialogRef: MatDialogRef<BaseDialogComponent>, private readonly _isInEditMode?: boolean) {}
 
-    ngOnInit() {
-        this.#subscriptions.add(
-            this._dialogRef.backdropClick().subscribe(() => {
-                this.close();
-            }),
-        );
-        this.#subscriptions.add(
-            from(['keyup', 'input'])
-                .pipe(
-                    mergeMap(event => fromEvent(window, event)),
-                    debounceTime(0),
-                    tap(() => (this.#hasErrors = !!document.getElementsByClassName('ng-invalid')[0])),
-                )
-                .subscribe(),
-        );
-    }
-
     get valid(): boolean {
         return !this.form || this.form.valid;
     }
@@ -61,6 +44,17 @@ export abstract class BaseDialogComponent implements OnInit, OnDestroy {
         return !this.valid || !this.changed || this.#hasErrors;
     }
 
+    ngOnInit() {
+        this.#subscriptions.add(this._dialogRef.backdropClick().subscribe(() => this.close()));
+
+        const events = [fromEvent(window, 'keyup'), fromEvent(window, 'input'), this.form?.valueChanges];
+        const events$ = merge(...events).pipe(
+            debounceTime(10),
+            tap(() => (this.#hasErrors = !!document.getElementsByClassName('ng-invalid')[0])),
+        );
+        this.#subscriptions.add(events$.subscribe());
+    }
+
     abstract save(options?: SaveOptions): void;
 
     ngOnDestroy(): void {