@ethlete/query 6.0.0-next.10 → 6.0.0-next.11

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @ethlete/query
 
+## 6.0.0-next.11
+
+### Patch Changes
+
+- [#2995](https://github.com/ethlete-io/ethdk/pull/2995) [`9038da9`](https://github.com/ethlete-io/ethdk/commit/9038da9dba1af6597ce24056f45354b4073673aa) Thanks [@github-actions](https://github.com/apps/github-actions)! - Fix `withSuccessHandling`, `withErrorHandling` and `withLogging` callbacks sometimes being skipped when a query re-executes in quick succession (e.g. polling, auto-refresh, or fast repeated requests). Each execution's result now reliably triggers its handler.
+
+- [#2995](https://github.com/ethlete-io/ethdk/pull/2995) [`24b4fd7`](https://github.com/ethlete-io/ethdk/commit/24b4fd7e1aebda8a4844d4a8ec9700aa1a89a0ee) Thanks [@github-actions](https://github.com/apps/github-actions)! - Fix secure queries intermittently throwing `tokensNotAvailableInsideAuthAndExec` when the auth query completes on a different reactive timeline than the access token is set on (e.g. a cross-client / secure login query whose token is populated by a separate effect). The secure execute factory now waits for the access token to be available before running the request instead of assuming it is set the moment the auth query has a response, and recovers automatically once the token arrives.
+
 ## 6.0.0-next.10
 
 ### Patch Changes

package/fesm2022/ethlete-query.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { isDevMode, DestroyRef, InjectionToken, inject, Injector, EnvironmentInjector, ErrorHandler, ɵEffectScheduler as _EffectScheduler, createEnvironmentInjector, effect, computed, untracked, signal, linkedSignal, runInInjectionContext, assertInInjectionContext, ChangeDetectorRef, ViewContainerRef, TemplateRef, Input, Directive, ElementRef, input, Pipe, ViewEncapsulation, ChangeDetectionStrategy, Component, DOCUMENT, NgZone } from '@angular/core';
+import { isDevMode, DestroyRef, InjectionToken, inject, Injector, EnvironmentInjector, ErrorHandler, createEnvironmentInjector, effect, untracked, signal, linkedSignal, computed, runInInjectionContext, assertInInjectionContext, ChangeDetectorRef, ViewContainerRef, TemplateRef, Input, Directive, ElementRef, input, Pipe, ViewEncapsulation, ChangeDetectionStrategy, Component, DOCUMENT, NgZone } from '@angular/core';
 import { createStaticProvider, RuntimeError, clamp, createDestroy, computedTillTruthy, getCookie, setCookie, deleteCookie, createProvider, nextFrame, createRootProvider, isObject, injectRoute, getDomain, injectQueryParamChanges, injectQueryParams, clone, equal, ET_PROPERTY_REMOVED, previousSignalValue } from '@ethlete/core';
-import { Observable, Subscription, tap, retry, throwError, timer, catchError, takeUntil, startWith, pairwise, switchMap, of, BehaviorSubject, Subject, fromEvent, take, filter, ReplaySubject, map, shareReplay, interval, skip, takeWhile, combineLatest, EMPTY, withLatestFrom, debounceTime, merge, throttleTime } from 'rxjs';
+import { filter, Subject, Subscription, Observable, tap, retry, throwError, timer, catchError, takeUntil, startWith, pairwise, switchMap, of, BehaviorSubject, fromEvent, take, ReplaySubject, map, shareReplay, interval, skip, takeWhile, combineLatest, EMPTY, withLatestFrom, debounceTime, merge, throttleTime } from 'rxjs';
 import { toObservable, takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
 import { HttpClient, HttpEventType, HttpErrorResponse, HttpHeaders, HttpStatusCode } from '@angular/common/http';
 import { getActiveConsumer, setActiveConsumer } from '@angular/core/primitives/signals';
@@ -46,9 +46,6 @@ const createGqlExecuteFn = (executeOptions) => {
     const reset = () => resetExecuteState({ executeState, executeOptions });
     const exec = (executeArgs) => {
         circularChecker.check();
-        // Make sure all effects are flushed before reading the args.
-        // A withArgs feature effect might still be pending otherwise resulting in the wrong args being read.
-        executeOptions.deps.effectScheduler.flush();
         const { args = executeOptions.state.args(), options } = executeArgs ?? {};
         const query = transformGql(executeOptions.creatorInternals.query);
         let gqlParams = query(args?.variables);
@@ -133,7 +130,6 @@ const setupQueryDependencies = (options) => {
         scopeDestroyRef: hostInjector.get(DestroyRef),
         client: hostInjector.get(clientToken),
         injector: undefined, // Will be set after injector creation
-        effectScheduler: hostInjector.get(_EffectScheduler),
         ngErrorHandler: hostInjector.get(ErrorHandler),
         httpClient: hostInjector.get(HttpClient),
     };
@@ -307,17 +303,27 @@ const withArgs = (args) => {
     return createQueryFeature({
         type: QueryFeatureType.WITH_ARGS,
         fn: (context) => {
-            const currArgs = computed(() => args(), ...(ngDevMode ? [{ debugName: "currArgs" }] : /* istanbul ignore next */ []));
+            // `state.args` is reactively backed by this source, so every reader (exec, polling,
+            // auto-refresh) always sees the latest value with no pending-effect window. Sentinels are
+            // resolved here: CLEAR -> null, `null` ("don't change") -> keep the previous value.
+            let previous = null;
+            context.state.subtle.setArgsSource(() => {
+                const value = args();
+                if (value === CLEAR_QUERY_ARGS) {
+                    previous = null;
+                    return null;
+                }
+                if (value === null)
+                    return previous;
+                previous = value;
+                return value;
+            });
+            // Trigger (auto-)execution whenever the resolved args change.
             nestedEffect(() => {
-                const currArgsNow = currArgs();
+                const currArgsNow = context.state.args();
                 if (currArgsNow === null)
                     return;
                 untracked(() => {
-                    if (currArgsNow === CLEAR_QUERY_ARGS) {
-                        context.state.args.set(null);
-                        return;
-                    }
-                    context.state.args.set(currArgsNow);
                     if (context.flags.shouldAutoExecute)
                         context.execute({ args: currArgsNow });
                 });
@@ -366,14 +372,9 @@ const withLogging = (options) => {
     return createQueryFeature({
         type: QueryFeatureType.WITH_LOGGING,
         fn: (context) => {
-            nestedEffect(() => {
-                const event = context.state.latestHttpEvent();
-                if (event === null)
-                    return;
-                untracked(() => {
-                    options.logFn(event);
-                });
-            }, { injector: context.deps.injector });
+            context.state.events$.pipe(takeUntilDestroyed(context.deps.destroyRef)).subscribe((event) => {
+                options.logFn(event);
+            });
         },
     });
 };
@@ -382,14 +383,11 @@ const withErrorHandling = (options) => {
     return createQueryFeature({
         type: QueryFeatureType.WITH_ERROR_HANDLING,
         fn: (context) => {
-            nestedEffect(() => {
-                const error = context.state.error();
-                if (error === null)
-                    return;
-                untracked(() => {
-                    options.handler(error);
-                });
-            }, { injector: context.deps.injector });
+            context.state.events$
+                .pipe(filter((event) => event.type === 'error'), takeUntilDestroyed(context.deps.destroyRef))
+                .subscribe((event) => {
+                options.handler(event.error);
+            });
         },
     });
 };
@@ -398,14 +396,11 @@ const withSuccessHandling = (options) => {
     return createQueryFeature({
         type: QueryFeatureType.WITH_SUCCESS_HANDLING,
         fn: (context) => {
-            nestedEffect(() => {
-                const event = context.state.latestHttpEvent();
-                if (!event || event.type !== HttpEventType.Response)
-                    return;
-                untracked(() => {
-                    options.handler(context.state.response());
-                });
-            }, { injector: context.deps.injector });
+            context.state.events$
+                .pipe(filter((event) => event.type === HttpEventType.Response), takeUntilDestroyed(context.deps.destroyRef))
+                .subscribe(() => {
+                options.handler(context.state.response());
+            });
         },
     });
 };
@@ -469,9 +464,21 @@ const setupQueryState = (options) => {
     const loading = linkedSignal(() => request()?.loading() ?? null, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
     const error = linkedSignal(() => request()?.error() ?? null, ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
     const latestHttpEvent = linkedSignal(() => request()?.currentEvent() ?? null, ...(ngDevMode ? [{ debugName: "latestHttpEvent" }] : /* istanbul ignore next */ []));
-    const args = signal(null, ...(ngDevMode ? [{ debugName: "args" }] : /* istanbul ignore next */ []));
+    // `args` is reactively sourced: reads always reflect the latest value from the installed source
+    // (e.g. the `withArgs` feature), so there is no stale window between a source change and an
+    // effect writing it. It stays writable (reset / auth-error clear it via `.set(null)`); a manual
+    // set is overridden again the next time the source's dependencies change.
+    const argsSource = signal(() => null, ...(ngDevMode ? [{ debugName: "argsSource" }] : /* istanbul ignore next */ []));
+    const args = linkedSignal(() => argsSource()(), ...(ngDevMode ? [{ debugName: "args" }] : /* istanbul ignore next */ []));
+    const setArgsSource = (source) => argsSource.set(source);
     const lastTimeExecutedAt = signal(null, ...(ngDevMode ? [{ debugName: "lastTimeExecutedAt" }] : /* istanbul ignore next */ []));
     const lastTriggeredBy = signal(null, ...(ngDevMode ? [{ debugName: "lastTriggeredBy" }] : /* istanbul ignore next */ []));
+    const requestEvents$ = new Subject();
+    let requestEventsSubscription = Subscription.EMPTY;
+    const bindRequestEvents = (request) => {
+        requestEventsSubscription.unsubscribe();
+        requestEventsSubscription = request.events$.subscribe((event) => requestEvents$.next(event));
+    };
     const executionState = computed(() => {
         const currentResponse = response();
         const currentError = error();
@@ -517,9 +524,12 @@ const setupQueryState = (options) => {
         lastTimeExecutedAt,
         lastTriggeredBy,
         executionState,
+        events$: requestEvents$.asObservable(),
         subtle: {
             request,
             rawResponse,
+            bindRequestEvents,
+            setArgsSource,
         },
     };
     return state;
@@ -746,6 +756,7 @@ const queryExecute = (options) => {
     state.lastTimeExecutedAt.set(Date.now());
     state.lastTriggeredBy.set(runQueryOptions?.triggeredBy ?? null);
     state.subtle.request.set(request);
+    state.subtle.bindRequestEvents(request);
 };
 const circularQueryDependencyChecker = () => {
     let lastTriggerTs = 0;
@@ -779,9 +790,6 @@ const createExecuteFn = (executeOptions) => {
     const reset = () => resetExecuteState({ executeState, executeOptions });
     const exec = (executeArgs) => {
         circularChecker.check();
-        // Make sure all effects are flushed before reading the args.
-        // A withArgs feature effect might still be pending otherwise resulting in the wrong args being read.
-        executeOptions.deps.effectScheduler.flush();
         const { args = executeOptions.state.args(), options } = executeArgs ?? {};
         queryExecute({ executeOptions, executeState, args, options });
     };
@@ -1540,6 +1548,7 @@ const createHttpRequest = (options) => {
     let currentStreamSubscription = Subscription.EMPTY;
     const { args, clientOptions, dependencies } = options;
     const currentEvent = signal(null, ...(ngDevMode ? [{ debugName: "currentEvent" }] : /* istanbul ignore next */ []));
+    const event$ = new Subject();
     const loading = signal(null, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
     const error = signal(null, ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
     const response = signal(null, ...(ngDevMode ? [{ debugName: "response" }] : /* istanbul ignore next */ []));
@@ -1601,11 +1610,10 @@ const createHttpRequest = (options) => {
         return true;
     };
     const destroy = () => {
-        if (currentStreamSubscription.closed) {
-            return false;
-        }
+        const wasActive = !currentStreamSubscription.closed;
         currentStreamSubscription.unsubscribe();
-        return true;
+        event$.complete();
+        return wasActive;
     };
     const updateState = (event) => {
         switch (event.type) {
@@ -1635,12 +1643,15 @@ const createHttpRequest = (options) => {
                 break;
         }
         currentEvent.set(event);
+        event$.next(event);
     };
     const updateErrorState = (errorResponse) => {
         const errorRes = createQueryErrorResponse(errorResponse);
         error.set(errorRes);
         loading.set(null);
-        currentEvent.set({ type: 'error', error: errorRes });
+        const errorEvent = { type: 'error', error: errorRes };
+        currentEvent.set(errorEvent);
+        event$.next(errorEvent);
         options.dependencies.ngErrorHandler.handleError(errorRes.raw);
     };
     const updateLoadingState = (event) => {
@@ -1680,6 +1691,7 @@ const createHttpRequest = (options) => {
         error: error.asReadonly(),
         response: response.asReadonly(),
         currentEvent: currentEvent.asReadonly(),
+        events$: event$.asObservable(),
         isStale,
     };
     return httpRequest;
@@ -2623,11 +2635,14 @@ const createSecureExecuteFactory = (options) => {
     const circularChecker = circularQueryDependencyChecker();
     let authQuerySubscription = Subscription.EMPTY;
     let tokenRefreshSubscription = Subscription.EMPTY;
+    let tokenWaitSubscription = Subscription.EMPTY;
     const reset = () => {
         authQuerySubscription.unsubscribe();
         authQuerySubscription = Subscription.EMPTY;
         tokenRefreshSubscription.unsubscribe();
         tokenRefreshSubscription = Subscription.EMPTY;
+        tokenWaitSubscription.unsubscribe();
+        tokenWaitSubscription = Subscription.EMPTY;
         resetExecuteState({
             executeState,
             executeOptions: { deps: options.deps, state: options.state },
@@ -2668,11 +2683,27 @@ const createSecureExecuteFactory = (options) => {
             },
         }, tokens, headers, executeState);
     };
+    // The auth query completing and the access token being populated happen on two
+    // different reactive timelines: the token is set by a separate token-extraction
+    // effect (see `setupBearerQueryRegistry`), and for cross-client / secure auth
+    // queries the completion is delivered through several nested `toObservable` hops.
+    // Calling `authAndExec` purely because the auth query is "done" therefore races
+    // the token and can run while it is still null. Gate on the token signal instead:
+    // execute immediately if it is already available, otherwise wait for it.
+    const authAndExecWhenTokenReady = (executeArgs) => {
+        if (options.authProvider.accessToken()) {
+            authAndExec(executeArgs);
+            return;
+        }
+        tokenWaitSubscription.unsubscribe();
+        tokenWaitSubscription = toObservable(options.authProvider.accessToken, {
+            injector: options.deps.injector,
+        })
+            .pipe(filter(Boolean), take(1), tap(() => authAndExec(executeArgs)))
+            .subscribe();
+    };
     const exec = (executeArgs) => {
         circularChecker.check();
-        // Make sure all effects are flushed before reading the args.
-        // A withArgs feature effect might still be pending otherwise resulting in the wrong args being read.
-        options.deps.effectScheduler.flush();
         const execArgsWithDefaults = {
             args: executeArgs?.args ?? options.state.args(),
             options: executeArgs?.options,
@@ -2681,6 +2712,8 @@ const createSecureExecuteFactory = (options) => {
         authQuerySubscription = Subscription.EMPTY;
         tokenRefreshSubscription.unsubscribe();
         tokenRefreshSubscription = Subscription.EMPTY;
+        tokenWaitSubscription.unsubscribe();
+        tokenWaitSubscription = Subscription.EMPTY;
         tokenRefreshSubscription = options.authProvider.afterTokenRefresh$
             .pipe(filter(() => {
             const currentError = options.state.error();
@@ -2708,14 +2741,14 @@ const createSecureExecuteFactory = (options) => {
                         error(query);
                     }
                     else if (query.response()) {
-                        authAndExec(execArgsWithDefaults);
+                        authAndExecWhenTokenReady(execArgsWithDefaults);
                     }
                 }));
             }))
                 .subscribe();
         }
         else if (authQuery.response()) {
-            authAndExec(execArgsWithDefaults);
+            authAndExecWhenTokenReady(execArgsWithDefaults);
         }
         else if (authQuery.error()) {
             error(authQuery);
@@ -5041,26 +5074,17 @@ const createQueryRepository = (config) => {
         else {
             const consumers = new Map([]);
             consumers.set(consumerDestroyRef, destroyListener);
-            const eventSubscription = combineLatest([
-                toObservable(request.error, { injector: config.dependencies.injector }),
-                toObservable(request.response, { injector: config.dependencies.injector }),
-            ]).subscribe(([errorValue, responseValue]) => {
-                if (errorValue?.raw instanceof HttpErrorResponse) {
-                    eventsSubject.next({
-                        type: 'request-error',
-                        error: errorValue.raw,
-                        key,
-                        isSecure,
-                        request,
-                    });
+            // Drive repository events off the request's discrete, terminal event stream rather than
+            // recombining the `error` + `response` signals via combineLatest (which could observe stale
+            // pairings). Each settle emits exactly one terminal event.
+            const eventSubscription = request.events$.subscribe((event) => {
+                if (event.type === 'error') {
+                    if (event.error.raw instanceof HttpErrorResponse) {
+                        eventsSubject.next({ type: 'request-error', error: event.error.raw, key, isSecure, request });
+                    }
                 }
-                else if (responseValue !== null && !errorValue) {
-                    eventsSubject.next({
-                        type: 'request-success',
-                        key,
-                        isSecure,
-                        request,
-                    });
+                else if (event.type === HttpEventType.Response) {
+                    eventsSubject.next({ type: 'request-success', key, isSecure, request });
                 }
             });
             cache.set(key, {