add: requestStatus variable for track request process

npm/ng-packs/packages/core/src/lib/services/list.service.ts

@@ -20,6 +20,8 @@ import { ABP } from '../models/common';
 import { PagedResultDto } from '../models/dtos';
 import { LIST_QUERY_DEBOUNCE_TIME } from '../tokens/list.token';
 
+export type RequestStatus = 'idle' | 'loading' | 'success' | 'error';
+
 @Injectable()
 export class ListService<QueryParamsType = ABP.PageQueryParams | any> implements OnDestroy {
   private _filter = '';
@@ -40,7 +42,6 @@ export class ListService<QueryParamsType = ABP.PageQueryParams | any> implements
     return this._maxResultCount;
   }
 
-  private _skipCount = 0;
   private _page = 0;
   set page(value: number) {
     if (value === this._page) return;
@@ -91,12 +92,21 @@ export class ListService<QueryParamsType = ABP.PageQueryParams | any> implements
 
   private _isLoading$ = new BehaviorSubject(false);
 
+  private _requestStatus = new BehaviorSubject<RequestStatus>('idle');
+
   private destroy$ = new Subject<void>();
 
   private delay: MonoTypeOperatorFunction<QueryParamsType>;
 
+  /**
+   * @deprecated Use `requestStatus$` instead.
+   */
   get isLoading$(): Observable<boolean> {
-    return this._isLoading$.asObservable();
+    return this._isLoading$.asObservable().pipe(takeUntil(this.destroy$));
+  }
+
+  get requestStatus$(): Observable<RequestStatus> {
+    return this._requestStatus.asObservable().pipe(takeUntil(this.destroy$));
   }
 
   get = () => {
@@ -119,29 +129,32 @@ export class ListService<QueryParamsType = ABP.PageQueryParams | any> implements
   ): Observable<PagedResultDto<T>> {
     return this.query$.pipe(
       tap(() => this._isLoading$.next(true)),
+      tap(() => this._requestStatus.next('loading')),
       switchMap(query => streamCreatorCallback(query).pipe(catchError(() => of(null)))),
       filter(Boolean),
       tap(() => this._isLoading$.next(false)),
+      tap(() => this._requestStatus.next('success')),
       shareReplay<any>({ bufferSize: 1, refCount: true }),
       takeUntil(this.destroy$),
+      catchError(error => {
+        this._requestStatus.next('error');
+        throw error;
+      }),
     );
   }
 
   ngOnDestroy() {
     this.destroy$.next();
   }
-
   private resetPageWhenUnchanged() {
     const maxPage = Number(Number(this.totalCount / this._maxResultCount).toFixed());
     const skipCount = this._page * this._maxResultCount;
 
     if (skipCount !== this._totalCount) {
-      this._skipCount = skipCount;
       return;
     }
 
     if (this.page === maxPage && this.page > 0) {
-      this._skipCount = skipCount - this._maxResultCount;
       this.page = this.page - 1;
     }
   }

npm/ng-packs/packages/core/src/lib/tests/list.service.spec.ts

@@ -149,5 +149,35 @@ describe('ListService', () => {
 
       service.hookToQuery(callback).subscribe();
     });
+
+    it('should emit requestStatus as side effect', done => {
+      const callback: QueryStreamCreatorCallback<ABP.PageQueryParams> = query =>
+        of({ items: [query], totalCount: 1 });
+
+      service.requestStatus$.pipe(bufferCount(3)).subscribe(([idle, init, end]) => {
+        expect(idle).toBe('idle');
+        expect(init).toBe('loading');
+        expect(end).toBe('success');
+
+        done();
+      });
+
+      service.hookToQuery(callback).subscribe();
+    });
+
+    it('should emit error requestStatus as side effect', done => {
+      const errCallback: QueryStreamCreatorCallback<ABP.PageQueryParams> = query => {
+        throw Error('A server error occurred');
+      };
+
+      service.requestStatus$.pipe(bufferCount(3)).subscribe(([idle, loading, error]) => {
+        expect(idle).toBe('idle');
+        expect(loading).toBe('loading');
+        expect(error).toBe('error');
+        done();
+      });
+
+      service.hookToQuery(errCallback).subscribe();
+    });
   });
 });