reactfire 4.0.0-exp.b6c8eeb → 4.0.0-exp.f654109

package/README.md

@@ -91,12 +91,14 @@ This repository is maintained by Googlers but is not a supported Firebase produc
 
 ### Extra Experimental [concurrent mode](https://reactjs.org/docs/concurrent-mode-suspense.html) features
 
+These features are marked as *extra experimental* because they use experimental React features that [will not be stable until sometime after React 18 is released](https://github.com/reactwg/react-18/discussions/47#:~:text=Likely%20after%20React%2018.0%3A%20Suspense%20for%20Data%20Fetching).
+
 - **Loading states handled by `<Suspense>`** - ReactFire's hooks throw promises
-  that Suspense can catch. No more `isLoaded ?...` - let React
-  [handle it for you](https://reactjs.org/docs/concurrent-mode-suspense.html).
+  that Suspense can catch. Let React
+  [handle loading states for you](https://reactjs.org/docs/concurrent-mode-suspense.html).
 - **Automatically instrument your `Suspense` load times** - Need to automatically instrument your `Suspense` load times with [RUM](https://firebase.google.com/docs/perf-mon)? Use `<SuspenseWithPerf />`.
 
-Enable concurrent mode features by setting the `suspense` prop in `FirebaseAppProvider`:
+Enable concurrent mode features by following the [concurrent mode setup guide](https://reactjs.org/docs/concurrent-mode-adoption.html#installation) and then setting the `suspense` prop in `FirebaseAppProvider`:
 
 ```jsx
 <FirebaseAppProvider firebaseConfig={firebaseConfig} suspense={true}>

package/dist/SuspenseSubject.d.ts

@@ -12,7 +12,7 @@ export declare class SuspenseSubject<T> extends Subject<T> {
     private _resolveFirstEmission;
     constructor(innerObservable: Observable<T>, _timeoutWindow: number);
     get hasValue(): boolean;
-    get value(): T | undefined;
+    get value(): T;
     get firstEmission(): Promise<void>;
     private _next;
     private _reset;

package/dist/functions.d.ts

@@ -0,0 +1,12 @@
+import { ReactFireOptions, ObservableStatus } from './';
+import type { HttpsCallableOptions } from 'firebase/functions';
+/**
+ * Calls a callable function.
+ *
+ * @param functionName - The name of the function to call
+ * @param options
+ */
+export declare function useCallableFunctionResponse<RequestData, ResponseData>(functionName: string, options?: ReactFireOptions<ResponseData> & {
+    httpsCallableOptions?: HttpsCallableOptions;
+    data?: RequestData;
+}): ObservableStatus<ResponseData>;

package/dist/index.d.ts

@@ -28,6 +28,7 @@ export * from './auth';
 export * from './database';
 export * from './firebaseApp';
 export * from './firestore';
+export * from './functions';
 export * from './performance';
 export * from './remote-config';
 export * from './storage';

package/dist/reactfire.cjs.development.js

@@ -10,7 +10,8 @@ var app = require('firebase/app');
 var database = require('rxfire/database');
 var firestore = require('rxfire/firestore');
 var firestore$1 = require('firebase/firestore');
-var remoteConfig = require('firebase/remote-config');
+var functions = require('rxfire/functions');
+var remoteConfig = require('rxfire/remote-config');
 var storage = require('rxfire/storage');
 var storage$1 = require('firebase/storage');
 
@@ -960,9 +961,9 @@ try {
 
 var DEFAULT_APP_NAME = '[DEFAULT]';
 var FirebaseAppContext = /*#__PURE__*/React.createContext(undefined);
-var SuspenseEnabledContext = /*#__PURE__*/React.createContext(false); // @ts-ignore: "__REACTFIRE_VERSION__" is replaced with actual ReactFire version (see babel.config.js)
+var SuspenseEnabledContext = /*#__PURE__*/React.createContext(false); // @ts-expect-error: "__REACTFIRE_VERSION__" is replaced with actual ReactFire version (see babel.config.js)
 
-var version = "4.0.0-exp.b6c8eeb";
+var version = "4.0.0-exp.f654109";
 
 var shallowEq = function shallowEq(a, b) {
   return a === b || [].concat(Object.keys(a), Object.keys(b)).every(function (key) {
@@ -1350,8 +1351,8 @@ function useDatabaseListData(ref, options) {
 var SuspenseSubject = /*#__PURE__*/function (_Subject) {
   _inheritsLoose(SuspenseSubject, _Subject);
 
-  // @ts-ignore: TODO: double check to see if this is an RXJS thing or if we should listen to TS
-  // @ts-ignore: TODO: double check to see if this is an RXJS thing or if we should listen to TS
+  // @ts-expect-error: TODO: double check to see if this is an RXJS thing or if we should listen to TS
+  // @ts-expect-error: TODO: double check to see if this is an RXJS thing or if we should listen to TS
   function SuspenseSubject(innerObservable, _timeoutWindow) {
     var _this;
 
@@ -1442,6 +1443,8 @@ var SuspenseSubject = /*#__PURE__*/function (_Subject) {
       // As it is now, this will burn the cache entry until the timeout fires.
       if (this._error) {
         throw this._error;
+      } else if (!this.hasValue) {
+        throw Error('Can only get value if SuspenseSubject has a value');
       }
 
       return this._value;
@@ -1481,6 +1484,39 @@ function preloadObservable(source, id) {
     return observable;
   }
 }
+
+function reducerFactory(observable) {
+  return function reducer(state, action) {
+    // always make sure these values are in sync with the observable
+    var newState = _extends({}, state, {
+      hasEmitted: state.hasEmitted || observable.hasValue,
+      error: observable.ourError,
+      firstValuePromise: observable.firstEmission
+    });
+
+    if (observable.hasValue) {
+      newState.data = observable.value;
+    }
+
+    switch (action) {
+      case 'value':
+        newState.status = 'success';
+        return newState;
+
+      case 'error':
+        newState.status = 'error';
+        return newState;
+
+      case 'complete':
+        newState.isComplete = true;
+        return newState;
+
+      default:
+        throw new Error("invalid action \"" + action + "\"");
+    }
+  };
+}
+
 function useObservable(observableId, source, config) {
   var _config$initialData, _config, _config2;
 
@@ -1488,71 +1524,52 @@ function useObservable(observableId, source, config) {
     config = {};
   }
 
+  // Register the observable with the cache
   if (!observableId) {
     throw new Error('cannot call useObservable without an observableId');
   }
 
-  var observable = preloadObservable(source, observableId);
+  var observable = preloadObservable(source, observableId); // Suspend if suspense is enabled and no initial data exists
+
   var hasInitialData = config.hasOwnProperty('initialData') || config.hasOwnProperty('startWithValue');
+  var hasData = observable.hasValue || hasInitialData;
   var suspenseEnabled = useSuspenseEnabledFromConfigAndContext(config.suspense);
 
-  if (suspenseEnabled === true && !observable.hasValue && ((_config$initialData = !((_config = config) != null && _config.initialData)) != null ? _config$initialData : !((_config2 = config) != null && _config2.startWithValue))) {
+  if (suspenseEnabled === true && !hasData) {
     throw observable.firstEmission;
   }
 
-  var _React$useState = React.useState(function () {
-    var _config$initialData2;
-
-    return observable.hasValue ? observable.value : (_config$initialData2 = config.initialData) != null ? _config$initialData2 : config.startWithValue;
-  }),
-      latest = _React$useState[0],
-      setValue = _React$useState[1];
-
-  var _React$useState2 = React.useState(false),
-      isComplete = _React$useState2[0],
-      setIsComplete = _React$useState2[1];
+  var initialState = {
+    status: hasData ? 'success' : 'loading',
+    hasEmitted: hasData,
+    isComplete: false,
+    data: observable.hasValue ? observable.value : (_config$initialData = (_config = config) == null ? void 0 : _config.initialData) != null ? _config$initialData : (_config2 = config) == null ? void 0 : _config2.startWithValue,
+    error: observable.ourError,
+    firstValuePromise: observable.firstEmission
+  };
 
-  var _React$useState3 = React.useState(false),
-      hasError = _React$useState3[0],
-      setHasError = _React$useState3[1];
+  var _React$useReducer = React.useReducer(reducerFactory(observable), initialState),
+      status = _React$useReducer[0],
+      dispatch = _React$useReducer[1];
 
   React.useEffect(function () {
     var subscription = observable.subscribe({
-      next: function next(v) {
-        setValue(function () {
-          return v;
-        });
+      next: function next() {
+        dispatch('value');
       },
       error: function error(e) {
-        setHasError(true);
+        dispatch('error');
         throw e;
       },
       complete: function complete() {
-        setIsComplete(true);
+        dispatch('complete');
       }
     });
     return function () {
       return subscription.unsubscribe();
     };
   }, [observable]);
-  var status;
-
-  if (hasError) {
-    status = 'error';
-  } else if (observable.hasValue || hasInitialData) {
-    status = 'success';
-  } else {
-    status = 'loading';
-  }
-
-  return {
-    status: status,
-    hasEmitted: observable.hasValue || hasInitialData,
-    isComplete: isComplete,
-    data: latest,
-    error: observable.ourError,
-    firstValuePromise: observable.firstEmission
-  };
+  return status;
 }
 
 var cachedQueries$1 = globalThis._reactFireFirestoreQueryCache || [];
@@ -1677,6 +1694,21 @@ function useFirestoreCollectionData(query, options) {
   return useObservable(observableId, observable$, options);
 }
 
+/**
+ * Calls a callable function.
+ *
+ * @param functionName - The name of the function to call
+ * @param options
+ */
+
+function useCallableFunctionResponse(functionName, options) {
+  var functions$1 = useFunctions();
+  var observableId = "functions:callableResponse:" + functionName + ":" + JSON.stringify(options == null ? void 0 : options.data) + ":" + JSON.stringify(options == null ? void 0 : options.httpsCallableOptions);
+  var obsFactory = functions.httpsCallable(functions$1, functionName, options == null ? void 0 : options.httpsCallableOptions);
+  var observable$ = obsFactory(options == null ? void 0 : options.data);
+  return useObservable(observableId, observable$, options);
+}
+
 function SuspenseWithPerf(_ref) {
   var _performance;
 
@@ -1708,76 +1740,6 @@ function SuspenseWithPerf(_ref) {
   }, children);
 }
 
-function parameter$(_ref) {
-  var remoteConfig$1 = _ref.remoteConfig,
-      key = _ref.key,
-      getter = _ref.getter;
-  return new rxjs.Observable(function (subscriber) {
-    remoteConfig.ensureInitialized(remoteConfig$1).then(function () {
-      // 'this' for the getter loses context in the next()
-      // call, so it needs to be bound.
-      subscriber.next(getter.bind(remoteConfig$1)(key));
-    });
-  });
-}
-
-function getValue(remoteConfig$1, key) {
-  var getter = function getter() {
-    return remoteConfig.getValue(remoteConfig$1, key);
-  };
-
-  return parameter$({
-    remoteConfig: remoteConfig$1,
-    key: key,
-    getter: getter
-  });
-}
-function getString(remoteConfig$1, key) {
-  var getter = function getter() {
-    return remoteConfig.getString(remoteConfig$1, key);
-  };
-
-  return parameter$({
-    remoteConfig: remoteConfig$1,
-    key: key,
-    getter: getter
-  });
-}
-function getNumber(remoteConfig$1, key) {
-  var getter = function getter() {
-    return remoteConfig.getNumber(remoteConfig$1, key);
-  };
-
-  return parameter$({
-    remoteConfig: remoteConfig$1,
-    key: key,
-    getter: getter
-  });
-}
-function getBoolean(remoteConfig$1, key) {
-  var getter = function getter() {
-    return remoteConfig.getBoolean(remoteConfig$1, key);
-  };
-
-  return parameter$({
-    remoteConfig: remoteConfig$1,
-    key: key,
-    getter: getter
-  });
-}
-function getAll(remoteConfig$1) {
-  var getter = function getter() {
-    return remoteConfig.getAll(remoteConfig$1);
-  }; // No key is needed for getAll()
-
-
-  return parameter$({
-    remoteConfig: remoteConfig$1,
-    key: '',
-    getter: getter
-  });
-}
-
 /**
  * Helper function to construct type safe functions. Since Remote Config has
  * methods that return different types for values, we need to be extra safe
@@ -1788,12 +1750,8 @@ function getAll(remoteConfig$1) {
  */
 
 function useRemoteConfigValue_INTERNAL(key, getter) {
-  var _remoteConfig$_storag;
-
-  var remoteConfig = useRemoteConfig(); // INVESTIGATE need to use a public API to get at the app name, one doesn't appear to exist...
-  // we might need to iterate over the Firebase apps and check for remoteConfig equality? this works for now
-
-  var appName = (_remoteConfig$_storag = remoteConfig._storage) == null ? void 0 : _remoteConfig$_storag.appName;
+  var remoteConfig = useRemoteConfig();
+  var appName = remoteConfig.app.name;
   var $value = getter(remoteConfig, key);
   var observableId = "remoteConfig:" + key + ":" + getter.name + ":" + appName;
   return useObservable(observableId, $value);
@@ -1803,75 +1761,46 @@ function useRemoteConfigValue_INTERNAL(key, getter) {
  * Remote Config Value.
  *
  * @param key The parameter key in Remote Config
- * @param remoteConfig Optional instance. If not provided ReactFire will either grab the default instance or lazy load.
  */
 
 
 function useRemoteConfigValue(key) {
-  return useRemoteConfigValue_INTERNAL(key, getValue);
+  return useRemoteConfigValue_INTERNAL(key, remoteConfig.getValue);
 }
 /**
  * Convience method similar to useRemoteConfigValue. Returns a `string` from a Remote Config parameter.
  * @param key The parameter key in Remote Config
- * @param remoteConfig Optional instance. If not provided ReactFire will either grab the default instance or lazy load.
  */
 
 function useRemoteConfigString(key) {
-  return useRemoteConfigValue_INTERNAL(key, getString);
+  return useRemoteConfigValue_INTERNAL(key, remoteConfig.getString);
 }
 /**
  * Convience method similar to useRemoteConfigValue. Returns a `number` from a Remote Config parameter.
  * @param key The parameter key in Remote Config
- * @param remoteConfig Optional instance. If not provided ReactFire will either grab the default instance or lazy load.
  */
 
 function useRemoteConfigNumber(key) {
-  return useRemoteConfigValue_INTERNAL(key, getNumber);
+  return useRemoteConfigValue_INTERNAL(key, remoteConfig.getNumber);
 }
 /**
  * Convience method similar to useRemoteConfigValue. Returns a `boolean` from a Remote Config parameter.
  * @param key The parameter key in Remote Config
- * @param remoteConfig Optional instance. If not provided ReactFire will either grab the default instance or lazy load.
  */
 
 function useRemoteConfigBoolean(key) {
-  return useRemoteConfigValue_INTERNAL(key, getBoolean);
+  return useRemoteConfigValue_INTERNAL(key, remoteConfig.getBoolean);
 }
 /**
  * Convience method similar to useRemoteConfigValue. Returns allRemote Config parameters.
  * @param key The parameter key in Remote Config
- * @param remoteConfig Optional instance. If not provided ReactFire will either grab the default instance or lazy load.
  */
 
 function useRemoteConfigAll(key) {
-  return useRemoteConfigValue_INTERNAL(key, getAll);
+  return useRemoteConfigValue_INTERNAL(key, remoteConfig.getAll);
 }
 
 var _excluded = ["storage", "storagePath", "suspense", "placeHolder"];
-/**
- * modified version of rxFire's _fromTask
- *
- * @param task
- */
-
-function _fromTask(task) {
-  return new rxjs.Observable(function (subscriber) {
-    var progress = function progress(snap) {
-      return subscriber.next(snap);
-    };
-
-    var error = function error(e) {
-      return subscriber.error(e);
-    };
-
-    var complete = function complete() {
-      return subscriber.complete();
-    };
-
-    task.on('state_changed', progress, error, complete); // I REMOVED THE UNSUBSCRIBE RETURN BECAUSE IT CANCELS THE UPLOAD
-    // https://github.com/firebase/firebase-js-sdk/issues/1659
-  });
-}
 /**
  * Subscribe to the progress of a storage task
  *
@@ -1880,12 +1809,9 @@ function _fromTask(task) {
  * @param options
  */
 
-
 function useStorageTask(task, ref, options) {
   var observableId = "storage:task:" + ref.toString();
-
-  var observable$ = _fromTask(task);
-
+  var observable$ = storage.fromTask(task);
   return useObservable(observableId, observable$, options);
 }
 /**
@@ -1952,35 +1878,24 @@ function StorageImage(props) {
   }
 }
 
+var AppCheckSdkContext = /*#__PURE__*/React.createContext(undefined);
 var AuthSdkContext = /*#__PURE__*/React.createContext(undefined);
 var AnalyticsSdkContext = /*#__PURE__*/React.createContext(undefined);
 var DatabaseSdkContext = /*#__PURE__*/React.createContext(undefined);
 var FirestoreSdkContext = /*#__PURE__*/React.createContext(undefined);
+var FunctionsSdkContext = /*#__PURE__*/React.createContext(undefined);
 var StorageSdkContext = /*#__PURE__*/React.createContext(undefined);
 var PerformanceSdkContext = /*#__PURE__*/React.createContext(undefined);
 var RemoteConfigSdkContext = /*#__PURE__*/React.createContext(undefined);
 
 function getSdkProvider(SdkContext) {
   return function SdkProvider(props) {
-    var contextualAppName = useFirebaseApp().name;
-    var sdkAppName; // @ts-ignore Auth doesn't have field 'app'
-
-    if (props.sdk.app) {
-      // @ts-ignore Auth doesn't have field 'app'
-      sdkAppName = props.sdk.app.name; // @ts-ignore only Auth has field 'name'
-    } else if (props.sdk.name) {
-      // @ts-ignore only Auth has field 'name'
-      sdkAppName = props.sdk.name;
-    }
-
-    if (sdkAppName !== contextualAppName) {
-      throw new Error('sdk was initialized with a different firebase app');
-    }
-
-    if (!props.sdk) {
-      throw new Error('no sdk provided');
-    }
+    var _props$sdk, _props$sdk$app;
 
+    if (!props.sdk) throw new Error('no sdk provided');
+    var contextualAppName = useFirebaseApp().name;
+    var sdkAppName = props == null ? void 0 : (_props$sdk = props.sdk) == null ? void 0 : (_props$sdk$app = _props$sdk.app) == null ? void 0 : _props$sdk$app.name;
+    if (sdkAppName !== contextualAppName) throw new Error('sdk was initialized with a different firebase app');
     return React.createElement(SdkContext.Provider, _extends({
       value: props.sdk
     }, props));
@@ -2012,13 +1927,18 @@ function useInitSdk(sdkName, SdkContext, sdkInitializer, options) {
   return useObservable("firebase-sdk:" + sdkName + ":" + firebaseApp.name, rxjs.from(initializeSdk), options);
 }
 
+var AppCheckProvider = /*#__PURE__*/getSdkProvider(AppCheckSdkContext);
 var AuthProvider = /*#__PURE__*/getSdkProvider(AuthSdkContext);
 var AnalyticsProvider = /*#__PURE__*/getSdkProvider(AnalyticsSdkContext);
 var DatabaseProvider = /*#__PURE__*/getSdkProvider(DatabaseSdkContext);
 var FirestoreProvider = /*#__PURE__*/getSdkProvider(FirestoreSdkContext);
+var FunctionsProvider = /*#__PURE__*/getSdkProvider(FunctionsSdkContext);
 var PerformanceProvider = /*#__PURE__*/getSdkProvider(PerformanceSdkContext);
 var StorageProvider = /*#__PURE__*/getSdkProvider(StorageSdkContext);
 var RemoteConfigProvider = /*#__PURE__*/getSdkProvider(RemoteConfigSdkContext);
+var useAppCheck = function useAppCheck() {
+  return useSdk(AppCheckSdkContext);
+};
 var useAuth = function useAuth() {
   return useSdk(AuthSdkContext);
 };
@@ -2031,6 +1951,9 @@ var useDatabase = function useDatabase() {
 var useFirestore = function useFirestore() {
   return useSdk(FirestoreSdkContext);
 };
+var useFunctions = function useFunctions() {
+  return useSdk(FunctionsSdkContext);
+};
 var usePerformance = function usePerformance() {
   return useSdk(PerformanceSdkContext);
 };
@@ -2040,6 +1963,9 @@ var useStorage = function useStorage() {
 var useRemoteConfig = function useRemoteConfig() {
   return useSdk(RemoteConfigSdkContext);
 };
+var useInitAppCheck = function useInitAppCheck(initializer, options) {
+  return useInitSdk('appcheck', AppCheckSdkContext, initializer, options);
+};
 var useInitAuth = function useInitAuth(initializer, options) {
   return useInitSdk('auth', AuthSdkContext, initializer, options);
 };
@@ -2052,6 +1978,9 @@ var useInitDatabase = function useInitDatabase(initializer, options) {
 var useInitFirestore = function useInitFirestore(initializer, options) {
   return useInitSdk('firestore', FirestoreSdkContext, initializer, options);
 };
+var useInitFunctions = function useInitFunctions(initializer, options) {
+  return useInitSdk('functions', FunctionsSdkContext, initializer, options);
+};
 var useInitPerformance = function useInitPerformance(initializer, options) {
   return useInitSdk('performance', PerformanceSdkContext, initializer, options);
 };
@@ -2098,17 +2027,28 @@ function checkIdField(options) {
 }
 
 exports.AnalyticsProvider = AnalyticsProvider;
+exports.AnalyticsSdkContext = AnalyticsSdkContext;
+exports.AppCheckProvider = AppCheckProvider;
+exports.AppCheckSdkContext = AppCheckSdkContext;
 exports.AuthCheck = AuthCheck;
 exports.AuthProvider = AuthProvider;
+exports.AuthSdkContext = AuthSdkContext;
 exports.ClaimsCheck = ClaimsCheck;
 exports.DatabaseProvider = DatabaseProvider;
+exports.DatabaseSdkContext = DatabaseSdkContext;
 exports.FirebaseAppProvider = FirebaseAppProvider;
 exports.FirestoreProvider = FirestoreProvider;
+exports.FirestoreSdkContext = FirestoreSdkContext;
+exports.FunctionsProvider = FunctionsProvider;
+exports.FunctionsSdkContext = FunctionsSdkContext;
 exports.PerformanceProvider = PerformanceProvider;
+exports.PerformanceSdkContext = PerformanceSdkContext;
 exports.ReactFireError = ReactFireError;
 exports.RemoteConfigProvider = RemoteConfigProvider;
+exports.RemoteConfigSdkContext = RemoteConfigSdkContext;
 exports.StorageImage = StorageImage;
 exports.StorageProvider = StorageProvider;
+exports.StorageSdkContext = StorageSdkContext;
 exports.SuspenseWithPerf = SuspenseWithPerf;
 exports.checkIdField = checkIdField;
 exports.checkOptions = checkOptions;
@@ -2117,7 +2057,9 @@ exports.preloadFirestoreDoc = preloadFirestoreDoc;
 exports.preloadObservable = preloadObservable;
 exports.preloadUser = preloadUser;
 exports.useAnalytics = useAnalytics;
+exports.useAppCheck = useAppCheck;
 exports.useAuth = useAuth;
+exports.useCallableFunctionResponse = useCallableFunctionResponse;
 exports.useDatabase = useDatabase;
 exports.useDatabaseList = useDatabaseList;
 exports.useDatabaseListData = useDatabaseListData;
@@ -2131,11 +2073,14 @@ exports.useFirestoreDoc = useFirestoreDoc;
 exports.useFirestoreDocData = useFirestoreDocData;
 exports.useFirestoreDocDataOnce = useFirestoreDocDataOnce;
 exports.useFirestoreDocOnce = useFirestoreDocOnce;
+exports.useFunctions = useFunctions;
 exports.useIdTokenResult = useIdTokenResult;
 exports.useInitAnalytics = useInitAnalytics;
+exports.useInitAppCheck = useInitAppCheck;
 exports.useInitAuth = useInitAuth;
 exports.useInitDatabase = useInitDatabase;
 exports.useInitFirestore = useInitFirestore;
+exports.useInitFunctions = useInitFunctions;
 exports.useInitPerformance = useInitPerformance;
 exports.useInitRemoteConfig = useInitRemoteConfig;
 exports.useInitStorage = useInitStorage;