@ethlete/query 6.0.0-next.10 → 6.0.0-next.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -0
- package/fesm2022/ethlete-query.mjs +302 -187
- package/fesm2022/ethlete-query.mjs.map +1 -1
- package/package.json +9 -9
- package/types/ethlete-query.d.ts +28 -3
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { isDevMode, DestroyRef, InjectionToken, inject, Injector, EnvironmentInjector, ErrorHandler,
|
|
2
|
+
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';
|
|
3
3
|
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';
|
|
4
|
-
import {
|
|
4
|
+
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';
|
|
5
5
|
import { toObservable, takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
|
|
6
6
|
import { HttpClient, HttpEventType, HttpErrorResponse, HttpHeaders, HttpStatusCode } from '@angular/common/http';
|
|
7
7
|
import { getActiveConsumer, setActiveConsumer } from '@angular/core/primitives/signals';
|
|
@@ -46,9 +46,6 @@ const createGqlExecuteFn = (executeOptions) => {
|
|
|
46
46
|
const reset = () => resetExecuteState({ executeState, executeOptions });
|
|
47
47
|
const exec = (executeArgs) => {
|
|
48
48
|
circularChecker.check();
|
|
49
|
-
// Make sure all effects are flushed before reading the args.
|
|
50
|
-
// A withArgs feature effect might still be pending otherwise resulting in the wrong args being read.
|
|
51
|
-
executeOptions.deps.effectScheduler.flush();
|
|
52
49
|
const { args = executeOptions.state.args(), options } = executeArgs ?? {};
|
|
53
50
|
const query = transformGql(executeOptions.creatorInternals.query);
|
|
54
51
|
let gqlParams = query(args?.variables);
|
|
@@ -133,7 +130,6 @@ const setupQueryDependencies = (options) => {
|
|
|
133
130
|
scopeDestroyRef: hostInjector.get(DestroyRef),
|
|
134
131
|
client: hostInjector.get(clientToken),
|
|
135
132
|
injector: undefined, // Will be set after injector creation
|
|
136
|
-
effectScheduler: hostInjector.get(_EffectScheduler),
|
|
137
133
|
ngErrorHandler: hostInjector.get(ErrorHandler),
|
|
138
134
|
httpClient: hostInjector.get(HttpClient),
|
|
139
135
|
};
|
|
@@ -307,17 +303,27 @@ const withArgs = (args) => {
|
|
|
307
303
|
return createQueryFeature({
|
|
308
304
|
type: QueryFeatureType.WITH_ARGS,
|
|
309
305
|
fn: (context) => {
|
|
310
|
-
|
|
306
|
+
// `state.args` is reactively backed by this source, so every reader (exec, polling,
|
|
307
|
+
// auto-refresh) always sees the latest value with no pending-effect window. Sentinels are
|
|
308
|
+
// resolved here: CLEAR -> null, `null` ("don't change") -> keep the previous value.
|
|
309
|
+
let previous = null;
|
|
310
|
+
context.state.subtle.setArgsSource(() => {
|
|
311
|
+
const value = args();
|
|
312
|
+
if (value === CLEAR_QUERY_ARGS) {
|
|
313
|
+
previous = null;
|
|
314
|
+
return null;
|
|
315
|
+
}
|
|
316
|
+
if (value === null)
|
|
317
|
+
return previous;
|
|
318
|
+
previous = value;
|
|
319
|
+
return value;
|
|
320
|
+
});
|
|
321
|
+
// Trigger (auto-)execution whenever the resolved args change.
|
|
311
322
|
nestedEffect(() => {
|
|
312
|
-
const currArgsNow =
|
|
323
|
+
const currArgsNow = context.state.args();
|
|
313
324
|
if (currArgsNow === null)
|
|
314
325
|
return;
|
|
315
326
|
untracked(() => {
|
|
316
|
-
if (currArgsNow === CLEAR_QUERY_ARGS) {
|
|
317
|
-
context.state.args.set(null);
|
|
318
|
-
return;
|
|
319
|
-
}
|
|
320
|
-
context.state.args.set(currArgsNow);
|
|
321
327
|
if (context.flags.shouldAutoExecute)
|
|
322
328
|
context.execute({ args: currArgsNow });
|
|
323
329
|
});
|
|
@@ -366,14 +372,9 @@ const withLogging = (options) => {
|
|
|
366
372
|
return createQueryFeature({
|
|
367
373
|
type: QueryFeatureType.WITH_LOGGING,
|
|
368
374
|
fn: (context) => {
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
return;
|
|
373
|
-
untracked(() => {
|
|
374
|
-
options.logFn(event);
|
|
375
|
-
});
|
|
376
|
-
}, { injector: context.deps.injector });
|
|
375
|
+
context.state.events$.pipe(takeUntilDestroyed(context.deps.destroyRef)).subscribe((event) => {
|
|
376
|
+
options.logFn(event);
|
|
377
|
+
});
|
|
377
378
|
},
|
|
378
379
|
});
|
|
379
380
|
};
|
|
@@ -382,14 +383,11 @@ const withErrorHandling = (options) => {
|
|
|
382
383
|
return createQueryFeature({
|
|
383
384
|
type: QueryFeatureType.WITH_ERROR_HANDLING,
|
|
384
385
|
fn: (context) => {
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
options.handler(error);
|
|
391
|
-
});
|
|
392
|
-
}, { injector: context.deps.injector });
|
|
386
|
+
context.state.events$
|
|
387
|
+
.pipe(filter((event) => event.type === 'error'), takeUntilDestroyed(context.deps.destroyRef))
|
|
388
|
+
.subscribe((event) => {
|
|
389
|
+
options.handler(event.error);
|
|
390
|
+
});
|
|
393
391
|
},
|
|
394
392
|
});
|
|
395
393
|
};
|
|
@@ -398,14 +396,11 @@ const withSuccessHandling = (options) => {
|
|
|
398
396
|
return createQueryFeature({
|
|
399
397
|
type: QueryFeatureType.WITH_SUCCESS_HANDLING,
|
|
400
398
|
fn: (context) => {
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
options.handler(context.state.response());
|
|
407
|
-
});
|
|
408
|
-
}, { injector: context.deps.injector });
|
|
399
|
+
context.state.events$
|
|
400
|
+
.pipe(filter((event) => event.type === HttpEventType.Response), takeUntilDestroyed(context.deps.destroyRef))
|
|
401
|
+
.subscribe(() => {
|
|
402
|
+
options.handler(context.state.response());
|
|
403
|
+
});
|
|
409
404
|
},
|
|
410
405
|
});
|
|
411
406
|
};
|
|
@@ -458,20 +453,42 @@ const withResponseUpdate = (options) => {
|
|
|
458
453
|
};
|
|
459
454
|
|
|
460
455
|
const setupQueryState = (options) => {
|
|
461
|
-
const request = signal(null,
|
|
462
|
-
|
|
456
|
+
const request = signal(null, /* @ts-ignore */
|
|
457
|
+
...(ngDevMode ? [{ debugName: "request" }] : /* istanbul ignore next */ []));
|
|
458
|
+
const rawResponse = linkedSignal(() => request()?.response() ?? null, /* @ts-ignore */
|
|
459
|
+
...(ngDevMode ? [{ debugName: "rawResponse" }] : /* istanbul ignore next */ []));
|
|
463
460
|
const response = computed(() => {
|
|
464
461
|
const raw = rawResponse();
|
|
465
462
|
if (raw === null)
|
|
466
463
|
return null;
|
|
467
464
|
return options.transformResponse ? options.transformResponse(raw) : raw;
|
|
468
|
-
},
|
|
469
|
-
|
|
470
|
-
const
|
|
471
|
-
|
|
472
|
-
const
|
|
473
|
-
|
|
474
|
-
const
|
|
465
|
+
}, /* @ts-ignore */
|
|
466
|
+
...(ngDevMode ? [{ debugName: "response" }] : /* istanbul ignore next */ []));
|
|
467
|
+
const loading = linkedSignal(() => request()?.loading() ?? null, /* @ts-ignore */
|
|
468
|
+
...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
|
|
469
|
+
const error = linkedSignal(() => request()?.error() ?? null, /* @ts-ignore */
|
|
470
|
+
...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
|
|
471
|
+
const latestHttpEvent = linkedSignal(() => request()?.currentEvent() ?? null, /* @ts-ignore */
|
|
472
|
+
...(ngDevMode ? [{ debugName: "latestHttpEvent" }] : /* istanbul ignore next */ []));
|
|
473
|
+
// `args` is reactively sourced: reads always reflect the latest value from the installed source
|
|
474
|
+
// (e.g. the `withArgs` feature), so there is no stale window between a source change and an
|
|
475
|
+
// effect writing it. It stays writable (reset / auth-error clear it via `.set(null)`); a manual
|
|
476
|
+
// set is overridden again the next time the source's dependencies change.
|
|
477
|
+
const argsSource = signal(() => null, /* @ts-ignore */
|
|
478
|
+
...(ngDevMode ? [{ debugName: "argsSource" }] : /* istanbul ignore next */ []));
|
|
479
|
+
const args = linkedSignal(() => argsSource()(), /* @ts-ignore */
|
|
480
|
+
...(ngDevMode ? [{ debugName: "args" }] : /* istanbul ignore next */ []));
|
|
481
|
+
const setArgsSource = (source) => argsSource.set(source);
|
|
482
|
+
const lastTimeExecutedAt = signal(null, /* @ts-ignore */
|
|
483
|
+
...(ngDevMode ? [{ debugName: "lastTimeExecutedAt" }] : /* istanbul ignore next */ []));
|
|
484
|
+
const lastTriggeredBy = signal(null, /* @ts-ignore */
|
|
485
|
+
...(ngDevMode ? [{ debugName: "lastTriggeredBy" }] : /* istanbul ignore next */ []));
|
|
486
|
+
const requestEvents$ = new Subject();
|
|
487
|
+
let requestEventsSubscription = Subscription.EMPTY;
|
|
488
|
+
const bindRequestEvents = (request) => {
|
|
489
|
+
requestEventsSubscription.unsubscribe();
|
|
490
|
+
requestEventsSubscription = request.events$.subscribe((event) => requestEvents$.next(event));
|
|
491
|
+
};
|
|
475
492
|
const executionState = computed(() => {
|
|
476
493
|
const currentResponse = response();
|
|
477
494
|
const currentError = error();
|
|
@@ -506,7 +523,8 @@ const setupQueryState = (options) => {
|
|
|
506
523
|
else {
|
|
507
524
|
return null;
|
|
508
525
|
}
|
|
509
|
-
},
|
|
526
|
+
}, /* @ts-ignore */
|
|
527
|
+
...(ngDevMode ? [{ debugName: "executionState" }] : /* istanbul ignore next */ []));
|
|
510
528
|
const state = {
|
|
511
529
|
rawResponse,
|
|
512
530
|
response,
|
|
@@ -517,9 +535,12 @@ const setupQueryState = (options) => {
|
|
|
517
535
|
lastTimeExecutedAt,
|
|
518
536
|
lastTriggeredBy,
|
|
519
537
|
executionState,
|
|
538
|
+
events$: requestEvents$.asObservable(),
|
|
520
539
|
subtle: {
|
|
521
540
|
request,
|
|
522
541
|
rawResponse,
|
|
542
|
+
bindRequestEvents,
|
|
543
|
+
setArgsSource,
|
|
523
544
|
},
|
|
524
545
|
};
|
|
525
546
|
return state;
|
|
@@ -530,7 +551,8 @@ const createQuerySnapshotFn = (options) => {
|
|
|
530
551
|
const context = injectQueryContext();
|
|
531
552
|
const snapshotFn = () => {
|
|
532
553
|
const snapshotState = setupQueryState({});
|
|
533
|
-
const isAlive = signal(true,
|
|
554
|
+
const isAlive = signal(true, /* @ts-ignore */
|
|
555
|
+
...(ngDevMode ? [{ debugName: "isAlive" }] : /* istanbul ignore next */ []));
|
|
534
556
|
const killEffectRef = effect(() => {
|
|
535
557
|
const currentLoading = state.loading();
|
|
536
558
|
const currentError = state.error();
|
|
@@ -746,6 +768,7 @@ const queryExecute = (options) => {
|
|
|
746
768
|
state.lastTimeExecutedAt.set(Date.now());
|
|
747
769
|
state.lastTriggeredBy.set(runQueryOptions?.triggeredBy ?? null);
|
|
748
770
|
state.subtle.request.set(request);
|
|
771
|
+
state.subtle.bindRequestEvents(request);
|
|
749
772
|
};
|
|
750
773
|
const circularQueryDependencyChecker = () => {
|
|
751
774
|
let lastTriggerTs = 0;
|
|
@@ -779,9 +802,6 @@ const createExecuteFn = (executeOptions) => {
|
|
|
779
802
|
const reset = () => resetExecuteState({ executeState, executeOptions });
|
|
780
803
|
const exec = (executeArgs) => {
|
|
781
804
|
circularChecker.check();
|
|
782
|
-
// Make sure all effects are flushed before reading the args.
|
|
783
|
-
// A withArgs feature effect might still be pending otherwise resulting in the wrong args being read.
|
|
784
|
-
executeOptions.deps.effectScheduler.flush();
|
|
785
805
|
const { args = executeOptions.state.args(), options } = executeArgs ?? {};
|
|
786
806
|
queryExecute({ executeOptions, executeState, args, options });
|
|
787
807
|
};
|
|
@@ -1539,18 +1559,28 @@ const SPEED_BUFFER_TIME_IN_MS = 2000;
|
|
|
1539
1559
|
const createHttpRequest = (options) => {
|
|
1540
1560
|
let currentStreamSubscription = Subscription.EMPTY;
|
|
1541
1561
|
const { args, clientOptions, dependencies } = options;
|
|
1542
|
-
const currentEvent = signal(null,
|
|
1543
|
-
|
|
1544
|
-
const
|
|
1545
|
-
const
|
|
1546
|
-
|
|
1547
|
-
const
|
|
1548
|
-
|
|
1549
|
-
const
|
|
1562
|
+
const currentEvent = signal(null, /* @ts-ignore */
|
|
1563
|
+
...(ngDevMode ? [{ debugName: "currentEvent" }] : /* istanbul ignore next */ []));
|
|
1564
|
+
const event$ = new Subject();
|
|
1565
|
+
const loading = signal(null, /* @ts-ignore */
|
|
1566
|
+
...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
|
|
1567
|
+
const error = signal(null, /* @ts-ignore */
|
|
1568
|
+
...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
|
|
1569
|
+
const response = signal(null, /* @ts-ignore */
|
|
1570
|
+
...(ngDevMode ? [{ debugName: "response" }] : /* istanbul ignore next */ []));
|
|
1571
|
+
const lastLoadEventTime = signal(0, /* @ts-ignore */
|
|
1572
|
+
...(ngDevMode ? [{ debugName: "lastLoadEventTime" }] : /* istanbul ignore next */ []));
|
|
1573
|
+
const lastLoadEventAmount = signal(0, /* @ts-ignore */
|
|
1574
|
+
...(ngDevMode ? [{ debugName: "lastLoadEventAmount" }] : /* istanbul ignore next */ []));
|
|
1575
|
+
const lastExecuteTime = signal(0, /* @ts-ignore */
|
|
1576
|
+
...(ngDevMode ? [{ debugName: "lastExecuteTime" }] : /* istanbul ignore next */ []));
|
|
1577
|
+
const expiresIn = signal(null, /* @ts-ignore */
|
|
1578
|
+
...(ngDevMode ? [{ debugName: "expiresIn" }] : /* istanbul ignore next */ []));
|
|
1550
1579
|
const isStale = computed(() => {
|
|
1551
1580
|
const expiresInTs = expiresIn();
|
|
1552
1581
|
return expiresInTs === null || expiresInTs < Date.now();
|
|
1553
|
-
},
|
|
1582
|
+
}, /* @ts-ignore */
|
|
1583
|
+
...(ngDevMode ? [{ debugName: "isStale" }] : /* istanbul ignore next */ []));
|
|
1554
1584
|
const createStream = () => {
|
|
1555
1585
|
const headers = typeof args?.headers === 'function' ? args.headers() : args?.headers;
|
|
1556
1586
|
return dependencies.httpClient
|
|
@@ -1601,11 +1631,10 @@ const createHttpRequest = (options) => {
|
|
|
1601
1631
|
return true;
|
|
1602
1632
|
};
|
|
1603
1633
|
const destroy = () => {
|
|
1604
|
-
|
|
1605
|
-
return false;
|
|
1606
|
-
}
|
|
1634
|
+
const wasActive = !currentStreamSubscription.closed;
|
|
1607
1635
|
currentStreamSubscription.unsubscribe();
|
|
1608
|
-
|
|
1636
|
+
event$.complete();
|
|
1637
|
+
return wasActive;
|
|
1609
1638
|
};
|
|
1610
1639
|
const updateState = (event) => {
|
|
1611
1640
|
switch (event.type) {
|
|
@@ -1635,12 +1664,15 @@ const createHttpRequest = (options) => {
|
|
|
1635
1664
|
break;
|
|
1636
1665
|
}
|
|
1637
1666
|
currentEvent.set(event);
|
|
1667
|
+
event$.next(event);
|
|
1638
1668
|
};
|
|
1639
1669
|
const updateErrorState = (errorResponse) => {
|
|
1640
1670
|
const errorRes = createQueryErrorResponse(errorResponse);
|
|
1641
1671
|
error.set(errorRes);
|
|
1642
1672
|
loading.set(null);
|
|
1643
|
-
|
|
1673
|
+
const errorEvent = { type: 'error', error: errorRes };
|
|
1674
|
+
currentEvent.set(errorEvent);
|
|
1675
|
+
event$.next(errorEvent);
|
|
1644
1676
|
options.dependencies.ngErrorHandler.handleError(errorRes.raw);
|
|
1645
1677
|
};
|
|
1646
1678
|
const updateLoadingState = (event) => {
|
|
@@ -1680,6 +1712,7 @@ const createHttpRequest = (options) => {
|
|
|
1680
1712
|
error: error.asReadonly(),
|
|
1681
1713
|
response: response.asReadonly(),
|
|
1682
1714
|
currentEvent: currentEvent.asReadonly(),
|
|
1715
|
+
events$: event$.asObservable(),
|
|
1683
1716
|
isStale,
|
|
1684
1717
|
};
|
|
1685
1718
|
return httpRequest;
|
|
@@ -1697,9 +1730,12 @@ const createQueryStack = (options) => {
|
|
|
1697
1730
|
return { queries, lastQuery };
|
|
1698
1731
|
}, transform, argsKeyFn, deduplicateArgs, maxQueries = Infinity, removeStrategy = 'oldest', } = options ?? {};
|
|
1699
1732
|
const injector = inject(Injector);
|
|
1700
|
-
const queries = signal([],
|
|
1701
|
-
|
|
1702
|
-
const
|
|
1733
|
+
const queries = signal([], /* @ts-ignore */
|
|
1734
|
+
...(ngDevMode ? [{ debugName: "queries" }] : /* istanbul ignore next */ []));
|
|
1735
|
+
const lastQuery = signal(null, /* @ts-ignore */
|
|
1736
|
+
...(ngDevMode ? [{ debugName: "lastQuery" }] : /* istanbul ignore next */ []));
|
|
1737
|
+
const firstQuery = computed(() => queries()[0] ?? null, /* @ts-ignore */
|
|
1738
|
+
...(ngDevMode ? [{ debugName: "firstQuery" }] : /* istanbul ignore next */ []));
|
|
1703
1739
|
const hasWithArgsFeature = features.some((f) => f.type == QueryFeatureType.WITH_ARGS);
|
|
1704
1740
|
const hasWithOptimisticUpdateFeature = features.some((f) => f.type == QueryFeatureType.WITH_RESPONSE_UPDATE);
|
|
1705
1741
|
if (hasWithArgsFeature) {
|
|
@@ -1781,23 +1817,29 @@ const createQueryStack = (options) => {
|
|
|
1781
1817
|
untracked(() => clear());
|
|
1782
1818
|
});
|
|
1783
1819
|
effect(() => runWithArgs(args(dependencies?.())));
|
|
1784
|
-
const anyLoading = computed(() => queries().some((q) => q.loading()),
|
|
1785
|
-
|
|
1820
|
+
const anyLoading = computed(() => queries().some((q) => q.loading()), /* @ts-ignore */
|
|
1821
|
+
...(ngDevMode ? [{ debugName: "anyLoading" }] : /* istanbul ignore next */ []));
|
|
1822
|
+
const loadingCount = computed(() => queries().filter((q) => q.loading()).length, /* @ts-ignore */
|
|
1823
|
+
...(ngDevMode ? [{ debugName: "loadingCount" }] : /* istanbul ignore next */ []));
|
|
1786
1824
|
const allLoading = computed(() => {
|
|
1787
1825
|
const qs = queries();
|
|
1788
1826
|
return qs.length > 0 && qs.every((q) => q.loading());
|
|
1789
|
-
},
|
|
1827
|
+
}, /* @ts-ignore */
|
|
1828
|
+
...(ngDevMode ? [{ debugName: "allLoading" }] : /* istanbul ignore next */ []));
|
|
1790
1829
|
const loadingProgress = computed(() => {
|
|
1791
1830
|
const total = queries().length;
|
|
1792
1831
|
const loaded = queries().filter((q) => !q.loading()).length;
|
|
1793
1832
|
return { loaded, total };
|
|
1794
|
-
},
|
|
1833
|
+
}, /* @ts-ignore */
|
|
1834
|
+
...(ngDevMode ? [{ debugName: "loadingProgress" }] : /* istanbul ignore next */ []));
|
|
1795
1835
|
const anyError = computed(() => queries()
|
|
1796
1836
|
.map((q) => q.error())
|
|
1797
|
-
.find((e) => e !== null) ?? null,
|
|
1837
|
+
.find((e) => e !== null) ?? null, /* @ts-ignore */
|
|
1838
|
+
...(ngDevMode ? [{ debugName: "anyError" }] : /* istanbul ignore next */ []));
|
|
1798
1839
|
const errors = computed(() => queries()
|
|
1799
1840
|
.map((q) => q.error())
|
|
1800
|
-
.filter((e) => e !== null),
|
|
1841
|
+
.filter((e) => e !== null), /* @ts-ignore */
|
|
1842
|
+
...(ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []));
|
|
1801
1843
|
const response = computed(() => {
|
|
1802
1844
|
const responses = queries().map((q) => q.response());
|
|
1803
1845
|
return transform?.(responses) ?? responses;
|
|
@@ -1892,12 +1934,18 @@ const fakePaginationAdapter = (totalHits = 10) => {
|
|
|
1892
1934
|
};
|
|
1893
1935
|
const createPagedQueryStack = (options) => {
|
|
1894
1936
|
const { responseNormalizer, queryCreator, features } = options;
|
|
1895
|
-
const currentPageArgs = signal(null,
|
|
1896
|
-
|
|
1897
|
-
const
|
|
1898
|
-
|
|
1899
|
-
const
|
|
1900
|
-
|
|
1937
|
+
const currentPageArgs = signal(null, /* @ts-ignore */
|
|
1938
|
+
...(ngDevMode ? [{ debugName: "currentPageArgs" }] : /* istanbul ignore next */ []));
|
|
1939
|
+
const initialPage = signal(options.initialPage ?? 1, /* @ts-ignore */
|
|
1940
|
+
...(ngDevMode ? [{ debugName: "initialPage" }] : /* istanbul ignore next */ []));
|
|
1941
|
+
const loadedMinPage = signal(initialPage(), /* @ts-ignore */
|
|
1942
|
+
...(ngDevMode ? [{ debugName: "loadedMinPage" }] : /* istanbul ignore next */ []));
|
|
1943
|
+
const loadedMaxPage = signal(initialPage(), /* @ts-ignore */
|
|
1944
|
+
...(ngDevMode ? [{ debugName: "loadedMaxPage" }] : /* istanbul ignore next */ []));
|
|
1945
|
+
const resetTrigger = signal(0, /* @ts-ignore */
|
|
1946
|
+
...(ngDevMode ? [{ debugName: "resetTrigger" }] : /* istanbul ignore next */ []));
|
|
1947
|
+
const pageDirection = signal('next', /* @ts-ignore */
|
|
1948
|
+
...(ngDevMode ? [{ debugName: "pageDirection" }] : /* istanbul ignore next */ []));
|
|
1901
1949
|
const stack = createQueryStack({
|
|
1902
1950
|
args: () => null,
|
|
1903
1951
|
queryCreator,
|
|
@@ -1936,22 +1984,26 @@ const createPagedQueryStack = (options) => {
|
|
|
1936
1984
|
if (!res)
|
|
1937
1985
|
return null;
|
|
1938
1986
|
return responseNormalizer(res, all);
|
|
1939
|
-
},
|
|
1987
|
+
}, /* @ts-ignore */
|
|
1988
|
+
...(ngDevMode ? [{ debugName: "maxPagination" }] : /* istanbul ignore next */ []));
|
|
1940
1989
|
const minPagination = computed(() => {
|
|
1941
1990
|
const res = stack.firstQuery()?.response();
|
|
1942
1991
|
const all = stack.response();
|
|
1943
1992
|
if (!res)
|
|
1944
1993
|
return null;
|
|
1945
1994
|
return responseNormalizer(res, all);
|
|
1946
|
-
},
|
|
1995
|
+
}, /* @ts-ignore */
|
|
1996
|
+
...(ngDevMode ? [{ debugName: "minPagination" }] : /* istanbul ignore next */ []));
|
|
1947
1997
|
const isFirstPageLoaded = computed(() => {
|
|
1948
1998
|
const min = minPagination();
|
|
1949
1999
|
return min ? loadedMinPage() === min.currentPage : false;
|
|
1950
|
-
},
|
|
2000
|
+
}, /* @ts-ignore */
|
|
2001
|
+
...(ngDevMode ? [{ debugName: "isFirstPageLoaded" }] : /* istanbul ignore next */ []));
|
|
1951
2002
|
const isLastPageLoaded = computed(() => {
|
|
1952
2003
|
const max = maxPagination();
|
|
1953
2004
|
return max ? loadedMaxPage() === max.totalPages : false;
|
|
1954
|
-
},
|
|
2005
|
+
}, /* @ts-ignore */
|
|
2006
|
+
...(ngDevMode ? [{ debugName: "isLastPageLoaded" }] : /* istanbul ignore next */ []));
|
|
1955
2007
|
const fetchPreviousPage = () => {
|
|
1956
2008
|
const page = loadedMinPage() - 1;
|
|
1957
2009
|
const allResponses = stack.response();
|
|
@@ -2027,18 +2079,22 @@ const createPagedQueryStack = (options) => {
|
|
|
2027
2079
|
if (!currentMinPagination)
|
|
2028
2080
|
return false;
|
|
2029
2081
|
return loadedMinPage() > 1;
|
|
2030
|
-
},
|
|
2082
|
+
}, /* @ts-ignore */
|
|
2083
|
+
...(ngDevMode ? [{ debugName: "canFetchPreviousPage" }] : /* istanbul ignore next */ []));
|
|
2031
2084
|
const canFetchNextPage = computed(() => {
|
|
2032
2085
|
const currentMaxPagination = maxPagination();
|
|
2033
2086
|
return currentMaxPagination ? loadedMaxPage() < currentMaxPagination.totalPages : false;
|
|
2034
|
-
},
|
|
2087
|
+
}, /* @ts-ignore */
|
|
2088
|
+
...(ngDevMode ? [{ debugName: "canFetchNextPage" }] : /* istanbul ignore next */ []));
|
|
2035
2089
|
const items = computed(() => {
|
|
2036
2090
|
const res = stack.response();
|
|
2037
2091
|
return res.map((r) => responseNormalizer(r, res).items).flat();
|
|
2038
|
-
},
|
|
2092
|
+
}, /* @ts-ignore */
|
|
2093
|
+
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
2039
2094
|
const isFirstLoad = computed(() => {
|
|
2040
2095
|
return stack.queries().length === 1 && !!stack.lastQuery()?.loading();
|
|
2041
|
-
},
|
|
2096
|
+
}, /* @ts-ignore */
|
|
2097
|
+
...(ngDevMode ? [{ debugName: "isFirstLoad" }] : /* istanbul ignore next */ []));
|
|
2042
2098
|
const execute = (options) => {
|
|
2043
2099
|
const whereFn = options?.where;
|
|
2044
2100
|
if (whereFn) {
|
|
@@ -2211,7 +2267,8 @@ function effectComputed(computation, injector) {
|
|
|
2211
2267
|
// Ignore errors in the initial computation
|
|
2212
2268
|
// Angular might throw an error if required inputs are read but not available yet
|
|
2213
2269
|
}
|
|
2214
|
-
const lastResult = signal(initialData,
|
|
2270
|
+
const lastResult = signal(initialData, /* @ts-ignore */
|
|
2271
|
+
...(ngDevMode ? [{ debugName: "lastResult" }] : /* istanbul ignore next */ []));
|
|
2215
2272
|
effect(() => {
|
|
2216
2273
|
const data = runInInjectionContext(injector, () => computation());
|
|
2217
2274
|
untracked(() => {
|
|
@@ -2262,7 +2319,8 @@ function queryStateSignal(source, options) {
|
|
|
2262
2319
|
})), {
|
|
2263
2320
|
initialValue: null,
|
|
2264
2321
|
});
|
|
2265
|
-
const rwSignal = linkedSignal(roSignal,
|
|
2322
|
+
const rwSignal = linkedSignal(roSignal, /* @ts-ignore */
|
|
2323
|
+
...(ngDevMode ? [{ debugName: "rwSignal" }] : /* istanbul ignore next */ []));
|
|
2266
2324
|
return rwSignal;
|
|
2267
2325
|
}
|
|
2268
2326
|
function queryStateResponseSignal(source, options) {
|
|
@@ -2270,7 +2328,8 @@ function queryStateResponseSignal(source, options) {
|
|
|
2270
2328
|
const dataSignal = computed(() => {
|
|
2271
2329
|
const state = s();
|
|
2272
2330
|
return isQueryStateSuccess(state) ? state.response : null;
|
|
2273
|
-
},
|
|
2331
|
+
}, /* @ts-ignore */
|
|
2332
|
+
...(ngDevMode ? [{ debugName: "dataSignal" }] : /* istanbul ignore next */ []));
|
|
2274
2333
|
dataSignal['reset'] = () => {
|
|
2275
2334
|
s.set(null);
|
|
2276
2335
|
};
|
|
@@ -2353,7 +2412,8 @@ class V2QueryCreator {
|
|
|
2353
2412
|
};
|
|
2354
2413
|
this.createSignal = (initialValue, config) => {
|
|
2355
2414
|
assertInInjectionContext(this.createSignal);
|
|
2356
|
-
const _signal = signal(initialValue ?? null,
|
|
2415
|
+
const _signal = signal(initialValue ?? null, /* @ts-ignore */
|
|
2416
|
+
...(ngDevMode ? [{ debugName: "_signal" }] : /* istanbul ignore next */ []));
|
|
2357
2417
|
addQueryContainerHandling(toObservable(_signal), () => _signal(), config);
|
|
2358
2418
|
return _signal;
|
|
2359
2419
|
};
|
|
@@ -2623,11 +2683,14 @@ const createSecureExecuteFactory = (options) => {
|
|
|
2623
2683
|
const circularChecker = circularQueryDependencyChecker();
|
|
2624
2684
|
let authQuerySubscription = Subscription.EMPTY;
|
|
2625
2685
|
let tokenRefreshSubscription = Subscription.EMPTY;
|
|
2686
|
+
let tokenWaitSubscription = Subscription.EMPTY;
|
|
2626
2687
|
const reset = () => {
|
|
2627
2688
|
authQuerySubscription.unsubscribe();
|
|
2628
2689
|
authQuerySubscription = Subscription.EMPTY;
|
|
2629
2690
|
tokenRefreshSubscription.unsubscribe();
|
|
2630
2691
|
tokenRefreshSubscription = Subscription.EMPTY;
|
|
2692
|
+
tokenWaitSubscription.unsubscribe();
|
|
2693
|
+
tokenWaitSubscription = Subscription.EMPTY;
|
|
2631
2694
|
resetExecuteState({
|
|
2632
2695
|
executeState,
|
|
2633
2696
|
executeOptions: { deps: options.deps, state: options.state },
|
|
@@ -2668,11 +2731,27 @@ const createSecureExecuteFactory = (options) => {
|
|
|
2668
2731
|
},
|
|
2669
2732
|
}, tokens, headers, executeState);
|
|
2670
2733
|
};
|
|
2734
|
+
// The auth query completing and the access token being populated happen on two
|
|
2735
|
+
// different reactive timelines: the token is set by a separate token-extraction
|
|
2736
|
+
// effect (see `setupBearerQueryRegistry`), and for cross-client / secure auth
|
|
2737
|
+
// queries the completion is delivered through several nested `toObservable` hops.
|
|
2738
|
+
// Calling `authAndExec` purely because the auth query is "done" therefore races
|
|
2739
|
+
// the token and can run while it is still null. Gate on the token signal instead:
|
|
2740
|
+
// execute immediately if it is already available, otherwise wait for it.
|
|
2741
|
+
const authAndExecWhenTokenReady = (executeArgs) => {
|
|
2742
|
+
if (options.authProvider.accessToken()) {
|
|
2743
|
+
authAndExec(executeArgs);
|
|
2744
|
+
return;
|
|
2745
|
+
}
|
|
2746
|
+
tokenWaitSubscription.unsubscribe();
|
|
2747
|
+
tokenWaitSubscription = toObservable(options.authProvider.accessToken, {
|
|
2748
|
+
injector: options.deps.injector,
|
|
2749
|
+
})
|
|
2750
|
+
.pipe(filter(Boolean), take(1), tap(() => authAndExec(executeArgs)))
|
|
2751
|
+
.subscribe();
|
|
2752
|
+
};
|
|
2671
2753
|
const exec = (executeArgs) => {
|
|
2672
2754
|
circularChecker.check();
|
|
2673
|
-
// Make sure all effects are flushed before reading the args.
|
|
2674
|
-
// A withArgs feature effect might still be pending otherwise resulting in the wrong args being read.
|
|
2675
|
-
options.deps.effectScheduler.flush();
|
|
2676
2755
|
const execArgsWithDefaults = {
|
|
2677
2756
|
args: executeArgs?.args ?? options.state.args(),
|
|
2678
2757
|
options: executeArgs?.options,
|
|
@@ -2681,6 +2760,8 @@ const createSecureExecuteFactory = (options) => {
|
|
|
2681
2760
|
authQuerySubscription = Subscription.EMPTY;
|
|
2682
2761
|
tokenRefreshSubscription.unsubscribe();
|
|
2683
2762
|
tokenRefreshSubscription = Subscription.EMPTY;
|
|
2763
|
+
tokenWaitSubscription.unsubscribe();
|
|
2764
|
+
tokenWaitSubscription = Subscription.EMPTY;
|
|
2684
2765
|
tokenRefreshSubscription = options.authProvider.afterTokenRefresh$
|
|
2685
2766
|
.pipe(filter(() => {
|
|
2686
2767
|
const currentError = options.state.error();
|
|
@@ -2708,14 +2789,14 @@ const createSecureExecuteFactory = (options) => {
|
|
|
2708
2789
|
error(query);
|
|
2709
2790
|
}
|
|
2710
2791
|
else if (query.response()) {
|
|
2711
|
-
|
|
2792
|
+
authAndExecWhenTokenReady(execArgsWithDefaults);
|
|
2712
2793
|
}
|
|
2713
2794
|
}));
|
|
2714
2795
|
}))
|
|
2715
2796
|
.subscribe();
|
|
2716
2797
|
}
|
|
2717
2798
|
else if (authQuery.response()) {
|
|
2718
|
-
|
|
2799
|
+
authAndExecWhenTokenReady(execArgsWithDefaults);
|
|
2719
2800
|
}
|
|
2720
2801
|
else if (authQuery.error()) {
|
|
2721
2802
|
error(authQuery);
|
|
@@ -2960,7 +3041,8 @@ class LegacyQuery {
|
|
|
2960
3041
|
});
|
|
2961
3042
|
}
|
|
2962
3043
|
});
|
|
2963
|
-
},
|
|
3044
|
+
}, /* @ts-ignore */
|
|
3045
|
+
...(ngDevMode ? [{ debugName: "storeSyncEffect" }] : /* istanbul ignore next */ []));
|
|
2964
3046
|
/**
|
|
2965
3047
|
* @internal
|
|
2966
3048
|
*/
|
|
@@ -3113,7 +3195,8 @@ class LegacyQueryCreator {
|
|
|
3113
3195
|
legacyQuery.destroy();
|
|
3114
3196
|
destroyEffect.destroy();
|
|
3115
3197
|
}
|
|
3116
|
-
},
|
|
3198
|
+
}, /* @ts-ignore */
|
|
3199
|
+
...(ngDevMode ? [{ debugName: "destroyEffect" }] : /* istanbul ignore next */ []));
|
|
3117
3200
|
}
|
|
3118
3201
|
return legacyQuery;
|
|
3119
3202
|
});
|
|
@@ -3125,7 +3208,8 @@ class LegacyQueryCreator {
|
|
|
3125
3208
|
return subject;
|
|
3126
3209
|
};
|
|
3127
3210
|
this.createSignal = (initialValue, config) => {
|
|
3128
|
-
const _signal = signal(initialValue ?? null,
|
|
3211
|
+
const _signal = signal(initialValue ?? null, /* @ts-ignore */
|
|
3212
|
+
...(ngDevMode ? [{ debugName: "_signal" }] : /* istanbul ignore next */ []));
|
|
3129
3213
|
addQueryContainerHandling(toObservable(_signal), () => _signal(), config);
|
|
3130
3214
|
return _signal;
|
|
3131
3215
|
};
|
|
@@ -3272,7 +3356,8 @@ const createQueryCollectionSubject = (queryMap, config) => {
|
|
|
3272
3356
|
};
|
|
3273
3357
|
const createQueryCollectionSignal = (queryMap, config) => {
|
|
3274
3358
|
assertInInjectionContext(createQueryCollectionSignal);
|
|
3275
|
-
const _signal = signal(null,
|
|
3359
|
+
const _signal = signal(null, /* @ts-ignore */
|
|
3360
|
+
...(ngDevMode ? [{ debugName: "_signal" }] : /* istanbul ignore next */ []));
|
|
3276
3361
|
addQueryContainerHandling(toObservable(_signal).pipe(map((s) => s?.query ?? null)), () => _signal()?.query ?? null, config);
|
|
3277
3362
|
return _signal;
|
|
3278
3363
|
};
|
|
@@ -4006,7 +4091,8 @@ class V2BearerAuthProvider {
|
|
|
4006
4091
|
}
|
|
4007
4092
|
|
|
4008
4093
|
const [provideInfinityQueryResponseDelay, injectInfinityQueryResponseDelay] = createProvider(() => {
|
|
4009
|
-
const enabled = signal(false,
|
|
4094
|
+
const enabled = signal(false, /* @ts-ignore */
|
|
4095
|
+
...(ngDevMode ? [{ debugName: "enabled" }] : /* istanbul ignore next */ []));
|
|
4010
4096
|
const enabled$ = toObservable(enabled);
|
|
4011
4097
|
return {
|
|
4012
4098
|
enabled,
|
|
@@ -4317,13 +4403,13 @@ class InfinityQueryDirective {
|
|
|
4317
4403
|
this._viewContext.currentQuery = null;
|
|
4318
4404
|
this._data$.next([]);
|
|
4319
4405
|
}
|
|
4320
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4321
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
4406
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: InfinityQueryDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4407
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: InfinityQueryDirective, isStandalone: true, selector: "[etInfinityQuery]", inputs: { infinityQuery: ["etInfinityQuery", "infinityQuery"] }, providers: [
|
|
4322
4408
|
{ provide: INFINITY_QUERY_TOKEN, useExisting: InfinityQueryDirective },
|
|
4323
4409
|
provideInfinityQueryResponseDelay(),
|
|
4324
4410
|
], exportAs: ["etInfinityQuery"], ngImport: i0 }); }
|
|
4325
4411
|
}
|
|
4326
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4412
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: InfinityQueryDirective, decorators: [{
|
|
4327
4413
|
type: Directive,
|
|
4328
4414
|
args: [{
|
|
4329
4415
|
selector: '[etInfinityQuery]',
|
|
@@ -4345,10 +4431,13 @@ class InfinityQueryTriggerDirective {
|
|
|
4345
4431
|
this._destroy = new Subject();
|
|
4346
4432
|
this._observer = null;
|
|
4347
4433
|
this.click$ = fromEvent(this._elementRef.nativeElement, 'click');
|
|
4348
|
-
this.scrollContainerSelector = input(null,
|
|
4434
|
+
this.scrollContainerSelector = input(null, /* @ts-ignore */
|
|
4435
|
+
...(ngDevMode ? [{ debugName: "scrollContainerSelector" }] : /* istanbul ignore next */ []));
|
|
4349
4436
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
4350
|
-
this.infinityQueryOverride = input(null,
|
|
4351
|
-
|
|
4437
|
+
this.infinityQueryOverride = input(null, /* @ts-ignore */
|
|
4438
|
+
...(ngDevMode ? [{ debugName: "infinityQueryOverride" }] : /* istanbul ignore next */ []));
|
|
4439
|
+
this.infinityQuery = computed(() => this.infinityQueryOverride() ?? this._infinityQuery, /* @ts-ignore */
|
|
4440
|
+
...(ngDevMode ? [{ debugName: "infinityQuery" }] : /* istanbul ignore next */ []));
|
|
4352
4441
|
}
|
|
4353
4442
|
ngOnInit() {
|
|
4354
4443
|
const isInteractive = this._elementRef.nativeElement.tagName === 'BUTTON';
|
|
@@ -4380,10 +4469,10 @@ class InfinityQueryTriggerDirective {
|
|
|
4380
4469
|
});
|
|
4381
4470
|
this._observer.observe(this._elementRef.nativeElement);
|
|
4382
4471
|
}
|
|
4383
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4384
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
4472
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: InfinityQueryTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4473
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: InfinityQueryTriggerDirective, isStandalone: true, selector: "[etInfinityQueryTrigger], et-infinity-query-trigger", inputs: { scrollContainerSelector: { classPropertyName: "scrollContainerSelector", publicName: "scrollContainerSelector", isSignal: true, isRequired: false, transformFunction: null }, infinityQueryOverride: { classPropertyName: "infinityQueryOverride", publicName: "infinityQueryOverride", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
|
|
4385
4474
|
}
|
|
4386
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4475
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: InfinityQueryTriggerDirective, decorators: [{
|
|
4387
4476
|
type: Directive,
|
|
4388
4477
|
args: [{
|
|
4389
4478
|
selector: '[etInfinityQueryTrigger], et-infinity-query-trigger',
|
|
@@ -4469,10 +4558,10 @@ class QueryDirective {
|
|
|
4469
4558
|
});
|
|
4470
4559
|
});
|
|
4471
4560
|
}
|
|
4472
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4473
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
4561
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: QueryDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4562
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: QueryDirective, isStandalone: true, selector: "[etQuery]", inputs: { query: { classPropertyName: "query", publicName: "etQuery", isSignal: true, isRequired: true, transformFunction: null }, cache: { classPropertyName: "cache", publicName: "etQueryCache", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
|
|
4474
4563
|
}
|
|
4475
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4564
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: QueryDirective, decorators: [{
|
|
4476
4565
|
type: Directive,
|
|
4477
4566
|
args: [{
|
|
4478
4567
|
selector: '[etQuery]',
|
|
@@ -4493,10 +4582,10 @@ class QueryShortNamePipe {
|
|
|
4493
4582
|
}
|
|
4494
4583
|
return route;
|
|
4495
4584
|
}
|
|
4496
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4497
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
4585
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: QueryShortNamePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
4586
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: QueryShortNamePipe, isStandalone: true, name: "queryShortName" }); }
|
|
4498
4587
|
}
|
|
4499
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4588
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: QueryShortNamePipe, decorators: [{
|
|
4500
4589
|
type: Pipe,
|
|
4501
4590
|
args: [{ name: 'queryShortName' }]
|
|
4502
4591
|
}] });
|
|
@@ -4518,19 +4607,30 @@ class QueryDevtoolsComponent {
|
|
|
4518
4607
|
this._cdr = inject(ChangeDetectorRef);
|
|
4519
4608
|
this._destroy$ = createDestroy();
|
|
4520
4609
|
this.queryClientConfigs = inject(QUERY_CLIENT_DEVTOOLS_TOKEN);
|
|
4521
|
-
this.isOpen = signal(false,
|
|
4522
|
-
|
|
4523
|
-
this.
|
|
4524
|
-
|
|
4525
|
-
this.
|
|
4526
|
-
|
|
4527
|
-
this.
|
|
4528
|
-
|
|
4529
|
-
this.
|
|
4530
|
-
|
|
4610
|
+
this.isOpen = signal(false, /* @ts-ignore */
|
|
4611
|
+
...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
|
|
4612
|
+
this.isTranslucent = signal(false, /* @ts-ignore */
|
|
4613
|
+
...(ngDevMode ? [{ debugName: "isTranslucent" }] : /* istanbul ignore next */ []));
|
|
4614
|
+
this.snapLayout = signal('full', /* @ts-ignore */
|
|
4615
|
+
...(ngDevMode ? [{ debugName: "snapLayout" }] : /* istanbul ignore next */ []));
|
|
4616
|
+
this.queryListMode = signal('live', /* @ts-ignore */
|
|
4617
|
+
...(ngDevMode ? [{ debugName: "queryListMode" }] : /* istanbul ignore next */ []));
|
|
4618
|
+
this.viewMode = signal('query', /* @ts-ignore */
|
|
4619
|
+
...(ngDevMode ? [{ debugName: "viewMode" }] : /* istanbul ignore next */ []));
|
|
4620
|
+
this.showResponse = signal(false, /* @ts-ignore */
|
|
4621
|
+
...(ngDevMode ? [{ debugName: "showResponse" }] : /* istanbul ignore next */ []));
|
|
4622
|
+
this.showRawResponse = signal(false, /* @ts-ignore */
|
|
4623
|
+
...(ngDevMode ? [{ debugName: "showRawResponse" }] : /* istanbul ignore next */ []));
|
|
4624
|
+
this.showQueryConfig = signal(false, /* @ts-ignore */
|
|
4625
|
+
...(ngDevMode ? [{ debugName: "showQueryConfig" }] : /* istanbul ignore next */ []));
|
|
4626
|
+
this.showEntityStoreValue = signal(false, /* @ts-ignore */
|
|
4627
|
+
...(ngDevMode ? [{ debugName: "showEntityStoreValue" }] : /* istanbul ignore next */ []));
|
|
4628
|
+
this.showArguments = signal(false, /* @ts-ignore */
|
|
4629
|
+
...(ngDevMode ? [{ debugName: "showArguments" }] : /* istanbul ignore next */ []));
|
|
4531
4630
|
this.selectedClientIdCtrl = new FormControl(0);
|
|
4532
4631
|
this.selectedClientId = toSignal(this.selectedClientIdCtrl.valueChanges.pipe(startWith(this.selectedClientIdCtrl.value)));
|
|
4533
|
-
this.selectedQueryId = signal(null,
|
|
4632
|
+
this.selectedQueryId = signal(null, /* @ts-ignore */
|
|
4633
|
+
...(ngDevMode ? [{ debugName: "selectedQueryId" }] : /* istanbul ignore next */ []));
|
|
4534
4634
|
this.selectedClientConfig = computed(() => {
|
|
4535
4635
|
if (this.queryClientConfigs.length === 1) {
|
|
4536
4636
|
return this.queryClientConfigs[0];
|
|
@@ -4541,11 +4641,13 @@ class QueryDevtoolsComponent {
|
|
|
4541
4641
|
return this.queryClientConfigs[0];
|
|
4542
4642
|
}
|
|
4543
4643
|
return cfg;
|
|
4544
|
-
},
|
|
4644
|
+
}, /* @ts-ignore */
|
|
4645
|
+
...(ngDevMode ? [{ debugName: "selectedClientConfig" }] : /* istanbul ignore next */ []));
|
|
4545
4646
|
this.queryStore = computed(() => {
|
|
4546
4647
|
const config = this.selectedClientConfig();
|
|
4547
4648
|
return config.client._store;
|
|
4548
|
-
},
|
|
4649
|
+
}, /* @ts-ignore */
|
|
4650
|
+
...(ngDevMode ? [{ debugName: "queryStore" }] : /* istanbul ignore next */ []));
|
|
4549
4651
|
this.queryStore$ = toObservable(this.queryStore);
|
|
4550
4652
|
this._queries$ = new BehaviorSubject([]);
|
|
4551
4653
|
this.queries = toSignal(this._queries$);
|
|
@@ -4559,14 +4661,16 @@ class QueryDevtoolsComponent {
|
|
|
4559
4661
|
return this.queries()?.find((q) => q._id === id) ?? null;
|
|
4560
4662
|
}
|
|
4561
4663
|
return this.queryHistory$.getValue()?.find((q) => q._id === id) ?? null;
|
|
4562
|
-
},
|
|
4664
|
+
}, /* @ts-ignore */
|
|
4665
|
+
...(ngDevMode ? [{ debugName: "selectedQuery" }] : /* istanbul ignore next */ []));
|
|
4563
4666
|
this.selectedQuery$ = toObservable(this.selectedQuery);
|
|
4564
4667
|
this.selectedQueryEntityStore = computed(() => {
|
|
4565
4668
|
const query = this.selectedQuery();
|
|
4566
4669
|
if (!query)
|
|
4567
4670
|
return null;
|
|
4568
4671
|
return query.store;
|
|
4569
|
-
},
|
|
4672
|
+
}, /* @ts-ignore */
|
|
4673
|
+
...(ngDevMode ? [{ debugName: "selectedQueryEntityStore" }] : /* istanbul ignore next */ []));
|
|
4570
4674
|
this.selectedQueryEntityStore$ = toObservable(this.selectedQueryEntityStore);
|
|
4571
4675
|
this.selectedQueryEntityStoreValue$ = this.selectedQueryEntityStore$.pipe(switchMap((s) => s?._change$.pipe(startWith(''), map(() => {
|
|
4572
4676
|
if (!s._dictionary)
|
|
@@ -4604,7 +4708,8 @@ class QueryDevtoolsComponent {
|
|
|
4604
4708
|
return {
|
|
4605
4709
|
...sharedCfg,
|
|
4606
4710
|
};
|
|
4607
|
-
},
|
|
4711
|
+
}, /* @ts-ignore */
|
|
4712
|
+
...(ngDevMode ? [{ debugName: "stringifiedQueryConfig" }] : /* istanbul ignore next */ []));
|
|
4608
4713
|
this.authProvider = toSignal(toObservable(this.selectedClientConfig).pipe(switchMap((c) => c.client.authProvider$)));
|
|
4609
4714
|
this.authProviderDetails = computed(() => {
|
|
4610
4715
|
const provider = this.authProvider();
|
|
@@ -4666,7 +4771,8 @@ class QueryDevtoolsComponent {
|
|
|
4666
4771
|
config: {},
|
|
4667
4772
|
};
|
|
4668
4773
|
}
|
|
4669
|
-
},
|
|
4774
|
+
}, /* @ts-ignore */
|
|
4775
|
+
...(ngDevMode ? [{ debugName: "authProviderDetails" }] : /* istanbul ignore next */ []));
|
|
4670
4776
|
this.trackByClient = (_, { client }) => client.config.baseRoute;
|
|
4671
4777
|
this.trackByQuery = (_, { _id }) => _id;
|
|
4672
4778
|
this.selectedClientIdCtrl.valueChanges
|
|
@@ -4787,14 +4893,14 @@ class QueryDevtoolsComponent {
|
|
|
4787
4893
|
clearQueryHistory() {
|
|
4788
4894
|
this.queryHistory$.next([]);
|
|
4789
4895
|
}
|
|
4790
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4791
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: QueryDevtoolsComponent, isStandalone: true, selector: "et-query-devtools", host: { classAttribute: "et-query-devtools" }, ngImport: i0, template: "@if (!isOpen()) {\n <button (click)=\"toggleOpen()\" class=\"et-query-devtools-open-btn et-qd-chip\">Query Devtools</button>\n}\n\n@if (isOpen()) {\n <div\n [class.et-query-devtools-container--transparent]=\"isTranslucent()\"\n class=\"et-query-devtools-container et-query-devtools-container--snap-{{ snapLayout() }}\"\n >\n <header class=\"et-qd-header\">\n <h3 class=\"et-qd-header__title\">Query Devtools</h3>\n\n <div class=\"et-qd-header__select\">\n <label for=\"et-query-client-instance\">Client instance</label>\n <select [formControl]=\"selectedClientIdCtrl\" id=\"et-query-client-instance\">\n @for (clientConfig of queryClientConfigs; track trackByClient(i, clientConfig); let i = $index) {\n <option [value]=\"i\">\n {{ clientConfig.displayName ?? clientConfig.client.config.baseRoute }}\n </option>\n }\n </select>\n </div>\n\n <button (click)=\"toggleOpen()\" class=\"et-qd-btn et-qd-btn-secondary\">Close</button>\n </header>\n\n <div class=\"et-qd-sub-header\">\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !isTranslucent() }\"\n (click)=\"toggleTranslucent()\"\n class=\"et-qd-chip et-qd-translucent-clickable\"\n >\n Translucent\n </button>\n <div class=\"et-qd-sub-header__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'full' }\"\n (click)=\"selectSnapLayout('full')\"\n class=\"et-qd-chip\"\n >\n Fullscreen\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'top' }\"\n (click)=\"selectSnapLayout('top')\"\n class=\"et-qd-chip\"\n >\n Top\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'bottom' }\"\n (click)=\"selectSnapLayout('bottom')\"\n class=\"et-qd-chip\"\n >\n Bottom\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'left' }\"\n (click)=\"selectSnapLayout('left')\"\n class=\"et-qd-chip\"\n >\n Left\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'right' }\"\n (click)=\"selectSnapLayout('right')\"\n class=\"et-qd-chip\"\n >\n Right\n </button>\n </div>\n\n @if (selectedClientConfig(); as cfg) {\n <div class=\"et-qd-client\">\n <p class=\"et-qd-client__title\">{{ cfg.displayName ?? cfg.client.config.baseRoute }}</p>\n\n <div class=\"et-qd-client__actions\">\n <button (click)=\"cfg.client._store.refreshQueriesInUse()\" class=\"et-qd-chip\">Refresh all</button>\n <button (click)=\"cfg.client._store.refreshQueriesInUse({ ignoreCacheValidity: true })\" class=\"et-qd-chip\">\n Refresh all (ignore caches)\n </button>\n <button\n (click)=\"cfg.client._store.refreshQueriesInUse({ ignoreCacheValidity: true, purgeUnused: true })\"\n class=\"et-qd-chip\"\n >\n Refresh all (ignore caches & purge unused)\n </button>\n </div>\n </div>\n }\n\n @if (selectedClientConfig(); as cfg) {\n <div class=\"et-qd-queries\">\n <p class=\"et-qd-queries__title\">Inspector</p>\n <div class=\"et-qd-queries__actions\">\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': queryListMode() !== 'live' || viewMode() !== 'query' }\"\n (click)=\"selectQueryListMode('live'); selectViewMode('query')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Live Queries ({{ queries()?.length ?? 0 }})\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': queryListMode() !== 'history' || viewMode() !== 'query' }\"\n (click)=\"selectQueryListMode('history'); selectViewMode('query')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Query History ({{ (queryHistory$ | async)?.length ?? 0 }}/50)\n </button>\n @if (queryListMode() === 'history' && viewMode() === 'query') {\n <div class=\"et-qd-queries__divider\"></div>\n <button (click)=\"clearQueryHistory()\" class=\"et-qd-chip et-qd-chip-bordered\">Clear history</button>\n }\n\n <div class=\"et-qd-queries__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': viewMode() !== 'authProvider' }\"\n (click)=\"selectViewMode('authProvider')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Auth Provider\n </button>\n </div>\n\n @if (viewMode() === 'query') {\n <div class=\"et-qd-queries__browser\">\n @if (queryListMode() === 'live') {\n <ul class=\"et-qd-queries__browser-list\">\n @for (query of queries(); track trackByQuery($index, query)) {\n <li>\n <button\n [class.et-qd-query--active]=\"selectedQuery()?._id === query._id\"\n (click)=\"selectQuery(query)\"\n >\n <span> {{ query._queryConfig.method }}</span>\n <span> {{ query | queryShortName }}</span>\n </button>\n </li>\n }\n </ul>\n }\n @if (queryListMode() === 'history') {\n <ul class=\"et-qd-queries__browser-list\">\n @for (query of queryHistory$ | async; track trackByQuery($index, query)) {\n <li>\n <button\n [class.et-qd-query--active]=\"selectedQuery()?._id === query._id\"\n (click)=\"selectQuery(query)\"\n >\n <span> {{ query._queryConfig.method }}</span>\n <span> {{ query | queryShortName }}</span>\n </button>\n </li>\n }\n </ul>\n }\n <div class=\"et-qd-queries__browser-detail\">\n @if (selectedQuery(); as query) {\n <p class=\"et-qd-queries__browser-detail__title\">\n {{ query._queryConfig.method }} {{ query._routeWithParams }}\n </p>\n\n <div class=\"et-qd-queries__actions\">\n <button (click)=\"query.execute()\" class=\"et-qd-chip et-qd-chip-bordered\">Execute</button>\n <button (click)=\"query.execute({ skipCache: true })\" class=\"et-qd-chip et-qd-chip-bordered\">\n Execute (ignore cache)\n </button>\n\n <button (click)=\"query.abort()\" class=\"et-qd-chip et-qd-chip-bordered\">Abort</button>\n <div class=\"et-qd-queries__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !query.isPolling }\"\n (click)=\"query.poll({ interval: 5000, takeUntil: _destroy$ })\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Poll\n </button>\n\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': query.isPolling }\"\n (click)=\"query.stopPolling()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Stop polling\n </button>\n @if (query.isPolling || query._isPollingPaused) {\n <button (click)=\"query.pausePolling()\" class=\"et-qd-chip et-qd-chip-secondary et-qd-chip-bordered\">\n Pause polling\n </button>\n <button (click)=\"query.resumePolling()\" class=\"et-qd-chip et-qd-chip-secondary et-qd-chip-bordered\">\n Resume polling\n </button>\n }\n </div>\n\n <div class=\"et-qd-list\">\n <div class=\"et-qd-list-item\">\n <p>State type</p>\n <pre>{{ query.rawState.type }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Dependents</p>\n <pre>{{ query._dependents | json }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is expired</p>\n <pre>{{ query.isExpired }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is in use</p>\n <pre>{{ query.isInUse }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Subscriber count</p>\n <pre>{{ query._subscriberCount }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is polling</p>\n <pre>{{ query.isPolling }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is polling paused</p>\n <pre>{{ query._isPollingPaused }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Enable smart polling</p>\n <pre>{{ query._enableSmartPolling }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Query store key</p>\n <pre>{{ query._queryStoreKey }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Arguments</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showArguments() }\"\n (click)=\"toggleShowArguments()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showArguments()) {\n <pre>{{ query._arguments | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>State</p>\n <p><i> Warning, this will cause a subscription if shown!</i></p>\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showResponse() }\"\n (click)=\"toggleShowResponse()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showResponse()) {\n <pre>{{ query.state$ | async | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Raw state</p>\n <p><i> The query state unaffected by entity stores</i></p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showRawResponse() }\"\n (click)=\"toggleShowRawResponse()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showRawResponse()) {\n <pre>{{ query.rawState | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Query config</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showQueryConfig() }\"\n (click)=\"toggleShowQueryConfig()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showQueryConfig()) {\n <pre>{{ stringifiedQueryConfig() | json }}</pre>\n }\n </div>\n\n @if (!!query._queryConfig.entity) {\n <div class=\"et-qd-list-item\">\n <p>Entity store value</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showEntityStoreValue() }\"\n (click)=\"toggleShowEntityStoreValue()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showEntityStoreValue()) {\n <pre>{{ selectedQueryEntityStoreValue$ | async | json }}</pre>\n }\n </div>\n }\n </div>\n }\n </div>\n </div>\n } @else if (viewMode() === 'authProvider') {\n <div class=\"et-qd-auth-provider__viewer\">\n @if (authProviderDetails(); as details) {\n <div class=\"et-qd-list\">\n <div class=\"et-qd-list-item\">\n <p>Type</p>\n <pre>{{ details.type }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Header value</p>\n <pre>{{ details.header() | json }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Config</p>\n <pre>{{ details.config | json }}</pre>\n </div>\n\n @if (details.type === 'BearerAuthProvider') {\n <div class=\"et-qd-list-item\">\n <p>Tokens</p>\n <pre>{{ details.provider.tokens$ | async | json }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Should refresh on unauthorized response</p>\n <pre>{{ details.provider.shouldRefreshOnUnauthorizedResponse }}</pre>\n </div>\n\n <ng-container\n *etQuery=\"\n details.provider.currentRefreshQuery$ | async as response;\n loading as loading;\n error as error;\n query as query\n \"\n >\n <div class=\"et-qd-list-item\">\n <p>Refresh query response</p>\n\n <div>\n <button (click)=\"details.provider._refreshQuery()\" class=\"et-qd-chip et-qd-chip-bordered\">\n Refresh\n </button>\n </div>\n <pre>{{ response | json }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Refresh query loading</p>\n <pre>{{ loading }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Refresh query error</p>\n <pre>{{ error ?? 'null' }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>State</p>\n <pre>{{ query?.state$ | async | json }}</pre>\n </div>\n </ng-container>\n }\n </div>\n } @else {\n <p>No auth provider set</p>\n }\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [":host{position:fixed;top:0;z-index:1000000;font-size:14px;color:#fff}.et-query-devtools-container{position:fixed;inset:0;background-color:#25292e;z-index:10000;overflow:auto;font-family:monospace;display:grid;grid-template-rows:auto auto auto minmax(0,1fr)}.et-query-devtools-container.et-query-devtools-container--transparent{opacity:.25;pointer-events:none}.et-query-devtools-container.et-query-devtools-container--transparent .et-query-devtools-translucent-btn{pointer-events:all}.et-query-devtools-container.et-query-devtools-container--snap-left{inset-inline-start:0;inset-block-start:0;inset-block-end:0;width:50%;border-right:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-right{inset-inline-start:unset;inset-inline-end:0;inset-block-start:0;inset-block-end:0;width:50%;border-left:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-top{inset-inline-start:0;inset-block-start:0;inset-inline-end:0;height:50%;border-bottom:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-bottom{inset-inline-start:0;inset-block-start:unset;inset-block-end:0;inset-inline-end:0;height:50%;border-top:1px solid rgb(37,41,46)}button.et-query-devtools-open-btn{position:fixed;inset-inline-end:20px;inset-block-end:0;z-index:9999;font-family:monospace;border-radius:3px 3px 0 0;line-height:14px;font-size:12px}.et-qd-header{background-color:#00ffa1;padding:12px;display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center}.et-qd-header__title{color:#25292e;margin:0;font-size:22px}.et-qd-header__select{display:grid;background-color:#25292e;border-radius:10px;overflow:hidden}.et-qd-header__select select{width:250px;color:#fff;padding:3px 10px 2px;border:none;background-color:#25292e;font-family:monospace}.et-qd-header__select label{padding:3px 10px;color:#25292e;font-size:12px;font-weight:700;color:#fff;border-bottom:1px solid gray}.et-qd-sub-header{background-color:#00b371;padding:12px;display:flex;gap:12px;flex-wrap:wrap}.et-qd-sub-header__divider{width:1px;background-color:#25292e}.et-qd-btn{background-color:#00ffa1;color:#25292e;border:none;padding:12px;cursor:pointer;font-size:14px;font-weight:700;text-align:center;text-decoration:none;display:inline-block;width:100%;transition:all .3s ease-in-out;font-family:monospace;border-radius:10px}.et-qd-btn:hover{background-color:#00cc81}.et-qd-btn.et-qd-btn-secondary{background-color:#25292e;color:#00ffa1}.et-qd-btn.et-qd-btn-secondary:hover{background-color:#3c424a}.et-qd-chip{background-color:#00ffa1;color:#25292e;border:none;padding:4px 9px;cursor:pointer;font-size:12px;font-weight:700;text-align:center;text-decoration:none;display:inline-block;transition:all .3s ease-in-out;font-family:monospace;border-radius:10px}.et-qd-chip:hover{background-color:#00cc81}.et-qd-chip.et-qd-chip-secondary{background-color:#25292e;color:#00ffa1}.et-qd-chip.et-qd-chip-secondary:hover{background-color:#3c424a}.et-qd-chip.et-qd-chip-bordered{border:1px solid rgb(0,255,161)}.et-qd-translucent-clickable{pointer-events:all}.et-qd-client{border-bottom:1px solid rgb(59.734939759,66.1927710843,74.265060241);padding:12px}.et-qd-client__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-client__actions{display:flex;gap:12px;margin-top:12px}.et-qd-queries{padding:12px;display:grid;grid-template-rows:auto auto minmax(0,1fr)}.et-qd-queries__actions{display:flex;gap:12px;margin-top:12px;margin-bottom:16px}.et-qd-queries__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-queries__divider{width:1px;background-color:#3c424a}.et-qd-queries__browser{display:grid;grid-template-columns:1fr minmax(0,3fr);margin-left:-12px;margin-right:-12px;border-top:1px solid rgb(59.734939759,66.1927710843,74.265060241);margin-bottom:-12px}.et-qd-queries__browser-list{border-right:1px solid rgb(59.734939759,66.1927710843,74.265060241);list-style:none;padding:0;margin:0;display:grid;grid-auto-flow:row;grid-auto-rows:55px;overflow-y:auto;overflow-x:hidden}.et-qd-queries__browser-list li{margin:0}.et-qd-queries__browser-list li button{all:unset;font-family:monospace;box-sizing:border-box;width:100%;border:none;border-bottom:1px solid rgb(59.734939759,66.1927710843,74.265060241);background-color:#25292e;color:#fff;text-align:left;padding:12px;height:100%;transition:all .3s ease-in-out;cursor:pointer;display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px;display:block}.et-qd-queries__browser-list li button span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.et-qd-queries__browser-list li button span:first-of-type{font-weight:700}.et-qd-queries__browser-list li button:hover,.et-qd-queries__browser-list li button.et-qd-query--active{background-color:#30363c}.et-qd-queries__browser-detail{padding:12px;overflow-y:auto;overflow-x:hidden}.et-qd-queries__browser-detail__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-auth-provider__viewer{border-top:1px solid rgb(59.734939759,66.1927710843,74.265060241);margin-left:-12px;margin-right:-12px;margin-bottom:-12px;padding:12px;overflow-y:auto;overflow-x:hidden}.et-qd-list{display:grid;gap:12px}.et-qd-list-item{display:grid}.et-qd-list-item p{font-weight:700;margin:0;padding-bottom:8px}.et-qd-list-item p+p{margin-top:-8px}.et-qd-list-item div+pre{margin-top:8px}.et-qd-list-item pre{margin:0;padding:4px;background-color:#0e1012;border-radius:4px;max-height:450px;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: QueryDirective, selector: "[etQuery]", inputs: ["etQuery", "etQueryCache"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "pipe", type: QueryShortNamePipe, name: "queryShortName" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.ShadowDom }); }
|
|
4896
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: QueryDevtoolsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4897
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: QueryDevtoolsComponent, isStandalone: true, selector: "et-query-devtools", host: { classAttribute: "et-query-devtools" }, ngImport: i0, template: "@if (!isOpen()) {\n <button (click)=\"toggleOpen()\" class=\"et-query-devtools-open-btn et-qd-chip\">Query Devtools</button>\n}\n\n@if (isOpen()) {\n <div\n [class.et-query-devtools-container--transparent]=\"isTranslucent()\"\n class=\"et-query-devtools-container et-query-devtools-container--snap-{{ snapLayout() }}\"\n >\n <header class=\"et-qd-header\">\n <h3 class=\"et-qd-header__title\">Query Devtools</h3>\n\n <div class=\"et-qd-header__select\">\n <label for=\"et-query-client-instance\">Client instance</label>\n <select [formControl]=\"selectedClientIdCtrl\" id=\"et-query-client-instance\">\n @for (clientConfig of queryClientConfigs; track trackByClient(i, clientConfig); let i = $index) {\n <option [value]=\"i\">\n {{ clientConfig.displayName ?? clientConfig.client.config.baseRoute }}\n </option>\n }\n </select>\n </div>\n\n <button (click)=\"toggleOpen()\" class=\"et-qd-btn et-qd-btn-secondary\">Close</button>\n </header>\n\n <div class=\"et-qd-sub-header\">\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !isTranslucent() }\"\n (click)=\"toggleTranslucent()\"\n class=\"et-qd-chip et-qd-translucent-clickable\"\n >\n Translucent\n </button>\n <div class=\"et-qd-sub-header__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'full' }\"\n (click)=\"selectSnapLayout('full')\"\n class=\"et-qd-chip\"\n >\n Fullscreen\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'top' }\"\n (click)=\"selectSnapLayout('top')\"\n class=\"et-qd-chip\"\n >\n Top\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'bottom' }\"\n (click)=\"selectSnapLayout('bottom')\"\n class=\"et-qd-chip\"\n >\n Bottom\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'left' }\"\n (click)=\"selectSnapLayout('left')\"\n class=\"et-qd-chip\"\n >\n Left\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'right' }\"\n (click)=\"selectSnapLayout('right')\"\n class=\"et-qd-chip\"\n >\n Right\n </button>\n </div>\n\n @if (selectedClientConfig(); as cfg) {\n <div class=\"et-qd-client\">\n <p class=\"et-qd-client__title\">{{ cfg.displayName ?? cfg.client.config.baseRoute }}</p>\n\n <div class=\"et-qd-client__actions\">\n <button (click)=\"cfg.client._store.refreshQueriesInUse()\" class=\"et-qd-chip\">Refresh all</button>\n <button (click)=\"cfg.client._store.refreshQueriesInUse({ ignoreCacheValidity: true })\" class=\"et-qd-chip\">\n Refresh all (ignore caches)\n </button>\n <button\n (click)=\"cfg.client._store.refreshQueriesInUse({ ignoreCacheValidity: true, purgeUnused: true })\"\n class=\"et-qd-chip\"\n >\n Refresh all (ignore caches & purge unused)\n </button>\n </div>\n </div>\n }\n\n @if (selectedClientConfig(); as cfg) {\n <div class=\"et-qd-queries\">\n <p class=\"et-qd-queries__title\">Inspector</p>\n <div class=\"et-qd-queries__actions\">\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': queryListMode() !== 'live' || viewMode() !== 'query' }\"\n (click)=\"selectQueryListMode('live'); selectViewMode('query')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Live Queries ({{ queries()?.length ?? 0 }})\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': queryListMode() !== 'history' || viewMode() !== 'query' }\"\n (click)=\"selectQueryListMode('history'); selectViewMode('query')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Query History ({{ (queryHistory$ | async)?.length ?? 0 }}/50)\n </button>\n @if (queryListMode() === 'history' && viewMode() === 'query') {\n <div class=\"et-qd-queries__divider\"></div>\n <button (click)=\"clearQueryHistory()\" class=\"et-qd-chip et-qd-chip-bordered\">Clear history</button>\n }\n\n <div class=\"et-qd-queries__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': viewMode() !== 'authProvider' }\"\n (click)=\"selectViewMode('authProvider')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Auth Provider\n </button>\n </div>\n\n @if (viewMode() === 'query') {\n <div class=\"et-qd-queries__browser\">\n @if (queryListMode() === 'live') {\n <ul class=\"et-qd-queries__browser-list\">\n @for (query of queries(); track trackByQuery($index, query)) {\n <li>\n <button\n [class.et-qd-query--active]=\"selectedQuery()?._id === query._id\"\n (click)=\"selectQuery(query)\"\n >\n <span> {{ query._queryConfig.method }}</span>\n <span> {{ query | queryShortName }}</span>\n </button>\n </li>\n }\n </ul>\n }\n @if (queryListMode() === 'history') {\n <ul class=\"et-qd-queries__browser-list\">\n @for (query of queryHistory$ | async; track trackByQuery($index, query)) {\n <li>\n <button\n [class.et-qd-query--active]=\"selectedQuery()?._id === query._id\"\n (click)=\"selectQuery(query)\"\n >\n <span> {{ query._queryConfig.method }}</span>\n <span> {{ query | queryShortName }}</span>\n </button>\n </li>\n }\n </ul>\n }\n <div class=\"et-qd-queries__browser-detail\">\n @if (selectedQuery(); as query) {\n <p class=\"et-qd-queries__browser-detail__title\">\n {{ query._queryConfig.method }} {{ query._routeWithParams }}\n </p>\n\n <div class=\"et-qd-queries__actions\">\n <button (click)=\"query.execute()\" class=\"et-qd-chip et-qd-chip-bordered\">Execute</button>\n <button (click)=\"query.execute({ skipCache: true })\" class=\"et-qd-chip et-qd-chip-bordered\">\n Execute (ignore cache)\n </button>\n\n <button (click)=\"query.abort()\" class=\"et-qd-chip et-qd-chip-bordered\">Abort</button>\n <div class=\"et-qd-queries__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !query.isPolling }\"\n (click)=\"query.poll({ interval: 5000, takeUntil: _destroy$ })\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Poll\n </button>\n\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': query.isPolling }\"\n (click)=\"query.stopPolling()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Stop polling\n </button>\n @if (query.isPolling || query._isPollingPaused) {\n <button (click)=\"query.pausePolling()\" class=\"et-qd-chip et-qd-chip-secondary et-qd-chip-bordered\">\n Pause polling\n </button>\n <button (click)=\"query.resumePolling()\" class=\"et-qd-chip et-qd-chip-secondary et-qd-chip-bordered\">\n Resume polling\n </button>\n }\n </div>\n\n <div class=\"et-qd-list\">\n <div class=\"et-qd-list-item\">\n <p>State type</p>\n <pre>{{ query.rawState.type }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Dependents</p>\n <pre>{{ query._dependents | json }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is expired</p>\n <pre>{{ query.isExpired }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is in use</p>\n <pre>{{ query.isInUse }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Subscriber count</p>\n <pre>{{ query._subscriberCount }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is polling</p>\n <pre>{{ query.isPolling }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is polling paused</p>\n <pre>{{ query._isPollingPaused }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Enable smart polling</p>\n <pre>{{ query._enableSmartPolling }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Query store key</p>\n <pre>{{ query._queryStoreKey }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Arguments</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showArguments() }\"\n (click)=\"toggleShowArguments()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showArguments()) {\n <pre>{{ query._arguments | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>State</p>\n <p><i> Warning, this will cause a subscription if shown!</i></p>\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showResponse() }\"\n (click)=\"toggleShowResponse()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showResponse()) {\n <pre>{{ query.state$ | async | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Raw state</p>\n <p><i> The query state unaffected by entity stores</i></p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showRawResponse() }\"\n (click)=\"toggleShowRawResponse()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showRawResponse()) {\n <pre>{{ query.rawState | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Query config</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showQueryConfig() }\"\n (click)=\"toggleShowQueryConfig()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showQueryConfig()) {\n <pre>{{ stringifiedQueryConfig() | json }}</pre>\n }\n </div>\n\n @if (!!query._queryConfig.entity) {\n <div class=\"et-qd-list-item\">\n <p>Entity store value</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showEntityStoreValue() }\"\n (click)=\"toggleShowEntityStoreValue()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showEntityStoreValue()) {\n <pre>{{ selectedQueryEntityStoreValue$ | async | json }}</pre>\n }\n </div>\n }\n </div>\n }\n </div>\n </div>\n } @else if (viewMode() === 'authProvider') {\n <div class=\"et-qd-auth-provider__viewer\">\n @if (authProviderDetails(); as details) {\n <div class=\"et-qd-list\">\n <div class=\"et-qd-list-item\">\n <p>Type</p>\n <pre>{{ details.type }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Header value</p>\n <pre>{{ details.header() | json }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Config</p>\n <pre>{{ details.config | json }}</pre>\n </div>\n\n @if (details.type === 'BearerAuthProvider') {\n <div class=\"et-qd-list-item\">\n <p>Tokens</p>\n <pre>{{ details.provider.tokens$ | async | json }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Should refresh on unauthorized response</p>\n <pre>{{ details.provider.shouldRefreshOnUnauthorizedResponse }}</pre>\n </div>\n\n <ng-container\n *etQuery=\"\n details.provider.currentRefreshQuery$ | async as response;\n loading as loading;\n error as error;\n query as query\n \"\n >\n <div class=\"et-qd-list-item\">\n <p>Refresh query response</p>\n\n <div>\n <button (click)=\"details.provider._refreshQuery()\" class=\"et-qd-chip et-qd-chip-bordered\">\n Refresh\n </button>\n </div>\n <pre>{{ response | json }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Refresh query loading</p>\n <pre>{{ loading }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Refresh query error</p>\n <pre>{{ error ?? 'null' }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>State</p>\n <pre>{{ $safeNavigationMigration(query?.state$) | async | json }}</pre>\n </div>\n </ng-container>\n }\n </div>\n } @else {\n <p>No auth provider set</p>\n }\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [":host{position:fixed;top:0;z-index:1000000;font-size:14px;color:#fff}.et-query-devtools-container{position:fixed;inset:0;background-color:#25292e;z-index:10000;overflow:auto;font-family:monospace;display:grid;grid-template-rows:auto auto auto minmax(0,1fr)}.et-query-devtools-container.et-query-devtools-container--transparent{opacity:.25;pointer-events:none}.et-query-devtools-container.et-query-devtools-container--transparent .et-query-devtools-translucent-btn{pointer-events:all}.et-query-devtools-container.et-query-devtools-container--snap-left{inset-inline-start:0;inset-block-start:0;inset-block-end:0;width:50%;border-right:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-right{inset-inline-start:unset;inset-inline-end:0;inset-block-start:0;inset-block-end:0;width:50%;border-left:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-top{inset-inline-start:0;inset-block-start:0;inset-inline-end:0;height:50%;border-bottom:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-bottom{inset-inline-start:0;inset-block-start:unset;inset-block-end:0;inset-inline-end:0;height:50%;border-top:1px solid rgb(37,41,46)}button.et-query-devtools-open-btn{position:fixed;inset-inline-end:20px;inset-block-end:0;z-index:9999;font-family:monospace;border-radius:3px 3px 0 0;line-height:14px;font-size:12px}.et-qd-header{background-color:#00ffa1;padding:12px;display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center}.et-qd-header__title{color:#25292e;margin:0;font-size:22px}.et-qd-header__select{display:grid;background-color:#25292e;border-radius:10px;overflow:hidden}.et-qd-header__select select{width:250px;color:#fff;padding:3px 10px 2px;border:none;background-color:#25292e;font-family:monospace}.et-qd-header__select label{padding:3px 10px;color:#25292e;font-size:12px;font-weight:700;color:#fff;border-bottom:1px solid gray}.et-qd-sub-header{background-color:#00b371;padding:12px;display:flex;gap:12px;flex-wrap:wrap}.et-qd-sub-header__divider{width:1px;background-color:#25292e}.et-qd-btn{background-color:#00ffa1;color:#25292e;border:none;padding:12px;cursor:pointer;font-size:14px;font-weight:700;text-align:center;text-decoration:none;display:inline-block;width:100%;transition:all .3s ease-in-out;font-family:monospace;border-radius:10px}.et-qd-btn:hover{background-color:#00cc81}.et-qd-btn.et-qd-btn-secondary{background-color:#25292e;color:#00ffa1}.et-qd-btn.et-qd-btn-secondary:hover{background-color:#3c424a}.et-qd-chip{background-color:#00ffa1;color:#25292e;border:none;padding:4px 9px;cursor:pointer;font-size:12px;font-weight:700;text-align:center;text-decoration:none;display:inline-block;transition:all .3s ease-in-out;font-family:monospace;border-radius:10px}.et-qd-chip:hover{background-color:#00cc81}.et-qd-chip.et-qd-chip-secondary{background-color:#25292e;color:#00ffa1}.et-qd-chip.et-qd-chip-secondary:hover{background-color:#3c424a}.et-qd-chip.et-qd-chip-bordered{border:1px solid rgb(0,255,161)}.et-qd-translucent-clickable{pointer-events:all}.et-qd-client{border-bottom:1px solid rgb(59.734939759,66.1927710843,74.265060241);padding:12px}.et-qd-client__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-client__actions{display:flex;gap:12px;margin-top:12px}.et-qd-queries{padding:12px;display:grid;grid-template-rows:auto auto minmax(0,1fr)}.et-qd-queries__actions{display:flex;gap:12px;margin-top:12px;margin-bottom:16px}.et-qd-queries__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-queries__divider{width:1px;background-color:#3c424a}.et-qd-queries__browser{display:grid;grid-template-columns:1fr minmax(0,3fr);margin-left:-12px;margin-right:-12px;border-top:1px solid rgb(59.734939759,66.1927710843,74.265060241);margin-bottom:-12px}.et-qd-queries__browser-list{border-right:1px solid rgb(59.734939759,66.1927710843,74.265060241);list-style:none;padding:0;margin:0;display:grid;grid-auto-flow:row;grid-auto-rows:55px;overflow-y:auto;overflow-x:hidden}.et-qd-queries__browser-list li{margin:0}.et-qd-queries__browser-list li button{all:unset;font-family:monospace;box-sizing:border-box;width:100%;border:none;border-bottom:1px solid rgb(59.734939759,66.1927710843,74.265060241);background-color:#25292e;color:#fff;text-align:left;padding:12px;height:100%;transition:all .3s ease-in-out;cursor:pointer;display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px;display:block}.et-qd-queries__browser-list li button span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.et-qd-queries__browser-list li button span:first-of-type{font-weight:700}.et-qd-queries__browser-list li button:hover,.et-qd-queries__browser-list li button.et-qd-query--active{background-color:#30363c}.et-qd-queries__browser-detail{padding:12px;overflow-y:auto;overflow-x:hidden}.et-qd-queries__browser-detail__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-auth-provider__viewer{border-top:1px solid rgb(59.734939759,66.1927710843,74.265060241);margin-left:-12px;margin-right:-12px;margin-bottom:-12px;padding:12px;overflow-y:auto;overflow-x:hidden}.et-qd-list{display:grid;gap:12px}.et-qd-list-item{display:grid}.et-qd-list-item p{font-weight:700;margin:0;padding-bottom:8px}.et-qd-list-item p+p{margin-top:-8px}.et-qd-list-item div+pre{margin-top:8px}.et-qd-list-item pre{margin:0;padding:4px;background-color:#0e1012;border-radius:4px;max-height:450px;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: QueryDirective, selector: "[etQuery]", inputs: ["etQuery", "etQueryCache"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "pipe", type: QueryShortNamePipe, name: "queryShortName" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.ShadowDom }); }
|
|
4792
4898
|
}
|
|
4793
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4899
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: QueryDevtoolsComponent, decorators: [{
|
|
4794
4900
|
type: Component,
|
|
4795
4901
|
args: [{ selector: 'et-query-devtools', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.ShadowDom, host: {
|
|
4796
4902
|
class: 'et-query-devtools',
|
|
4797
|
-
}, imports: [AsyncPipe, JsonPipe, ReactiveFormsModule, NgClass, QueryShortNamePipe, QueryDirective], template: "@if (!isOpen()) {\n <button (click)=\"toggleOpen()\" class=\"et-query-devtools-open-btn et-qd-chip\">Query Devtools</button>\n}\n\n@if (isOpen()) {\n <div\n [class.et-query-devtools-container--transparent]=\"isTranslucent()\"\n class=\"et-query-devtools-container et-query-devtools-container--snap-{{ snapLayout() }}\"\n >\n <header class=\"et-qd-header\">\n <h3 class=\"et-qd-header__title\">Query Devtools</h3>\n\n <div class=\"et-qd-header__select\">\n <label for=\"et-query-client-instance\">Client instance</label>\n <select [formControl]=\"selectedClientIdCtrl\" id=\"et-query-client-instance\">\n @for (clientConfig of queryClientConfigs; track trackByClient(i, clientConfig); let i = $index) {\n <option [value]=\"i\">\n {{ clientConfig.displayName ?? clientConfig.client.config.baseRoute }}\n </option>\n }\n </select>\n </div>\n\n <button (click)=\"toggleOpen()\" class=\"et-qd-btn et-qd-btn-secondary\">Close</button>\n </header>\n\n <div class=\"et-qd-sub-header\">\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !isTranslucent() }\"\n (click)=\"toggleTranslucent()\"\n class=\"et-qd-chip et-qd-translucent-clickable\"\n >\n Translucent\n </button>\n <div class=\"et-qd-sub-header__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'full' }\"\n (click)=\"selectSnapLayout('full')\"\n class=\"et-qd-chip\"\n >\n Fullscreen\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'top' }\"\n (click)=\"selectSnapLayout('top')\"\n class=\"et-qd-chip\"\n >\n Top\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'bottom' }\"\n (click)=\"selectSnapLayout('bottom')\"\n class=\"et-qd-chip\"\n >\n Bottom\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'left' }\"\n (click)=\"selectSnapLayout('left')\"\n class=\"et-qd-chip\"\n >\n Left\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'right' }\"\n (click)=\"selectSnapLayout('right')\"\n class=\"et-qd-chip\"\n >\n Right\n </button>\n </div>\n\n @if (selectedClientConfig(); as cfg) {\n <div class=\"et-qd-client\">\n <p class=\"et-qd-client__title\">{{ cfg.displayName ?? cfg.client.config.baseRoute }}</p>\n\n <div class=\"et-qd-client__actions\">\n <button (click)=\"cfg.client._store.refreshQueriesInUse()\" class=\"et-qd-chip\">Refresh all</button>\n <button (click)=\"cfg.client._store.refreshQueriesInUse({ ignoreCacheValidity: true })\" class=\"et-qd-chip\">\n Refresh all (ignore caches)\n </button>\n <button\n (click)=\"cfg.client._store.refreshQueriesInUse({ ignoreCacheValidity: true, purgeUnused: true })\"\n class=\"et-qd-chip\"\n >\n Refresh all (ignore caches & purge unused)\n </button>\n </div>\n </div>\n }\n\n @if (selectedClientConfig(); as cfg) {\n <div class=\"et-qd-queries\">\n <p class=\"et-qd-queries__title\">Inspector</p>\n <div class=\"et-qd-queries__actions\">\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': queryListMode() !== 'live' || viewMode() !== 'query' }\"\n (click)=\"selectQueryListMode('live'); selectViewMode('query')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Live Queries ({{ queries()?.length ?? 0 }})\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': queryListMode() !== 'history' || viewMode() !== 'query' }\"\n (click)=\"selectQueryListMode('history'); selectViewMode('query')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Query History ({{ (queryHistory$ | async)?.length ?? 0 }}/50)\n </button>\n @if (queryListMode() === 'history' && viewMode() === 'query') {\n <div class=\"et-qd-queries__divider\"></div>\n <button (click)=\"clearQueryHistory()\" class=\"et-qd-chip et-qd-chip-bordered\">Clear history</button>\n }\n\n <div class=\"et-qd-queries__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': viewMode() !== 'authProvider' }\"\n (click)=\"selectViewMode('authProvider')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Auth Provider\n </button>\n </div>\n\n @if (viewMode() === 'query') {\n <div class=\"et-qd-queries__browser\">\n @if (queryListMode() === 'live') {\n <ul class=\"et-qd-queries__browser-list\">\n @for (query of queries(); track trackByQuery($index, query)) {\n <li>\n <button\n [class.et-qd-query--active]=\"selectedQuery()?._id === query._id\"\n (click)=\"selectQuery(query)\"\n >\n <span> {{ query._queryConfig.method }}</span>\n <span> {{ query | queryShortName }}</span>\n </button>\n </li>\n }\n </ul>\n }\n @if (queryListMode() === 'history') {\n <ul class=\"et-qd-queries__browser-list\">\n @for (query of queryHistory$ | async; track trackByQuery($index, query)) {\n <li>\n <button\n [class.et-qd-query--active]=\"selectedQuery()?._id === query._id\"\n (click)=\"selectQuery(query)\"\n >\n <span> {{ query._queryConfig.method }}</span>\n <span> {{ query | queryShortName }}</span>\n </button>\n </li>\n }\n </ul>\n }\n <div class=\"et-qd-queries__browser-detail\">\n @if (selectedQuery(); as query) {\n <p class=\"et-qd-queries__browser-detail__title\">\n {{ query._queryConfig.method }} {{ query._routeWithParams }}\n </p>\n\n <div class=\"et-qd-queries__actions\">\n <button (click)=\"query.execute()\" class=\"et-qd-chip et-qd-chip-bordered\">Execute</button>\n <button (click)=\"query.execute({ skipCache: true })\" class=\"et-qd-chip et-qd-chip-bordered\">\n Execute (ignore cache)\n </button>\n\n <button (click)=\"query.abort()\" class=\"et-qd-chip et-qd-chip-bordered\">Abort</button>\n <div class=\"et-qd-queries__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !query.isPolling }\"\n (click)=\"query.poll({ interval: 5000, takeUntil: _destroy$ })\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Poll\n </button>\n\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': query.isPolling }\"\n (click)=\"query.stopPolling()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Stop polling\n </button>\n @if (query.isPolling || query._isPollingPaused) {\n <button (click)=\"query.pausePolling()\" class=\"et-qd-chip et-qd-chip-secondary et-qd-chip-bordered\">\n Pause polling\n </button>\n <button (click)=\"query.resumePolling()\" class=\"et-qd-chip et-qd-chip-secondary et-qd-chip-bordered\">\n Resume polling\n </button>\n }\n </div>\n\n <div class=\"et-qd-list\">\n <div class=\"et-qd-list-item\">\n <p>State type</p>\n <pre>{{ query.rawState.type }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Dependents</p>\n <pre>{{ query._dependents | json }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is expired</p>\n <pre>{{ query.isExpired }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is in use</p>\n <pre>{{ query.isInUse }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Subscriber count</p>\n <pre>{{ query._subscriberCount }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is polling</p>\n <pre>{{ query.isPolling }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is polling paused</p>\n <pre>{{ query._isPollingPaused }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Enable smart polling</p>\n <pre>{{ query._enableSmartPolling }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Query store key</p>\n <pre>{{ query._queryStoreKey }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Arguments</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showArguments() }\"\n (click)=\"toggleShowArguments()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showArguments()) {\n <pre>{{ query._arguments | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>State</p>\n <p><i> Warning, this will cause a subscription if shown!</i></p>\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showResponse() }\"\n (click)=\"toggleShowResponse()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showResponse()) {\n <pre>{{ query.state$ | async | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Raw state</p>\n <p><i> The query state unaffected by entity stores</i></p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showRawResponse() }\"\n (click)=\"toggleShowRawResponse()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showRawResponse()) {\n <pre>{{ query.rawState | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Query config</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showQueryConfig() }\"\n (click)=\"toggleShowQueryConfig()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showQueryConfig()) {\n <pre>{{ stringifiedQueryConfig() | json }}</pre>\n }\n </div>\n\n @if (!!query._queryConfig.entity) {\n <div class=\"et-qd-list-item\">\n <p>Entity store value</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showEntityStoreValue() }\"\n (click)=\"toggleShowEntityStoreValue()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showEntityStoreValue()) {\n <pre>{{ selectedQueryEntityStoreValue$ | async | json }}</pre>\n }\n </div>\n }\n </div>\n }\n </div>\n </div>\n } @else if (viewMode() === 'authProvider') {\n <div class=\"et-qd-auth-provider__viewer\">\n @if (authProviderDetails(); as details) {\n <div class=\"et-qd-list\">\n <div class=\"et-qd-list-item\">\n <p>Type</p>\n <pre>{{ details.type }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Header value</p>\n <pre>{{ details.header() | json }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Config</p>\n <pre>{{ details.config | json }}</pre>\n </div>\n\n @if (details.type === 'BearerAuthProvider') {\n <div class=\"et-qd-list-item\">\n <p>Tokens</p>\n <pre>{{ details.provider.tokens$ | async | json }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Should refresh on unauthorized response</p>\n <pre>{{ details.provider.shouldRefreshOnUnauthorizedResponse }}</pre>\n </div>\n\n <ng-container\n *etQuery=\"\n details.provider.currentRefreshQuery$ | async as response;\n loading as loading;\n error as error;\n query as query\n \"\n >\n <div class=\"et-qd-list-item\">\n <p>Refresh query response</p>\n\n <div>\n <button (click)=\"details.provider._refreshQuery()\" class=\"et-qd-chip et-qd-chip-bordered\">\n Refresh\n </button>\n </div>\n <pre>{{ response | json }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Refresh query loading</p>\n <pre>{{ loading }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Refresh query error</p>\n <pre>{{ error ?? 'null' }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>State</p>\n <pre>{{ query?.state$ | async | json }}</pre>\n </div>\n </ng-container>\n }\n </div>\n } @else {\n <p>No auth provider set</p>\n }\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [":host{position:fixed;top:0;z-index:1000000;font-size:14px;color:#fff}.et-query-devtools-container{position:fixed;inset:0;background-color:#25292e;z-index:10000;overflow:auto;font-family:monospace;display:grid;grid-template-rows:auto auto auto minmax(0,1fr)}.et-query-devtools-container.et-query-devtools-container--transparent{opacity:.25;pointer-events:none}.et-query-devtools-container.et-query-devtools-container--transparent .et-query-devtools-translucent-btn{pointer-events:all}.et-query-devtools-container.et-query-devtools-container--snap-left{inset-inline-start:0;inset-block-start:0;inset-block-end:0;width:50%;border-right:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-right{inset-inline-start:unset;inset-inline-end:0;inset-block-start:0;inset-block-end:0;width:50%;border-left:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-top{inset-inline-start:0;inset-block-start:0;inset-inline-end:0;height:50%;border-bottom:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-bottom{inset-inline-start:0;inset-block-start:unset;inset-block-end:0;inset-inline-end:0;height:50%;border-top:1px solid rgb(37,41,46)}button.et-query-devtools-open-btn{position:fixed;inset-inline-end:20px;inset-block-end:0;z-index:9999;font-family:monospace;border-radius:3px 3px 0 0;line-height:14px;font-size:12px}.et-qd-header{background-color:#00ffa1;padding:12px;display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center}.et-qd-header__title{color:#25292e;margin:0;font-size:22px}.et-qd-header__select{display:grid;background-color:#25292e;border-radius:10px;overflow:hidden}.et-qd-header__select select{width:250px;color:#fff;padding:3px 10px 2px;border:none;background-color:#25292e;font-family:monospace}.et-qd-header__select label{padding:3px 10px;color:#25292e;font-size:12px;font-weight:700;color:#fff;border-bottom:1px solid gray}.et-qd-sub-header{background-color:#00b371;padding:12px;display:flex;gap:12px;flex-wrap:wrap}.et-qd-sub-header__divider{width:1px;background-color:#25292e}.et-qd-btn{background-color:#00ffa1;color:#25292e;border:none;padding:12px;cursor:pointer;font-size:14px;font-weight:700;text-align:center;text-decoration:none;display:inline-block;width:100%;transition:all .3s ease-in-out;font-family:monospace;border-radius:10px}.et-qd-btn:hover{background-color:#00cc81}.et-qd-btn.et-qd-btn-secondary{background-color:#25292e;color:#00ffa1}.et-qd-btn.et-qd-btn-secondary:hover{background-color:#3c424a}.et-qd-chip{background-color:#00ffa1;color:#25292e;border:none;padding:4px 9px;cursor:pointer;font-size:12px;font-weight:700;text-align:center;text-decoration:none;display:inline-block;transition:all .3s ease-in-out;font-family:monospace;border-radius:10px}.et-qd-chip:hover{background-color:#00cc81}.et-qd-chip.et-qd-chip-secondary{background-color:#25292e;color:#00ffa1}.et-qd-chip.et-qd-chip-secondary:hover{background-color:#3c424a}.et-qd-chip.et-qd-chip-bordered{border:1px solid rgb(0,255,161)}.et-qd-translucent-clickable{pointer-events:all}.et-qd-client{border-bottom:1px solid rgb(59.734939759,66.1927710843,74.265060241);padding:12px}.et-qd-client__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-client__actions{display:flex;gap:12px;margin-top:12px}.et-qd-queries{padding:12px;display:grid;grid-template-rows:auto auto minmax(0,1fr)}.et-qd-queries__actions{display:flex;gap:12px;margin-top:12px;margin-bottom:16px}.et-qd-queries__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-queries__divider{width:1px;background-color:#3c424a}.et-qd-queries__browser{display:grid;grid-template-columns:1fr minmax(0,3fr);margin-left:-12px;margin-right:-12px;border-top:1px solid rgb(59.734939759,66.1927710843,74.265060241);margin-bottom:-12px}.et-qd-queries__browser-list{border-right:1px solid rgb(59.734939759,66.1927710843,74.265060241);list-style:none;padding:0;margin:0;display:grid;grid-auto-flow:row;grid-auto-rows:55px;overflow-y:auto;overflow-x:hidden}.et-qd-queries__browser-list li{margin:0}.et-qd-queries__browser-list li button{all:unset;font-family:monospace;box-sizing:border-box;width:100%;border:none;border-bottom:1px solid rgb(59.734939759,66.1927710843,74.265060241);background-color:#25292e;color:#fff;text-align:left;padding:12px;height:100%;transition:all .3s ease-in-out;cursor:pointer;display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px;display:block}.et-qd-queries__browser-list li button span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.et-qd-queries__browser-list li button span:first-of-type{font-weight:700}.et-qd-queries__browser-list li button:hover,.et-qd-queries__browser-list li button.et-qd-query--active{background-color:#30363c}.et-qd-queries__browser-detail{padding:12px;overflow-y:auto;overflow-x:hidden}.et-qd-queries__browser-detail__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-auth-provider__viewer{border-top:1px solid rgb(59.734939759,66.1927710843,74.265060241);margin-left:-12px;margin-right:-12px;margin-bottom:-12px;padding:12px;overflow-y:auto;overflow-x:hidden}.et-qd-list{display:grid;gap:12px}.et-qd-list-item{display:grid}.et-qd-list-item p{font-weight:700;margin:0;padding-bottom:8px}.et-qd-list-item p+p{margin-top:-8px}.et-qd-list-item div+pre{margin-top:8px}.et-qd-list-item pre{margin:0;padding:4px;background-color:#0e1012;border-radius:4px;max-height:450px;overflow:auto}\n"] }]
|
|
4903
|
+
}, imports: [AsyncPipe, JsonPipe, ReactiveFormsModule, NgClass, QueryShortNamePipe, QueryDirective], template: "@if (!isOpen()) {\n <button (click)=\"toggleOpen()\" class=\"et-query-devtools-open-btn et-qd-chip\">Query Devtools</button>\n}\n\n@if (isOpen()) {\n <div\n [class.et-query-devtools-container--transparent]=\"isTranslucent()\"\n class=\"et-query-devtools-container et-query-devtools-container--snap-{{ snapLayout() }}\"\n >\n <header class=\"et-qd-header\">\n <h3 class=\"et-qd-header__title\">Query Devtools</h3>\n\n <div class=\"et-qd-header__select\">\n <label for=\"et-query-client-instance\">Client instance</label>\n <select [formControl]=\"selectedClientIdCtrl\" id=\"et-query-client-instance\">\n @for (clientConfig of queryClientConfigs; track trackByClient(i, clientConfig); let i = $index) {\n <option [value]=\"i\">\n {{ clientConfig.displayName ?? clientConfig.client.config.baseRoute }}\n </option>\n }\n </select>\n </div>\n\n <button (click)=\"toggleOpen()\" class=\"et-qd-btn et-qd-btn-secondary\">Close</button>\n </header>\n\n <div class=\"et-qd-sub-header\">\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !isTranslucent() }\"\n (click)=\"toggleTranslucent()\"\n class=\"et-qd-chip et-qd-translucent-clickable\"\n >\n Translucent\n </button>\n <div class=\"et-qd-sub-header__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'full' }\"\n (click)=\"selectSnapLayout('full')\"\n class=\"et-qd-chip\"\n >\n Fullscreen\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'top' }\"\n (click)=\"selectSnapLayout('top')\"\n class=\"et-qd-chip\"\n >\n Top\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'bottom' }\"\n (click)=\"selectSnapLayout('bottom')\"\n class=\"et-qd-chip\"\n >\n Bottom\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'left' }\"\n (click)=\"selectSnapLayout('left')\"\n class=\"et-qd-chip\"\n >\n Left\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': snapLayout() !== 'right' }\"\n (click)=\"selectSnapLayout('right')\"\n class=\"et-qd-chip\"\n >\n Right\n </button>\n </div>\n\n @if (selectedClientConfig(); as cfg) {\n <div class=\"et-qd-client\">\n <p class=\"et-qd-client__title\">{{ cfg.displayName ?? cfg.client.config.baseRoute }}</p>\n\n <div class=\"et-qd-client__actions\">\n <button (click)=\"cfg.client._store.refreshQueriesInUse()\" class=\"et-qd-chip\">Refresh all</button>\n <button (click)=\"cfg.client._store.refreshQueriesInUse({ ignoreCacheValidity: true })\" class=\"et-qd-chip\">\n Refresh all (ignore caches)\n </button>\n <button\n (click)=\"cfg.client._store.refreshQueriesInUse({ ignoreCacheValidity: true, purgeUnused: true })\"\n class=\"et-qd-chip\"\n >\n Refresh all (ignore caches & purge unused)\n </button>\n </div>\n </div>\n }\n\n @if (selectedClientConfig(); as cfg) {\n <div class=\"et-qd-queries\">\n <p class=\"et-qd-queries__title\">Inspector</p>\n <div class=\"et-qd-queries__actions\">\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': queryListMode() !== 'live' || viewMode() !== 'query' }\"\n (click)=\"selectQueryListMode('live'); selectViewMode('query')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Live Queries ({{ queries()?.length ?? 0 }})\n </button>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': queryListMode() !== 'history' || viewMode() !== 'query' }\"\n (click)=\"selectQueryListMode('history'); selectViewMode('query')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Query History ({{ (queryHistory$ | async)?.length ?? 0 }}/50)\n </button>\n @if (queryListMode() === 'history' && viewMode() === 'query') {\n <div class=\"et-qd-queries__divider\"></div>\n <button (click)=\"clearQueryHistory()\" class=\"et-qd-chip et-qd-chip-bordered\">Clear history</button>\n }\n\n <div class=\"et-qd-queries__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': viewMode() !== 'authProvider' }\"\n (click)=\"selectViewMode('authProvider')\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Auth Provider\n </button>\n </div>\n\n @if (viewMode() === 'query') {\n <div class=\"et-qd-queries__browser\">\n @if (queryListMode() === 'live') {\n <ul class=\"et-qd-queries__browser-list\">\n @for (query of queries(); track trackByQuery($index, query)) {\n <li>\n <button\n [class.et-qd-query--active]=\"selectedQuery()?._id === query._id\"\n (click)=\"selectQuery(query)\"\n >\n <span> {{ query._queryConfig.method }}</span>\n <span> {{ query | queryShortName }}</span>\n </button>\n </li>\n }\n </ul>\n }\n @if (queryListMode() === 'history') {\n <ul class=\"et-qd-queries__browser-list\">\n @for (query of queryHistory$ | async; track trackByQuery($index, query)) {\n <li>\n <button\n [class.et-qd-query--active]=\"selectedQuery()?._id === query._id\"\n (click)=\"selectQuery(query)\"\n >\n <span> {{ query._queryConfig.method }}</span>\n <span> {{ query | queryShortName }}</span>\n </button>\n </li>\n }\n </ul>\n }\n <div class=\"et-qd-queries__browser-detail\">\n @if (selectedQuery(); as query) {\n <p class=\"et-qd-queries__browser-detail__title\">\n {{ query._queryConfig.method }} {{ query._routeWithParams }}\n </p>\n\n <div class=\"et-qd-queries__actions\">\n <button (click)=\"query.execute()\" class=\"et-qd-chip et-qd-chip-bordered\">Execute</button>\n <button (click)=\"query.execute({ skipCache: true })\" class=\"et-qd-chip et-qd-chip-bordered\">\n Execute (ignore cache)\n </button>\n\n <button (click)=\"query.abort()\" class=\"et-qd-chip et-qd-chip-bordered\">Abort</button>\n <div class=\"et-qd-queries__divider\"></div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !query.isPolling }\"\n (click)=\"query.poll({ interval: 5000, takeUntil: _destroy$ })\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Poll\n </button>\n\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': query.isPolling }\"\n (click)=\"query.stopPolling()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Stop polling\n </button>\n @if (query.isPolling || query._isPollingPaused) {\n <button (click)=\"query.pausePolling()\" class=\"et-qd-chip et-qd-chip-secondary et-qd-chip-bordered\">\n Pause polling\n </button>\n <button (click)=\"query.resumePolling()\" class=\"et-qd-chip et-qd-chip-secondary et-qd-chip-bordered\">\n Resume polling\n </button>\n }\n </div>\n\n <div class=\"et-qd-list\">\n <div class=\"et-qd-list-item\">\n <p>State type</p>\n <pre>{{ query.rawState.type }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Dependents</p>\n <pre>{{ query._dependents | json }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is expired</p>\n <pre>{{ query.isExpired }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is in use</p>\n <pre>{{ query.isInUse }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Subscriber count</p>\n <pre>{{ query._subscriberCount }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is polling</p>\n <pre>{{ query.isPolling }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Is polling paused</p>\n <pre>{{ query._isPollingPaused }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Enable smart polling</p>\n <pre>{{ query._enableSmartPolling }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Query store key</p>\n <pre>{{ query._queryStoreKey }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Arguments</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showArguments() }\"\n (click)=\"toggleShowArguments()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showArguments()) {\n <pre>{{ query._arguments | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>State</p>\n <p><i> Warning, this will cause a subscription if shown!</i></p>\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showResponse() }\"\n (click)=\"toggleShowResponse()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showResponse()) {\n <pre>{{ query.state$ | async | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Raw state</p>\n <p><i> The query state unaffected by entity stores</i></p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showRawResponse() }\"\n (click)=\"toggleShowRawResponse()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showRawResponse()) {\n <pre>{{ query.rawState | json }}</pre>\n }\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Query config</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showQueryConfig() }\"\n (click)=\"toggleShowQueryConfig()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showQueryConfig()) {\n <pre>{{ stringifiedQueryConfig() | json }}</pre>\n }\n </div>\n\n @if (!!query._queryConfig.entity) {\n <div class=\"et-qd-list-item\">\n <p>Entity store value</p>\n\n <div>\n <button\n [ngClass]=\"{ 'et-qd-chip-secondary': !showEntityStoreValue() }\"\n (click)=\"toggleShowEntityStoreValue()\"\n class=\"et-qd-chip et-qd-chip-bordered\"\n >\n Toggle\n </button>\n </div>\n @if (showEntityStoreValue()) {\n <pre>{{ selectedQueryEntityStoreValue$ | async | json }}</pre>\n }\n </div>\n }\n </div>\n }\n </div>\n </div>\n } @else if (viewMode() === 'authProvider') {\n <div class=\"et-qd-auth-provider__viewer\">\n @if (authProviderDetails(); as details) {\n <div class=\"et-qd-list\">\n <div class=\"et-qd-list-item\">\n <p>Type</p>\n <pre>{{ details.type }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Header value</p>\n <pre>{{ details.header() | json }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Config</p>\n <pre>{{ details.config | json }}</pre>\n </div>\n\n @if (details.type === 'BearerAuthProvider') {\n <div class=\"et-qd-list-item\">\n <p>Tokens</p>\n <pre>{{ details.provider.tokens$ | async | json }}</pre>\n </div>\n\n <div class=\"et-qd-list-item\">\n <p>Should refresh on unauthorized response</p>\n <pre>{{ details.provider.shouldRefreshOnUnauthorizedResponse }}</pre>\n </div>\n\n <ng-container\n *etQuery=\"\n details.provider.currentRefreshQuery$ | async as response;\n loading as loading;\n error as error;\n query as query\n \"\n >\n <div class=\"et-qd-list-item\">\n <p>Refresh query response</p>\n\n <div>\n <button (click)=\"details.provider._refreshQuery()\" class=\"et-qd-chip et-qd-chip-bordered\">\n Refresh\n </button>\n </div>\n <pre>{{ response | json }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Refresh query loading</p>\n <pre>{{ loading }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>Refresh query error</p>\n <pre>{{ error ?? 'null' }}</pre>\n </div>\n <div class=\"et-qd-list-item\">\n <p>State</p>\n <pre>{{ $safeNavigationMigration(query?.state$) | async | json }}</pre>\n </div>\n </ng-container>\n }\n </div>\n } @else {\n <p>No auth provider set</p>\n }\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [":host{position:fixed;top:0;z-index:1000000;font-size:14px;color:#fff}.et-query-devtools-container{position:fixed;inset:0;background-color:#25292e;z-index:10000;overflow:auto;font-family:monospace;display:grid;grid-template-rows:auto auto auto minmax(0,1fr)}.et-query-devtools-container.et-query-devtools-container--transparent{opacity:.25;pointer-events:none}.et-query-devtools-container.et-query-devtools-container--transparent .et-query-devtools-translucent-btn{pointer-events:all}.et-query-devtools-container.et-query-devtools-container--snap-left{inset-inline-start:0;inset-block-start:0;inset-block-end:0;width:50%;border-right:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-right{inset-inline-start:unset;inset-inline-end:0;inset-block-start:0;inset-block-end:0;width:50%;border-left:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-top{inset-inline-start:0;inset-block-start:0;inset-inline-end:0;height:50%;border-bottom:1px solid rgb(37,41,46)}.et-query-devtools-container.et-query-devtools-container--snap-bottom{inset-inline-start:0;inset-block-start:unset;inset-block-end:0;inset-inline-end:0;height:50%;border-top:1px solid rgb(37,41,46)}button.et-query-devtools-open-btn{position:fixed;inset-inline-end:20px;inset-block-end:0;z-index:9999;font-family:monospace;border-radius:3px 3px 0 0;line-height:14px;font-size:12px}.et-qd-header{background-color:#00ffa1;padding:12px;display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center}.et-qd-header__title{color:#25292e;margin:0;font-size:22px}.et-qd-header__select{display:grid;background-color:#25292e;border-radius:10px;overflow:hidden}.et-qd-header__select select{width:250px;color:#fff;padding:3px 10px 2px;border:none;background-color:#25292e;font-family:monospace}.et-qd-header__select label{padding:3px 10px;color:#25292e;font-size:12px;font-weight:700;color:#fff;border-bottom:1px solid gray}.et-qd-sub-header{background-color:#00b371;padding:12px;display:flex;gap:12px;flex-wrap:wrap}.et-qd-sub-header__divider{width:1px;background-color:#25292e}.et-qd-btn{background-color:#00ffa1;color:#25292e;border:none;padding:12px;cursor:pointer;font-size:14px;font-weight:700;text-align:center;text-decoration:none;display:inline-block;width:100%;transition:all .3s ease-in-out;font-family:monospace;border-radius:10px}.et-qd-btn:hover{background-color:#00cc81}.et-qd-btn.et-qd-btn-secondary{background-color:#25292e;color:#00ffa1}.et-qd-btn.et-qd-btn-secondary:hover{background-color:#3c424a}.et-qd-chip{background-color:#00ffa1;color:#25292e;border:none;padding:4px 9px;cursor:pointer;font-size:12px;font-weight:700;text-align:center;text-decoration:none;display:inline-block;transition:all .3s ease-in-out;font-family:monospace;border-radius:10px}.et-qd-chip:hover{background-color:#00cc81}.et-qd-chip.et-qd-chip-secondary{background-color:#25292e;color:#00ffa1}.et-qd-chip.et-qd-chip-secondary:hover{background-color:#3c424a}.et-qd-chip.et-qd-chip-bordered{border:1px solid rgb(0,255,161)}.et-qd-translucent-clickable{pointer-events:all}.et-qd-client{border-bottom:1px solid rgb(59.734939759,66.1927710843,74.265060241);padding:12px}.et-qd-client__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-client__actions{display:flex;gap:12px;margin-top:12px}.et-qd-queries{padding:12px;display:grid;grid-template-rows:auto auto minmax(0,1fr)}.et-qd-queries__actions{display:flex;gap:12px;margin-top:12px;margin-bottom:16px}.et-qd-queries__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-queries__divider{width:1px;background-color:#3c424a}.et-qd-queries__browser{display:grid;grid-template-columns:1fr minmax(0,3fr);margin-left:-12px;margin-right:-12px;border-top:1px solid rgb(59.734939759,66.1927710843,74.265060241);margin-bottom:-12px}.et-qd-queries__browser-list{border-right:1px solid rgb(59.734939759,66.1927710843,74.265060241);list-style:none;padding:0;margin:0;display:grid;grid-auto-flow:row;grid-auto-rows:55px;overflow-y:auto;overflow-x:hidden}.et-qd-queries__browser-list li{margin:0}.et-qd-queries__browser-list li button{all:unset;font-family:monospace;box-sizing:border-box;width:100%;border:none;border-bottom:1px solid rgb(59.734939759,66.1927710843,74.265060241);background-color:#25292e;color:#fff;text-align:left;padding:12px;height:100%;transition:all .3s ease-in-out;cursor:pointer;display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px;display:block}.et-qd-queries__browser-list li button span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.et-qd-queries__browser-list li button span:first-of-type{font-weight:700}.et-qd-queries__browser-list li button:hover,.et-qd-queries__browser-list li button.et-qd-query--active{background-color:#30363c}.et-qd-queries__browser-detail{padding:12px;overflow-y:auto;overflow-x:hidden}.et-qd-queries__browser-detail__title{margin:0;font-size:14px;color:#fff;font-weight:700}.et-qd-auth-provider__viewer{border-top:1px solid rgb(59.734939759,66.1927710843,74.265060241);margin-left:-12px;margin-right:-12px;margin-bottom:-12px;padding:12px;overflow-y:auto;overflow-x:hidden}.et-qd-list{display:grid;gap:12px}.et-qd-list-item{display:grid}.et-qd-list-item p{font-weight:700;margin:0;padding-bottom:8px}.et-qd-list-item p+p{margin-top:-8px}.et-qd-list-item div+pre{margin-top:8px}.et-qd-list-item pre{margin:0;padding:4px;background-color:#0e1012;border-radius:4px;max-height:450px;overflow:auto}\n"] }]
|
|
4798
4904
|
}], ctorParameters: () => [] });
|
|
4799
4905
|
|
|
4800
4906
|
class EntityStoreError extends Error {
|
|
@@ -5041,26 +5147,17 @@ const createQueryRepository = (config) => {
|
|
|
5041
5147
|
else {
|
|
5042
5148
|
const consumers = new Map([]);
|
|
5043
5149
|
consumers.set(consumerDestroyRef, destroyListener);
|
|
5044
|
-
|
|
5045
|
-
|
|
5046
|
-
|
|
5047
|
-
|
|
5048
|
-
if (
|
|
5049
|
-
|
|
5050
|
-
type: 'request-error',
|
|
5051
|
-
|
|
5052
|
-
key,
|
|
5053
|
-
isSecure,
|
|
5054
|
-
request,
|
|
5055
|
-
});
|
|
5150
|
+
// Drive repository events off the request's discrete, terminal event stream rather than
|
|
5151
|
+
// recombining the `error` + `response` signals via combineLatest (which could observe stale
|
|
5152
|
+
// pairings). Each settle emits exactly one terminal event.
|
|
5153
|
+
const eventSubscription = request.events$.subscribe((event) => {
|
|
5154
|
+
if (event.type === 'error') {
|
|
5155
|
+
if (event.error.raw instanceof HttpErrorResponse) {
|
|
5156
|
+
eventsSubject.next({ type: 'request-error', error: event.error.raw, key, isSecure, request });
|
|
5157
|
+
}
|
|
5056
5158
|
}
|
|
5057
|
-
else if (
|
|
5058
|
-
eventsSubject.next({
|
|
5059
|
-
type: 'request-success',
|
|
5060
|
-
key,
|
|
5061
|
-
isSecure,
|
|
5062
|
-
request,
|
|
5063
|
-
});
|
|
5159
|
+
else if (event.type === HttpEventType.Response) {
|
|
5160
|
+
eventsSubject.next({ type: 'request-success', key, isSecure, request });
|
|
5064
5161
|
}
|
|
5065
5162
|
});
|
|
5066
5163
|
cache.set(key, {
|
|
@@ -5165,8 +5262,10 @@ const setupLeaderElection = () => {
|
|
|
5165
5262
|
const leaderTimeout = 3000;
|
|
5166
5263
|
const storageKey = 'ethlete-auth-leader-heartbeat';
|
|
5167
5264
|
const tabId = `tab-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
|
|
5168
|
-
const isLeader = signal(false,
|
|
5169
|
-
|
|
5265
|
+
const isLeader = signal(false, /* @ts-ignore */
|
|
5266
|
+
...(ngDevMode ? [{ debugName: "isLeader" }] : /* istanbul ignore next */ []));
|
|
5267
|
+
const instanceCount = signal(1, /* @ts-ignore */
|
|
5268
|
+
...(ngDevMode ? [{ debugName: "instanceCount" }] : /* istanbul ignore next */ []));
|
|
5170
5269
|
const knownTabs = new Map();
|
|
5171
5270
|
knownTabs.set(tabId, Date.now());
|
|
5172
5271
|
let channel = null;
|
|
@@ -5553,7 +5652,8 @@ const setupBearerQueryRegistry = (builders, injector, latestExecutedQuery, lates
|
|
|
5553
5652
|
const queries = {};
|
|
5554
5653
|
const querySnapshots = new Map();
|
|
5555
5654
|
for (const builder of builders) {
|
|
5556
|
-
const querySnapshot = signal(null,
|
|
5655
|
+
const querySnapshot = signal(null, /* @ts-ignore */
|
|
5656
|
+
...(ngDevMode ? [{ debugName: "querySnapshot" }] : /* istanbul ignore next */ []));
|
|
5557
5657
|
querySnapshots.set(builder.key, querySnapshot);
|
|
5558
5658
|
const extractTokens = builder.config.extractTokens ?? defaultExtractTokens;
|
|
5559
5659
|
effect(() => {
|
|
@@ -5662,8 +5762,10 @@ const createBearerAuthProviderImpl = (config) => {
|
|
|
5662
5762
|
const injector = inject(Injector);
|
|
5663
5763
|
const destroyRef = inject(DestroyRef);
|
|
5664
5764
|
const queryClient = config.queryClientRef[1]();
|
|
5665
|
-
const accessToken = signal(null,
|
|
5666
|
-
|
|
5765
|
+
const accessToken = signal(null, /* @ts-ignore */
|
|
5766
|
+
...(ngDevMode ? [{ debugName: "accessToken" }] : /* istanbul ignore next */ []));
|
|
5767
|
+
const refreshToken = signal(null, /* @ts-ignore */
|
|
5768
|
+
...(ngDevMode ? [{ debugName: "refreshToken" }] : /* istanbul ignore next */ []));
|
|
5667
5769
|
const afterTokenRefresh$ = new Subject();
|
|
5668
5770
|
const bearerData = computed(() => {
|
|
5669
5771
|
const token = accessToken();
|
|
@@ -5678,11 +5780,16 @@ const createBearerAuthProviderImpl = (config) => {
|
|
|
5678
5780
|
}
|
|
5679
5781
|
return null;
|
|
5680
5782
|
}
|
|
5681
|
-
},
|
|
5682
|
-
|
|
5683
|
-
const
|
|
5684
|
-
|
|
5685
|
-
const
|
|
5783
|
+
}, /* @ts-ignore */
|
|
5784
|
+
...(ngDevMode ? [{ debugName: "bearerData" }] : /* istanbul ignore next */ []));
|
|
5785
|
+
const isAuthenticated = computed(() => !!accessToken(), /* @ts-ignore */
|
|
5786
|
+
...(ngDevMode ? [{ debugName: "isAuthenticated" }] : /* istanbul ignore next */ []));
|
|
5787
|
+
const latestExecutedQuery = signal(null, /* @ts-ignore */
|
|
5788
|
+
...(ngDevMode ? [{ debugName: "latestExecutedQuery" }] : /* istanbul ignore next */ []));
|
|
5789
|
+
const latestNonInternalQuery = signal(null, /* @ts-ignore */
|
|
5790
|
+
...(ngDevMode ? [{ debugName: "latestNonInternalQuery" }] : /* istanbul ignore next */ []));
|
|
5791
|
+
const executionState = signal(null, /* @ts-ignore */
|
|
5792
|
+
...(ngDevMode ? [{ debugName: "executionState" }] : /* istanbul ignore next */ []));
|
|
5686
5793
|
const setTokens = (access, refresh) => {
|
|
5687
5794
|
accessToken.set(access);
|
|
5688
5795
|
refreshToken.set(refresh);
|
|
@@ -5886,8 +5993,10 @@ const withInactivityLogout = (config = {}) => {
|
|
|
5886
5993
|
const activityEvents = config.activityEvents ?? ['mousedown', 'keydown', 'scroll', 'touchstart'];
|
|
5887
5994
|
const destroyRef = inject(DestroyRef);
|
|
5888
5995
|
const document = inject(DOCUMENT);
|
|
5889
|
-
const enabled = signal(true,
|
|
5890
|
-
|
|
5996
|
+
const enabled = signal(true, /* @ts-ignore */
|
|
5997
|
+
...(ngDevMode ? [{ debugName: "enabled" }] : /* istanbul ignore next */ []));
|
|
5998
|
+
const lastActivityTime = signal(Date.now(), /* @ts-ignore */
|
|
5999
|
+
...(ngDevMode ? [{ debugName: "lastActivityTime" }] : /* istanbul ignore next */ []));
|
|
5891
6000
|
const resetTimer = () => {
|
|
5892
6001
|
lastActivityTime.set(Date.now());
|
|
5893
6002
|
};
|
|
@@ -5970,7 +6079,8 @@ const createPersistentAuthFeature = (config, context) => {
|
|
|
5970
6079
|
}
|
|
5971
6080
|
return config.defaultRememberMe ?? false;
|
|
5972
6081
|
};
|
|
5973
|
-
const rememberMeSignal = signal(initializeRememberMe(),
|
|
6082
|
+
const rememberMeSignal = signal(initializeRememberMe(), /* @ts-ignore */
|
|
6083
|
+
...(ngDevMode ? [{ debugName: "rememberMeSignal" }] : /* istanbul ignore next */ []));
|
|
5974
6084
|
effect(() => {
|
|
5975
6085
|
const token = refreshToken();
|
|
5976
6086
|
const rememberMe = rememberMeSignal();
|
|
@@ -6031,7 +6141,8 @@ const withTokenExpirationWarning = (config = {}) => {
|
|
|
6031
6141
|
if (typeof exp !== 'number')
|
|
6032
6142
|
return null;
|
|
6033
6143
|
return new Date(exp * 1000);
|
|
6034
|
-
},
|
|
6144
|
+
}, /* @ts-ignore */
|
|
6145
|
+
...(ngDevMode ? [{ debugName: "expiresAt" }] : /* istanbul ignore next */ []));
|
|
6035
6146
|
const expiresIn$ = combineLatest([interval(checkInterval), toObservable(context.bearerData)]).pipe(map(() => {
|
|
6036
6147
|
const expiry = expiresAt();
|
|
6037
6148
|
if (!expiry)
|
|
@@ -6062,7 +6173,8 @@ const withTokenExpirationWarning = (config = {}) => {
|
|
|
6062
6173
|
const withTokenRevocation = (config) => {
|
|
6063
6174
|
return (context) => {
|
|
6064
6175
|
const revokeOnLogout = config.revokeOnLogout ?? true;
|
|
6065
|
-
const enabled = signal(true,
|
|
6176
|
+
const enabled = signal(true, /* @ts-ignore */
|
|
6177
|
+
...(ngDevMode ? [{ debugName: "enabled" }] : /* istanbul ignore next */ []));
|
|
6066
6178
|
let previousAccessToken = null;
|
|
6067
6179
|
let previousRefreshToken = null;
|
|
6068
6180
|
let currentRevocationSnapshot = null;
|
|
@@ -6420,10 +6532,10 @@ class ParseHttpErrorCodeToTitleDePipe {
|
|
|
6420
6532
|
constructor() {
|
|
6421
6533
|
this.transform = parseHttpErrorCodeToTitleDe;
|
|
6422
6534
|
}
|
|
6423
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6424
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
6535
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToTitleDePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
6536
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToTitleDePipe, isStandalone: true, name: "parseHttpErrorCodeToTitleDe" }); }
|
|
6425
6537
|
}
|
|
6426
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6538
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToTitleDePipe, decorators: [{
|
|
6427
6539
|
type: Pipe,
|
|
6428
6540
|
args: [{
|
|
6429
6541
|
name: 'parseHttpErrorCodeToTitleDe',
|
|
@@ -6433,10 +6545,10 @@ class ParseHttpErrorCodeToMessageDePipe {
|
|
|
6433
6545
|
constructor() {
|
|
6434
6546
|
this.transform = parseHttpErrorCodeToMessageDe;
|
|
6435
6547
|
}
|
|
6436
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6437
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
6548
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToMessageDePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
6549
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToMessageDePipe, isStandalone: true, name: "parseHttpErrorCodeToMessageDe" }); }
|
|
6438
6550
|
}
|
|
6439
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6551
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToMessageDePipe, decorators: [{
|
|
6440
6552
|
type: Pipe,
|
|
6441
6553
|
args: [{
|
|
6442
6554
|
name: 'parseHttpErrorCodeToMessageDe',
|
|
@@ -6620,10 +6732,10 @@ class ParseHttpErrorCodeToTitleEnPipe {
|
|
|
6620
6732
|
constructor() {
|
|
6621
6733
|
this.transform = parseHttpErrorCodeToTitleEn;
|
|
6622
6734
|
}
|
|
6623
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6624
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
6735
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToTitleEnPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
6736
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToTitleEnPipe, isStandalone: true, name: "parseHttpErrorCodeToTitleEn" }); }
|
|
6625
6737
|
}
|
|
6626
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6738
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToTitleEnPipe, decorators: [{
|
|
6627
6739
|
type: Pipe,
|
|
6628
6740
|
args: [{
|
|
6629
6741
|
name: 'parseHttpErrorCodeToTitleEn',
|
|
@@ -6633,10 +6745,10 @@ class ParseHttpErrorCodeToMessageEnPipe {
|
|
|
6633
6745
|
constructor() {
|
|
6634
6746
|
this.transform = parseHttpErrorCodeToMessageEn;
|
|
6635
6747
|
}
|
|
6636
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6637
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
6748
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToMessageEnPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
6749
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToMessageEnPipe, isStandalone: true, name: "parseHttpErrorCodeToMessageEn" }); }
|
|
6638
6750
|
}
|
|
6639
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6751
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ParseHttpErrorCodeToMessageEnPipe, decorators: [{
|
|
6640
6752
|
type: Pipe,
|
|
6641
6753
|
args: [{
|
|
6642
6754
|
name: 'parseHttpErrorCodeToMessageEn',
|
|
@@ -7306,17 +7418,20 @@ const createWebSocketClient = (options) => {
|
|
|
7306
7418
|
transports: options.transports,
|
|
7307
7419
|
});
|
|
7308
7420
|
const rooms = new Map();
|
|
7309
|
-
const isConnected = signal(false,
|
|
7421
|
+
const isConnected = signal(false, /* @ts-ignore */
|
|
7422
|
+
...(ngDevMode ? [{ debugName: "isConnected" }] : /* istanbul ignore next */ []));
|
|
7310
7423
|
const joinRoom = (room) => {
|
|
7311
7424
|
const roomFn = typeof room === 'function' ? room : () => room;
|
|
7312
7425
|
const pre = previousSignalValue(computed(() => roomFn()));
|
|
7313
|
-
const roomData = signal(null,
|
|
7426
|
+
const roomData = signal(null, /* @ts-ignore */
|
|
7427
|
+
...(ngDevMode ? [{ debugName: "roomData" }] : /* istanbul ignore next */ []));
|
|
7314
7428
|
const join = (name) => {
|
|
7315
7429
|
socket.emit('join-room', name);
|
|
7316
7430
|
const existingRoom = rooms.get(name);
|
|
7317
7431
|
if (existingRoom)
|
|
7318
7432
|
return existingRoom;
|
|
7319
|
-
const message = signal(null,
|
|
7433
|
+
const message = signal(null, /* @ts-ignore */
|
|
7434
|
+
...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
|
|
7320
7435
|
const newRoom = {
|
|
7321
7436
|
latestMessage: message,
|
|
7322
7437
|
};
|