@atlaskit/editor-synced-block-provider 4.1.0 → 4.1.1

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

@@ -12,7 +12,6 @@ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
 var _monitoring = require("@atlaskit/editor-common/monitoring");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _types = require("../common/types");
 var _errorHandling = require("../utils/errorHandling");
 var _experienceTracking = require("../utils/experienceTracking");
@@ -72,11 +71,9 @@ var SourceSyncBlockStoreManager = exports.SourceSyncBlockStoreManager = /*#__PUR
           throw new Error('Local ID or resource ID is not set');
         }
         var syncBlockData = (0, _utils.convertSyncBlockPMNodeToSyncBlockData)(syncBlockNode);
-        if ((0, _platformFeatureFlags.fg)('platform_synced_block_patch_5')) {
-          var cachedBlock = this.syncBlockCache.get(resourceId);
-          if (cachedBlock && !(0, _isEqual.default)(syncBlockData.content, cachedBlock.content)) {
-            this.hasReceivedContentChange = true;
-          }
+        var cachedBlock = this.syncBlockCache.get(resourceId);
+        if (cachedBlock && !(0, _isEqual.default)(syncBlockData.content, cachedBlock.content)) {
+          this.hasReceivedContentChange = true;
         }
         this.syncBlockCache.set(resourceId, _objectSpread(_objectSpread({}, syncBlockData), {}, {
           isDirty: true

package/dist/cjs/store-manager/syncBlockSubscriptionManager.js

@@ -9,26 +9,45 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/cl
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _monitoring = require("@atlaskit/editor-common/monitoring");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _errorHandling = require("../utils/errorHandling");
 var _resolveSyncBlockInstance = require("../utils/resolveSyncBlockInstance");
 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; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+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) { (0, _defineProperty2.default)(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; }
 /**
  * Manages the lifecycle of GraphQL WebSocket subscriptions for sync block
- * real-time updates, and provides a listener API so React components can
- * react when the set of subscribed resource IDs changes.
+ * real-time updates, owns the subscriptions and titleSubscriptions maps,
+ * and provides a listener API so React components can react when the set
+ * of subscribed resource IDs changes.
  */
 var SyncBlockSubscriptionManager = exports.SyncBlockSubscriptionManager = /*#__PURE__*/function () {
   function SyncBlockSubscriptionManager(deps) {
     (0, _classCallCheck2.default)(this, SyncBlockSubscriptionManager);
+    (0, _defineProperty2.default)(this, "subscriptions", new Map());
+    (0, _defineProperty2.default)(this, "titleSubscriptions", new Map());
     (0, _defineProperty2.default)(this, "graphqlSubscriptions", new Map());
     (0, _defineProperty2.default)(this, "subscriptionChangeListeners", new Set());
     (0, _defineProperty2.default)(this, "useRealTimeSubscriptions", false);
+    // 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.
+    (0, _defineProperty2.default)(this, "pendingCacheDeletions", new Map());
     this.deps = deps;
   }
+
+  /**
+   * Returns the subscriptions map. Used by external consumers (e.g. batch fetcher, flush)
+   * that need to read the current subscription state.
+   */
   return (0, _createClass2.default)(SyncBlockSubscriptionManager, [{
+    key: "getSubscriptions",
+    value: function getSubscriptions() {
+      return this.subscriptions;
+    }
+  }, {
     key: "setRealTimeSubscriptionsEnabled",
     value: function setRealTimeSubscriptionsEnabled(enabled) {
       if (this.useRealTimeSubscriptions === enabled) {
@@ -49,7 +68,7 @@ var SyncBlockSubscriptionManager = exports.SyncBlockSubscriptionManager = /*#__P
   }, {
     key: "getSubscribedResourceIds",
     value: function getSubscribedResourceIds() {
-      return Array.from(this.deps.getSubscriptions().keys());
+      return Array.from(this.subscriptions.keys());
     }
   }, {
     key: "onSubscriptionsChanged",
@@ -89,10 +108,140 @@ var SyncBlockSubscriptionManager = exports.SyncBlockSubscriptionManager = /*#__P
         this.deps.fetchSyncBlockSourceInfo(resolved.resourceId);
       }
     }
+  }, {
+    key: "subscribeToSyncBlock",
+    value: function subscribeToSyncBlock(resourceId, localId, callback) {
+      var _this3 = this;
+      // 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
+      // the deletion timeout fires.
+      var pendingDeletion = this.pendingCacheDeletions.get(resourceId);
+      if (pendingDeletion) {
+        clearTimeout(pendingDeletion);
+        this.pendingCacheDeletions.delete(resourceId);
+      }
+
+      // add to subscriptions map
+      var resourceSubscriptions = this.subscriptions.get(resourceId) || {};
+      var isNewResourceSubscription = Object.keys(resourceSubscriptions).length === 0;
+      this.subscriptions.set(resourceId, _objectSpread(_objectSpread({}, resourceSubscriptions), {}, (0, _defineProperty2.default)({}, localId, callback)));
+
+      // New subscription means new reference synced block is added to the document
+      this.deps.markCacheDirty();
+
+      // Notify listeners if this is a new resource subscription
+      if (isNewResourceSubscription) {
+        this.notifySubscriptionChangeListeners();
+      }
+      var cachedData = this.deps.getFromCache(resourceId);
+      if (cachedData) {
+        callback(cachedData);
+      } else {
+        this.deps.debouncedBatchedFetchSyncBlocks(resourceId);
+      }
+
+      // Set up GraphQL subscription if real-time subscriptions are enabled
+      if (this.shouldUseRealTime()) {
+        this.setupSubscription(resourceId);
+      }
+      return function () {
+        var resourceSubscriptions = _this3.subscriptions.get(resourceId);
+        if (resourceSubscriptions) {
+          // Unsubscription means a reference synced block is removed from the document
+          _this3.deps.markCacheDirty();
+          delete resourceSubscriptions[localId];
+          if (Object.keys(resourceSubscriptions).length === 0) {
+            _this3.subscriptions.delete(resourceId);
+
+            // Clean up GraphQL subscription when no more local subscribers
+            _this3.cleanupSubscription(resourceId);
+
+            // Notify listeners that subscription was removed
+            _this3.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
+            // cancel this pending deletion, preserving the cached data.
+            // TODO: EDITOR-4152 - Rework this logic
+            var deletionTimeout = setTimeout(function () {
+              // Only delete if still no subscribers (wasn't re-subscribed)
+              if (!_this3.subscriptions.has(resourceId)) {
+                _this3.deps.deleteFromCache(resourceId);
+              }
+              _this3.pendingCacheDeletions.delete(resourceId);
+            }, 1000);
+            _this3.pendingCacheDeletions.set(resourceId, deletionTimeout);
+          } else {
+            _this3.subscriptions.set(resourceId, resourceSubscriptions);
+          }
+        }
+      };
+    }
+  }, {
+    key: "subscribeToSourceTitle",
+    value: function subscribeToSourceTitle(node, callback) {
+      var _cachedData$data,
+        _this4 = this;
+      // check node is a sync block, as we only support sync block subscriptions
+      if (node.type.name !== 'syncBlock') {
+        return function () {};
+      }
+      var _node$attrs = node.attrs,
+        resourceId = _node$attrs.resourceId,
+        localId = _node$attrs.localId;
+      if (!localId || !resourceId) {
+        return function () {};
+      }
+      var cachedData = this.deps.getFromCache(resourceId);
+      if (cachedData !== null && cachedData !== void 0 && (_cachedData$data = cachedData.data) !== null && _cachedData$data !== void 0 && _cachedData$data.sourceTitle) {
+        callback(cachedData.data.sourceTitle);
+      }
+
+      // add to subscriptions map
+      var resourceSubscriptions = this.titleSubscriptions.get(resourceId) || {};
+      this.titleSubscriptions.set(resourceId, _objectSpread(_objectSpread({}, resourceSubscriptions), {}, (0, _defineProperty2.default)({}, localId, callback)));
+      return function () {
+        var resourceSubscriptions = _this4.titleSubscriptions.get(resourceId);
+        if (resourceSubscriptions) {
+          delete resourceSubscriptions[localId];
+          if (Object.keys(resourceSubscriptions).length === 0) {
+            _this4.titleSubscriptions.delete(resourceId);
+          } else {
+            _this4.titleSubscriptions.set(resourceId, resourceSubscriptions);
+          }
+        }
+      };
+    }
+  }, {
+    key: "updateSourceTitleSubscriptions",
+    value: function updateSourceTitleSubscriptions(resourceId, title) {
+      var callbacks = this.titleSubscriptions.get(resourceId);
+      if (callbacks) {
+        Object.values(callbacks).forEach(function (callback) {
+          callback(title);
+        });
+      }
+    }
+
+    /**
+     * Notifies all subscription callbacks for a given resource ID with the provided sync block instance.
+     */
+  }, {
+    key: "notifySubscriptionCallbacks",
+    value: function notifySubscriptionCallbacks(resourceId, syncBlock) {
+      var callbacks = this.subscriptions.get(resourceId);
+      if (callbacks) {
+        Object.values(callbacks).forEach(function (callback) {
+          callback(syncBlock);
+        });
+      }
+    }
   }, {
     key: "setupSubscription",
     value: function setupSubscription(resourceId) {
-      var _this3 = this;
+      var _this5 = this;
       if (this.graphqlSubscriptions.has(resourceId)) {
         return;
       }
@@ -101,13 +250,13 @@ var SyncBlockSubscriptionManager = exports.SyncBlockSubscriptionManager = /*#__P
         return;
       }
       var unsubscribe = dataProvider.subscribeToBlockUpdates(resourceId, function (syncBlockInstance) {
-        _this3.handleGraphQLUpdate(syncBlockInstance);
+        _this5.handleGraphQLUpdate(syncBlockInstance);
       }, function (error) {
-        var _this3$deps$getFireAn;
+        var _this5$deps$getFireAn;
         (0, _monitoring.logException)(error, {
           location: 'editor-synced-block-provider/syncBlockSubscriptionManager/graphql-subscription'
         });
-        (_this3$deps$getFireAn = _this3.deps.getFireAnalyticsEvent()) === null || _this3$deps$getFireAn === void 0 || _this3$deps$getFireAn((0, _errorHandling.fetchErrorPayload)(error.message));
+        (_this5$deps$getFireAn = _this5.deps.getFireAnalyticsEvent()) === null || _this5$deps$getFireAn === void 0 || _this5$deps$getFireAn((0, _errorHandling.fetchErrorPayload)(error.message));
       });
       if (unsubscribe) {
         this.graphqlSubscriptions.set(resourceId, unsubscribe);
@@ -125,7 +274,7 @@ var SyncBlockSubscriptionManager = exports.SyncBlockSubscriptionManager = /*#__P
   }, {
     key: "setupSubscriptionsForAllBlocks",
     value: function setupSubscriptionsForAllBlocks() {
-      var _iterator = _createForOfIteratorHelper(this.deps.getSubscriptions().keys()),
+      var _iterator = _createForOfIteratorHelper(this.subscriptions.keys()),
         _step;
       try {
         for (_iterator.s(); !(_step = _iterator.n()).done;) {
@@ -159,8 +308,25 @@ var SyncBlockSubscriptionManager = exports.SyncBlockSubscriptionManager = /*#__P
     key: "destroy",
     value: function destroy() {
       this.cleanupAll();
+      this.subscriptions.clear();
+      this.titleSubscriptions.clear();
       this.subscriptionChangeListeners.clear();
       this.useRealTimeSubscriptions = false;
+
+      // Clear any pending cache deletions
+      var _iterator3 = _createForOfIteratorHelper(this.pendingCacheDeletions.values()),
+        _step3;
+      try {
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var timeout = _step3.value;
+          clearTimeout(timeout);
+        }
+      } catch (err) {
+        _iterator3.e(err);
+      } finally {
+        _iterator3.f();
+      }
+      this.pendingCacheDeletions.clear();
     }
   }, {
     key: "shouldUseRealTime",
@@ -170,22 +336,19 @@ var SyncBlockSubscriptionManager = exports.SyncBlockSubscriptionManager = /*#__P
   }, {
     key: "handleGraphQLUpdate",
     value: function handleGraphQLUpdate(syncBlockInstance) {
-      var _this4 = this;
+      var _this6 = this;
       if (!syncBlockInstance.resourceId) {
-        if ((0, _platformFeatureFlags.fg)('platform_synced_block_patch_5')) {
-          return;
-        }
-        throw new Error('Sync block instance provided to graphql subscription update missing resource id');
+        return;
       }
       var existing = this.deps.getFromCache(syncBlockInstance.resourceId);
       var resolved = existing ? (0, _resolveSyncBlockInstance.resolveSyncBlockInstance)(existing, syncBlockInstance) : syncBlockInstance;
       this.deps.updateCache(resolved);
       if (!syncBlockInstance.error) {
-        var callbacks = this.deps.getSubscriptions().get(syncBlockInstance.resourceId);
+        var callbacks = this.subscriptions.get(syncBlockInstance.resourceId);
         var localIds = callbacks ? Object.keys(callbacks) : [];
         localIds.forEach(function (localId) {
-          var _this4$deps$getFireAn, _syncBlockInstance$da;
-          (_this4$deps$getFireAn = _this4.deps.getFireAnalyticsEvent()) === null || _this4$deps$getFireAn === void 0 || _this4$deps$getFireAn((0, _errorHandling.fetchSuccessPayload)(syncBlockInstance.resourceId, localId, (_syncBlockInstance$da = syncBlockInstance.data) === null || _syncBlockInstance$da === void 0 ? void 0 : _syncBlockInstance$da.product));
+          var _this6$deps$getFireAn, _syncBlockInstance$da;
+          (_this6$deps$getFireAn = _this6.deps.getFireAnalyticsEvent()) === null || _this6$deps$getFireAn === void 0 || _this6$deps$getFireAn((0, _errorHandling.fetchSuccessPayload)(syncBlockInstance.resourceId, localId, (_syncBlockInstance$da = syncBlockInstance.data) === null || _syncBlockInstance$da === void 0 ? void 0 : _syncBlockInstance$da.product));
         });
         this.deps.fetchSyncBlockSourceInfo(resolved.resourceId);
       } else {