react-native-onyx 2.0.76 → 2.0.78

package/dist/Onyx.js

@@ -30,7 +30,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const underscore_1 = __importDefault(require("underscore"));
 const pick_1 = __importDefault(require("lodash/pick"));
 const Logger = __importStar(require("./Logger"));
-const OnyxCache_1 = __importDefault(require("./OnyxCache"));
+const OnyxCache_1 = __importStar(require("./OnyxCache"));
 const PerformanceUtils = __importStar(require("./PerformanceUtils"));
 const storage_1 = __importDefault(require("./storage"));
 const utils_1 = __importDefault(require("./utils"));
@@ -390,7 +390,7 @@ function mergeCollection(collectionKey, collection) {
 function clear(keysToPreserve = []) {
     const defaultKeyStates = OnyxUtils_1.default.getDefaultKeyStates();
     const initialKeys = Object.keys(defaultKeyStates);
-    return OnyxUtils_1.default.getAllKeys()
+    const promise = OnyxUtils_1.default.getAllKeys()
         .then((cachedKeys) => {
         OnyxCache_1.default.clearNullishStorageKeys();
         const keysToBeClearedFromStorage = [];
@@ -459,6 +459,7 @@ function clear(keysToPreserve = []) {
         // Remove only the items that we want cleared from storage, and reset others to default
         keysToBeClearedFromStorage.forEach((key) => OnyxCache_1.default.drop(key));
         return storage_1.default.removeItems(keysToBeClearedFromStorage)
+            .then(() => OnyxConnectionManager_1.default.refreshSessionID())
             .then(() => storage_1.default.multiSet(defaultKeyValuePairs))
             .then(() => {
             DevTools_1.default.clearState(keysToPreserve);
@@ -466,6 +467,7 @@ function clear(keysToPreserve = []) {
         });
     })
         .then(() => undefined);
+    return OnyxCache_1.default.captureTask(OnyxCache_1.TASK.CLEAR, promise);
 }
 function updateSnapshots(data) {
     const snapshotCollectionKey = OnyxUtils_1.default.getSnapshotKey();

package/dist/OnyxCache.d.ts

@@ -1,4 +1,11 @@
+import type { ValueOf } from 'type-fest';
 import type { OnyxKey, OnyxValue } from './types';
+declare const TASK: {
+    readonly GET: "get";
+    readonly GET_ALL_KEYS: "getAllKeys";
+    readonly CLEAR: "clear";
+};
+type CacheTask = ValueOf<typeof TASK> | `${ValueOf<typeof TASK>}:${string}`;
 /**
  * In memory cache providing data by reference
  * Encapsulates Onyx cache related functionality
@@ -67,20 +74,20 @@ declare class OnyxCache {
      * Check whether the given task is already running
      * @param taskName - unique name given for the task
      */
-    hasPendingTask(taskName: string): boolean;
+    hasPendingTask(taskName: CacheTask): boolean;
     /**
      * Use this method to prevent concurrent calls for the same thing
      * Instead of calling the same task again use the existing promise
      * provided from this function
      * @param taskName - unique name given for the task
      */
-    getTaskPromise(taskName: string): Promise<OnyxValue<OnyxKey> | OnyxKey[]> | undefined;
+    getTaskPromise(taskName: CacheTask): Promise<OnyxValue<OnyxKey> | OnyxKey[]> | undefined;
     /**
      * Capture a promise for a given task so other caller can
      * hook up to the promise if it's still pending
      * @param taskName - unique name for the task
      */
-    captureTask(taskName: string, promise: Promise<OnyxValue<OnyxKey>>): Promise<OnyxValue<OnyxKey>>;
+    captureTask(taskName: CacheTask, promise: Promise<OnyxValue<OnyxKey>>): Promise<OnyxValue<OnyxKey>>;
     /** Adds a key to the top of the recently accessed keys */
     addToAccessedKeys(key: OnyxKey): void;
     /** Remove keys that don't fall into the range of recently used keys */
@@ -92,3 +99,5 @@ declare class OnyxCache {
 }
 declare const instance: OnyxCache;
 export default instance;
+export { TASK };
+export type { CacheTask };

package/dist/OnyxCache.js

@@ -3,9 +3,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.TASK = void 0;
 const fast_equals_1 = require("fast-equals");
 const bindAll_1 = __importDefault(require("lodash/bindAll"));
 const utils_1 = __importDefault(require("./utils"));
+// Task constants
+const TASK = {
+    GET: 'get',
+    GET_ALL_KEYS: 'getAllKeys',
+    CLEAR: 'clear',
+};
+exports.TASK = TASK;
 /**
  * In memory cache providing data by reference
  * Encapsulates Onyx cache related functionality

package/dist/OnyxConnectionManager.d.ts

@@ -25,6 +25,20 @@ declare class OnyxConnectionManager {
      * Stores the last generated callback ID which will be incremented when making a new connection.
      */
     private lastCallbackID;
+    /**
+     * Stores the last generated session ID for the connection manager. The current session ID
+     * is appended to the connection IDs and it's used to create new different connections for the same key
+     * when `refreshSessionID()` is called.
+     *
+     * When calling `Onyx.clear()` after a logout operation some connections might remain active as they
+     * aren't tied to the React's lifecycle e.g. `Onyx.connect()` usage, causing infinite loading state issues to new `useOnyx()` subscribers
+     * that are connecting to the same key as we didn't populate the cache again because we are still reusing such connections.
+     *
+     * To elimitate this problem, the session ID must be refreshed during the `Onyx.clear()` call (by using `refreshSessionID()`)
+     * in order to create fresh connections when new subscribers connect to the same keys again, allowing them
+     * to use the cache system correctly and avoid the mentioned issues in `useOnyx()`.
+     */
+    private sessionID;
     constructor();
     /**
      * Generates a connection ID based on the `connectOptions` object passed to the function.
@@ -54,6 +68,10 @@ declare class OnyxConnectionManager {
      * Disconnect all subscribers from Onyx.
      */
     disconnectAll(): void;
+    /**
+     * Refreshes the connection manager's session ID.
+     */
+    refreshSessionID(): void;
     /**
      * Adds the connection to the eviction block list. Connections added to this list can never be evicted.
      * */

package/dist/OnyxConnectionManager.js

@@ -38,8 +38,9 @@ class OnyxConnectionManager {
     constructor() {
         this.connectionsMap = new Map();
         this.lastCallbackID = 0;
+        this.sessionID = Str.guid();
         // Binds all public methods to prevent problems with `this`.
-        (0, bindAll_1.default)(this, 'generateConnectionID', 'fireCallbacks', 'connect', 'disconnect', 'disconnectAll', 'addToEvictionBlockList', 'removeFromEvictionBlockList');
+        (0, bindAll_1.default)(this, 'generateConnectionID', 'fireCallbacks', 'connect', 'disconnect', 'disconnectAll', 'refreshSessionID', 'addToEvictionBlockList', 'removeFromEvictionBlockList');
     }
     /**
      * Generates a connection ID based on the `connectOptions` object passed to the function.
@@ -49,7 +50,9 @@ class OnyxConnectionManager {
      */
     generateConnectionID(connectOptions) {
         const { key, initWithStoredValues, reuseConnection, waitForCollectionCallback } = connectOptions;
-        let suffix = '';
+        // The current session ID is appended to the connection ID so we can have different connections
+        // after an `Onyx.clear()` operation.
+        let suffix = `,sessionID=${this.sessionID}`;
         // We will generate a unique ID in any of the following situations:
         // - `reuseConnection` is `false`. That means the subscriber explicitly wants the connection to not be reused.
         // - `initWithStoredValues` is `false`. This flag changes the subscription flow when set to `false`, so the connection can't be reused.
@@ -162,6 +165,12 @@ class OnyxConnectionManager {
         });
         this.connectionsMap.clear();
     }
+    /**
+     * Refreshes the connection manager's session ID.
+     */
+    refreshSessionID() {
+        this.sessionID = Str.guid();
+    }
     /**
      * Adds the connection to the eviction block list. Connections added to this list can never be evicted.
      * */

package/dist/OnyxUtils.js

@@ -32,7 +32,7 @@ const fast_equals_1 = require("fast-equals");
 const clone_1 = __importDefault(require("lodash/clone"));
 const DevTools_1 = __importDefault(require("./DevTools"));
 const Logger = __importStar(require("./Logger"));
-const OnyxCache_1 = __importDefault(require("./OnyxCache"));
+const OnyxCache_1 = __importStar(require("./OnyxCache"));
 const PerformanceUtils = __importStar(require("./PerformanceUtils"));
 const Str = __importStar(require("./Str"));
 const batch_1 = __importDefault(require("./batch"));
@@ -187,7 +187,7 @@ function get(key) {
     if (OnyxCache_1.default.hasCacheForKey(key)) {
         return Promise.resolve(OnyxCache_1.default.get(key));
     }
-    const taskName = `get:${key}`;
+    const taskName = `${OnyxCache_1.TASK.GET}:${key}`;
     // When a value retrieving task for this key is still running hook to it
     if (OnyxCache_1.default.hasPendingTask(taskName)) {
         return OnyxCache_1.default.getTaskPromise(taskName);
@@ -229,7 +229,7 @@ function multiGet(keys) {
             dataMap.set(key, cacheValue);
             return;
         }
-        const pendingKey = `get:${key}`;
+        const pendingKey = `${OnyxCache_1.TASK.GET}:${key}`;
         if (OnyxCache_1.default.hasPendingTask(pendingKey)) {
             pendingTasks.push(OnyxCache_1.default.getTaskPromise(pendingKey));
             pendingKeys.push(key);
@@ -300,10 +300,9 @@ function getAllKeys() {
     if (cachedKeys.size > 0) {
         return Promise.resolve(cachedKeys);
     }
-    const taskName = 'getAllKeys';
     // When a value retrieving task for all keys is still running hook to it
-    if (OnyxCache_1.default.hasPendingTask(taskName)) {
-        return OnyxCache_1.default.getTaskPromise(taskName);
+    if (OnyxCache_1.default.hasPendingTask(OnyxCache_1.TASK.GET_ALL_KEYS)) {
+        return OnyxCache_1.default.getTaskPromise(OnyxCache_1.TASK.GET_ALL_KEYS);
     }
     // Otherwise retrieve the keys from storage and capture a promise to aid concurrent usages
     const promise = storage_1.default.getAllKeys().then((keys) => {
@@ -311,7 +310,7 @@ function getAllKeys() {
         // return the updated set of keys
         return OnyxCache_1.default.getAllKeys();
     });
-    return OnyxCache_1.default.captureTask(taskName, promise);
+    return OnyxCache_1.default.captureTask(OnyxCache_1.TASK.GET_ALL_KEYS, promise);
 }
 /**
  * Returns set of all registered collection keys

package/dist/useOnyx.d.ts

@@ -12,6 +12,11 @@ type BaseUseOnyxOptions = {
      * If set to `true`, data will be retrieved from cache during the first render even if there is a pending merge for the key.
      */
     allowStaleData?: boolean;
+    /**
+     * If set to `false`, the connection won't be reused between other subscribers that are listening to the same Onyx key
+     * with the same connect configurations.
+     */
+    reuseConnection?: boolean;
 };
 type UseOnyxInitialValueOption<TInitialValue> = {
     /**

package/dist/useOnyx.js

@@ -1,11 +1,34 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const fast_equals_1 = require("fast-equals");
 const react_1 = require("react");
-const OnyxCache_1 = __importDefault(require("./OnyxCache"));
+const OnyxCache_1 = __importStar(require("./OnyxCache"));
 const OnyxConnectionManager_1 = __importDefault(require("./OnyxConnectionManager"));
 const OnyxUtils_1 = __importDefault(require("./OnyxUtils"));
 const useLiveRef_1 = __importDefault(require("./useLiveRef"));
@@ -144,11 +167,14 @@ function useOnyx(key, options) {
         else {
             areValuesEqual = (0, fast_equals_1.shallowEqual)((_c = previousValueRef.current) !== null && _c !== void 0 ? _c : undefined, newValueRef.current);
         }
-        // If the previously cached value is different from the new value, we update both cached value
-        // and the result to be returned by the hook.
-        // If the cache was set for the first time, we also update the cached value and the result.
-        const isCacheSetFirstTime = previousValueRef.current === null && hasCacheForKey;
-        if (isCacheSetFirstTime || !areValuesEqual) {
+        // We updated the cached value and the result in the following conditions:
+        // We will update the cached value and the result in any of the following situations:
+        // - The previously cached value is different from the new value.
+        // - The previously cached value is `null` (not set from cache yet) and we have cache for this key
+        //   OR we have a pending `Onyx.clear()` task (if `Onyx.clear()` is running cache might not be available anymore
+        //   so we update the cached value/result right away in order to prevent infinite loading state issues).
+        const shouldUpdateResult = !areValuesEqual || (previousValueRef.current === null && (hasCacheForKey || OnyxCache_1.default.hasPendingTask(OnyxCache_1.TASK.CLEAR)));
+        if (shouldUpdateResult) {
             previousValueRef.current = newValueRef.current;
             // If the new value is `null` we default it to `undefined` to ensure the consumer gets a consistent result from the hook.
             resultRef.current = [(_d = previousValueRef.current) !== null && _d !== void 0 ? _d : undefined, { status: newFetchStatus !== null && newFetchStatus !== void 0 ? newFetchStatus : 'loaded' }];
@@ -169,6 +195,7 @@ function useOnyx(key, options) {
             },
             initWithStoredValues: options === null || options === void 0 ? void 0 : options.initWithStoredValues,
             waitForCollectionCallback: OnyxUtils_1.default.isCollectionKey(key),
+            reuseConnection: options === null || options === void 0 ? void 0 : options.reuseConnection,
         });
         checkEvictableKey();
         return () => {
@@ -178,7 +205,7 @@ function useOnyx(key, options) {
             OnyxConnectionManager_1.default.disconnect(connectionRef.current);
             isFirstConnectionRef.current = false;
         };
-    }, [key, options === null || options === void 0 ? void 0 : options.initWithStoredValues, checkEvictableKey]);
+    }, [key, options === null || options === void 0 ? void 0 : options.initWithStoredValues, options === null || options === void 0 ? void 0 : options.reuseConnection, checkEvictableKey]);
     (0, react_1.useEffect)(() => {
         checkEvictableKey();
     }, [checkEvictableKey]);

package/package.json

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