@ethlete/query 2.1.1 → 2.3.0

package/fesm2020/ethlete-query.mjs

@@ -1,5 +1,5 @@
 import { BehaviorSubjectWithSubscriberCount, getCookie, setCookie, deleteCookie, DestroyService, equal, clone } from '@ethlete/core';
-import { Observable, filter, takeWhile, switchMap, of, BehaviorSubject, Subject, takeUntil, interval, startWith, tap, timer, fromEvent, concat, take, debounceTime, combineLatest, map, distinctUntilChanged } from 'rxjs';
+import { Observable, filter, takeWhile, switchMap, of, BehaviorSubject, Subject, takeUntil, interval, startWith, tap, timer, fromEvent, take, concat, debounceTime, combineLatest, map, distinctUntilChanged } from 'rxjs';
 import * as i0 from '@angular/core';
 import { Directive, Input, InjectionToken, inject, ChangeDetectorRef, ViewContainerRef, TemplateRef, ErrorHandler, ElementRef } from '@angular/core';
 import { FormGroup } from '@angular/forms';
@@ -71,7 +71,7 @@ const queryStateDoesNotContainKeyError = (data) => new QueryError('005', 'The qu
 const queryStateCannotTransformError = (data) => new QueryError('006', 'The query state cannot be transformed because it is not loading', data);
 const invalidBodyError = (data) => new QueryError('007', 'The body is not valid or upsupported', data);
 
-const isRequestError = (error) => error instanceof Object && 'code' in error && 'message' in error;
+const isRequestError = (error) => error instanceof Object && 'status' in error && 'statusText' in error && 'url' in error;
 const buildRoute = (options) => {
     if (options.base.endsWith('/')) {
         throw invalidBaseRouteError(options.base);
@@ -271,6 +271,37 @@ const getResponseUrl = (xhr) => {
     }
     return null;
 };
+const shouldRetryRequest = (config) => {
+    const defaultRetryDelay = 1000 + 1000 * config.currentRetryCount;
+    if (config.currentRetryCount > 3) {
+        return { retry: false };
+    }
+    if (!isRequestError(config.error)) {
+        return { retry: false };
+    }
+    const { status } = config.error;
+    // Retry on 5xx errors
+    if (status >= 500) {
+        return { retry: true, delay: defaultRetryDelay };
+    }
+    // Retry on 408 or 425 errors
+    if (status === 408 /* HttpStatusCode.RequestTimeout */ || status === 425 /* HttpStatusCode.TooEarly */) {
+        return { retry: true, delay: defaultRetryDelay };
+    }
+    // Retry on 429 errors
+    if (status === 429 /* HttpStatusCode.TooManyRequests */) {
+        const retryAfter = config.headers['retry-after'] ||
+            config.headers['Retry-After'] ||
+            config.headers['x-retry-after'] ||
+            config.headers['X-Retry-After'];
+        if (retryAfter) {
+            const delay = parseInt(retryAfter) * 1000;
+            return { retry: true, delay: Number.isNaN(delay) ? defaultRetryDelay : delay };
+        }
+        return { retry: true, delay: defaultRetryDelay };
+    }
+    return { retry: false };
+};
 
 const XSSI_PREFIX = /^\)\]\}',?\n/;
 const request = (config) => {
@@ -278,25 +309,32 @@ const request = (config) => {
     const responseType = config.responseType || 'json';
     const body = config.body || null;
     const url = config.urlWithParams.split('?')[0];
+    const retryFn = config.retryFn || shouldRetryRequest;
+    let currentRetryCount = 0;
+    let retryTimeout = null;
     return new Observable((observer) => {
         const xhr = new XMLHttpRequest();
-        xhr.open(config.method, config.urlWithParams);
-        if (config.withCredentials) {
-            xhr.withCredentials = true;
-        }
-        forEachHeader(headers, (name, value) => xhr.setRequestHeader(name, value));
-        if (!hasHeader(headers, 'Accept')) {
-            xhr.setRequestHeader('Accept', 'application/json, text/plain, */*');
-        }
-        if (!hasHeader(headers, 'Content-Type')) {
-            const detectedType = detectContentTypeHeader(body);
-            if (detectedType) {
-                xhr.setRequestHeader('Content-Type', detectedType);
-            }
-        }
-        xhr.responseType = responseType !== 'json' ? responseType : 'text';
         const reqBody = serializeBody(body);
         let headerResponse = null;
+        const setupXhr = () => {
+            headerResponse = null;
+            xhr.open(config.method, config.urlWithParams);
+            if (config.withCredentials) {
+                xhr.withCredentials = true;
+            }
+            forEachHeader(headers, (name, value) => xhr.setRequestHeader(name, value));
+            if (!hasHeader(headers, 'Accept')) {
+                xhr.setRequestHeader('Accept', 'application/json, text/plain, */*');
+            }
+            if (!hasHeader(headers, 'Content-Type')) {
+                const detectedType = detectContentTypeHeader(body);
+                if (detectedType) {
+                    xhr.setRequestHeader('Content-Type', detectedType);
+                }
+            }
+            xhr.responseType = responseType !== 'json' ? responseType : 'text';
+        };
+        setupXhr();
         const partialFromXhr = () => {
             if (headerResponse !== null) {
                 return headerResponse;
@@ -307,6 +345,24 @@ const request = (config) => {
             headerResponse = { headers, status: xhr.status, statusText, url: _url };
             return headerResponse;
         };
+        const handleRetry = (error) => {
+            const newRetryCount = currentRetryCount + 1;
+            const { headers } = partialFromXhr();
+            const { retry, delay } = retryFn({ currentRetryCount: newRetryCount, headers, error });
+            if (!retry) {
+                observer.next({ type: 'failure', headers, error });
+                observer.complete();
+                return;
+            }
+            const _delay = delay ?? 1000;
+            observer.next({ type: 'delay-retry', headers, retryNumber: newRetryCount, retryDelay: _delay });
+            retryTimeout = window.setTimeout(() => {
+                setupXhr();
+                xhr.send(reqBody);
+                currentRetryCount = newRetryCount;
+                observer.next({ type: 'start', headers, isRetry: true, retryNumber: currentRetryCount, retryDelay: _delay });
+            }, _delay);
+        };
         const onLoad = () => {
             const { headers, statusText, url } = partialFromXhr();
             let { status } = partialFromXhr();
@@ -347,32 +403,22 @@ const request = (config) => {
                 observer.complete();
             }
             else {
-                observer.next({
-                    type: 'failure',
-                    headers,
-                    error: {
-                        url,
-                        detail: body,
-                        status,
-                        statusText,
-                    },
+                handleRetry({
+                    url,
+                    detail: body,
+                    status,
+                    statusText,
                 });
-                observer.complete();
             }
         };
         const onError = (error) => {
-            const { url, headers } = partialFromXhr();
-            observer.next({
-                type: 'failure',
-                headers,
-                error: {
-                    url,
-                    detail: error,
-                    status: xhr.status || 0,
-                    statusText: xhr.statusText || 'Unknown Error',
-                },
+            const { url } = partialFromXhr();
+            handleRetry({
+                url,
+                detail: error,
+                status: xhr.status || 0,
+                statusText: xhr.statusText || 'Unknown Error',
             });
-            observer.complete();
         };
         const onDownProgress = (event) => {
             const { headers } = partialFromXhr();
@@ -426,6 +472,9 @@ const request = (config) => {
             xhr.removeEventListener('abort', onError);
             xhr.removeEventListener('load', onLoad);
             xhr.removeEventListener('timeout', onError);
+            if (retryTimeout) {
+                window.clearTimeout(retryTimeout);
+            }
             if (config.reportProgress) {
                 xhr.removeEventListener('progress', onDownProgress);
                 if (reqBody !== null && xhr.upload) {
@@ -445,6 +494,11 @@ function filterSuccess() {
         return source.pipe(filter((value) => isQueryStateSuccess(value)));
     };
 }
+function ignoreAutoRefresh() {
+    return function (source) {
+        return source.pipe(filter((value) => !isAutoRefresh(value)));
+    };
+}
 function filterFailure() {
     return function (source) {
         return source.pipe(filter((value) => isQueryStateFailure(value)));
@@ -485,6 +539,7 @@ const isQueryStateSuccess = (state) => state?.type === "SUCCESS" /* QueryStateTy
 const isQueryStateFailure = (state) => state?.type === "FAILURE" /* QueryStateType.Failure */;
 const isQueryStateCancelled = (state) => state?.type === "CANCELLED" /* QueryStateType.Cancelled */;
 const isQueryStatePrepared = (state) => state?.type === "PREPARED" /* QueryStateType.Prepared */;
+const isAutoRefresh = (state) => state?.meta.triggeredVia === 'auto';
 const mergeHeaders = (...headers) => {
     return headers.reduce((acc, headers) => {
         if (!headers) {
@@ -527,6 +582,13 @@ const getDefaultHeaders = (headers, method) => {
     }
     return headers;
 };
+const castQueryCreatorTypes = (config) => {
+    if (config.args?.pathParams) {
+        console.error(config);
+        throw new Error('Path params cannot be overridden in castQueryCreatorTypes. Create a new query creator instead.');
+    }
+    return config.creator;
+};
 
 class Query {
     get _nextId() {
@@ -628,23 +690,31 @@ class Query {
                 authHeader = this._client.authProvider.header;
             }
         }
+        const mergedHeaders = mergeHeaders(getDefaultHeaders(this._client.config.request?.headers, this._queryConfig.method), authHeader, this._args?.headers) || undefined;
         request({
             urlWithParams: this._routeWithParams,
             method: transformMethod(this._queryConfig.method),
             body,
-            headers: mergeHeaders(getDefaultHeaders(this._client.config.request?.headers, this._queryConfig.method), authHeader, this._args?.headers) || undefined,
-            cacheAdapter: this._client.config.request?.cacheAdapter,
+            headers: mergedHeaders,
             reportProgress: this._queryConfig.reportProgress,
             responseType: this._queryConfig.responseType,
             withCredentials: this._queryConfig.withCredentials,
+            cacheAdapter: this._client.config.request?.cacheAdapter,
+            retryFn: this._client.config.request?.retryFn,
         })
             .pipe(takeUntil(this._onAbort$))
             .subscribe({
             next: (state) => {
-                if (state.type === 'start') {
+                if (state.type === 'start' || state.type === 'delay-retry') {
+                    const newMeta = {
+                        ...meta,
+                        isWaitingForRetry: state.type === 'delay-retry',
+                        retryDelay: state.retryDelay,
+                        retryNumber: state.retryNumber,
+                    };
                     this._state$.next({
                         type: "LOADING" /* QueryStateType.Loading */,
-                        meta,
+                        meta: newMeta,
                     });
                 }
                 else if (state.type === 'download-progress') {
@@ -1098,6 +1168,9 @@ class InfinityQuery {
         this._data$.next([]);
         this.nextPage();
     }
+    /**
+     * @internal
+     */
     _clearSubscriptions() {
         this._subscriptions.forEach((sub) => sub.unsubscribe());
         this._subscriptions = [];
@@ -1228,7 +1301,7 @@ class InfinityQueryDirective {
         this._cleanup();
         this._infinityQuery = v;
         this._infinityQueryInstance = this._setupInfinityQuery(v);
-        this._loadNextPage();
+        this.loadNextPage();
     }
     get context() {
         return this._viewContext;
@@ -1301,12 +1374,25 @@ class InfinityQueryDirective {
             .subscribe();
         return instance;
     }
+    /**
+     * @deprecated Use `loadNextPage` instead
+     * @breaking 3.0.0
+     */
     _loadNextPage() {
+        this.loadNextPage();
+    }
+    loadNextPage() {
         if (!this._infinityQueryInstance) {
             return;
         }
         this._infinityQueryInstance.nextPage();
     }
+    reset(newConfig) {
+        if (!this._infinityQueryInstance) {
+            return;
+        }
+        this._infinityQueryInstance.reset(newConfig);
+    }
     _renderMainView() {
         if (!this._isMainViewCreated) {
             this._isMainViewCreated = true;
@@ -1355,7 +1441,7 @@ class InfinityQueryTriggerDirective {
     ngOnInit() {
         const isInteractive = this._elementRef.nativeElement.hasAttribute('infinityQueryTrigger');
         if (isInteractive) {
-            this.click$.pipe(takeUntil(this._destroy)).subscribe(() => this._infinityQuery._loadNextPage());
+            this.click$.pipe(takeUntil(this._destroy)).subscribe(() => this._infinityQuery.loadNextPage());
         }
         else {
             this._setupIntersectionObserver();
@@ -1370,7 +1456,7 @@ class InfinityQueryTriggerDirective {
         this._observer = new IntersectionObserver((entries) => {
             const entry = entries[0];
             if (entry.isIntersecting && !this._infinityQuery.context.loading) {
-                this._infinityQuery._loadNextPage();
+                this._infinityQuery.loadNextPage();
             }
         }, {
             root: this.scrollContainerSelector ? document.querySelector(this.scrollContainerSelector) : null,
@@ -1398,6 +1484,8 @@ class QueryStore {
         this._config = _config;
         this._store = new Map();
         this._garbageCollector = null;
+        this._isInLowResourceMode = false;
+        this._lastBlurTimestamp = Date.now();
         this._initSmartQueryHandling();
     }
     add(id, query) {
@@ -1434,27 +1522,39 @@ class QueryStore {
         const windowBlur$ = fromEvent(window, 'blur');
         const windowFocus$ = fromEvent(window, 'focus');
         windowBlur$.subscribe(() => {
-            this._stopGarbageCollector();
-            if (this._config?.enableSmartPolling) {
-                this.forEach((query) => {
-                    if (!query.isPolling || !query._enableSmartPolling) {
-                        return;
-                    }
-                    query.pausePolling();
-                });
-            }
+            timer(5000)
+                .pipe(takeUntil(windowFocus$), take(1))
+                .subscribe(() => {
+                this._lastBlurTimestamp = Date.now();
+                this._isInLowResourceMode = true;
+                this._stopGarbageCollector();
+                if (this._config?.enableSmartPolling) {
+                    this.forEach((query) => {
+                        if (!query.isPolling || !query._enableSmartPolling) {
+                            return;
+                        }
+                        query.pausePolling();
+                    });
+                }
+            });
         });
         windowFocus$.subscribe(() => {
+            if (!this._isInLowResourceMode) {
+                return;
+            }
+            this._isInLowResourceMode = false;
             if (this._config?.enableSmartPolling || this._config?.autoRefreshQueriesOnWindowFocus) {
                 this.forEach((query) => {
                     if (this._config?.enableSmartPolling && query._isPollingPaused) {
                         query.resumePolling();
                     }
-                    if (this._config?.autoRefreshQueriesOnWindowFocus &&
-                        query.isExpired &&
-                        query.isInUse &&
-                        query.autoRefreshOnConfig.windowFocus) {
-                        query.execute({ skipCache: true, _triggeredVia: 'auto' });
+                    if (Date.now() - this._lastBlurTimestamp > 15000) {
+                        if (this._config?.autoRefreshQueriesOnWindowFocus &&
+                            query.isExpired &&
+                            query.isInUse &&
+                            query.autoRefreshOnConfig.windowFocus) {
+                            query.execute({ skipCache: true, _triggeredVia: 'auto' });
+                        }
                     }
                 });
             }
@@ -1485,6 +1585,7 @@ class QueryStore {
         if (this._garbageCollector !== null) {
             window.clearInterval(this._garbageCollector);
             this._garbageCollector = null;
+            this._logGarbageCollector('Stop');
         }
     }
     _runGarbageCollector() {
@@ -1497,7 +1598,6 @@ class QueryStore {
         this._logGarbageCollector('Collection done');
         if (!this._store.size) {
             this._stopGarbageCollector();
-            this._logGarbageCollector('Stop');
         }
     }
     _logGarbageCollector(action) {
@@ -1869,5 +1969,5 @@ const def = () => null;
  * Generated bundle index. Do not edit.
  */
 
-export { BasicAuthProvider, BearerAuthProvider, CustomHeaderAuthProvider, INFINITY_QUERY_TOKEN, InfinityQuery, InfinityQueryDirective, InfinityQueryTriggerDirective, Query, QueryClient, QueryDirective, QueryError, QueryField, QueryForm, QueryStore, buildErrorMessage, buildGqlCacheKey, buildQueryArrayString, buildQueryString, buildRoute, buildTimestampFromSeconds, createInfinityQueryConfig, createQueryCollection, decryptBearer, deepFreeze, def, detectContentTypeHeader, extractExpiresInSeconds, extractQuery, filterFailure, filterInvalidParams, filterNull, filterQueryStates, filterSuccess, forEachHeader, getDefaultHeaders, getResponseUrl, gql, hasHeader, invalidBaseRouteError, invalidBodyError, invalidRouteError, isBasicAuthProvider, isBearerAuthProvider, isCustomHeaderAuthProvider, isFetchResponse, isGqlQueryConfig, isParamValid, isQuery, isQueryStateCancelled, isQueryStateFailure, isQueryStateLoading, isQueryStatePrepared, isQueryStateSuccess, isRequestError, mergeHeaders, parseAllXhrResponseHeaders, pathParamsMissingInRouteFunctionError, queryStateAlreadyHasKeyError, queryStateCannotTransformError, queryStateDoesNotContainKeyError, request, serializeBody, shouldCacheQuery, skipPaginationPageParamCalculator, switchQueryCollectionState, switchQueryState, takeUntilResponse, transformGql, transformMethod, transformToBoolean, transformToBooleanArray, transformToDate, transformToDateArray, transformToNumber, transformToNumberArray, transformToSort, transformToSortQueryParam, transformToString, transformToStringArray };
+export { BasicAuthProvider, BearerAuthProvider, CustomHeaderAuthProvider, INFINITY_QUERY_TOKEN, InfinityQuery, InfinityQueryDirective, InfinityQueryTriggerDirective, Query, QueryClient, QueryDirective, QueryError, QueryField, QueryForm, QueryStore, buildErrorMessage, buildGqlCacheKey, buildQueryArrayString, buildQueryString, buildRoute, buildTimestampFromSeconds, castQueryCreatorTypes, createInfinityQueryConfig, createQueryCollection, decryptBearer, deepFreeze, def, detectContentTypeHeader, extractExpiresInSeconds, extractQuery, filterFailure, filterInvalidParams, filterNull, filterQueryStates, filterSuccess, forEachHeader, getDefaultHeaders, getResponseUrl, gql, hasHeader, ignoreAutoRefresh, invalidBaseRouteError, invalidBodyError, invalidRouteError, isAutoRefresh, isBasicAuthProvider, isBearerAuthProvider, isCustomHeaderAuthProvider, isFetchResponse, isGqlQueryConfig, isParamValid, isQuery, isQueryStateCancelled, isQueryStateFailure, isQueryStateLoading, isQueryStatePrepared, isQueryStateSuccess, isRequestError, mergeHeaders, parseAllXhrResponseHeaders, pathParamsMissingInRouteFunctionError, queryStateAlreadyHasKeyError, queryStateCannotTransformError, queryStateDoesNotContainKeyError, request, serializeBody, shouldCacheQuery, shouldRetryRequest, skipPaginationPageParamCalculator, switchQueryCollectionState, switchQueryState, takeUntilResponse, transformGql, transformMethod, transformToBoolean, transformToBooleanArray, transformToDate, transformToDateArray, transformToNumber, transformToNumberArray, transformToSort, transformToSortQueryParam, transformToString, transformToStringArray };
 //# sourceMappingURL=ethlete-query.mjs.map