@atlaskit/editor-synced-block-provider 0.2.0 → 0.3.0

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/editor-synced-block-provider
 
+## 0.3.0
+
+### Minor Changes
+
+- [`9e7a5a0bb1869`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9e7a5a0bb1869) -
+  Add content api sync block provider
+
 ## 0.2.0
 
 ### Minor Changes

package/dist/cjs/common/syncBlockProvider.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useFetchDocNode = exports.SyncBlockProvider = void 0;
+exports.useMemoizedSyncedBlockProvider = exports.useFetchDocNode = exports.SyncBlockProvider = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
@@ -55,6 +55,9 @@ var SyncBlockProvider = exports.SyncBlockProvider = /*#__PURE__*/function (_Sync
       });
       return Promise.all(resourceIds);
     });
+    (0, _defineProperty2.default)(_this, "getSourceId", function () {
+      return _this.sourceId;
+    });
     _this.fetchProvider = fetchProvider;
     _this.writeProvider = writeProvider;
     _this.sourceId = sourceId;
@@ -68,25 +71,34 @@ var useFetchDocNode = exports.useFetchDocNode = function useFetchDocNode(editorV
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     docNode = _useState2[0],
     setDocNode = _useState2[1];
+  var fetchNode = function fetchNode(editorView, node, provider) {
+    var nodes = [(0, _utils.convertSyncBlockPMNodeToSyncBlockData)(node, false)];
+    provider === null || provider === void 0 || provider.fetchNodesData(nodes).then(function (data) {
+      var _data$;
+      if (data && (_data$ = data[0]) !== null && _data$ !== void 0 && _data$.content) {
+        var newNode = editorView.state.schema.nodeFromJSON(data[0].content);
+        setDocNode(_objectSpread(_objectSpread({}, newNode.toJSON()), {}, {
+          version: 1
+        }));
+      }
+    });
+  };
   (0, _react.useEffect)(function () {
     if (!provider) {
       return;
     }
+    fetchNode(editorView, node, provider);
     var interval = window.setInterval(function () {
-      var nodes = [(0, _utils.convertSyncBlockPMNodeToSyncBlockData)(node, false)];
-      provider === null || provider === void 0 || provider.fetchNodesData(nodes).then(function (data) {
-        var _data$;
-        if (data && (_data$ = data[0]) !== null && _data$ !== void 0 && _data$.content) {
-          var newNode = editorView.state.schema.nodeFromJSON(data[0].content);
-          setDocNode(_objectSpread(_objectSpread({}, newNode.toJSON()), {}, {
-            version: 1
-          }));
-        }
-      });
-    }, 1000);
+      fetchNode(editorView, node, provider);
+    }, 3000);
     return function () {
       window.clearInterval(interval);
     };
   }, [editorView, node, provider]);
   return docNode;
+};
+var useMemoizedSyncedBlockProvider = exports.useMemoizedSyncedBlockProvider = function useMemoizedSyncedBlockProvider(fetchProvider, writeProvider, sourceId) {
+  return (0, _react.useMemo)(function () {
+    return new SyncBlockProvider(fetchProvider, writeProvider, sourceId);
+  }, [fetchProvider, writeProvider, sourceId]);
 };

package/dist/cjs/common/syncBlockStoreManager.js

