@atlaskit/editor-synced-block-provider 12.0.7 → 12.1.0

package/dist/es2019/store-manager/sourceSyncBlockStoreManager.js

@@ -1,5 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { logException } from '@atlaskit/editor-common/monitoring';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { SyncBlockError } from '../common/types';
 import { updateErrorPayload, createErrorPayload, deleteErrorPayload, updateCacheErrorPayload, getSourceInfoErrorPayload, updateSuccessPayload, createSuccessPayload, createSuccessOperationalPayload, addContentSuccessPayload, deleteSuccessPayload, fetchReferencesErrorPayload, buildErrorAttribution } from '../utils/errorHandling';
@@ -23,6 +24,7 @@ const DELETE_DEDUPE_WINDOW_MS = 5000;
 // Ensures consistency between local and remote state, and can be used in both editor and renderer contexts.
 export class SourceSyncBlockStoreManager {
   constructor(dataProvider, viewMode, isLivePage) {
+    _defineProperty(this, "localSourceSubscribers", new Map());
     _defineProperty(this, "hasReceivedContentChange", false);
     /**
      * Promises for in-flight block creations, keyed by resourceId.
@@ -157,6 +159,7 @@ export class SourceSyncBlockStoreManager {
         contentFragment: syncBlockNode.content,
         status: cachedBlock === null || cachedBlock === void 0 ? void 0 : cachedBlock.status
       });
+      this.notifyLocalSource(resourceId);
       return true;
     } catch (error) {
       var _this$fireAnalyticsEv, _syncBlockNode$attrs, _syncBlockNode$attrs2;
@@ -257,6 +260,7 @@ export class SourceSyncBlockStoreManager {
           const cachedData = this.syncBlockCache.get(result.resourceId);
           if (cachedData) {
             cachedData.isDirty = true;
+            this.notifyLocalSource(result.resourceId);
           }
         }
       });
@@ -270,6 +274,7 @@ export class SourceSyncBlockStoreManager {
             const cachedData = this.syncBlockCache.get(result.resourceId);
             if (cachedData && result.status) {
               cachedData.status = result.status;
+              this.notifyLocalSource(result.resourceId);
             }
             (_this$fireAnalyticsEv2 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv2 === void 0 ? void 0 : _this$fireAnalyticsEv2.call(this, updateSuccessPayload(result.resourceId, false, getSourceProductFromResourceIdSafe(result.resourceId)));
           }
@@ -330,6 +335,48 @@ export class SourceSyncBlockStoreManager {
     var _this$syncBlockCache$;
     return (_this$syncBlockCache$ = this.syncBlockCache.get(resourceId)) === null || _this$syncBlockCache$ === void 0 ? void 0 : _this$syncBlockCache$.status;
   }
+  getLocalSourceSnapshot(resourceId) {
+    if (!isExperimentEnabled('editor-synced-block-same-page-sync')) {
+      return undefined;
+    }
+    const cached = this.syncBlockCache.get(resourceId);
+    if (!cached || cached.status === 'deleted') {
+      return undefined;
+    }
+    const {
+      contentFragment: _contentFragment,
+      isDirty: _isDirty,
+      ...data
+    } = cached;
+    return {
+      ...data,
+      content: [...data.content]
+    };
+  }
+  subscribeToLocalSource(resourceId, callback) {
+    if (!isExperimentEnabled('editor-synced-block-same-page-sync')) {
+      return () => {};
+    }
+    let subscribers = this.localSourceSubscribers.get(resourceId);
+    if (!subscribers) {
+      subscribers = new Set();
+      this.localSourceSubscribers.set(resourceId, subscribers);
+    }
+    subscribers.add(callback);
+    callback(this.getLocalSourceSnapshot(resourceId));
+    return () => {
+      const currentSubscribers = this.localSourceSubscribers.get(resourceId);
+      currentSubscribers === null || currentSubscribers === void 0 ? void 0 : currentSubscribers.delete(callback);
+      if ((currentSubscribers === null || currentSubscribers === void 0 ? void 0 : currentSubscribers.size) === 0) {
+        this.localSourceSubscribers.delete(resourceId);
+      }
+    };
+  }
+  notifyLocalSource(resourceId) {
+    var _this$localSourceSubs;
+    const snapshot = this.getLocalSourceSnapshot(resourceId);
+    (_this$localSourceSubs = this.localSourceSubscribers.get(resourceId)) === null || _this$localSourceSubs === void 0 ? void 0 : _this$localSourceSubs.forEach(callback => callback(snapshot));
+  }
 
   /**
    *  Fires callback to insert node (if creation is successful) and clears pending creation data
@@ -374,6 +421,7 @@ export class SourceSyncBlockStoreManager {
       var _this$fireAnalyticsEv8;
       // Delete the node from cache if fail to create so it's not flushed to BE
       this.syncBlockCache.delete(resourceId || '');
+      this.notifyLocalSource(resourceId);
       this.newSourceBlockResourceIds.delete(resourceId || '');
       // Creation failed, so there is no block to add content to — drop the
       // first-content tracking entry so a later unrelated edit cannot fire it.
@@ -471,6 +519,7 @@ export class SourceSyncBlockStoreManager {
       const cached = this.syncBlockCache.get(resourceId);
       if (cached) {
         cached.status = 'unpublished';
+        this.notifyLocalSource(resourceId);
       }
       this.creationCompletionCallbacks.set(resourceId, onCompletion);
       (_this$createExperienc = this.createExperience) === null || _this$createExperienc === void 0 ? void 0 : _this$createExperienc.start({});
@@ -578,7 +627,10 @@ export class SourceSyncBlockStoreManager {
         results.forEach(result => {
           this.emitDeleteSuccess(result.resourceId, reason, mechanism);
         });
-        callback = Ids => this.syncBlockCache.delete(Ids.resourceId);
+        callback = Ids => {
+          this.syncBlockCache.delete(Ids.resourceId);
+          this.notifyLocalSource(Ids.resourceId);
+        };
         this.clearPendingDeletion();
         (_this$deleteExperienc2 = this.deleteExperience) === null || _this$deleteExperienc2 === void 0 ? void 0 : _this$deleteExperienc2.success();
       } else {
@@ -678,6 +730,7 @@ export class SourceSyncBlockStoreManager {
         const cached = this.syncBlockCache.get(sourceResourceId);
         if (cached && (_result$data = result.data) !== null && _result$data !== void 0 && _result$data.status) {
           cached.status = result.data.status;
+          this.notifyLocalSource(sourceResourceId);
         }
       }
     } catch {
@@ -792,7 +845,10 @@ export class SourceSyncBlockStoreManager {
   }
   destroy() {
     var _this$saveExperience4, _this$createExperienc5, _this$deleteExperienc4, _this$fetchSourceInfo4;
+    const subscribedResourceIds = [...this.localSourceSubscribers.keys()];
     this.syncBlockCache.clear();
+    subscribedResourceIds.forEach(resourceId => this.notifyLocalSource(resourceId));
+    this.localSourceSubscribers.clear();
     this.confirmationCallback = undefined;
     this.creationCompletionCallbacks.clear();
     this.flushCompletionCallback = undefined;

package/dist/es2019/store-manager/syncBlockStoreManager.js

@@ -16,10 +16,8 @@ import { SourceSyncBlockStoreManager } from './sourceSyncBlockStoreManager';
 
 export class SyncBlockStoreManager {
   constructor(dataProvider, viewMode, isLivePage) {
-    // In future, if reference manager needs to reach to source manager and read its current in memory cache
-    // we can pass the source manager as a parameter to the reference manager constructor
     this.sourceSyncBlockStoreManager = new SourceSyncBlockStoreManager(dataProvider, viewMode, isLivePage);
-    this.referenceSyncBlockStoreManager = new ReferenceSyncBlockStoreManager(dataProvider, viewMode);
+    this.referenceSyncBlockStoreManager = new ReferenceSyncBlockStoreManager(dataProvider, viewMode, this.sourceSyncBlockStoreManager);
     this.dataProvider = dataProvider;
     this.referenceSyncBlockStoreManager.setRealTimeSubscriptionsEnabled(true);
   }

package/dist/esm/store-manager/referenceSyncBlockStoreManager.js

@@ -1,5 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
@@ -11,9 +12,11 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import isEqual from 'lodash/isEqual';
 import { logException } from '@atlaskit/editor-common/monitoring';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { isProviderNotReadyError, ProviderNotReadyError, SyncBlockError } from '../common/types';
 import { buildErrorAttribution, buildFetchErrorAttribution, cacheDeletionForcedPayload, fetchErrorPayload, fetchSuccessPayload, getSourceInfoErrorPayload, sourceInfoOrphanedPayload, updateReferenceErrorPayload } from '../utils/errorHandling';
 import { getFetchExperience, getFetchSourceInfoExperience, getSaveReferenceExperience } from '../utils/experienceTracking';
+import { parseResourceId } from '../utils/resourceId';
 import { resolveSyncBlockInstance } from '../utils/resolveSyncBlockInstance';
 import { createSyncBlockNode, getSourceProductFromResourceIdSafe, normalizeSyncBlockJSONContent } from '../utils/utils';
 import { SyncBlockBatchFetcher } from './syncBlockBatchFetcher';
@@ -37,7 +40,7 @@ var CACHE_DELETION_MAX_RESCHEDULES = 10;
 // Handles fetching source URL and title for sync blocks.
 // Can be used in both editor and renderer contexts.
 export var ReferenceSyncBlockStoreManager = /*#__PURE__*/function () {
-  function ReferenceSyncBlockStoreManager(dataProvider, viewMode) {
+  function ReferenceSyncBlockStoreManager(dataProvider, viewMode, sourceManager) {
     var _this = this,
       _this$dataProvider;
     _classCallCheck(this, ReferenceSyncBlockStoreManager);
@@ -62,6 +65,7 @@ export var ReferenceSyncBlockStoreManager = /*#__PURE__*/function () {
     _defineProperty(this, "isDestroyed", false);
     this.dataProvider = dataProvider;
     this.viewMode = viewMode;
+    this.sourceManager = sourceManager;
     this.syncBlockFetchDataRequests = new Map();
     this.syncBlockSourceInfoRequests = new Map();
     this.newlyAddedSyncBlocks = new Set();
@@ -238,6 +242,10 @@ export var ReferenceSyncBlockStoreManager = /*#__PURE__*/function () {
     key: "getInitialSyncBlockData",
     value: function getInitialSyncBlockData(resourceId) {
       var _this$dataProvider2;
+      var localReference = this.getLocalReference(resourceId);
+      if (localReference) {
+        return localReference;
+      }
       var syncBlockNode = createSyncBlockNode('', resourceId);
       var providerData = (_this$dataProvider2 = this.dataProvider) === null || _this$dataProvider2 === void 0 || (_this$dataProvider2 = _this$dataProvider2.getNodeDataFromCache(syncBlockNode)) === null || _this$dataProvider2 === void 0 ? void 0 : _this$dataProvider2.data;
       if (providerData) {
@@ -247,6 +255,41 @@ export var ReferenceSyncBlockStoreManager = /*#__PURE__*/function () {
       }
       return this.getFromSessionCache(resourceId);
     }
+  }, {
+    key: "getSameDocumentReferenceParts",
+    value: function getSameDocumentReferenceParts(resourceId) {
+      var parsed = parseResourceId(resourceId);
+      if (!parsed || !this.dataProvider || this.dataProvider.generateResourceIdForReference(parsed.uuid) !== resourceId) {
+        return undefined;
+      }
+      return parsed;
+    }
+  }, {
+    key: "getLocalReference",
+    value: function getLocalReference(resourceId) {
+      var _this$sourceManager;
+      if (!isExperimentEnabled('editor-synced-block-same-page-sync')) {
+        return undefined;
+      }
+      var parsed = this.getSameDocumentReferenceParts(resourceId);
+      if (!parsed) {
+        return undefined;
+      }
+      var snapshot = (_this$sourceManager = this.sourceManager) === null || _this$sourceManager === void 0 ? void 0 : _this$sourceManager.getLocalSourceSnapshot(parsed.uuid);
+      if (!snapshot) {
+        return undefined;
+      }
+      return {
+        resourceId: resourceId,
+        data: _objectSpread(_objectSpread({}, snapshot), {}, {
+          content: _toConsumableArray(snapshot.content)
+        }),
+        localSameDocumentSource: {
+          sourceBlockInstanceId: snapshot.blockInstanceId,
+          sourceProduct: parsed.product
+        }
+      };
+    }
   }, {
     key: "normalizeReferenceData",
     value: function normalizeReferenceData(syncBlock) {
@@ -914,7 +957,35 @@ export var ReferenceSyncBlockStoreManager = /*#__PURE__*/function () {
   }, {
     key: "subscribeToSyncBlock",
     value: function subscribeToSyncBlock(resourceId, localId, callback) {
-      return this._subscriptionManager.subscribeToSyncBlock(resourceId, localId, callback);
+      var _this$sourceManager2,
+        _this9 = this;
+      var isSamePageSyncEnabled = isExperimentEnabled('editor-synced-block-same-page-sync');
+      var sameDocumentParts = isSamePageSyncEnabled ? this.getSameDocumentReferenceParts(resourceId) : undefined;
+      var localReference = isSamePageSyncEnabled ? this.getLocalReference(resourceId) : undefined;
+      var unsubscribeRemote = this._subscriptionManager.subscribeToSyncBlock(resourceId, localId, function (instance) {
+        if (!localReference) {
+          callback(instance);
+        }
+      });
+      var unsubscribeLocal = sameDocumentParts ? (_this$sourceManager2 = this.sourceManager) === null || _this$sourceManager2 === void 0 ? void 0 : _this$sourceManager2.subscribeToLocalSource(sameDocumentParts.uuid, function () {
+        var hadLocalReference = Boolean(localReference);
+        localReference = _this9.getLocalReference(resourceId);
+        if (localReference) {
+          callback(localReference);
+          return;
+        }
+        if (!hadLocalReference) {
+          return;
+        }
+        // Source left the document: keep the last local instance on screen
+        // and fetch the current backend value. Do not replay a remote
+        // value captured while the local source was authoritative.
+        _this9.debouncedBatchedFetchSyncBlocks(resourceId);
+      }) : undefined;
+      return function () {
+        unsubscribeLocal === null || unsubscribeLocal === void 0 || unsubscribeLocal();
+        unsubscribeRemote();
+      };
     }
   }, {
     key: "subscribeToSourceTitle",
@@ -935,7 +1006,7 @@ export var ReferenceSyncBlockStoreManager = /*#__PURE__*/function () {
         if (!localId || !resourceId) {
           throw new Error('Missing local id or resource id');
         }
-        return this._subscriptionManager.subscribeToSyncBlock(resourceId, localId, callback);
+        return this.subscribeToSyncBlock(resourceId, localId, callback);
       } catch (error) {
         var _this$fireAnalyticsEv7;
         // EDITOR-7860: benign not-ready/torn-down case — suppress both the
@@ -1003,7 +1074,7 @@ export var ReferenceSyncBlockStoreManager = /*#__PURE__*/function () {
     key: "flush",
     value: (function () {
       var _flush = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-        var _this9 = this;
+        var _this0 = this;
         var success, syncedBlocksToFlush, _this$saveExperience, blocks, _iterator, _step, _loop, updateResult, _this$saveExperience2, _this$fireAnalyticsEv8, _this$saveExperience3, _this$fireAnalyticsEv9, _this$saveExperience4, _t2, _t3;
         return _regeneratorRuntime.wrap(function (_context4) {
           while (1) switch (_context4.prev = _context4.next) {
@@ -1147,8 +1218,8 @@ export var ReferenceSyncBlockStoreManager = /*#__PURE__*/function () {
                 // Use setTimeout to avoid deep recursion and run queued flush asynchronously
                 // Note: flush() handles all exceptions internally and never rejects
                 this.queuedFlushTimeout = setTimeout(function () {
-                  _this9.queuedFlushTimeout = undefined;
-                  void _this9.flush();
+                  _this0.queuedFlushTimeout = undefined;
+                  void _this0.flush();
                 }, 0);
               }
               return _context4.finish(17);

package/dist/esm/store-manager/sourceSyncBlockStoreManager.js

@@ -1,8 +1,11 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["contentFragment", "isDirty"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -10,6 +13,7 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { logException } from '@atlaskit/editor-common/monitoring';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { SyncBlockError } from '../common/types';
 import { updateErrorPayload, createErrorPayload, deleteErrorPayload, updateCacheErrorPayload, getSourceInfoErrorPayload, updateSuccessPayload, createSuccessPayload, createSuccessOperationalPayload, addContentSuccessPayload, deleteSuccessPayload, fetchReferencesErrorPayload, buildErrorAttribution } from '../utils/errorHandling';
@@ -35,6 +39,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
   function SourceSyncBlockStoreManager(dataProvider, viewMode, isLivePage) {
     var _this = this;
     _classCallCheck(this, SourceSyncBlockStoreManager);
+    _defineProperty(this, "localSourceSubscribers", new Map());
     _defineProperty(this, "hasReceivedContentChange", false);
     /**
      * Promises for in-flight block creations, keyed by resourceId.
@@ -181,6 +186,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
           contentFragment: syncBlockNode.content,
           status: cachedBlock === null || cachedBlock === void 0 ? void 0 : cachedBlock.status
         }));
+        this.notifyLocalSource(resourceId);
         return true;
       } catch (error) {
         var _this$fireAnalyticsEv, _syncBlockNode$attrs2, _syncBlockNode$attrs3;
@@ -299,6 +305,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
                   var cachedData = _this2.syncBlockCache.get(result.resourceId);
                   if (cachedData) {
                     cachedData.isDirty = true;
+                    _this2.notifyLocalSource(result.resourceId);
                   }
                 }
               });
@@ -316,6 +323,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
                   var cachedData = _this2.syncBlockCache.get(result.resourceId);
                   if (cachedData && result.status) {
                     cachedData.status = result.status;
+                    _this2.notifyLocalSource(result.resourceId);
                   }
                   (_this2$fireAnalyticsE = _this2.fireAnalyticsEvent) === null || _this2$fireAnalyticsE === void 0 || _this2$fireAnalyticsE.call(_this2, updateSuccessPayload(result.resourceId, false, getSourceProductFromResourceIdSafe(result.resourceId)));
                 }
@@ -400,6 +408,54 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
       var _this$syncBlockCache$;
       return (_this$syncBlockCache$ = this.syncBlockCache.get(resourceId)) === null || _this$syncBlockCache$ === void 0 ? void 0 : _this$syncBlockCache$.status;
     }
+  }, {
+    key: "getLocalSourceSnapshot",
+    value: function getLocalSourceSnapshot(resourceId) {
+      if (!isExperimentEnabled('editor-synced-block-same-page-sync')) {
+        return undefined;
+      }
+      var cached = this.syncBlockCache.get(resourceId);
+      if (!cached || cached.status === 'deleted') {
+        return undefined;
+      }
+      var _contentFragment = cached.contentFragment,
+        _isDirty = cached.isDirty,
+        data = _objectWithoutProperties(cached, _excluded);
+      return _objectSpread(_objectSpread({}, data), {}, {
+        content: _toConsumableArray(data.content)
+      });
+    }
+  }, {
+    key: "subscribeToLocalSource",
+    value: function subscribeToLocalSource(resourceId, callback) {
+      var _this3 = this;
+      if (!isExperimentEnabled('editor-synced-block-same-page-sync')) {
+        return function () {};
+      }
+      var subscribers = this.localSourceSubscribers.get(resourceId);
+      if (!subscribers) {
+        subscribers = new Set();
+        this.localSourceSubscribers.set(resourceId, subscribers);
+      }
+      subscribers.add(callback);
+      callback(this.getLocalSourceSnapshot(resourceId));
+      return function () {
+        var currentSubscribers = _this3.localSourceSubscribers.get(resourceId);
+        currentSubscribers === null || currentSubscribers === void 0 || currentSubscribers.delete(callback);
+        if ((currentSubscribers === null || currentSubscribers === void 0 ? void 0 : currentSubscribers.size) === 0) {
+          _this3.localSourceSubscribers.delete(resourceId);
+        }
+      };
+    }
+  }, {
+    key: "notifyLocalSource",
+    value: function notifyLocalSource(resourceId) {
+      var _this$localSourceSubs;
+      var snapshot = this.getLocalSourceSnapshot(resourceId);
+      (_this$localSourceSubs = this.localSourceSubscribers.get(resourceId)) === null || _this$localSourceSubs === void 0 || _this$localSourceSubs.forEach(function (callback) {
+        return callback(snapshot);
+      });
+    }
 
     /**
      *  Fires callback to insert node (if creation is successful) and clears pending creation data
@@ -446,6 +502,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
         var _this$fireAnalyticsEv6;
         // Delete the node from cache if fail to create so it's not flushed to BE
         this.syncBlockCache.delete(resourceId || '');
+        this.notifyLocalSource(resourceId);
         this.newSourceBlockResourceIds.delete(resourceId || '');
         // Creation failed, so there is no block to add content to — drop the
         // first-content tracking entry so a later unrelated edit cannot fire it.
@@ -479,10 +536,10 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
   }, {
     key: "registerConfirmationCallback",
     value: function registerConfirmationCallback(callback) {
-      var _this3 = this;
+      var _this4 = this;
       this.confirmationCallback = callback;
       return function () {
-        _this3.confirmationCallback = undefined;
+        _this4.confirmationCallback = undefined;
       };
     }
   }, {
@@ -522,7 +579,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
   }, {
     key: "createBodiedSyncBlockNode",
     value: function createBodiedSyncBlockNode(attrs, node, onCompletion, enrichment) {
-      var _this4 = this;
+      var _this5 = this;
       if (this.viewMode === 'view') {
         return;
       }
@@ -552,6 +609,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
         var cached = this.syncBlockCache.get(resourceId);
         if (cached) {
           cached.status = 'unpublished';
+          this.notifyLocalSource(resourceId);
         }
         this.creationCompletionCallbacks.set(resourceId, onCompletion);
         (_this$createExperienc = this.createExperience) === null || _this$createExperienc === void 0 || _this$createExperienc.start({});
@@ -562,29 +620,29 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
         }).then(function (result) {
           var resourceId = result.resourceId || '';
           if (resourceId && !result.error) {
-            var _this4$createExperien;
-            _this4.commitPendingCreation(true, resourceId);
-            (_this4$createExperien = _this4.createExperience) === null || _this4$createExperien === void 0 || _this4$createExperien.success();
+            var _this5$createExperien;
+            _this5.commitPendingCreation(true, resourceId);
+            (_this5$createExperien = _this5.createExperience) === null || _this5$createExperien === void 0 || _this5$createExperien.success();
           } else {
-            var _this4$createExperien2, _this4$fireAnalyticsE;
-            _this4.commitPendingCreation(false, resourceId);
-            (_this4$createExperien2 = _this4.createExperience) === null || _this4$createExperien2 === void 0 || _this4$createExperien2.failure({
+            var _this5$createExperien2, _this5$fireAnalyticsE;
+            _this5.commitPendingCreation(false, resourceId);
+            (_this5$createExperien2 = _this5.createExperience) === null || _this5$createExperien2 === void 0 || _this5$createExperien2.failure({
               reason: result.error || 'Failed to create bodied sync block'
             });
-            (_this4$fireAnalyticsE = _this4.fireAnalyticsEvent) === null || _this4$fireAnalyticsE === void 0 || _this4$fireAnalyticsE.call(_this4, createErrorPayload(result.error || 'Failed to create bodied sync block', resourceId, getSourceProductFromResourceIdSafe(resourceId), buildErrorAttribution(result.error, result.statusCode)));
+            (_this5$fireAnalyticsE = _this5.fireAnalyticsEvent) === null || _this5$fireAnalyticsE === void 0 || _this5$fireAnalyticsE.call(_this5, createErrorPayload(result.error || 'Failed to create bodied sync block', resourceId, getSourceProductFromResourceIdSafe(resourceId), buildErrorAttribution(result.error, result.statusCode)));
           }
         }).catch(function (error) {
-          var _this4$createExperien3, _this4$fireAnalyticsE2;
-          _this4.commitPendingCreation(false, resourceId);
+          var _this5$createExperien3, _this5$fireAnalyticsE2;
+          _this5.commitPendingCreation(false, resourceId);
           logException(error, {
             location: 'editor-synced-block-provider/sourceSyncBlockStoreManager'
           });
-          (_this4$createExperien3 = _this4.createExperience) === null || _this4$createExperien3 === void 0 || _this4$createExperien3.failure({
+          (_this5$createExperien3 = _this5.createExperience) === null || _this5$createExperien3 === void 0 || _this5$createExperien3.failure({
             reason: error.message
           });
-          (_this4$fireAnalyticsE2 = _this4.fireAnalyticsEvent) === null || _this4$fireAnalyticsE2 === void 0 || _this4$fireAnalyticsE2.call(_this4, createErrorPayload(error.message, resourceId, getSourceProductFromResourceIdSafe(resourceId)));
+          (_this5$fireAnalyticsE2 = _this5.fireAnalyticsEvent) === null || _this5$fireAnalyticsE2 === void 0 || _this5$fireAnalyticsE2.call(_this5, createErrorPayload(error.message, resourceId, getSourceProductFromResourceIdSafe(resourceId)));
         }).finally(function () {
-          _this4.pendingCreationPromises.delete(resourceId);
+          _this5.pendingCreationPromises.delete(resourceId);
         });
         this.pendingCreationPromises.set(resourceId, creationPromise);
       } catch (error) {
@@ -654,7 +712,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
     key: "delete",
     value: function () {
       var _delete2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(syncBlockIds, onDelete, onDeleteCompleted, reason, mechanism) {
-        var _this5 = this;
+        var _this6 = this;
         var _this$deleteExperienc, results, callback, isDeleteSuccessful, _this$deleteExperienc2, _this$deleteExperienc3, attribution, _t2;
         return _regeneratorRuntime.wrap(function (_context2) {
           while (1) switch (_context2.prev = _context2.next) {
@@ -673,7 +731,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
               throw new Error('Data provider not set');
             case 2:
               syncBlockIds.forEach(function (Ids) {
-                _this5.setPendingDeletion(Ids, true);
+                _this6.setPendingDeletion(Ids, true);
               });
               (_this$deleteExperienc = this.deleteExperience) === null || _this$deleteExperienc === void 0 || _this$deleteExperienc.start({});
               _context2.next = 3;
@@ -691,24 +749,25 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
                 // Emit before the cache entry is deleted below, so blockInstanceId
                 // is still available to emitDeleteSuccess.
                 results.forEach(function (result) {
-                  _this5.emitDeleteSuccess(result.resourceId, reason, mechanism);
+                  _this6.emitDeleteSuccess(result.resourceId, reason, mechanism);
                 });
                 callback = function callback(Ids) {
-                  return _this5.syncBlockCache.delete(Ids.resourceId);
+                  _this6.syncBlockCache.delete(Ids.resourceId);
+                  _this6.notifyLocalSource(Ids.resourceId);
                 };
                 this.clearPendingDeletion();
                 (_this$deleteExperienc2 = this.deleteExperience) === null || _this$deleteExperienc2 === void 0 || _this$deleteExperienc2.success();
               } else {
                 callback = function callback(Ids) {
-                  _this5.setPendingDeletion(Ids, false);
+                  _this6.setPendingDeletion(Ids, false);
                 };
                 (_this$deleteExperienc3 = this.deleteExperience) === null || _this$deleteExperienc3 === void 0 || _this$deleteExperienc3.failure();
                 results.forEach(function (result) {
                   if (result.success) {
-                    _this5.emitDeleteSuccess(result.resourceId, reason, mechanism);
+                    _this6.emitDeleteSuccess(result.resourceId, reason, mechanism);
                   } else {
-                    var _this5$fireAnalyticsE;
-                    (_this5$fireAnalyticsE = _this5.fireAnalyticsEvent) === null || _this5$fireAnalyticsE === void 0 || _this5$fireAnalyticsE.call(_this5, deleteErrorPayload(result.error || 'Failed to delete synced block', result.resourceId, getSourceProductFromResourceIdSafe(result.resourceId), buildErrorAttribution(result.error, result.statusCode)));
+                    var _this6$fireAnalyticsE;
+                    (_this6$fireAnalyticsE = _this6.fireAnalyticsEvent) === null || _this6$fireAnalyticsE === void 0 || _this6$fireAnalyticsE.call(_this6, deleteErrorPayload(result.error || 'Failed to delete synced block', result.resourceId, getSourceProductFromResourceIdSafe(result.resourceId), buildErrorAttribution(result.error, result.statusCode)));
                   }
                 });
               }
@@ -721,9 +780,9 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
               // so the attribution `reason` falls back to `unknown`.
               attribution = buildErrorAttribution();
               syncBlockIds.forEach(function (Ids) {
-                var _this5$fireAnalyticsE2;
-                _this5.setPendingDeletion(Ids, false);
-                (_this5$fireAnalyticsE2 = _this5.fireAnalyticsEvent) === null || _this5$fireAnalyticsE2 === void 0 || _this5$fireAnalyticsE2.call(_this5, deleteErrorPayload(_t2.message, Ids.resourceId, getSourceProductFromResourceIdSafe(Ids.resourceId), attribution));
+                var _this6$fireAnalyticsE2;
+                _this6.setPendingDeletion(Ids, false);
+                (_this6$fireAnalyticsE2 = _this6.fireAnalyticsEvent) === null || _this6$fireAnalyticsE2 === void 0 || _this6$fireAnalyticsE2.call(_this6, deleteErrorPayload(_t2.message, Ids.resourceId, getSourceProductFromResourceIdSafe(Ids.resourceId), attribution));
               });
               logException(_t2, {
                 location: 'editor-synced-block-provider/sourceSyncBlockStoreManager'
@@ -801,7 +860,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
     key: "fetchAndCacheStatuses",
     value: (function () {
       var _fetchAndCacheStatuses = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
-        var _this6 = this;
+        var _this7 = this;
         var sourceToReferenceMap, syncBlockNodes, results, _iterator3, _step3, _sourceToReferenceMap, _result$data, result, sourceResourceId, cached, _t3;
         return _regeneratorRuntime.wrap(function (_context4) {
           while (1) switch (_context4.prev = _context4.next) {
@@ -819,11 +878,11 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
               // so we can update the correct cache entries.
               sourceToReferenceMap = new Map();
               syncBlockNodes = Array.from(this.syncBlockCache.entries()).map(function (_ref) {
-                var _this6$dataProvider$g, _this6$dataProvider;
+                var _this7$dataProvider$g, _this7$dataProvider;
                 var _ref2 = _slicedToArray(_ref, 2),
                   resourceId = _ref2[0],
                   data = _ref2[1];
-                var referenceResourceId = (_this6$dataProvider$g = (_this6$dataProvider = _this6.dataProvider) === null || _this6$dataProvider === void 0 ? void 0 : _this6$dataProvider.generateResourceIdForReference(resourceId)) !== null && _this6$dataProvider$g !== void 0 ? _this6$dataProvider$g : resourceId;
+                var referenceResourceId = (_this7$dataProvider$g = (_this7$dataProvider = _this7.dataProvider) === null || _this7$dataProvider === void 0 ? void 0 : _this7$dataProvider.generateResourceIdForReference(resourceId)) !== null && _this7$dataProvider$g !== void 0 ? _this7$dataProvider$g : resourceId;
                 sourceToReferenceMap.set(referenceResourceId, resourceId);
                 return {
                   type: 'bodiedSyncBlock',
@@ -847,6 +906,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
                   cached = this.syncBlockCache.get(sourceResourceId);
                   if (cached && (_result$data = result.data) !== null && _result$data !== void 0 && _result$data.status) {
                     cached.status = result.data.status;
+                    this.notifyLocalSource(sourceResourceId);
                   }
                 }
               } catch (err) {
@@ -976,7 +1036,7 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
   }, {
     key: "getSyncBlockSourceInfo",
     value: function getSyncBlockSourceInfo(localId) {
-      var _this7 = this;
+      var _this8 = this;
       try {
         var _this$fetchSourceInfo;
         if (!this.dataProvider) {
@@ -985,13 +1045,13 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
         (_this$fetchSourceInfo = this.fetchSourceInfoExperience) === null || _this$fetchSourceInfo === void 0 || _this$fetchSourceInfo.start();
         return this.dataProvider.fetchSyncBlockSourceInfo(localId, undefined, undefined).then(function (sourceInfo) {
           if (!sourceInfo) {
-            var _this7$fetchSourceInf;
-            (_this7$fetchSourceInf = _this7.fetchSourceInfoExperience) === null || _this7$fetchSourceInf === void 0 || _this7$fetchSourceInf.failure({
+            var _this8$fetchSourceInf;
+            (_this8$fetchSourceInf = _this8.fetchSourceInfoExperience) === null || _this8$fetchSourceInf === void 0 || _this8$fetchSourceInf.failure({
               reason: 'No source info returned'
             });
           } else {
-            var _this7$fetchSourceInf2;
-            (_this7$fetchSourceInf2 = _this7.fetchSourceInfoExperience) === null || _this7$fetchSourceInf2 === void 0 || _this7$fetchSourceInf2.success();
+            var _this8$fetchSourceInf2;
+            (_this8$fetchSourceInf2 = _this8.fetchSourceInfoExperience) === null || _this8$fetchSourceInf2 === void 0 || _this8$fetchSourceInf2.success();
           }
           return sourceInfo;
         });
@@ -1026,8 +1086,17 @@ export var SourceSyncBlockStoreManager = /*#__PURE__*/function () {
   }, {
     key: "destroy",
     value: function destroy() {
-      var _this$saveExperience4, _this$createExperienc2, _this$deleteExperienc4, _this$fetchSourceInfo2;
+      var _this9 = this,
+        _this$saveExperience4,
+        _this$createExperienc2,
+        _this$deleteExperienc4,
+        _this$fetchSourceInfo2;
+      var subscribedResourceIds = _toConsumableArray(this.localSourceSubscribers.keys());
       this.syncBlockCache.clear();
+      subscribedResourceIds.forEach(function (resourceId) {
+        return _this9.notifyLocalSource(resourceId);
+      });
+      this.localSourceSubscribers.clear();
       this.confirmationCallback = undefined;
       this.creationCompletionCallbacks.clear();
       this.flushCompletionCallback = undefined;

package/dist/esm/store-manager/syncBlockStoreManager.js

@@ -24,10 +24,8 @@ import { SourceSyncBlockStoreManager } from './sourceSyncBlockStoreManager';
 export var SyncBlockStoreManager = /*#__PURE__*/function () {
   function SyncBlockStoreManager(dataProvider, viewMode, isLivePage) {
     _classCallCheck(this, SyncBlockStoreManager);
-    // In future, if reference manager needs to reach to source manager and read its current in memory cache
-    // we can pass the source manager as a parameter to the reference manager constructor
     this.sourceSyncBlockStoreManager = new SourceSyncBlockStoreManager(dataProvider, viewMode, isLivePage);
-    this.referenceSyncBlockStoreManager = new ReferenceSyncBlockStoreManager(dataProvider, viewMode);
+    this.referenceSyncBlockStoreManager = new ReferenceSyncBlockStoreManager(dataProvider, viewMode, this.sourceSyncBlockStoreManager);
     this.dataProvider = dataProvider;
     this.referenceSyncBlockStoreManager.setRealTimeSubscriptionsEnabled(true);
   }

package/dist/types/entry-points/syncBlockStoreManager.d.ts

@@ -1 +1,2 @@
 export { SyncBlockStoreManager, useMemoizedSyncBlockStoreManager, } from '../store-manager/syncBlockStoreManager';
+export type { SourceSyncBlockStoreManager } from '../store-manager/sourceSyncBlockStoreManager';