@recursyve/nice-ui-kit.v2 14.0.0-beta.125 → 14.0.0-beta.126

package/fesm2020/recursyve-nice-ui-kit.v2.mjs

@@ -4,8 +4,8 @@ import { HttpContextToken, HttpResponse, HttpContext, HttpParams } from '@angula
 import * as i0 from '@angular/core';
 import { Injectable, NgModule, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Output, HostBinding, InjectionToken, Directive, HostListener, forwardRef, TemplateRef, Optional, Inject, ViewChild, ContentChild, ViewChildren, Self, Pipe, ElementRef, PLATFORM_ID, ContentChildren, SimpleChange, SkipSelf } from '@angular/core';
 import { plainToInstance } from 'class-transformer';
-import { map, filter, takeUntil, tap, take, finalize, debounceTime as debounceTime$1, delay, switchMap } from 'rxjs/operators';
-import { catchError, ReplaySubject, Subject, BehaviorSubject, mergeMap, from, isObservable, firstValueFrom, debounceTime, distinctUntilChanged, startWith, pairwise, tap as tap$1, Observable, combineLatest, defer, timer, of, fromEvent, merge as merge$1 } from 'rxjs';
+import { map, filter, takeUntil, tap, finalize, take, debounceTime as debounceTime$1, delay, switchMap as switchMap$1 } from 'rxjs/operators';
+import { catchError, ReplaySubject, Subject, BehaviorSubject, distinctUntilChanged, switchMap, defer, EMPTY, isObservable, mergeMap, from, firstValueFrom, debounceTime, startWith, pairwise, tap as tap$1, Observable, combineLatest, timer, of, fromEvent, merge as merge$1 } from 'rxjs';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i2 from '@angular/common';
 import { CommonModule, DatePipe, CurrencyPipe, DOCUMENT, isPlatformServer, NgForOf, NgIf, AsyncPipe, UpperCasePipe } from '@angular/common';
@@ -34,6 +34,7 @@ import * as i1$5 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import * as i10 from '@angular/material/progress-bar';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
+import { fromPromise } from 'rxjs/internal/observable/innerFrom';
 import { CdkStepper, CdkStep, CdkStepperModule } from '@angular/cdk/stepper';
 import * as i1$6 from '@recursyve/ngx-form-generator';
 import { registerAsyncValidatorDecorator, AsyncValidator, NGX_FORM_GENERATOR_ASYNC_VALIDATORS, DynamicGroup } from '@recursyve/ngx-form-generator';
@@ -2690,15 +2691,22 @@ class NiceAsyncTypeaheadService {
             isLastPage: false,
             excludedIds: []
         });
-        this.loading$ = this.state$.pipe(map(x => x.loading));
-        this.loadingPage$ = this.state$.pipe(map(x => x.loadingPage));
-        this.active$ = this.state$.pipe(map(x => x.active));
-        this.items$ = this.state$.pipe(map(x => x.items));
-        this.filteredItems$ = this.state$.pipe(map(x => x.items.filter(item => !x.excludedIds.includes(item.id))));
+        this.loading$ = this.state$.pipe(map(x => x.loading), distinctUntilChanged());
+        this.loadingPage$ = this.state$.pipe(map(x => x.loadingPage), distinctUntilChanged());
+        this.active$ = this.state$.pipe(map(x => x.active), distinctUntilChanged());
+        this.items$ = this.state$.pipe(map(x => x.items), distinctUntilChanged());
+        this.filteredItems$ = this.state$.pipe(map(x => x.items.filter(item => !x.excludedIds.includes(item.id))), distinctUntilChanged());
+        this.requests$ = new Subject();
         if (!this.apis) {
             this.apis = [];
         }
     }
