reactfire 4.2.3-exp.9754f86 → 4.2.3-exp.a1d5930

package/dist/sdk.d.ts

@@ -20,34 +20,34 @@ export declare const FunctionsSdkContext: React.Context<Functions | undefined>;
 export declare const StorageSdkContext: React.Context<FirebaseStorage | undefined>;
 export declare const PerformanceSdkContext: React.Context<FirebasePerformance | undefined>;
 export declare const RemoteConfigSdkContext: React.Context<RemoteConfig | undefined>;
-declare type FirebaseSdks = Analytics | AppCheck | Auth | Database | Firestore | FirebasePerformance | FirebaseStorage | Functions | RemoteConfig;
+type FirebaseSdks = Analytics | AppCheck | Auth | Database | Firestore | FirebasePerformance | FirebaseStorage | Functions | RemoteConfig;
 export declare const AppCheckProvider: (props: React.PropsWithChildren<{
     sdk: AppCheck;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const AuthProvider: (props: React.PropsWithChildren<{
     sdk: Auth;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const AnalyticsProvider: (props: React.PropsWithChildren<{
     sdk: Analytics;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const DatabaseProvider: (props: React.PropsWithChildren<{
     sdk: Database;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const FirestoreProvider: (props: React.PropsWithChildren<{
     sdk: Firestore;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const FunctionsProvider: (props: React.PropsWithChildren<{
     sdk: Functions;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const PerformanceProvider: (props: React.PropsWithChildren<{
     sdk: FirebasePerformance;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const StorageProvider: (props: React.PropsWithChildren<{
     sdk: FirebaseStorage;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const RemoteConfigProvider: (props: React.PropsWithChildren<{
     sdk: RemoteConfig;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export declare const useAppCheck: () => AppCheck;
 export declare const useAuth: () => Auth;
 export declare const useAnalytics: () => Analytics;
@@ -57,7 +57,7 @@ export declare const useFunctions: () => Functions;
 export declare const usePerformance: () => FirebasePerformance;
 export declare const useStorage: () => FirebaseStorage;
 export declare const useRemoteConfig: () => RemoteConfig;
-declare type InitSdkHook<Sdk extends FirebaseSdks> = (initializer: (firebaseApp: FirebaseApp) => Promise<Sdk>, options?: ReactFireOptions<Sdk>) => ObservableStatus<Sdk>;
+type InitSdkHook<Sdk extends FirebaseSdks> = (initializer: (firebaseApp: FirebaseApp) => Promise<Sdk>, options?: ReactFireOptions<Sdk>) => ObservableStatus<Sdk>;
 export declare const useInitAppCheck: InitSdkHook<AppCheck>;
 export declare const useInitAuth: InitSdkHook<Auth>;
 export declare const useInitAnalytics: InitSdkHook<Analytics>;

package/dist/storage.d.ts

@@ -16,11 +16,11 @@ export declare function useStorageTask<T = unknown>(task: UploadTask, ref: Stora
  * @param options
  */
 export declare function useStorageDownloadURL<T = string>(ref: StorageReference, options?: ReactFireOptions<T>): ObservableStatus<string | T>;
-declare type StorageImageProps = {
+type StorageImageProps = {
     storagePath: string;
     storage?: FirebaseStorage;
     suspense?: boolean;
     placeHolder?: JSX.Element;
 };
-export declare function StorageImage(props: StorageImageProps & React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>): JSX.Element;
+export declare function StorageImage(props: StorageImageProps & React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>): React.JSX.Element;
 export {};

package/dist/useObservable.d.ts

@@ -1,7 +1,7 @@
 import { Observable } from 'rxjs';
 import { SuspenseSubject } from './SuspenseSubject';
 import { ReactFireOptions } from './';
-export declare function preloadObservable<T>(source: Observable<T>, id: string): SuspenseSubject<T>;
+export declare function preloadObservable<T>(source: Observable<T>, id: string, suspenseEnabled?: boolean): SuspenseSubject<T>;
 export interface ObservableStatus<T> {
     /**
      * The loading status.

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "4.2.3-exp.9754f86",
+  "version": "4.2.3-exp.a1d5930",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.umd.cjs",
@@ -36,7 +36,7 @@
     "docs:fork": "typedoc --options typedoc.json --gitRemote upstream && markdown-toc -i docs/use.md"
   },
   "peerDependencies": {
-    "firebase": "^9.0.0",
+    "firebase": "^9.0.0 || next",
     "react": ">=16 || experimental"
   },
   "husky": {
@@ -71,40 +71,39 @@
     }
   ],
   "devDependencies": {
-    "@rollup/plugin-typescript": "^8.3.4",
-    "@size-limit/preset-small-lib": "^7.0.8",
-    "@testing-library/jest-dom": "^5.16.4",
-    "@testing-library/react": "^12.1.5",
-    "@testing-library/react-hooks": "^8.0.1",
-    "@types/react": "^17.0.2",
-    "@types/react-dom": "^17.0.2",
-    "@typescript-eslint/eslint-plugin": "^5.32.0",
-    "@typescript-eslint/parser": "^5.32.0",
-    "@vitejs/plugin-react": "^2.0.0",
-    "@vitest/ui": "^0.20.3",
-    "cross-fetch": "^3.1.5",
-    "eslint": "^8.20.0",
-    "eslint-plugin-no-only-tests": "^2.6.0",
-    "eslint-plugin-react": "^7.30.1",
+    "@rollup/plugin-typescript": "^11.1.1",
+    "@size-limit/preset-small-lib": "^8.2.6",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^14.0.0",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "@typescript-eslint/eslint-plugin": "^5.60.1",
+    "@typescript-eslint/parser": "^5.60.1",
+    "@vitejs/plugin-react": "^4.0.1",
+    "@vitest/ui": "^0.32.2",
+    "cross-fetch": "^3.1.6",
+    "eslint": "^8.43.0",
+    "eslint-plugin-no-only-tests": "^3.1.0",
+    "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "firebase": "^9.9.0",
-    "firebase-tools": "^11.3.0",
+    "firebase-tools": "^12.4.0",
     "globalthis": "^1.0.3",
-    "husky": "^8.0.1",
-    "jest-environment-jsdom": "^28.1.3",
-    "jsdom": "^20.0.0",
+    "husky": "^8.0.3",
+    "jest-environment-jsdom": "^29.5.0",
+    "jsdom": "^22.1.0",
     "markdown-toc": "^1.2.0",
-    "prettier": "^2.7.1",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "react-test-renderer": "^17.0.2",
-    "rollup-plugin-visualizer": "^5.7.1",
-    "size-limit": "^7.0.8",
-    "typedoc": "^0.23.8",
-    "typedoc-plugin-markdown": "^3.13.3",
-    "typescript": "^4.7.4",
-    "vite": "^3.0.2",
-    "vitest": "^0.18.1"
+    "prettier": "^2.8.8",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-test-renderer": "^18.2.0",
+    "rollup-plugin-visualizer": "^5.9.2",
+    "size-limit": "^8.2.6",
+    "typedoc": "^0.24.8",
+    "typedoc-plugin-markdown": "^3.15.3",
+    "typescript": "^5.1.3",
+    "vite": "^4.3.9",
+    "vitest": "^0.32.2"
   },
   "dependencies": {
     "rxfire": "^6.0.3",

package/src/SuspenseSubject.ts

@@ -15,7 +15,7 @@ export class SuspenseSubject<T> extends Subject<T> {
   // @ts-expect-error: TODO: double check to see if this is an RXJS thing or if we should listen to TS
   private _resolveFirstEmission: () => void;
 
-  constructor(innerObservable: Observable<T>, private _timeoutWindow: number) {
+  constructor(innerObservable: Observable<T>, private _timeoutWindow: number, private _suspenseEnabled: boolean) {
     super();
     this._firstEmission = new Promise<void>((resolve) => (this._resolveFirstEmission = resolve));
     this._innerObservable = innerObservable.pipe(
@@ -38,7 +38,12 @@ export class SuspenseSubject<T> extends Subject<T> {
 
     // set a timeout for resetting the cache, subscriptions will cancel the timeout
     // and reschedule again on unsubscribe
-    this._timeoutHandler = setTimeout(this._reset.bind(this), this._timeoutWindow);
+    if (this._suspenseEnabled) {
+      // Noop if suspense is enabled
+      this._timeoutHandler = setTimeout(() => {}, this._timeoutWindow);
+    } else {
+      this._timeoutHandler = setTimeout(this._reset.bind(this), this._timeoutWindow);
+    }
   }
 
   get hasValue(): boolean {

package/src/auth.tsx

@@ -28,7 +28,7 @@ export function useUser<T = unknown>(options?: ReactFireOptions<T>): ObservableS
   return useObservable(observableId, observable$, options);
 }
 
-export function useIdTokenResult(user: User, forceRefresh: boolean = false, options?: ReactFireOptions<IdTokenResult>): ObservableStatus<IdTokenResult> {
+export function useIdTokenResult(user: User, forceRefresh = false, options?: ReactFireOptions<IdTokenResult>): ObservableStatus<IdTokenResult> {
   if (!user) {
     throw new Error('you must provide a user');
   }
@@ -173,7 +173,7 @@ export function useSigninCheck(
     })
   );
 
-  return useObservable(observableId, observable);
+  return useObservable(observableId, observable, options);
 }
 
 function getClaimsObjectValidator(requiredClaims: Claims): ClaimsValidator {

package/src/firebaseApp.tsx

@@ -65,7 +65,7 @@ export function useIsSuspenseEnabled(): boolean {
 }
 
 export function useSuspenseEnabledFromConfigAndContext(suspenseFromConfig?: boolean): boolean {
-  let suspenseFromContext = React.useContext(SuspenseEnabledContext);
+  const suspenseFromContext = React.useContext(SuspenseEnabledContext);
 
   // prioritize config over context
   if (suspenseFromConfig !== undefined) {

package/src/firestore.tsx

@@ -6,13 +6,13 @@ import { first } from 'rxjs/operators';
 import { Query as FirestoreQuery, QuerySnapshot, DocumentReference, queryEqual, DocumentData, DocumentSnapshot } from 'firebase/firestore';
 
 // Since we're side-effect free, we need to ensure our observableId cache is global
-const cachedQueries: Array<FirestoreQuery> = (globalThis as any as ReactFireGlobals)._reactFireFirestoreQueryCache || [];
+const cachedQueries: Array<FirestoreQuery<any>> = (globalThis as any as ReactFireGlobals)._reactFireFirestoreQueryCache || [];
 
 if (!(globalThis as any as ReactFireGlobals)._reactFireFirestoreQueryCache) {
   (globalThis as any as ReactFireGlobals)._reactFireFirestoreQueryCache = cachedQueries;
 }
 
-function getUniqueIdForFirestoreQuery(query: FirestoreQuery) {
+function getUniqueIdForFirestoreQuery<T = DocumentData>(query: FirestoreQuery<T>) {
   const index = cachedQueries.findIndex((cachedQuery) => queryEqual(cachedQuery, query));
   if (index > -1) {
     return index;
@@ -30,12 +30,12 @@ export async function preloadFirestoreDoc(refProvider: () => Promise<DocumentRef
   return preloadObservable(doc(ref), getDocObservableId(ref));
 }
 
-function getDocObservableId(ref: DocumentReference) {
+function getDocObservableId<T = DocumentData>(ref: DocumentReference<T>) {
   return `firestore:doc:${ref.firestore.app.name}:${ref.path}`;
 }
 
 /**
- * Suscribe to Firestore Document changes
+ * Subscribe to Firestore Document changes
  *
  * You can preload data for this hook by calling `preloadFirestoreDoc`
  */
@@ -57,7 +57,7 @@ export function useFirestoreDocOnce<T = DocumentData>(ref: DocumentReference<T>,
 }
 
 /**
- * Suscribe to Firestore Document changes and unwrap the document into a plain object
+ * Subscribe to Firestore Document changes and unwrap the document into a plain object
  */
 export function useFirestoreDocData<T = unknown>(ref: DocumentReference<T>, options?: ReactFireOptions<T>): ObservableStatus<T> {
   const idField = options ? checkIdField(options) : 'NO_ID_FIELD';

package/src/storage.tsx

@@ -49,7 +49,7 @@ function StorageFromContext(props: StorageImageProps & React.DetailedHTMLProps<R
 }
 
 function INTERNALStorageImage(props: StorageImageProps & React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>): JSX.Element {
-  let { storage, storagePath, suspense, placeHolder, ...imgProps } = props;
+  const { storage, storagePath, suspense, placeHolder, ...imgProps } = props;
 
   const reactfireOptions: ReactFireOptions<string> = {
     suspense: useSuspenseEnabledFromConfigAndContext(suspense),
@@ -76,7 +76,7 @@ function INTERNALStorageImage(props: StorageImageProps & React.DetailedHTMLProps
 }
 
 export function StorageImage(props: StorageImageProps & React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>) {
-  let { storage } = props;
+  const { storage } = props;
 
   if (storage) {
     return <INTERNALStorageImage {...props} />;

package/src/useObservable.ts

@@ -16,11 +16,11 @@ if (!(globalThis as any as ReactFireGlobals)._reactFirePreloadedObservables) {
 // Starts listening to an Observable.
 // Call this once you know you're going to render a
 // child that will consume the observable
-export function preloadObservable<T>(source: Observable<T>, id: string) {
+export function preloadObservable<T>(source: Observable<T>, id: string, suspenseEnabled = false) {
   if (preloadedObservables.has(id)) {
     return preloadedObservables.get(id) as SuspenseSubject<T>;
   } else {
-    const observable = new SuspenseSubject(source, DEFAULT_TIMEOUT);
+    const observable = new SuspenseSubject(source, DEFAULT_TIMEOUT, suspenseEnabled);
     preloadedObservables.set(id, observable);
     return observable;
   }
@@ -97,12 +97,13 @@ export function useObservable<T = unknown>(observableId: string, source: Observa
   if (!observableId) {
     throw new Error('cannot call useObservable without an observableId');
   }
-  const observable = preloadObservable(source, observableId);
+  const suspenseEnabled = useSuspenseEnabledFromConfigAndContext(config.suspense);
+
+  const observable = preloadObservable(source, observableId, suspenseEnabled);
 
   // Suspend if suspense is enabled and no initial data exists
   const hasInitialData = config.hasOwnProperty('initialData') || config.hasOwnProperty('startWithValue');
   const hasData = observable.hasValue || hasInitialData;
-  const suspenseEnabled = useSuspenseEnabledFromConfigAndContext(config.suspense);
   if (suspenseEnabled === true && !hasData) {
     throw observable.firstEmission;
   }