react-native-onyx 1.0.21 → 1.0.23

package/lib/Onyx.js

@@ -367,11 +367,15 @@ function keysChanged(collectionKey, partialCollection) {
 /**
  * When a key change happens, search for any callbacks matching the key or collection key and trigger those callbacks
  *
+ * @example
+ * keyChanged(key, value, subscriber => subscriber.initWithStoredValues === false)
+ *
  * @private
  * @param {String} key
  * @param {*} data
+ * @param {Function} [canUpdateSubscriber] only subscribers that pass this truth test will be updated
  */
-function keyChanged(key, data) {
+function keyChanged(key, data, canUpdateSubscriber) {
     // Add or remove this key from the recentlyAccessedKeys lists
     if (!_.isNull(data)) {
         addLastAccessedKey(key);
@@ -385,7 +389,7 @@ function keyChanged(key, data) {
     const stateMappingKeys = _.keys(callbackToStateMapping);
     for (let i = 0; i < stateMappingKeys.length; i++) {
         const subscriber = callbackToStateMapping[stateMappingKeys[i]];
-        if (!subscriber || !isKeyMatch(subscriber.key, key)) {
+        if (!subscriber || !isKeyMatch(subscriber.key, key) || (_.isFunction(canUpdateSubscriber) && !canUpdateSubscriber(subscriber))) {
             continue;
         }
 
@@ -631,12 +635,16 @@ function disconnect(connectionID, keyToRemoveFromEvictionBlocklist) {
  * available async. Since we have code in our main applications that might expect things to work this way it's not safe to change this
  * behavior just yet.
  *
+ * @example
+ * notifySubscribersOnNextTick(key, value, subscriber => subscriber.initWithStoredValues === false)
+ *
  * @param {String} key
  * @param {*} value
+ * @param {Function} [canUpdateSubscriber] only subscribers that pass this truth test will be updated
  */
 // eslint-disable-next-line rulesdir/no-negated-variables
-function notifySubscribersOnNextTick(key, value) {
-    Promise.resolve().then(() => keyChanged(key, value));
+function notifySubscribersOnNextTick(key, value, canUpdateSubscriber) {
+    Promise.resolve().then(() => keyChanged(key, value, canUpdateSubscriber));
 }
 
 /**
@@ -703,6 +711,14 @@ function set(key, value) {
         Logger.logAlert(`Onyx.set() called after Onyx.merge() for key: ${key}. It is recommended to use set() or merge() not both.`);
     }
 
+    // If the value in the cache is the same as what we have then do not update subscribers unless they
+    // have initWithStoredValues: false then they MUST get all updates even if nothing has changed.
+    if (!cache.hasValueChanged(key, value)) {
+        cache.addToAccessedKeys(key);
+        notifySubscribersOnNextTick(key, value, subscriber => subscriber.initWithStoredValues === false);
+        return Promise.resolve();
+    }
+
     // Adds the key to cache when it's not available
     cache.set(key, value);
     notifySubscribersOnNextTick(key, value);
@@ -1008,8 +1024,6 @@ function update(data) {
  * @param {Boolean} [options.captureMetrics] Enables Onyx benchmarking and exposes the get/print/reset functions
  * @param {Boolean} [options.shouldSyncMultipleInstances] Auto synchronize storage events between multiple instances
  * of Onyx running in different tabs/windows. Defaults to true for platforms that support local storage (web/desktop)
- * @param {String[]} [option.keysToDisableSyncEvents=[]] Contains keys for which
- * we want to disable sync event across tabs.
  * @param {Boolean} [options.debugSetState] Enables debugging setState() calls to connected components.
  * @example
  * Onyx.init({
@@ -1026,7 +1040,6 @@ function init({
     maxCachedKeysCount = 1000,
     captureMetrics = false,
     shouldSyncMultipleInstances = Boolean(global.localStorage),
-    keysToDisableSyncEvents = [],
     debugSetState = false,
 } = {}) {
     if (captureMetrics) {
@@ -1060,7 +1073,7 @@ function init({
         .then(deferredInitTask.resolve);
 
     if (shouldSyncMultipleInstances && _.isFunction(Storage.keepInstancesSync)) {
-        Storage.keepInstancesSync(keysToDisableSyncEvents, (key, value) => {
+        Storage.keepInstancesSync((key, value) => {
             cache.set(key, value);
             keyChanged(key, value);
         });

package/lib/OnyxCache.js

@@ -1,4 +1,5 @@
 import _ from 'underscore';
+import {deepEqual} from 'fast-equals';
 import fastMerge from './fastMerge';
 
 const isDefined = _.negate(_.isUndefined);
@@ -191,6 +192,15 @@ class OnyxCache {
     setRecentKeysLimit(limit) {
         this.maxRecentKeysSize = limit;
     }
+
+    /**
+     * @param {String} key
+     * @param {*} value
+     * @returns {Boolean}
+     */
+    hasValueChanged(key, value) {
+        return !deepEqual(this.storageMap[key], value);
+    }
 }
 
 const instance = new OnyxCache();

package/lib/storage/WebStorage.js

@@ -16,12 +16,9 @@ const webStorage = {
     ...Storage,
 
     /**
-     * Contains keys for which we want to disable sync event across tabs.
-     * @param {String[]} keysToDisableSyncEvents
-     * Storage synchronization mechanism keeping all opened tabs in sync
-     * @param {function(key: String, data: *)} onStorageKeyChanged
+     * @param {Function} onStorageKeyChanged Storage synchronization mechanism keeping all opened tabs in sync
      */
-    keepInstancesSync(keysToDisableSyncEvents, onStorageKeyChanged) {
+    keepInstancesSync(onStorageKeyChanged) {
         // Override set, remove and clear to raise storage events that we intercept in other tabs
         this.setItem = (key, value) => Storage.setItem(key, value)
             .then(() => raiseStorageSyncEvent(key));
@@ -43,10 +40,6 @@ const webStorage = {
             }
 
             const onyxKey = event.newValue;
-            if (_.contains(keysToDisableSyncEvents, onyxKey)) {
-                return;
-            }
-
             Storage.getItem(onyxKey)
                 .then(value => onStorageKeyChanged(onyxKey, value));
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-onyx",
-  "version": "1.0.21",
+  "version": "1.0.23",
   "author": "Expensify, Inc.",
   "homepage": "https://expensify.com",
   "description": "State management for React Native",
@@ -40,6 +40,7 @@
   },
   "dependencies": {
     "ascii-table": "0.0.9",
+    "fast-equals": "^4.0.3",
     "lodash": "^4.17.21",
     "underscore": "^1.13.1"
   },