react-native-onyx 2.0.83 → 2.0.84

package/dist/useOnyx.d.ts

@@ -1,3 +1,4 @@
+import type { DependencyList } from 'react';
 import type { OnyxKey, OnyxValue } from './types';
 type BaseUseOnyxOptions = {
     /**
@@ -40,7 +41,7 @@ type ResultMetadata = {
     status: FetchStatus;
 };
 type UseOnyxResult<TValue> = [NonNullable<TValue> | undefined, ResultMetadata];
-declare function useOnyx<TKey extends OnyxKey, TReturnValue = OnyxValue<TKey>>(key: TKey, options?: BaseUseOnyxOptions & UseOnyxInitialValueOption<TReturnValue> & Required<UseOnyxSelectorOption<TKey, TReturnValue>>): UseOnyxResult<TReturnValue>;
-declare function useOnyx<TKey extends OnyxKey, TReturnValue = OnyxValue<TKey>>(key: TKey, options?: BaseUseOnyxOptions & UseOnyxInitialValueOption<NoInfer<TReturnValue>>): UseOnyxResult<TReturnValue>;
+declare function useOnyx<TKey extends OnyxKey, TReturnValue = OnyxValue<TKey>>(key: TKey, options?: BaseUseOnyxOptions & UseOnyxInitialValueOption<TReturnValue> & Required<UseOnyxSelectorOption<TKey, TReturnValue>>, dependencies?: DependencyList): UseOnyxResult<TReturnValue>;
+declare function useOnyx<TKey extends OnyxKey, TReturnValue = OnyxValue<TKey>>(key: TKey, options?: BaseUseOnyxOptions & UseOnyxInitialValueOption<NoInfer<TReturnValue>>, dependencies?: DependencyList): UseOnyxResult<TReturnValue>;
 export default useOnyx;
 export type { FetchStatus, ResultMetadata, UseOnyxResult };

package/dist/useOnyx.js

@@ -64,7 +64,7 @@ function getCachedValue(key, selector) {
     const selectedValue = selector ? selector(value) : value;
     return selectedValue !== null && selectedValue !== void 0 ? selectedValue : undefined;
 }
-function useOnyx(key, options) {
+function useOnyx(key, options, dependencies = []) {
     const connectionRef = (0, react_1.useRef)(null);
     const previousKey = (0, usePrevious_1.default)(key);
     // Used to stabilize the selector reference and avoid unnecessary calls to `getSnapshot()`.
@@ -86,6 +86,10 @@ function useOnyx(key, options) {
     // Indicates if it's the first Onyx connection of this hook or not, as we don't want certain use cases
     // in `getSnapshot()` to be satisfied several times.
     const isFirstConnectionRef = (0, react_1.useRef)(true);
+    // Indicates if the hook is connecting to a Onyx key.
+    const isConnectingRef = (0, react_1.useRef)(false);
+    // Stores the `onStoreChange()` function, which can be used to trigger a `getSnapshot()` update when desired.
+    const onStoreChangeFnRef = (0, react_1.useRef)(null);
     // Indicates if we should get the newest cached value from Onyx during `getSnapshot()` execution.
     const shouldGetCachedValueRef = (0, react_1.useRef)(true);
     (0, react_1.useEffect)(() => {
@@ -107,6 +111,17 @@ function useOnyx(key, options) {
         }
         throw new Error(`'${previousKey}' key can't be changed to '${key}'. useOnyx() only supports dynamic keys if they are both collection member keys from the same collection e.g. from 'collection_id1' to 'collection_id2'.`);
     }, [previousKey, key]);
+    (0, react_1.useEffect)(() => {
+        // This effect will only run if the `dependencies` array changes. If it changes it will force the hook
+        // to trigger a `getSnapshot()` update by calling the stored `onStoreChange()` function reference, thus
+        // re-running the hook and returning the latest value to the consumer.
+        if (connectionRef.current === null || isConnectingRef.current || !onStoreChangeFnRef.current) {
+            return;
+        }
+        shouldGetCachedValueRef.current = true;
+        onStoreChangeFnRef.current();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [...dependencies]);
     // Mimics withOnyx's checkEvictableKeys() behavior.
     const checkEvictableKey = (0, react_1.useCallback)(() => {
         if ((options === null || options === void 0 ? void 0 : options.canEvict) === undefined || !connectionRef.current) {
@@ -182,9 +197,13 @@ function useOnyx(key, options) {
         return resultRef.current;
     }, [options === null || options === void 0 ? void 0 : options.initWithStoredValues, options === null || options === void 0 ? void 0 : options.allowStaleData, options === null || options === void 0 ? void 0 : options.initialValue, key, selectorRef]);
     const subscribe = (0, react_1.useCallback)((onStoreChange) => {
+        isConnectingRef.current = true;
+        onStoreChangeFnRef.current = onStoreChange;
         connectionRef.current = OnyxConnectionManager_1.default.connect({
             key,
             callback: () => {
+                isConnectingRef.current = false;
+                onStoreChangeFnRef.current = onStoreChange;
                 // Signals that the first connection was made, so some logics in `getSnapshot()`
                 // won't be executed anymore.
                 isFirstConnectionRef.current = false;
@@ -204,6 +223,8 @@ function useOnyx(key, options) {
             }
             OnyxConnectionManager_1.default.disconnect(connectionRef.current);
             isFirstConnectionRef.current = false;
+            isConnectingRef.current = false;
+            onStoreChangeFnRef.current = null;
         };
     }, [key, options === null || options === void 0 ? void 0 : options.initWithStoredValues, options === null || options === void 0 ? void 0 : options.reuseConnection, checkEvictableKey]);
     (0, react_1.useEffect)(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-onyx",
-  "version": "2.0.83",
+  "version": "2.0.84",
   "author": "Expensify, Inc.",
   "homepage": "https://expensify.com",
   "description": "State management for React Native",