@@ -18,9 +18,10 @@ var _uuid = _interopRequireDefault(require("uuid"));
 // Handles caching, debouncing updates, and publish/subscribe for local changes.
 // Ensures consistency between local and remote state, and can be used in both editor and renderer contexts.
 var SyncBlockStoreManager = exports.SyncBlockStoreManager = /*#__PURE__*/function () {
-  function SyncBlockStoreManager(_dataProvider) {
+  function SyncBlockStoreManager(dataProvider) {
     (0, _classCallCheck2.default)(this, SyncBlockStoreManager);
     this.syncBlocks = new Map();
+    this.dataProvider = dataProvider;
   }
   return (0, _createClass2.default)(SyncBlockStoreManager, [{
     key: "setEditorView",
@@ -30,14 +31,13 @@ var SyncBlockStoreManager = exports.SyncBlockStoreManager = /*#__PURE__*/functio
   }, {
     key: "isSourceBlock",
     value: function isSourceBlock(node) {
-      var _this$syncBlocks$get;
       if (node.type.name !== 'syncBlock') {
         return false;
       }
       var _node$attrs = node.attrs,
         resourceId = _node$attrs.resourceId,
         localId = _node$attrs.localId;
-      return this.syncBlocks.has(resourceId) && ((_this$syncBlocks$get = this.syncBlocks.get(resourceId)) === null || _this$syncBlocks$get === void 0 ? void 0 : _this$syncBlocks$get.sourceLocalId) === localId;
+      return resourceId.includes(localId);
     }
   }, {
     key: "registerConfirmationCallback",
@@ -56,15 +56,18 @@ var SyncBlockStoreManager = exports.SyncBlockStoreManager = /*#__PURE__*/functio
   }, {
     key: "createSyncBlockNode",
     value: function createSyncBlockNode() {
+      var _this$dataProvider;
       // TODO: EDITOR-1644 - properly implement creation of the synced block
       // below is a temporary implementation for the creation of the synced block
       // the resource id needs to have pageId and content property key in it
+      // Note: If the data provider is not set, the resource id will be the local id
 
-      var blockInstanceId = (0, _uuid.default)();
       var localId = (0, _uuid.default)();
+      var sourceId = (_this$dataProvider = this.dataProvider) === null || _this$dataProvider === void 0 ? void 0 : _this$dataProvider.getSourceId();
+      var resourceId = sourceId ? "".concat(sourceId, "/").concat(localId) : localId;
       var syncBlockNode = {
         attrs: {
-          resourceId: "ari:cloud:confluence:fake_cloud_id:page/fake_page_id/".concat(blockInstanceId),
+          resourceId: resourceId,
           localId: localId
         },
         type: 'syncBlock'

package/dist/cjs/index.js

@@ -21,12 +21,24 @@ Object.defineProperty(exports, "convertSyncBlockPMNodeToSyncBlockData", {
     return _utils.convertSyncBlockPMNodeToSyncBlockData;
   }
 });
+Object.defineProperty(exports, "createContentAPIProvidersWithDefaultKey", {
+  enumerable: true,
+  get: function get() {
+    return _confluenceContentAPI.createContentAPIProvidersWithDefaultKey;
+  }
+});
 Object.defineProperty(exports, "generateSyncBlockSourceUrl", {
   enumerable: true,
   get: function get() {
     return _utils.generateSyncBlockSourceUrl;
   }
 });
+Object.defineProperty(exports, "getConfluencePageAri", {
+  enumerable: true,
+  get: function get() {
+    return _ari.getConfluencePageAri;
+  }
+});
 Object.defineProperty(exports, "getDefaultSyncBlockSchema", {
   enumerable: true,
   get: function get() {
@@ -51,8 +63,22 @@ Object.defineProperty(exports, "useFetchDocNode", {
     return _syncBlockProvider.useFetchDocNode;
   }
 });
+Object.defineProperty(exports, "useMemoizedContentAPIProviders", {
+  enumerable: true,
+  get: function get() {
+    return _confluenceContentAPI.useMemoizedContentAPIProviders;
+  }
+});
+Object.defineProperty(exports, "useMemoizedSyncedBlockProvider", {
+  enumerable: true,
+  get: function get() {
+    return _syncBlockProvider.useMemoizedSyncedBlockProvider;
+  }
+});
 var _syncBlockProvider = require("./common/syncBlockProvider");
 var _syncBlockStoreManager = require("./common/syncBlockStoreManager");
 var _inMemory = require("./providers/inMemory");
-var _utils = require("./utils/utils");
-var _schema = require("./common/schema");
+var _schema = require("./common/schema");
+var _confluenceContentAPI = require("./providers/confluenceContentAPI");
+var _ari = require("./utils/ari");
+var _utils = require("./utils/utils");

package/dist/cjs/providers/confluenceContentAPI.js

@@ -0,0 +1,238 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMemoizedContentAPIProviders = exports.createContentAPIProvidersWithDefaultKey = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _react = require("react");
+var _ari = require("../utils/ari");
+var _contentProperty = require("../utils/contentProperty");
+/**
+ * Configuration for Content API providers
+ */
+
+var getContentPropertyKey = function getContentPropertyKey(contentPropertyKey, localId) {
+  return contentPropertyKey + '-' + localId;
+};
+var parseSyncedBlockContentPropertyValue = function parseSyncedBlockContentPropertyValue(value) {
+  try {
+    if (typeof value === 'string') {
+      return JSON.parse(value);
+    }
+    return value;
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.error('Failed to parse synced block content:', error);
+    return {
+      content: undefined
+    };
+  }
+};
+
+/**
+ * ADFFetchProvider implementation that fetches synced block data from Confluence Content API
+ */
+var ConfluenceADFFetchProvider = /*#__PURE__*/function () {
+  function ConfluenceADFFetchProvider(config) {
+    (0, _classCallCheck2.default)(this, ConfluenceADFFetchProvider);
+    this.config = config;
+  }
+  return (0, _createClass2.default)(ConfluenceADFFetchProvider, [{
+    key: "fetchData",
+    value: function () {
+      var _fetchData = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(resourceId) {
+        var _contentProperty$data, pageId, localId, key, options, contentProperty, value, syncedBlockData;
+        return _regenerator.default.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              pageId = (0, _ari.getPageIdFromAri)(resourceId);
+              localId = (0, _ari.getLocalIdFromAri)(resourceId);
+              key = getContentPropertyKey(this.config.contentPropertyKey, localId);
+              options = {
+                pageId: pageId,
+                key: key,
+                cloudId: this.config.cloudId
+              };
+              _context.next = 7;
+              return (0, _contentProperty.getContentProperty)(options);
+            case 7:
+              contentProperty = _context.sent;
+              value = (_contentProperty$data = contentProperty.data.confluence.page.properties) === null || _contentProperty$data === void 0 || (_contentProperty$data = _contentProperty$data[0]) === null || _contentProperty$data === void 0 ? void 0 : _contentProperty$data.value;
+              if (value) {
+                _context.next = 11;
+                break;
+              }
+              throw new Error('Content property value does not exist');
+            case 11:
+              // Parse the synced block content from the property value
+              syncedBlockData = parseSyncedBlockContentPropertyValue(value);
+              return _context.abrupt("return", {
+                content: syncedBlockData.content
+              });
+            case 15:
+              _context.prev = 15;
+              _context.t0 = _context["catch"](0);
+              // eslint-disable-next-line no-console
+              console.error('Failed to fetch synced block data:', _context.t0);
+              return _context.abrupt("return", {
+                content: undefined
+              });
+            case 19:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, this, [[0, 15]]);
+      }));
+      function fetchData(_x) {
+        return _fetchData.apply(this, arguments);
+      }
+      return fetchData;
+    }()
+  }]);
+}();
+/**
+ * ADFWriteProvider implementation that writes synced block data to Confluence Content API
+ */
+var ConfluenceADFWriteProvider = /*#__PURE__*/function () {
+  function ConfluenceADFWriteProvider(config) {
+    var _this = this;
+    (0, _classCallCheck2.default)(this, ConfluenceADFWriteProvider);
+    (0, _defineProperty2.default)(this, "createNewContentProperty", /*#__PURE__*/function () {
+      var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(pageId, key, value) {
+        var _contentProperty$data2;
+        var contentProperty;
+        return _regenerator.default.wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              _context2.next = 2;
+              return (0, _contentProperty.createContentProperty)({
+                pageId: pageId,
+                key: key,
+                value: value,
+                cloudId: _this.config.cloudId
+              });
+            case 2:
+              contentProperty = _context2.sent;
+              if (!(((_contentProperty$data2 = contentProperty.data.confluence.createPageProperty.pageProperty) === null || _contentProperty$data2 === void 0 ? void 0 : _contentProperty$data2.key) === key)) {
+                _context2.next = 7;
+                break;
+              }
+              return _context2.abrupt("return", key);
+            case 7:
+              throw new Error('Failed to create content property');
+            case 8:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2);
+      }));
+      return function (_x2, _x3, _x4) {
+        return _ref.apply(this, arguments);
+      };
+    }());
+    this.config = config;
+  }
+  return (0, _createClass2.default)(ConfluenceADFWriteProvider, [{
+    key: "writeData",
+    value: function () {
+      var _writeData = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(sourceId, localId, data, resourceId) {
+        var pageId, syncedBlockValue, _contentProperty$data3, _localId, key, contentProperty, _key;
+        return _regenerator.default.wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
+            case 0:
+              _context3.prev = 0;
+              pageId = (0, _ari.getPageIdFromAri)(sourceId);
+              syncedBlockValue = JSON.stringify({
+                content: data
+              });
+              if (!resourceId) {
+                _context3.next = 20;
+                break;
+              }
+              // Update existing content property
+              _localId = (0, _ari.getLocalIdFromAri)(resourceId);
+              key = getContentPropertyKey(this.config.contentPropertyKey, _localId);
+              _context3.next = 8;
+              return (0, _contentProperty.updateContentProperty)({
+                pageId: pageId,
+                key: key,
+                value: syncedBlockValue,
+                cloudId: this.config.cloudId
+              });
+            case 8:
+              contentProperty = _context3.sent;
+              if (!(((_contentProperty$data3 = contentProperty.data.confluence.updateValuePageProperty.pageProperty) === null || _contentProperty$data3 === void 0 ? void 0 : _contentProperty$data3.key) === key)) {
+                _context3.next = 13;
+                break;
+              }
+              return _context3.abrupt("return", key);
+            case 13:
+              if (!(contentProperty.data.confluence.updateValuePageProperty.pageProperty === null)) {
+                _context3.next = 17;
+                break;
+              }
+              return _context3.abrupt("return", this.createNewContentProperty(pageId, key, syncedBlockValue));
+            case 17:
+              throw new Error('Failed to update content property');
+            case 18:
+              _context3.next = 22;
+              break;
+            case 20:
+              // Create new content property
+              _key = getContentPropertyKey(this.config.contentPropertyKey, localId);
+              return _context3.abrupt("return", this.createNewContentProperty(pageId, _key, syncedBlockValue));
+            case 22:
+              _context3.next = 28;
+              break;
+            case 24:
+              _context3.prev = 24;
+              _context3.t0 = _context3["catch"](0);
+              // eslint-disable-next-line no-console
+              console.error('Failed to write synced block data:', _context3.t0);
+              return _context3.abrupt("return", Promise.reject(_context3.t0));
+            case 28:
+            case "end":
+              return _context3.stop();
+          }
+        }, _callee3, this, [[0, 24]]);
+      }));
+      function writeData(_x5, _x6, _x7, _x8) {
+        return _writeData.apply(this, arguments);
+      }
+      return writeData;
+    }()
+  }]);
+}();
+/**
+ * Factory function to create both providers with shared configuration
+ */
+var createContentAPIProviders = function createContentAPIProviders(config) {
+  var fetchProvider = new ConfluenceADFFetchProvider(config);
+  var writeProvider = new ConfluenceADFWriteProvider(config);
+  return {
+    fetchProvider: fetchProvider,
+    writeProvider: writeProvider
+  };
+};
+
+/**
+ * Convenience function to create providers with default content property key
+ */
+var createContentAPIProvidersWithDefaultKey = exports.createContentAPIProvidersWithDefaultKey = function createContentAPIProvidersWithDefaultKey(cloudId) {
+  return createContentAPIProviders({
+    cloudId: cloudId,
+    contentPropertyKey: 'editor-synced-block'
+  });
+};
+var useMemoizedContentAPIProviders = exports.useMemoizedContentAPIProviders = function useMemoizedContentAPIProviders(cloudId) {
+  return (0, _react.useMemo)(function () {
+    return createContentAPIProvidersWithDefaultKey(cloudId);
+  }, [cloudId]);
+};

