Skip to content

Commit 4329c43

Browse files
Mythiejhuleatt
andauthored
disable observable timeouts for suspense (#525)
Co-authored-by: Jeff <3759507+jhuleatt@users.noreply.github.com>
1 parent 546fe9b commit 4329c43

2 files changed

Lines changed: 13 additions & 6 deletions

File tree

src/SuspenseSubject.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export class SuspenseSubject<T> extends Subject<T> {
1515
// @ts-expect-error: TODO: double check to see if this is an RXJS thing or if we should listen to TS
1616
private _resolveFirstEmission: () => void;
1717

18-
constructor(innerObservable: Observable<T>, private _timeoutWindow: number) {
18+
constructor(innerObservable: Observable<T>, private _timeoutWindow: number, private _suspenseEnabled: boolean) {
1919
super();
2020
this._firstEmission = new Promise<void>((resolve) => (this._resolveFirstEmission = resolve));
2121
this._innerObservable = innerObservable.pipe(
@@ -38,7 +38,13 @@ export class SuspenseSubject<T> extends Subject<T> {
3838

3939
// set a timeout for resetting the cache, subscriptions will cancel the timeout
4040
// and reschedule again on unsubscribe
41-
this._timeoutHandler = setTimeout(this._reset.bind(this), this._timeoutWindow);
41+
if (this._suspenseEnabled) {
42+
// Noop if suspense is enabled
43+
console.log('SuspenseSubject: Suspense is enabled');
44+
this._timeoutHandler = setTimeout(() => {}, this._timeoutWindow);
45+
} else {
46+
this._timeoutHandler = setTimeout(this._reset.bind(this), this._timeoutWindow);
47+
}
4248
}
4349

4450
get hasValue(): boolean {

src/useObservable.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,11 @@ if (!(globalThis as any as ReactFireGlobals)._reactFirePreloadedObservables) {
1616
// Starts listening to an Observable.
1717
// Call this once you know you're going to render a
1818
// child that will consume the observable
19-
export function preloadObservable<T>(source: Observable<T>, id: string) {
19+
export function preloadObservable<T>(source: Observable<T>, id: string, suspenseEnabled = false) {
2020
if (preloadedObservables.has(id)) {
2121
return preloadedObservables.get(id) as SuspenseSubject<T>;
2222
} else {
23-
const observable = new SuspenseSubject(source, DEFAULT_TIMEOUT);
23+
const observable = new SuspenseSubject(source, DEFAULT_TIMEOUT, suspenseEnabled);
2424
preloadedObservables.set(id, observable);
2525
return observable;
2626
}
@@ -97,12 +97,13 @@ export function useObservable<T = unknown>(observableId: string, source: Observa
9797
if (!observableId) {
9898
throw new Error('cannot call useObservable without an observableId');
9999
}
100-
const observable = preloadObservable(source, observableId);
100+
const suspenseEnabled = useSuspenseEnabledFromConfigAndContext(config.suspense);
101+
102+
const observable = preloadObservable(source, observableId, suspenseEnabled);
101103

102104
// Suspend if suspense is enabled and no initial data exists
103105
const hasInitialData = config.hasOwnProperty('initialData') || config.hasOwnProperty('startWithValue');
104106
const hasData = observable.hasValue || hasInitialData;
105-
const suspenseEnabled = useSuspenseEnabledFromConfigAndContext(config.suspense);
106107
if (suspenseEnabled === true && !hasData) {
107108
throw observable.firstEmission;
108109
}

0 commit comments

Comments
 (0)