+    listenForRequest() {
+        this.requestsSubscription$ = this.requests$.pipe(switchMap((request) => this.sendRequest(request))).subscribe();
+    }
+    closeRequestSubscription() {
+        this.requestsSubscription$?.unsubscribe();
+    }
     async initialize(resource, options) {
         const { initialized } = this.state$.getValue();
         if (initialized) {
@@ -2706,74 +2714,76 @@ class NiceAsyncTypeaheadService {
         }
         return this.search(resource, "", options);
     }
-    async search(resource, searchQuery, options) {
-        const { active, initialized } = this.state$.getValue();
-        if (active && !initialized) {
-            this.state$.next({
-                ...this.state$.value,
-                initialized: true
-            });
-            return;
-        }
-        const api = this.apis.find(x => x.resource === resource);
-        if (!api) {
-            return;
-        }
-        try {
-            this.state$.next({
-                ...this.state$.value,
-                loading: true,
-                initialized: true,
-                page: 0,
-                isLastPage: false,
-                searchQuery
-            });
-            const result = await api.search(searchQuery, 0, options);
+    sendRequest(request) {
+        return defer(() => {
+            const { active, initialized } = this.state$.getValue();
+            if (active && !initialized) {
+                this.state$.next({
+                    ...this.state$.value,
+                    initialized: true
+                });
+                return EMPTY;
+            }
+            const api = this.apis.find(x => x.resource === request.resource);
+            if (!api) {
+                return EMPTY;
+            }
+            if (request.page === 0) {
+                this.state$.next({
+                    ...this.state$.value,
+                    loading: true,
+                    initialized: true,
+                    page: request.page,
+                    isLastPage: false,
+                    searchQuery: request.searchQuery
+                });
+            }
+            else {
+                this.state$.next({
+                    ...this.state$.value,
+                    loadingPage: true
+                });
+            }
+            const result = api.search(request.searchQuery, request.page, request.searchOptions);
+            if (isObservable(result)) {
+                return result;
+            }
+            return fromPromise(result);
+        }).pipe(map((result) => {
             this.state$.next({
                 ...this.state$.value,
-                items: result.items,
+                items: request.page === 0 ? result.items : [...(this.state$.value.items ?? []), ...result.items],
                 page: result.nextPage ? result.nextPage : this.state$.value.page,
                 isLastPage: !result.nextPage
             });
-        }
-        catch { }
-        finally {
+        }), catchError(() => EMPTY), finalize(() => {
             this.state$.next({
                 ...this.state$.value,
-                loading: false
+                loading: false,
+                loadingPage: false
             });
-        }
+        }));
     }
-    async loadMore(resource, options) {
+    search(resource, searchQuery, options) {
+        this.requests$.next({
+            resource,
+            searchQuery,
+            searchOptions: options,
+            page: 0
+        });
+    }
+    loadMore(resource, options) {
         const { loadingPage, isLastPage } = this.state$.getValue();
         if (loadingPage || isLastPage) {
             return;
         }
-        const api = this.apis.find(x => x.resource === resource);
-        if (!api) {
-            return;
-        }
-        try {
-            this.state$.next({
-                ...this.state$.value,
-                loadingPage: true
-            });
-            const { searchQuery, page, items } = this.state$.getValue();
-            const result = await api.search(searchQuery, page, options);
-            this.state$.next({
-                ...this.state$.value,
-                items: [...items, ...result.items],
-                page: result.nextPage ? result.nextPage : this.state$.value.page,
-                isLastPage: !result.nextPage
-            });
-        }
-        catch { }
-        finally {
-            this.state$.next({
-                ...this.state$.value,
-                loadingPage: false
-            });
-        }
+        const { searchQuery, page } = this.state$.getValue();
+        this.requests$.next({
+            resource,
+            page,
+            searchQuery,
+            searchOptions: options,
+        });
     }
     getActive() {
         return this.state$.value.active;
@@ -2983,6 +2993,7 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
         return this.service.getInitialized();
     }
     ngOnInit() {
+        this.service.listenForRequest();
         if (this.ngControl) {
             if (this.ngControl.disabled) {
                 this.searchControl.disable({ emitEvent: false });
@@ -3013,13 +3024,15 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
         }
     }
     ngOnDestroy() {
+        this.service.closeRequestSubscription();
         this.valueChangesSub$.unsubscribe();
     }
     ngOnChanges(changes) {
         if ("searchOptions" in changes) {
             const change = changes.searchOptions;
             if (!change.isFirstChange() && change.currentValue !== change.previousValue && this.autoReload) {
-                this.service.search(this.resource, "", change.currentValue).then(() => this.checkIfValueStillExist());
+                this.service.search(this.resource, "", change.currentValue);
+                this.service.items$.pipe(take(1)).subscribe(() => this.checkIfValueStillExist());
             }
         }
         if ("filterFn" in changes) {
@@ -5354,10 +5367,15 @@ class NiceControlStatusDirective {
         this.vcr = vcr;
         this.formField = formField;
         this.translateService = translateService;
+        this.unsubscribeAll$ = new Subject();
     }
     ngAfterViewInit() {
         this.control = this.formField._control.ngControl;
-        this.control.statusChanges.subscribe(() => this.onChange());
+        this.control.statusChanges.pipe(takeUntil(this.unsubscribeAll$)).subscribe(() => this.onChange());
+    }
+    ngOnDestroy() {
+        this.unsubscribeAll$.next();
+        this.unsubscribeAll$.complete();
     }
     onChange() {
         if (this.control.pending) {
@@ -9889,7 +9907,7 @@ class NiceSweetAlertService {
     }
     success(...args) {
         const [titleKey, messageKey, buttonsKey, params] = this.transformArgs(args);
-        return this.getTranslations(titleKey, messageKey, buttonsKey, params).pipe(switchMap(([title, message, buttons]) => {
+        return this.getTranslations(titleKey, messageKey, buttonsKey, params).pipe(switchMap$1(([title, message, buttons]) => {
             return this.matDialog
                 .open(this.modal, {
                 panelClass: "nice-alert-modal",
@@ -9905,7 +9923,7 @@ class NiceSweetAlertService {
     }
     warning(...args) {
         const [titleKey, messageKey, buttonsKey, params] = this.transformArgs(args);
-        return this.getTranslations(titleKey, messageKey, buttonsKey, params).pipe(switchMap(([title, message, buttons]) => {
+        return this.getTranslations(titleKey, messageKey, buttonsKey, params).pipe(switchMap$1(([title, message, buttons]) => {
             return this.matDialog
                 .open(this.modal, {
                 panelClass: "nice-alert-modal",
@@ -9921,7 +9939,7 @@ class NiceSweetAlertService {
     }
     info(...args) {
         const [titleKey, messageKey, buttonsKey, params] = this.transformArgs(args);
-        return this.getTranslations(titleKey, messageKey, buttonsKey, params).pipe(switchMap(([title, message, buttons]) => {
+        return this.getTranslations(titleKey, messageKey, buttonsKey, params).pipe(switchMap$1(([title, message, buttons]) => {
             return this.matDialog
                 .open(this.modal, {
                 panelClass: "nice-alert-modal",