package/dist/cjs/utils/ari.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getPageIdFromAri = exports.getLocalIdFromAri = exports.getContentPropertyIdFromAri = exports.getContentPropertyAri = exports.getConfluencePageAri = void 0;
+var getConfluencePageAri = exports.getConfluencePageAri = function getConfluencePageAri(pageId, cloudId) {
+  return "ari:cloud:confluence:".concat(cloudId, ":page/").concat(pageId);
+};
+var getPageIdFromAri = exports.getPageIdFromAri = function getPageIdFromAri(ari) {
+  // eslint-disable-next-line require-unicode-regexp
+  var match = ari.match(/ari:cloud:confluence:[^:]+:page\/(\d+)/);
+  if (match !== null && match !== void 0 && match[1]) {
+    return match[1];
+  }
+  throw new Error("Invalid page ARI: ".concat(ari));
+};
+
+/**
+ *
+ * @param ari ari:cloud:confluence:<cloudId>:page/<pageId>/<localId>
+ * @returns
+ */
+var getLocalIdFromAri = exports.getLocalIdFromAri = function getLocalIdFromAri(ari) {
+  // eslint-disable-next-line require-unicode-regexp
+  var match = ari.match(/ari:cloud:confluence:[^:]+:page\/\d+\/([a-zA-Z0-9-]+)/);
+  if (match !== null && match !== void 0 && match[1]) {
+    return match[1];
+  }
+  throw new Error("Invalid page ARI: ".concat(ari));
+};
+var getContentPropertyAri = exports.getContentPropertyAri = function getContentPropertyAri(contentPropertyId, cloudId) {
+  return "ari:cloud:confluence:".concat(cloudId, ":content/").concat(contentPropertyId);
+};
+var getContentPropertyIdFromAri = exports.getContentPropertyIdFromAri = function getContentPropertyIdFromAri(ari) {
+  // eslint-disable-next-line require-unicode-regexp
+  var match = ari.match(/ari:cloud:confluence:[^:]+:content\/([^/]+)/);
+  if (match) {
+    return match[1];
+  }
+  throw new Error("Invalid content property ARI: ".concat(ari));
+};

