@atlaskit/editor-synced-block-provider 3.12.1 → 3.13.1

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

@@ -15,17 +15,16 @@ import { createSyncBlockNode } from '../utils/utils';
 // Handles fetching source URL and title for sync blocks.
 // Can be used in both editor and renderer contexts.
 export class ReferenceSyncBlockStoreManager {
-  // Track pending cache deletions to handle block moves (unmount/remount)
-  // When a block is moved, the old component unmounts before the new one mounts,
-  // causing the cache to be deleted prematurely. We delay deletion to allow
-  // the new component to subscribe and cancel the pending deletion.
+  // Listeners for subscription changes (used by React components to know when to update)
 
   constructor(dataProvider) {
     // Keeps track of addition and deletion of reference synced blocks on the document
     // This starts as true to always flush the cache when document is saved for the first time
-    // to cater the case when a editor seesion is closed without document being updated right after reference block is deleted
+    // to cater the case when a editor session is closed without document being updated right after reference block is deleted
     _defineProperty(this, "isCacheDirty", true);
     _defineProperty(this, "isRefreshingSubscriptions", false);
+    // Flag to indicate if real-time subscriptions are enabled
+    _defineProperty(this, "useRealTimeSubscriptions", false);
     this.syncBlockCache = new Map();
     this.subscriptions = new Map();
     this.titleSubscriptions = new Map();
@@ -35,6 +34,89 @@ export class ReferenceSyncBlockStoreManager {
     this.syncBlockSourceInfoRequests = new Map();
     this.providerFactories = new Map();
     this.pendingCacheDeletions = new Map();
+    this.graphqlSubscriptions = new Map();
+    this.subscriptionChangeListeners = new Set();
+  }
+
+  /**
+   * Enables or disables real-time GraphQL subscriptions for block updates.
+   * When enabled, the store manager will subscribe to real-time updates
+   * instead of relying on polling.
+   * @param enabled - Whether to enable real-time subscriptions
+   */
+  setRealTimeSubscriptionsEnabled(enabled) {
+    if (this.useRealTimeSubscriptions === enabled) {
+      return;
+    }
+    this.useRealTimeSubscriptions = enabled;
+    if (enabled) {
+      // Set up subscriptions for all currently subscribed blocks
+      this.setupGraphQLSubscriptionsForAllBlocks();
+    } else {
+      // Clean up all GraphQL subscriptions
+      this.cleanupAllGraphQLSubscriptions();
+    }
+  }
+
+  /**
+   * Checks if real-time subscriptions are currently enabled.
+   */
+  isRealTimeSubscriptionsEnabled() {
+    return this.useRealTimeSubscriptions;
+  }
+
+  /**
+   * Returns all resource IDs that are currently subscribed to.
+   * Used by React components to render subscription components.
+   */
+  getSubscribedResourceIds() {
+    return Array.from(this.subscriptions.keys());
+  }
+
+  /**
+   * Registers a listener that will be called when subscriptions change.
+   * @param listener - Callback function to invoke when subscriptions change
+   * @returns Unsubscribe function to remove the listener
+   */
+  onSubscriptionsChanged(listener) {
+    this.subscriptionChangeListeners.add(listener);
+    return () => {
+      this.subscriptionChangeListeners.delete(listener);
+    };
+  }
+
+  /**
+   * Notifies all subscription change listeners.
+   */
+  notifySubscriptionChangeListeners() {
+    this.subscriptionChangeListeners.forEach(listener => {
+      try {
+        listener();
+      } catch (error) {
+        var _this$fireAnalyticsEv;
+        logException(error, {
+          location: 'editor-synced-block-provider/referenceSyncBlockStoreManager/notifySubscriptionChangeListeners'
+        });
+        (_this$fireAnalyticsEv = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv === void 0 ? void 0 : _this$fireAnalyticsEv.call(this, fetchErrorPayload(error.message));
+      }
+    });
+  }
+
+  /**
+   * Handles incoming data from a GraphQL subscription.
+   * Called by React subscription components when they receive updates.
+   * @param syncBlockInstance - The updated sync block instance
+   */
+  handleSubscriptionUpdate(syncBlockInstance) {
+    if (!syncBlockInstance.resourceId) {
+      return;
+    }
+    const existingSyncBlock = this.getFromCache(syncBlockInstance.resourceId);
+    const resolvedSyncBlockInstance = existingSyncBlock ? resolveSyncBlockInstance(existingSyncBlock, syncBlockInstance) : syncBlockInstance;
+    this.updateCache(resolvedSyncBlockInstance);
+    if (!syncBlockInstance.error) {
+      this.fetchSyncBlockSourceInfo(resolvedSyncBlockInstance.resourceId);
+    }
   }
   setFireAnalyticsEvent(fireAnalyticsEvent) {
     this.fireAnalyticsEvent = fireAnalyticsEvent;
@@ -59,9 +141,14 @@ export class ReferenceSyncBlockStoreManager {
 
   /**
    * Refreshes the subscriptions for all sync blocks.
+   * This is a fallback polling mechanism when real-time subscriptions are not enabled.
    * @returns {Promise<void>}
    */
   async refreshSubscriptions() {
+    // Skip polling refresh if real-time subscriptions are enabled
+    if (this.useRealTimeSubscriptions) {
+      return;
+    }
     if (this.isRefreshingSubscriptions) {
       return;
     }
@@ -77,15 +164,90 @@ export class ReferenceSyncBlockStoreManager {
       // this function will update the cache and call the subscriptions
       await this.fetchSyncBlocksData(syncBlocks);
     } catch (error) {
-      var _this$fireAnalyticsEv;
+      var _this$fireAnalyticsEv2;
       logException(error, {
         location: 'editor-synced-block-provider/referenceSyncBlockStoreManager'
       });
-      (_this$fireAnalyticsEv = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv === void 0 ? void 0 : _this$fireAnalyticsEv.call(this, fetchErrorPayload(error.message));
+      (_this$fireAnalyticsEv2 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv2 === void 0 ? void 0 : _this$fireAnalyticsEv2.call(this, fetchErrorPayload(error.message));
     } finally {
       this.isRefreshingSubscriptions = false;
     }
   }
+
+  /**
+   * Sets up a GraphQL subscription for a specific block.
+   * @param resourceId - The resource ID of the block to subscribe to
+   */
+  setupGraphQLSubscription(resourceId) {
+    var _this$dataProvider2;
+    // Don't set up duplicate subscriptions
+    if (this.graphqlSubscriptions.has(resourceId)) {
+      return;
+    }
+    if (!((_this$dataProvider2 = this.dataProvider) !== null && _this$dataProvider2 !== void 0 && _this$dataProvider2.subscribeToBlockUpdates)) {
+      return;
+    }
+    const unsubscribe = this.dataProvider.subscribeToBlockUpdates(resourceId, syncBlockInstance => {
+      // Handle the subscription update
+      this.handleGraphQLSubscriptionUpdate(syncBlockInstance);
+    }, error => {
+      var _this$fireAnalyticsEv3;
+      logException(error, {
+        location: 'editor-synced-block-provider/referenceSyncBlockStoreManager/graphql-subscription'
+      });
+      (_this$fireAnalyticsEv3 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv3 === void 0 ? void 0 : _this$fireAnalyticsEv3.call(this, fetchErrorPayload(error.message));
+    });
+    if (unsubscribe) {
+      this.graphqlSubscriptions.set(resourceId, unsubscribe);
+    }
+  }
+
+  /**
+   * Handles updates received from GraphQL subscriptions.
+   * @param syncBlockInstance - The updated sync block instance
+   */
+  handleGraphQLSubscriptionUpdate(syncBlockInstance) {
+    if (!syncBlockInstance.resourceId) {
+      return;
+    }
+    const existingSyncBlock = this.getFromCache(syncBlockInstance.resourceId);
+    const resolvedSyncBlockInstance = existingSyncBlock ? resolveSyncBlockInstance(existingSyncBlock, syncBlockInstance) : syncBlockInstance;
+    this.updateCache(resolvedSyncBlockInstance);
+    if (!syncBlockInstance.error) {
+      this.fetchSyncBlockSourceInfo(resolvedSyncBlockInstance.resourceId);
+    }
+  }
+
+  /**
+   * Cleans up the GraphQL subscription for a specific block.
+   * @param resourceId - The resource ID of the block to unsubscribe from
+   */
+  cleanupGraphQLSubscription(resourceId) {
+    const unsubscribe = this.graphqlSubscriptions.get(resourceId);
+    if (unsubscribe) {
+      unsubscribe();
+      this.graphqlSubscriptions.delete(resourceId);
+    }
+  }
+
+  /**
+   * Sets up GraphQL subscriptions for all currently subscribed blocks.
+   */
+  setupGraphQLSubscriptionsForAllBlocks() {
+    for (const resourceId of this.subscriptions.keys()) {
+      this.setupGraphQLSubscription(resourceId);
+    }
+  }
+
+  /**
+   * Cleans up all GraphQL subscriptions.
+   */
+  cleanupAllGraphQLSubscriptions() {
+    for (const unsubscribe of this.graphqlSubscriptions.values()) {
+      unsubscribe();
+    }
+    this.graphqlSubscriptions.clear();
+  }
   fetchSyncBlockSourceInfo(resourceId) {
     try {
       if (!resourceId || !this.dataProvider) {
@@ -109,7 +271,7 @@ export class ReferenceSyncBlockStoreManager {
         blockInstanceId,
         sourceURL,
         sourceTitle,
-        onSamePage,
+        onSameDocument,
         sourceSubType
       } = existingSyncBlock.data || {};
       // skip if source URL and title are already present
@@ -120,7 +282,7 @@ export class ReferenceSyncBlockStoreManager {
             url: sourceURL,
             subType: sourceSubType,
             sourceAri: sourceAri || '',
-            onSamePage,
+            onSameDocument,
             productType: product
           });
         } else {
@@ -128,8 +290,8 @@ export class ReferenceSyncBlockStoreManager {
         }
       }
       if (!sourceAri || !product || !blockInstanceId) {
-        var _this$fireAnalyticsEv2;
-        (_this$fireAnalyticsEv2 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv2 === void 0 ? void 0 : _this$fireAnalyticsEv2.call(this, getSourceInfoErrorPayload('SourceAri, product or blockInstanceId missing', resourceId));
+        var _this$fireAnalyticsEv4;
+        (_this$fireAnalyticsEv4 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv4 === void 0 ? void 0 : _this$fireAnalyticsEv4.call(this, getSourceInfoErrorPayload('SourceAri, product or blockInstanceId missing', resourceId));
         return Promise.resolve(undefined);
       }
       if (fg('platform_synced_block_dogfooding')) {
@@ -139,11 +301,11 @@ export class ReferenceSyncBlockStoreManager {
       const sourceInfoPromise = this.dataProvider.fetchSyncBlockSourceInfo(blockInstanceId, sourceAri, product, this.fireAnalyticsEvent).then(sourceInfo => {
         if (!sourceInfo) {
           if (fg('platform_synced_block_dogfooding')) {
-            var _this$fetchSourceInfo2, _this$fireAnalyticsEv3;
+            var _this$fetchSourceInfo2, _this$fireAnalyticsEv5;
             (_this$fetchSourceInfo2 = this.fetchSourceInfoExperience) === null || _this$fetchSourceInfo2 === void 0 ? void 0 : _this$fetchSourceInfo2.failure({
               reason: 'No source info returned'
             });
-            (_this$fireAnalyticsEv3 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv3 === void 0 ? void 0 : _this$fireAnalyticsEv3.call(this, getSourceInfoErrorPayload('No source info returned', resourceId));
+            (_this$fireAnalyticsEv5 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv5 === void 0 ? void 0 : _this$fireAnalyticsEv5.call(this, getSourceInfoErrorPayload('No source info returned', resourceId));
           }
           return undefined;
         }
@@ -156,23 +318,23 @@ export class ReferenceSyncBlockStoreManager {
             var _this$fetchSourceInfo3;
             (_this$fetchSourceInfo3 = this.fetchSourceInfoExperience) === null || _this$fetchSourceInfo3 === void 0 ? void 0 : _this$fetchSourceInfo3.success();
           } else {
-            var _this$fetchSourceInfo4, _this$fireAnalyticsEv4;
+            var _this$fetchSourceInfo4, _this$fireAnalyticsEv6;
             (_this$fetchSourceInfo4 = this.fetchSourceInfoExperience) === null || _this$fetchSourceInfo4 === void 0 ? void 0 : _this$fetchSourceInfo4.failure({
               reason: 'Missing title or url'
             });
-            (_this$fireAnalyticsEv4 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv4 === void 0 ? void 0 : _this$fireAnalyticsEv4.call(this, getSourceInfoErrorPayload('Missing title or url', resourceId));
+            (_this$fireAnalyticsEv6 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv6 === void 0 ? void 0 : _this$fireAnalyticsEv6.call(this, getSourceInfoErrorPayload('Missing title or url', resourceId));
           }
           return sourceInfo;
         }
       }).catch(error => {
-        var _this$fireAnalyticsEv5;
+        var _this$fireAnalyticsEv7;
         if (fg('platform_synced_block_dogfooding')) {
           var _this$fetchSourceInfo5;
           (_this$fetchSourceInfo5 = this.fetchSourceInfoExperience) === null || _this$fetchSourceInfo5 === void 0 ? void 0 : _this$fetchSourceInfo5.failure({
             reason: error.message
           });
         }
-        (_this$fireAnalyticsEv5 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv5 === void 0 ? void 0 : _this$fireAnalyticsEv5.call(this, getSourceInfoErrorPayload(error.message, resourceId));
+        (_this$fireAnalyticsEv7 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv7 === void 0 ? void 0 : _this$fireAnalyticsEv7.call(this, getSourceInfoErrorPayload(error.message, resourceId));
         return undefined;
       }).finally(() => {
         if (fg('platform_synced_block_dogfooding')) {
@@ -188,11 +350,11 @@ export class ReferenceSyncBlockStoreManager {
         this.syncBlockSourceInfoRequestsOld.set(resourceId, true);
       }
     } catch (error) {
-      var _this$fireAnalyticsEv6;
+      var _this$fireAnalyticsEv8;
       logException(error, {
         location: 'editor-synced-block-provider/referenceSyncBlockStoreManager'
       });
-      (_this$fireAnalyticsEv6 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv6 === void 0 ? void 0 : _this$fireAnalyticsEv6.call(this, getSourceInfoErrorPayload(error.message, resourceId));
+      (_this$fireAnalyticsEv8 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv8 === void 0 ? void 0 : _this$fireAnalyticsEv8.call(this, getSourceInfoErrorPayload(error.message, resourceId));
     }
     return Promise.resolve(undefined);
   }
@@ -242,8 +404,8 @@ export class ReferenceSyncBlockStoreManager {
     let hasExpectedError = false;
     data.forEach(syncBlockInstance => {
       if (!syncBlockInstance.resourceId) {
-        var _this$fireAnalyticsEv7;
-        (_this$fireAnalyticsEv7 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv7 === void 0 ? void 0 : _this$fireAnalyticsEv7.call(this, fetchErrorPayload(syncBlockInstance.error || 'Returned sync block instance does not have resource id'));
+        var _this$fireAnalyticsEv9;
+        (_this$fireAnalyticsEv9 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv9 === void 0 ? void 0 : _this$fireAnalyticsEv9.call(this, fetchErrorPayload(syncBlockInstance.error || 'Returned sync block instance does not have resource id'));
         return;
       }
       const existingSyncBlock = this.getFromCache(syncBlockInstance.resourceId);
@@ -251,8 +413,8 @@ export class ReferenceSyncBlockStoreManager {
       this.updateCache(resolvedSyncBlockInstance);
       resolvedData.push(resolvedSyncBlockInstance);
       if (syncBlockInstance.error) {
-        var _this$fireAnalyticsEv8;
-        (_this$fireAnalyticsEv8 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv8 === void 0 ? void 0 : _this$fireAnalyticsEv8.call(this, fetchErrorPayload(syncBlockInstance.error, syncBlockInstance.resourceId));
+        var _this$fireAnalyticsEv0;
+        (_this$fireAnalyticsEv0 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv0 === void 0 ? void 0 : _this$fireAnalyticsEv0.call(this, fetchErrorPayload(syncBlockInstance.error, syncBlockInstance.resourceId));
         if (syncBlockInstance.error === SyncBlockError.NotFound || syncBlockInstance.error === SyncBlockError.Forbidden) {
           hasExpectedError = true;
         } else if (syncBlockInstance.error) {
@@ -260,8 +422,8 @@ export class ReferenceSyncBlockStoreManager {
         }
         return;
       } else if (fg('platform_synced_block_dogfooding')) {
-        var _this$fireAnalyticsEv9, _syncBlockInstance$da, _syncBlockInstance$da2;
-        (_this$fireAnalyticsEv9 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv9 === void 0 ? void 0 : _this$fireAnalyticsEv9.call(this, fetchSuccessPayload(syncBlockInstance.resourceId, (_syncBlockInstance$da = syncBlockInstance.data) === null || _syncBlockInstance$da === void 0 ? void 0 : _syncBlockInstance$da.blockInstanceId, (_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.product));
+        var _this$fireAnalyticsEv1, _syncBlockInstance$da, _syncBlockInstance$da2;
+        (_this$fireAnalyticsEv1 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv1 === void 0 ? void 0 : _this$fireAnalyticsEv1.call(this, fetchSuccessPayload(syncBlockInstance.resourceId, (_syncBlockInstance$da = syncBlockInstance.data) === null || _syncBlockInstance$da === void 0 ? void 0 : _syncBlockInstance$da.blockInstanceId, (_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.product));
       }
       this.fetchSyncBlockSourceInfo(resolvedSyncBlockInstance.resourceId);
     });
@@ -290,7 +452,7 @@ export class ReferenceSyncBlockStoreManager {
         ...existingSyncBlock.data,
         sourceURL: sourceInfo === null || sourceInfo === void 0 ? void 0 : sourceInfo.url,
         sourceTitle: sourceInfo === null || sourceInfo === void 0 ? void 0 : sourceInfo.title,
-        onSamePage: sourceInfo === null || sourceInfo === void 0 ? void 0 : sourceInfo.onSamePage,
+        onSameDocument: sourceInfo === null || sourceInfo === void 0 ? void 0 : sourceInfo.onSameDocument,
         sourceSubType: sourceInfo === null || sourceInfo === void 0 ? void 0 : sourceInfo.subType
       };
       this.updateCache(existingSyncBlock);
@@ -326,7 +488,7 @@ export class ReferenceSyncBlockStoreManager {
     this.providerFactories.delete(resourceId);
   }
   subscribeToSyncBlock(resourceId, localId, callback) {
-    var _this$dataProvider2, _this$dataProvider2$g;
+    var _this$dataProvider3, _this$dataProvider3$g;
     // Cancel any pending cache deletion for this resourceId.
     // This handles the case where a block is moved - the old component unmounts
     // (scheduling deletion) but the new component mounts and subscribes before
@@ -339,6 +501,7 @@ export class ReferenceSyncBlockStoreManager {
 
     // add to subscriptions map
     const resourceSubscriptions = this.subscriptions.get(resourceId) || {};
+    const isNewResourceSubscription = Object.keys(resourceSubscriptions).length === 0;
     this.subscriptions.set(resourceId, {
       ...resourceSubscriptions,
       [localId]: callback
@@ -346,22 +509,32 @@ export class ReferenceSyncBlockStoreManager {
 
     // New subscription means new reference synced block is added to the document
     this.isCacheDirty = true;
+
+    // Notify listeners if this is a new resource subscription
+    if (isNewResourceSubscription) {
+      this.notifySubscriptionChangeListeners();
+    }
     const syncBlockNode = createSyncBlockNode(localId, resourceId);
 
     // call the callback immediately if we have cached data
     // prefer cache from store manager first, should update data provider to use the same cache
-    const cachedData = this.getFromCache(resourceId) || ((_this$dataProvider2 = this.dataProvider) === null || _this$dataProvider2 === void 0 ? void 0 : (_this$dataProvider2$g = _this$dataProvider2.getNodeDataFromCache(syncBlockNode)) === null || _this$dataProvider2$g === void 0 ? void 0 : _this$dataProvider2$g.data);
+    const cachedData = this.getFromCache(resourceId) || ((_this$dataProvider3 = this.dataProvider) === null || _this$dataProvider3 === void 0 ? void 0 : (_this$dataProvider3$g = _this$dataProvider3.getNodeDataFromCache(syncBlockNode)) === null || _this$dataProvider3$g === void 0 ? void 0 : _this$dataProvider3$g.data);
     if (cachedData) {
       callback(cachedData);
     } else {
       this.fetchSyncBlocksData([syncBlockNode]).catch(error => {
-        var _this$fireAnalyticsEv0;
+        var _this$fireAnalyticsEv10;
         logException(error, {
           location: 'editor-synced-block-provider/referenceSyncBlockStoreManager'
         });
-        (_this$fireAnalyticsEv0 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv0 === void 0 ? void 0 : _this$fireAnalyticsEv0.call(this, fetchErrorPayload(error.message, resourceId));
+        (_this$fireAnalyticsEv10 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv10 === void 0 ? void 0 : _this$fireAnalyticsEv10.call(this, fetchErrorPayload(error.message, resourceId));
       });
     }
+
+    // Set up GraphQL subscription if real-time subscriptions are enabled
+    if (this.useRealTimeSubscriptions) {
+      this.setupGraphQLSubscription(resourceId);
+    }
     return () => {
       const resourceSubscriptions = this.subscriptions.get(resourceId);
       if (resourceSubscriptions) {
@@ -370,6 +543,13 @@ export class ReferenceSyncBlockStoreManager {
         delete resourceSubscriptions[localId];
         if (Object.keys(resourceSubscriptions).length === 0) {
           this.subscriptions.delete(resourceId);
+
+          // Clean up GraphQL subscription when no more local subscribers
+          this.cleanupGraphQLSubscription(resourceId);
+
+          // Notify listeners that subscription was removed
+          this.notifySubscriptionChangeListeners();
+
           // Delay cache deletion to handle block moves (unmount/remount).
           // When a block is moved, the old component unmounts before the new one mounts.
           // By delaying deletion, we give the new component time to subscribe and
@@ -440,11 +620,11 @@ export class ReferenceSyncBlockStoreManager {
       }
       return this.subscribeToSyncBlock(resourceId, localId, callback);
     } catch (error) {
-      var _this$fireAnalyticsEv1;
+      var _this$fireAnalyticsEv11;
       logException(error, {
         location: 'editor-synced-block-provider/referenceSyncBlockStoreManager'
       });
-      (_this$fireAnalyticsEv1 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv1 === void 0 ? void 0 : _this$fireAnalyticsEv1.call(this, fetchErrorPayload(error.message));
+      (_this$fireAnalyticsEv11 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv11 === void 0 ? void 0 : _this$fireAnalyticsEv11.call(this, fetchErrorPayload(error.message));
       return () => {};
     }
   }
@@ -464,12 +644,12 @@ export class ReferenceSyncBlockStoreManager {
   }
   getProviderFactory(resourceId) {
     if (!this.dataProvider) {
-      var _this$fireAnalyticsEv10;
+      var _this$fireAnalyticsEv12;
       const error = new Error('Data provider not set');
       logException(error, {
         location: 'editor-synced-block-provider/referenceSyncBlockStoreManager'
       });
-      (_this$fireAnalyticsEv10 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv10 === void 0 ? void 0 : _this$fireAnalyticsEv10.call(this, fetchErrorPayload(error.message));
+      (_this$fireAnalyticsEv12 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv12 === void 0 ? void 0 : _this$fireAnalyticsEv12.call(this, fetchErrorPayload(error.message));
       return undefined;
     }
     const {
@@ -499,11 +679,11 @@ export class ReferenceSyncBlockStoreManager {
       try {
         this.retrieveDynamicProviders(resourceId, providerFactory, providerCreator);
       } catch (error) {
-        var _this$fireAnalyticsEv11;
+        var _this$fireAnalyticsEv13;
         logException(error, {
           location: 'editor-synced-block-provider/referenceSyncBlockStoreManager'
         });
-        (_this$fireAnalyticsEv11 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv11 === void 0 ? void 0 : _this$fireAnalyticsEv11.call(this, fetchErrorPayload(error.message, resourceId));
+        (_this$fireAnalyticsEv13 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv13 === void 0 ? void 0 : _this$fireAnalyticsEv13.call(this, fetchErrorPayload(error.message, resourceId));
       }
     }
     return providerFactory;
@@ -547,7 +727,7 @@ export class ReferenceSyncBlockStoreManager {
     return null;
   }
   retrieveDynamicProviders(resourceId, providerFactory, providerCreator) {
-    var _syncBlock$data2, _syncBlock$data3, _syncBlock$data4, _syncBlock$data5;
+    var _syncBlock$data2, _syncBlock$data3;
     if (!this.dataProvider) {
       throw new Error('Data provider not set');
     }
@@ -558,15 +738,15 @@ export class ReferenceSyncBlockStoreManager {
       return;
     }
     const syncBlock = this.getFromCache(resourceId);
-    if (!syncBlock) {
+    if (!(syncBlock !== null && syncBlock !== void 0 && syncBlock.data)) {
       return;
     }
-    if (!((_syncBlock$data2 = syncBlock.data) !== null && _syncBlock$data2 !== void 0 && _syncBlock$data2.sourceAri) || !((_syncBlock$data3 = syncBlock.data) !== null && _syncBlock$data3 !== void 0 && _syncBlock$data3.product)) {
-      var _this$fireAnalyticsEv12;
-      (_this$fireAnalyticsEv12 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv12 === void 0 ? void 0 : _this$fireAnalyticsEv12.call(this, fetchErrorPayload('Sync block source ari or product not found'));
+    if (!syncBlock.data.sourceAri || !syncBlock.data.product) {
+      var _this$fireAnalyticsEv14;
+      (_this$fireAnalyticsEv14 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv14 === void 0 ? void 0 : _this$fireAnalyticsEv14.call(this, fetchErrorPayload('Sync block source ari or product not found'));
       return;
     }
-    const parentInfo = this.dataProvider.retrieveSyncBlockParentInfo((_syncBlock$data4 = syncBlock.data) === null || _syncBlock$data4 === void 0 ? void 0 : _syncBlock$data4.sourceAri, (_syncBlock$data5 = syncBlock.data) === null || _syncBlock$data5 === void 0 ? void 0 : _syncBlock$data5.product);
+    const parentInfo = this.dataProvider.retrieveSyncBlockParentInfo((_syncBlock$data2 = syncBlock.data) === null || _syncBlock$data2 === void 0 ? void 0 : _syncBlock$data2.sourceAri, (_syncBlock$data3 = syncBlock.data) === null || _syncBlock$data3 === void 0 ? void 0 : _syncBlock$data3.product);
     if (!parentInfo) {
       throw new Error('Unable to retrive sync block parent info');
     }
@@ -628,9 +808,13 @@ export class ReferenceSyncBlockStoreManager {
           });
         });
       });
-      if (blocks.length === 0) {
-        this.isCacheDirty = false;
-        return true;
+      if (!fg('platform_synced_block_dogfooding')) {
+        // It's possible that the last reference block on the document was just deleted,
+        // we still want to write to BE to update reference count
+        if (blocks.length === 0) {
+          this.isCacheDirty = false;
+          return true;
+        }
       }
       if (!this.dataProvider) {
         throw new Error('Data provider not set');
@@ -648,7 +832,7 @@ export class ReferenceSyncBlockStoreManager {
       }
       const updateResult = await this.dataProvider.updateReferenceData(blocks);
       if (!updateResult.success) {
-        var _this$fireAnalyticsEv13;
+        var _this$fireAnalyticsEv15;
         success = false;
         if (fg('platform_synced_block_dogfooding')) {
           var _this$saveExperience2;
@@ -656,10 +840,10 @@ export class ReferenceSyncBlockStoreManager {
             reason: updateResult.error || 'Failed to update reference synced blocks on the document'
           });
         }
-        (_this$fireAnalyticsEv13 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv13 === void 0 ? void 0 : _this$fireAnalyticsEv13.call(this, updateReferenceErrorPayload(updateResult.error || 'Failed to update reference synced blocks on the document'));
+        (_this$fireAnalyticsEv15 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv15 === void 0 ? void 0 : _this$fireAnalyticsEv15.call(this, updateReferenceErrorPayload(updateResult.error || 'Failed to update reference synced blocks on the document'));
       }
     } catch (error) {
-      var _this$fireAnalyticsEv14;
+      var _this$fireAnalyticsEv16;
       success = false;
       logException(error, {
         location: 'editor-synced-block-provider/referenceSyncBlockStoreManager'
@@ -670,7 +854,7 @@ export class ReferenceSyncBlockStoreManager {
           reason: error.message
         });
       }
-      (_this$fireAnalyticsEv14 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv14 === void 0 ? void 0 : _this$fireAnalyticsEv14.call(this, updateReferenceErrorPayload(error.message));
+      (_this$fireAnalyticsEv16 = this.fireAnalyticsEvent) === null || _this$fireAnalyticsEv16 === void 0 ? void 0 : _this$fireAnalyticsEv16.call(this, updateReferenceErrorPayload(error.message));
     } finally {
       if (!success) {
         // set isCacheDirty back to true for cases where it failed to update the reference synced blocks on the BE
@@ -684,6 +868,8 @@ export class ReferenceSyncBlockStoreManager {
   }
   destroy() {
     var _this$saveExperience5, _this$fetchExperience5, _this$fetchSourceInfo6;
+    // Clean up all GraphQL subscriptions first
+    this.cleanupAllGraphQLSubscriptions();
     this.dataProvider = undefined;
     this.syncBlockCache.clear();
     this.subscriptions.clear();
@@ -693,6 +879,8 @@ export class ReferenceSyncBlockStoreManager {
     this.syncBlockSourceInfoRequests.clear();
     this.providerFactories.clear();
     this.isRefreshingSubscriptions = false;
+    this.useRealTimeSubscriptions = false;
+    this.subscriptionChangeListeners.clear();
     this.providerFactories.forEach(providerFactory => {
       providerFactory.destroy();
     });

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

@@ -47,7 +47,7 @@ export class SyncBlockStoreManager {
         }
         return {
           ...sourceInfo,
-          onSamePage: reference.onSamePage,
+          onSameDocument: reference.onSameDocument,
           hasAccess: reference.hasAccess,
           productType: sourceInfo.productType
         };
@@ -57,7 +57,7 @@ export class SyncBlockStoreManager {
       if (sourceSyncBlockData) {
         sourceInfos.push({
           ...sourceSyncBlockData,
-          onSamePage: Boolean(sourceSyncBlockData === null || sourceSyncBlockData === void 0 ? void 0 : sourceSyncBlockData.onSamePage),
+          onSameDocument: Boolean(sourceSyncBlockData === null || sourceSyncBlockData === void 0 ? void 0 : sourceSyncBlockData.onSameDocument),
           hasAccess: true,
           isSource: true,
           productType: sourceSyncBlockData === null || sourceSyncBlockData === void 0 ? void 0 : sourceSyncBlockData.productType

package/dist/es2019/utils/resolveSyncBlockInstance.js

@@ -33,7 +33,7 @@ export const resolveSyncBlockInstance = (oldResult, newResult) => {
       sourceTitle: ((_newResult$data2 = newResult.data) === null || _newResult$data2 === void 0 ? void 0 : _newResult$data2.sourceTitle) || ((_oldResult$data2 = oldResult.data) === null || _oldResult$data2 === void 0 ? void 0 : _oldResult$data2.sourceTitle) || undefined,
       ...(fg('platform_synced_block_dogfooding') && {
         sourceSubType: ((_newResult$data3 = newResult.data) === null || _newResult$data3 === void 0 ? void 0 : _newResult$data3.sourceSubType) || ((_oldResult$data3 = oldResult.data) === null || _oldResult$data3 === void 0 ? void 0 : _oldResult$data3.sourceSubType) || undefined,
-        onSamePage: ((_newResult$data4 = newResult.data) === null || _newResult$data4 === void 0 ? void 0 : _newResult$data4.onSamePage) || ((_oldResult$data4 = oldResult.data) === null || _oldResult$data4 === void 0 ? void 0 : _oldResult$data4.onSamePage) || undefined
+        onSameDocument: ((_newResult$data4 = newResult.data) === null || _newResult$data4 === void 0 ? void 0 : _newResult$data4.onSameDocument) || ((_oldResult$data4 = oldResult.data) === null || _oldResult$data4 === void 0 ? void 0 : _oldResult$data4.onSameDocument) || undefined
       })
     }
   };