package/dist/cjs/utils/contentProperty.js

@@ -0,0 +1,192 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updateContentProperty = exports.getContentProperty = exports.createContentProperty = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _ari = require("./ari");
+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; }
+var COMMON_HEADERS = {
+  'Content-Type': 'application/json',
+  Accept: 'application/json'
+};
+var AGG_HEADERS = {
+  'X-ExperimentalApi': 'confluence-agg-beta'
+};
+var GRAPHQL_ENDPOINT = '/gateway/api/graphql';
+var GET_OPERATION_NAME = 'EDITOR_SYNCED_BLOCK_GET';
+var CREATE_OPERATION_NAME = 'EDITOR_SYNCED_BLOCK_CREATE';
+var UPDATE_OPERATION_NAME = 'EDITOR_SYNCED_BLOCK_UPDATE';
+/**
+ * Query to get the page property by key
+ * @param documentARI
+ * @param key
+ * @returns
+ */
+var GET_QUERY = "query ".concat(GET_OPERATION_NAME, " ($id: ID!, $keys: [String]!) {\n\t\t\t\t\tconfluence {\n\t\t\t\t\t\tpage (id: $id) {\n\t\t\t\t\t\t\tproperties(keys: $keys) {\n\t\t\t\t\t\t\t\tkey,\n\t\t\t\t\t\t\t\tvalue\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}");
+
+/**
+ * Query to create a page property with key and value
+ * @param documentARI
+ * @param key
+ * @param value
+ * @returns
+ */
+var CREATE_QUERY = "mutation ".concat(CREATE_OPERATION_NAME, " ($input: ConfluenceCreatePagePropertyInput!){\n\t\t\t\t\t\tconfluence {\n\t\t\t\t\t\t\tcreatePageProperty(input: $input) {\n\t\t\t\t\t\t\t\tpageProperty {\n\t\t\t\t\t\t\t\t\tkey,\n\t\t\t\t\t\t\t\t\tvalue\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}");
+
+/**
+ * Query to update a page property with key and value without bumping the version
+ * @param documentARI
+ * @param key
+ * @param value
+ * @returns
+ */
+var UPDATE_QUERY = "mutation ".concat(UPDATE_OPERATION_NAME, " ($input: ConfluenceUpdateValuePagePropertyInput!) {\n\t\t\t\t\t\tconfluence {\n\t\t\t\t\t\t\tupdateValuePageProperty(input: $input) {\n\t\t\t\t\t\t\t\tpageProperty {\n\t\t\t\t\t\t\t\t\tkey,\n\t\t\t\t\t\t\t\t\tvalue\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}");
+var getContentProperty = exports.getContentProperty = /*#__PURE__*/function () {
+  var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(_ref) {
+    var pageId, key, cloudId, documentARI, bodyData, response, contentProperty;
+    return _regenerator.default.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          pageId = _ref.pageId, key = _ref.key, cloudId = _ref.cloudId;
+          documentARI = (0, _ari.getConfluencePageAri)(pageId, cloudId);
+          bodyData = {
+            query: GET_QUERY,
+            operationName: GET_OPERATION_NAME,
+            variables: {
+              id: documentARI,
+              keys: [key]
+            }
+          };
+          _context.next = 5;
+          return fetch(GRAPHQL_ENDPOINT, {
+            method: 'POST',
+            headers: _objectSpread(_objectSpread({}, COMMON_HEADERS), AGG_HEADERS),
+            body: JSON.stringify(bodyData)
+          });
+        case 5:
+          response = _context.sent;
+          if (response.ok) {
+            _context.next = 8;
+            break;
+          }
+          throw new Error("Failed to get content property: ".concat(response.statusText));
+        case 8:
+          _context.next = 10;
+          return response.json();
+        case 10:
+          contentProperty = _context.sent;
+          return _context.abrupt("return", contentProperty);
+        case 12:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return function getContentProperty(_x) {
+    return _ref2.apply(this, arguments);
+  };
+}();
+var updateContentProperty = exports.updateContentProperty = /*#__PURE__*/function () {
+  var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(_ref3) {
+    var pageId, key, value, cloudId, documentARI, bodyData, response, contentProperty;
+    return _regenerator.default.wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          pageId = _ref3.pageId, key = _ref3.key, value = _ref3.value, cloudId = _ref3.cloudId;
+          documentARI = (0, _ari.getConfluencePageAri)(pageId, cloudId);
+          bodyData = {
+            query: UPDATE_QUERY,
+            operationName: UPDATE_OPERATION_NAME,
+            variables: {
+              input: {
+                pageId: documentARI,
+                key: key,
+                value: value,
+                useSameVersion: true
+              }
+            }
+          };
+          _context2.next = 5;
+          return fetch(GRAPHQL_ENDPOINT, {
+            method: 'POST',
+            headers: _objectSpread(_objectSpread({}, COMMON_HEADERS), AGG_HEADERS),
+            body: JSON.stringify(bodyData)
+          });
+        case 5:
+          response = _context2.sent;
+          if (response.ok) {
+            _context2.next = 8;
+            break;
+          }
+          throw new Error("Failed to update content property: ".concat(response.statusText));
+        case 8:
+          _context2.next = 10;
+          return response.json();
+        case 10:
+          contentProperty = _context2.sent;
+          return _context2.abrupt("return", contentProperty);
+        case 12:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2);
+  }));
+  return function updateContentProperty(_x2) {
+    return _ref4.apply(this, arguments);
+  };
+}();
+var createContentProperty = exports.createContentProperty = /*#__PURE__*/function () {
+  var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(_ref5) {
+    var pageId, key, value, cloudId, documentARI, escapedValue, bodyData, response, contentProperty;
+    return _regenerator.default.wrap(function _callee3$(_context3) {
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          pageId = _ref5.pageId, key = _ref5.key, value = _ref5.value, cloudId = _ref5.cloudId;
+          documentARI = (0, _ari.getConfluencePageAri)(pageId, cloudId); // eslint-disable-next-line require-unicode-regexp
+          escapedValue = value.replace(/"/g, '\\"');
+          bodyData = {
+            query: CREATE_QUERY,
+            operationName: CREATE_OPERATION_NAME,
+            variables: {
+              input: {
+                pageId: documentARI,
+                key: key,
+                value: escapedValue
+              }
+            }
+          };
+          _context3.next = 6;
+          return fetch(GRAPHQL_ENDPOINT, {
+            method: 'POST',
+            headers: _objectSpread(_objectSpread({}, COMMON_HEADERS), AGG_HEADERS),
+            body: JSON.stringify(bodyData)
+          });
+        case 6:
+          response = _context3.sent;
+          if (response.ok) {
+            _context3.next = 9;
+            break;
+          }
+          throw new Error("Failed to create content property: ".concat(response.statusText));
+        case 9:
+          _context3.next = 11;
+          return response.json();
+        case 11:
+          contentProperty = _context3.sent;
+          return _context3.abrupt("return", contentProperty);
+        case 13:
+        case "end":
+          return _context3.stop();
+      }
+    }, _callee3);
+  }));
+  return function createContentProperty(_x3) {
+    return _ref6.apply(this, arguments);
+  };
+}();