@atlaskit/editor-synced-block-renderer 8.1.1 → 8.2.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/editor-synced-block-renderer
 
+## 8.2.0
+
+### Minor Changes
+
+- [`717df2cfeca9e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/717df2cfeca9e) -
+  [ux] Pass accountId to SyncedBlockRenderer from Jira.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 8.1.2
+
+### Patch Changes
+
+- [`d3b98f06b9def`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d3b98f06b9def) -
+  [ux] EDITOR-6025 Implement request access flow for synced blocks whose source is a Jira work item
+  the viewer cannot access.
+- Updated dependencies
+
 ## 8.1.1
 
 ### Patch Changes

package/dist/cjs/getSyncedBlockRenderer.js

@@ -9,14 +9,16 @@ var _react = _interopRequireDefault(require("react"));
 var _SyncedBlockRenderer = require("./ui/SyncedBlockRenderer");
 // For rendering reference synced block nodes in Editor
 var getSyncedBlockRenderer = exports.getSyncedBlockRenderer = function getSyncedBlockRenderer(_ref) {
-  var syncBlockRendererOptions = _ref.syncBlockRendererOptions;
+  var syncBlockRendererOptions = _ref.syncBlockRendererOptions,
+    getAccountId = _ref.getAccountId;
   return function (_ref2) {
     var syncBlockFetchResult = _ref2.syncBlockFetchResult,
       api = _ref2.api;
     return /*#__PURE__*/_react.default.createElement(_SyncedBlockRenderer.SyncedBlockRenderer, {
       syncBlockRendererOptions: syncBlockRendererOptions,
       syncBlockFetchResult: syncBlockFetchResult,
-      api: api
+      api: api,
+      getAccountId: getAccountId
     });
   };
 };

package/dist/cjs/ui/SyncedBlockErrorComponent.js

@@ -18,8 +18,9 @@ var _SyncedBlockOfflineError = require("./SyncedBlockOfflineError");
 var _SyncedBlockPermissionDenied = require("./SyncedBlockPermissionDenied");
 var _SyncedBlockUnpublishedError = require("./SyncedBlockUnpublishedError");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-var getForbiddenErrorContent = function getForbiddenErrorContent(resourceId, fireAnalyticsEvent) {
+var getForbiddenErrorContent = function getForbiddenErrorContent(resourceId, fireAnalyticsEvent, getAccountId) {
   try {
+    var _getAccountId;
     if (!resourceId) {
       throw new Error('Missing resource id');
     }
@@ -28,7 +29,8 @@ var getForbiddenErrorContent = function getForbiddenErrorContent(resourceId, fir
       sourceProduct = _getContentIdAndProdu.sourceProduct;
     return /*#__PURE__*/_react.default.createElement(_SyncedBlockPermissionDenied.SyncedBlockPermissionDenied, {
       sourceContentId: sourceContentId,
-      sourceProduct: sourceProduct
+      sourceProduct: sourceProduct,
+      accountId: (_getAccountId = getAccountId === null || getAccountId === void 0 ? void 0 : getAccountId()) !== null && _getAccountId !== void 0 ? _getAccountId : null
     });
   } catch (error) {
     (0, _monitoring.logException)(error, {
@@ -44,7 +46,8 @@ var SyncedBlockErrorComponent = exports.SyncedBlockErrorComponent = function Syn
     onRetry = _ref.onRetry,
     resourceId = _ref.resourceId,
     fireAnalyticsEvent = _ref.fireAnalyticsEvent,
-    sourceURL = _ref.sourceURL;
+    sourceURL = _ref.sourceURL,
+    getAccountId = _ref.getAccountId;
   (0, _react.useEffect)(function () {
     fireAnalyticsEvent === null || fireAnalyticsEvent === void 0 || fireAnalyticsEvent({
       action: _analytics.ACTION.ERROR,
@@ -64,7 +67,7 @@ var SyncedBlockErrorComponent = exports.SyncedBlockErrorComponent = function Syn
       case _editorSyncedBlockProvider.SyncBlockError.Offline:
         return /*#__PURE__*/_react.default.createElement(_SyncedBlockOfflineError.SyncedBlockOfflineError, null);
       case _editorSyncedBlockProvider.SyncBlockError.Forbidden:
-        return getForbiddenErrorContent(resourceId, fireAnalyticsEvent);
+        return getForbiddenErrorContent(resourceId, fireAnalyticsEvent, getAccountId);
       case _editorSyncedBlockProvider.SyncBlockError.NotFound:
         return /*#__PURE__*/_react.default.createElement(_SyncedBlockNotFoundError.SyncedBlockNotFoundError, {
           reason: error.reason,
@@ -84,7 +87,7 @@ var SyncedBlockErrorComponent = exports.SyncedBlockErrorComponent = function Syn
       default:
         return /*#__PURE__*/_react.default.createElement(_SyncedBlockGenericError.SyncedBlockGenericError, null);
     }
-  }, [error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL]);
+  }, [error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL, getAccountId]);
   return (
     /*#__PURE__*/
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop

package/dist/cjs/ui/SyncedBlockNodeComponentRenderer.js

@@ -20,7 +20,8 @@ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer
   var _syncBlockInstance$er, _syncBlockInstance$da, _syncBlockInstance$da2;
   var nodeProps = _ref.nodeProps,
     syncBlockStoreManager = _ref.syncBlockStoreManager,
-    rendererOptions = _ref.rendererOptions;
+    rendererOptions = _ref.rendererOptions,
+    getAccountId = _ref.getAccountId;
   var resourceId = nodeProps.resourceId,
     localId = nodeProps.localId,
     fireAnalyticsEvent = nodeProps.fireAnalyticsEvent;
@@ -76,7 +77,8 @@ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer
     reloadData: reloadData,
     fireAnalyticsEvent: fireAnalyticsEvent,
     resourceId: resourceId,
-    error: errorForDisplay
+    error: errorForDisplay,
+    getAccountId: getAccountId
   });
   if (result.isSuccess) {
     return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({

package/dist/cjs/ui/SyncedBlockPermissionDenied.js

@@ -9,6 +9,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.SyncedBlockPermissionDenied = void 0;
 require("./SyncedBlockPermissionDenied.compiled.css");
 var _runtime = require("@compiled/react/runtime");
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _SyncedBlockPermissionDeniedRequestAccessMutation2 = _interopRequireDefault(require("./__generated__/SyncedBlockPermissionDeniedRequestAccessMutation.graphql"));
 var _react = _interopRequireWildcard(require("react"));
@@ -16,9 +18,11 @@ var _reactIntl = require("react-intl");
 var _reactRelay = require("react-relay");
 var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _messages = require("@atlaskit/editor-common/messages");
+var _requestJiraIssueAccess = require("@atlaskit/editor-synced-block-provider/requestJiraIssueAccess");
 var _heading = _interopRequireDefault(require("@atlaskit/heading"));
 var _statusSuccess = _interopRequireDefault(require("@atlaskit/icon/core/status-success"));
 var _image = _interopRequireDefault(require("@atlaskit/image"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _PermissionDenied = _interopRequireDefault(require("./assets/PermissionDenied.svg"));
 var _SyncedBlockGenericError = require("./SyncedBlockGenericError");
@@ -103,14 +107,101 @@ var SyncedBlockPermissionDeniedConfluencePage = function SyncedBlockPermissionDe
     testId: "sync-block-access-error-msg"
   }, formatMessage(_messages.syncBlockMessages.requestAccessError)))));
 };
-var SyncedBlockPermissionDenied = exports.SyncedBlockPermissionDenied = function SyncedBlockPermissionDenied(_ref2) {
+
+/**
+ * For Jira we deliberately collapse "success" and "failure" into a single
+ * `pending` state — matching the behaviour of `useRequestAccessSubmit` in
+ * `jira/src/packages/issue/request-access-modal`. The endpoint returns no
+ * distinguishable error information for security reasons.
+ */
+
+var SyncedBlockPermissionDeniedJiraWorkItem = function SyncedBlockPermissionDeniedJiraWorkItem(_ref2) {
   var sourceContentId = _ref2.sourceContentId,
-    sourceProduct = _ref2.sourceProduct;
+    accountId = _ref2.accountId;
+  var _useIntl2 = (0, _reactIntl.useIntl)(),
+    formatMessage = _useIntl2.formatMessage;
+  var _useState3 = (0, _react.useState)(RequestAccessState.default),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    requestAccessState = _useState4[0],
+    setRequestAccessState = _useState4[1];
+  var onClick = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+    return _regenerator.default.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          setRequestAccessState(RequestAccessState.loading);
+          // Fire and forget. Per the Jira backend contract the response is
+          // intentionally opaque (empty 204 on success, generic on failure) to
+          // prevent issue-existence enumeration. We always end in `pending`.
+          _context.prev = 1;
+          _context.next = 4;
+          return (0, _requestJiraIssueAccess.requestJiraSpaceAccess)({
+            accountId: accountId,
+            issueId: Number(sourceContentId) || null,
+            projectKey: null
+          });
+        case 4:
+          _context.next = 8;
+          break;
+        case 6:
+          _context.prev = 6;
+          _context.t0 = _context["catch"](1);
+        case 8:
+          setRequestAccessState(RequestAccessState.pending);
+        case 9:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee, null, [[1, 6]]);
+  })), [accountId, sourceContentId]);
+  return /*#__PURE__*/_react.default.createElement(_compiled.Box, {
+    xcss: styles.wrapper
+  }, /*#__PURE__*/_react.default.createElement(_image.default, {
+    src: _PermissionDenied.default,
+    alt: formatMessage(_messages.syncBlockMessages.permissionDeniedAltText),
+    width: "48",
+    height: "48"
+  }), /*#__PURE__*/_react.default.createElement(_compiled.Stack, {
+    space: "space.100"
+  }, /*#__PURE__*/_react.default.createElement(_heading.default, {
+    size: "xsmall"
+  }, formatMessage(_messages.syncBlockMessages.permissionDeniedHeading)), /*#__PURE__*/_react.default.createElement(_compiled.Text, {
+    color: "color.text.subtle"
+  }, formatMessage(_messages.syncBlockMessages.permissionDeniedDescription)), requestAccessState === RequestAccessState.pending ? /*#__PURE__*/_react.default.createElement(_compiled.Flex, {
+    columnGap: "space.050",
+    alignItems: "center"
+  }, /*#__PURE__*/_react.default.createElement(_statusSuccess.default, {
+    size: "small",
+    color: "var(--ds-icon-subtle, #505258)",
+    label: formatMessage(_messages.syncBlockMessages.accessRequested)
+  }), /*#__PURE__*/_react.default.createElement(_compiled.Text, {
+    color: "color.text.subtlest",
+    weight: "bold",
+    testId: "sync-block-access-requested-msg"
+  }, formatMessage(_messages.syncBlockMessages.accessRequested))) : /*#__PURE__*/_react.default.createElement(_compiled.Flex, {
+    columnGap: "space.100",
+    alignItems: "center"
+  }, /*#__PURE__*/_react.default.createElement(_new.default, {
+    appearance: "default",
+    spacing: "compact",
+    onClick: onClick,
+    isLoading: requestAccessState === RequestAccessState.loading,
+    testId: "sync-block-request-access-btn"
+  }, formatMessage(_messages.syncBlockMessages.requestAccessButton)))));
+};
+var SyncedBlockPermissionDenied = exports.SyncedBlockPermissionDenied = function SyncedBlockPermissionDenied(_ref4) {
+  var sourceContentId = _ref4.sourceContentId,
+    sourceProduct = _ref4.sourceProduct,
+    accountId = _ref4.accountId;
   switch (sourceProduct) {
     case 'confluence-page':
       return /*#__PURE__*/_react.default.createElement(SyncedBlockPermissionDeniedConfluencePage, {
         sourceContentId: sourceContentId
       });
+    case 'jira-work-item':
+      return (0, _platformFeatureFlags.fg)('platform_synced_block_patch_10') ? /*#__PURE__*/_react.default.createElement(SyncedBlockPermissionDeniedJiraWorkItem, {
+        sourceContentId: sourceContentId,
+        accountId: accountId
+      }) : /*#__PURE__*/_react.default.createElement(_SyncedBlockGenericError.SyncedBlockGenericError, null);
     default:
       return /*#__PURE__*/_react.default.createElement(_SyncedBlockGenericError.SyncedBlockGenericError, null);
   }

package/dist/cjs/ui/SyncedBlockRenderer.js

@@ -17,7 +17,8 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
   var _api$analytics2;
   var syncBlockRendererOptions = _ref.syncBlockRendererOptions,
     syncBlockFetchResult = _ref.syncBlockFetchResult,
-    api = _ref.api;
+    api = _ref.api,
+    getAccountId = _ref.getAccountId;
   (0, _react.useEffect)(function () {
     var timeoutId = setTimeout(function () {
       var _api$analytics;
@@ -71,7 +72,8 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
     reloadData: reloadData,
     fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent,
     resourceId: syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.resourceId,
-    isOffline: isCollabOffline
+    isOffline: isCollabOffline,
+    getAccountId: getAccountId
   });
   return result.element;
 };

package/dist/cjs/ui/renderSyncedBlockContent.js

@@ -28,7 +28,8 @@ function renderSyncedBlockContent(_ref) {
     fireAnalyticsEvent = _ref.fireAnalyticsEvent,
     resourceId = _ref.resourceId,
     isOffline = _ref.isOffline,
-    error = _ref.error;
+    error = _ref.error,
+    getAccountId = _ref.getAccountId;
   var isSSRMode = (0, _coreUtils.isSSR)();
   if (isOffline && !isSSRMode) {
     return {
@@ -66,7 +67,8 @@ function renderSyncedBlockContent(_ref) {
         resourceId: resourceId,
         onRetry: reloadData,
         isLoading: isLoading,
-        fireAnalyticsEvent: fireAnalyticsEvent
+        fireAnalyticsEvent: fireAnalyticsEvent,
+        getAccountId: getAccountId
       }),
       isSuccess: false
     };
@@ -81,7 +83,8 @@ function renderSyncedBlockContent(_ref) {
         },
         resourceId: resourceId,
         sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
-        fireAnalyticsEvent: fireAnalyticsEvent
+        fireAnalyticsEvent: fireAnalyticsEvent,
+        getAccountId: getAccountId
       }),
       isSuccess: false
     };

package/dist/cjs/useSyncedBlockNodeComponent.js

@@ -27,6 +27,7 @@ var useMemoizedSyncedBlockNodeComponent = exports.useMemoizedSyncedBlockNodeComp
     syncBlockProvider = _ref.syncBlockProvider,
     syncBlockRendererOptions = _ref.syncBlockRendererOptions,
     fireAnalyticsEvent = _ref.fireAnalyticsEvent,
+    getAccountId = _ref.getAccountId,
     getPrefetchedData = _ref.getPrefetchedData;
   var syncBlockStoreManager = (0, _editorSyncedBlockProvider.useMemoizedSyncBlockStoreManager)(syncBlockProvider, fireAnalyticsEvent);
 
@@ -61,7 +62,8 @@ var useMemoizedSyncedBlockNodeComponent = exports.useMemoizedSyncedBlockNodeComp
       key: props.localId,
       nodeProps: props,
       syncBlockStoreManager: syncBlockStoreManager,
-      rendererOptions: syncBlockRendererOptions
+      rendererOptions: syncBlockRendererOptions,
+      getAccountId: getAccountId
     })));
-  }, [syncBlockStoreManager, syncBlockRendererOptions, fireAnalyticsEvent]);
+  }, [syncBlockStoreManager, syncBlockRendererOptions, fireAnalyticsEvent, getAccountId]);
 };

package/dist/es2019/getSyncedBlockRenderer.js

@@ -2,7 +2,8 @@ import React from 'react';
 import { SyncedBlockRenderer } from './ui/SyncedBlockRenderer';
 // For rendering reference synced block nodes in Editor
 export const getSyncedBlockRenderer = ({
-  syncBlockRendererOptions
+  syncBlockRendererOptions,
+  getAccountId
 }) => ({
   syncBlockFetchResult,
   api
@@ -10,6 +11,7 @@ export const getSyncedBlockRenderer = ({
   return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
     syncBlockRendererOptions: syncBlockRendererOptions,
     syncBlockFetchResult: syncBlockFetchResult,
-    api: api
+    api: api,
+    getAccountId: getAccountId
   });
 };

package/dist/es2019/ui/SyncedBlockErrorComponent.js

@@ -10,8 +10,9 @@ import { SyncedBlockNotFoundError } from './SyncedBlockNotFoundError';
 import { SyncedBlockOfflineError } from './SyncedBlockOfflineError';
 import { SyncedBlockPermissionDenied } from './SyncedBlockPermissionDenied';
 import { SyncedBlockUnpublishedError } from './SyncedBlockUnpublishedError';
-const getForbiddenErrorContent = (resourceId, fireAnalyticsEvent) => {
+const getForbiddenErrorContent = (resourceId, fireAnalyticsEvent, getAccountId) => {
   try {
+    var _getAccountId;
     if (!resourceId) {
       throw new Error('Missing resource id');
     }
@@ -21,7 +22,8 @@ const getForbiddenErrorContent = (resourceId, fireAnalyticsEvent) => {
     } = getContentIdAndProductFromResourceId(resourceId);
     return /*#__PURE__*/React.createElement(SyncedBlockPermissionDenied, {
       sourceContentId: sourceContentId,
-      sourceProduct: sourceProduct
+      sourceProduct: sourceProduct,
+      accountId: (_getAccountId = getAccountId === null || getAccountId === void 0 ? void 0 : getAccountId()) !== null && _getAccountId !== void 0 ? _getAccountId : null
     });
   } catch (error) {
     logException(error, {
@@ -37,7 +39,8 @@ export const SyncedBlockErrorComponent = ({
   onRetry,
   resourceId,
   fireAnalyticsEvent,
-  sourceURL
+  sourceURL,
+  getAccountId
 }) => {
   useEffect(() => {
     fireAnalyticsEvent === null || fireAnalyticsEvent === void 0 ? void 0 : fireAnalyticsEvent({
@@ -58,7 +61,7 @@ export const SyncedBlockErrorComponent = ({
       case SyncBlockError.Offline:
         return /*#__PURE__*/React.createElement(SyncedBlockOfflineError, null);
       case SyncBlockError.Forbidden:
-        return getForbiddenErrorContent(resourceId, fireAnalyticsEvent);
+        return getForbiddenErrorContent(resourceId, fireAnalyticsEvent, getAccountId);
       case SyncBlockError.NotFound:
         return /*#__PURE__*/React.createElement(SyncedBlockNotFoundError, {
           reason: error.reason,
@@ -78,7 +81,7 @@ export const SyncedBlockErrorComponent = ({
       default:
         return /*#__PURE__*/React.createElement(SyncedBlockGenericError, null);
     }
-  }, [error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL]);
+  }, [error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL, getAccountId]);
   return (
     /*#__PURE__*/
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop

package/dist/es2019/ui/SyncedBlockNodeComponentRenderer.js

@@ -6,7 +6,8 @@ import { renderSyncedBlockContent } from './renderSyncedBlockContent';
 export const SyncedBlockNodeComponentRenderer = ({
   nodeProps,
   syncBlockStoreManager,
-  rendererOptions
+  rendererOptions,
+  getAccountId
 }) => {
   var _syncBlockInstance$er, _syncBlockInstance$da, _syncBlockInstance$da2;
   const {
@@ -69,7 +70,8 @@ export const SyncedBlockNodeComponentRenderer = ({
     reloadData,
     fireAnalyticsEvent,
     resourceId,
-    error: errorForDisplay
+    error: errorForDisplay,
+    getAccountId
   });
   if (result.isSuccess) {
     return /*#__PURE__*/React.createElement("div", {

package/dist/es2019/ui/SyncedBlockPermissionDenied.js

@@ -2,14 +2,16 @@
 import "./SyncedBlockPermissionDenied.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import _SyncedBlockPermissionDeniedRequestAccessMutation from "./__generated__/SyncedBlockPermissionDeniedRequestAccessMutation.graphql";
-import React, { useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import { useIntl } from 'react-intl';
 import { useMutation, graphql } from 'react-relay';
 import Button from '@atlaskit/button/new';
 import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
+import { requestJiraSpaceAccess } from '@atlaskit/editor-synced-block-provider/requestJiraIssueAccess';
 import Heading from '@atlaskit/heading';
 import StatusSuccessIcon from '@atlaskit/icon/core/status-success';
 import Image from '@atlaskit/image';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text, Flex, Stack, Box } from '@atlaskit/primitives/compiled';
 import PermissionDenied from './assets/PermissionDenied.svg';
 import { SyncedBlockGenericError } from './SyncedBlockGenericError';
@@ -90,15 +92,88 @@ const SyncedBlockPermissionDeniedConfluencePage = ({
     testId: "sync-block-access-error-msg"
   }, formatMessage(messages.requestAccessError)))));
 };
+
+/**
+ * For Jira we deliberately collapse "success" and "failure" into a single
+ * `pending` state — matching the behaviour of `useRequestAccessSubmit` in
+ * `jira/src/packages/issue/request-access-modal`. The endpoint returns no
+ * distinguishable error information for security reasons.
+ */
+
+const SyncedBlockPermissionDeniedJiraWorkItem = ({
+  sourceContentId,
+  accountId
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  const [requestAccessState, setRequestAccessState] = useState(RequestAccessState.default);
+  const onClick = useCallback(async () => {
+    setRequestAccessState(RequestAccessState.loading);
+    // Fire and forget. Per the Jira backend contract the response is
+    // intentionally opaque (empty 204 on success, generic on failure) to
+    // prevent issue-existence enumeration. We always end in `pending`.
+    try {
+      await requestJiraSpaceAccess({
+        accountId,
+        issueId: Number(sourceContentId) || null,
+        projectKey: null
+      });
+    } catch (_e) {
+      // Swallow — see comment above.
+    }
+    setRequestAccessState(RequestAccessState.pending);
+  }, [accountId, sourceContentId]);
+  return /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.wrapper
+  }, /*#__PURE__*/React.createElement(Image, {
+    src: PermissionDenied,
+    alt: formatMessage(messages.permissionDeniedAltText),
+    width: "48",
+    height: "48"
+  }), /*#__PURE__*/React.createElement(Stack, {
+    space: "space.100"
+  }, /*#__PURE__*/React.createElement(Heading, {
+    size: "xsmall"
+  }, formatMessage(messages.permissionDeniedHeading)), /*#__PURE__*/React.createElement(Text, {
+    color: "color.text.subtle"
+  }, formatMessage(messages.permissionDeniedDescription)), requestAccessState === RequestAccessState.pending ? /*#__PURE__*/React.createElement(Flex, {
+    columnGap: "space.050",
+    alignItems: "center"
+  }, /*#__PURE__*/React.createElement(StatusSuccessIcon, {
+    size: "small",
+    color: "var(--ds-icon-subtle, #505258)",
+    label: formatMessage(messages.accessRequested)
+  }), /*#__PURE__*/React.createElement(Text, {
+    color: "color.text.subtlest",
+    weight: "bold",
+    testId: "sync-block-access-requested-msg"
+  }, formatMessage(messages.accessRequested))) : /*#__PURE__*/React.createElement(Flex, {
+    columnGap: "space.100",
+    alignItems: "center"
+  }, /*#__PURE__*/React.createElement(Button, {
+    appearance: "default",
+    spacing: "compact",
+    onClick: onClick,
+    isLoading: requestAccessState === RequestAccessState.loading,
+    testId: "sync-block-request-access-btn"
+  }, formatMessage(messages.requestAccessButton)))));
+};
 export const SyncedBlockPermissionDenied = ({
   sourceContentId,
-  sourceProduct
+  sourceProduct,
+  accountId
 }) => {
   switch (sourceProduct) {
     case 'confluence-page':
       return /*#__PURE__*/React.createElement(SyncedBlockPermissionDeniedConfluencePage, {
         sourceContentId: sourceContentId
       });
+    case 'jira-work-item':
+      return fg('platform_synced_block_patch_10') ? /*#__PURE__*/React.createElement(SyncedBlockPermissionDeniedJiraWorkItem, {
+        sourceContentId: sourceContentId,
+        accountId: accountId
+      }) : /*#__PURE__*/React.createElement(SyncedBlockGenericError, null);
     default:
       return /*#__PURE__*/React.createElement(SyncedBlockGenericError, null);
   }

package/dist/es2019/ui/SyncedBlockRenderer.js

@@ -6,7 +6,8 @@ import { renderSyncedBlockContent } from './renderSyncedBlockContent';
 const SyncedBlockRendererComponent = ({
   syncBlockRendererOptions,
   syncBlockFetchResult,
-  api
+  api,
+  getAccountId
 }) => {
   var _api$analytics2;
   useEffect(() => {
@@ -67,7 +68,8 @@ const SyncedBlockRendererComponent = ({
     reloadData,
     fireAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent,
     resourceId: syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.resourceId,
-    isOffline: isCollabOffline
+    isOffline: isCollabOffline,
+    getAccountId
   });
   return result.element;
 };

package/dist/es2019/ui/renderSyncedBlockContent.js

@@ -20,7 +20,8 @@ export function renderSyncedBlockContent({
   fireAnalyticsEvent,
   resourceId,
   isOffline,
-  error
+  error,
+  getAccountId
 }) {
   var _syncBlockInstance$da2;
   const isSSRMode = isSSR();
@@ -60,7 +61,8 @@ export function renderSyncedBlockContent({
         resourceId: resourceId,
         onRetry: reloadData,
         isLoading: isLoading,
-        fireAnalyticsEvent: fireAnalyticsEvent
+        fireAnalyticsEvent: fireAnalyticsEvent,
+        getAccountId: getAccountId
       }),
       isSuccess: false
     };
@@ -75,7 +77,8 @@ export function renderSyncedBlockContent({
         },
         resourceId: resourceId,
         sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
-        fireAnalyticsEvent: fireAnalyticsEvent
+        fireAnalyticsEvent: fireAnalyticsEvent,
+        getAccountId: getAccountId
       }),
       isSuccess: false
     };

package/dist/es2019/useSyncedBlockNodeComponent.js

@@ -17,6 +17,7 @@ export const useMemoizedSyncedBlockNodeComponent = ({
   syncBlockProvider,
   syncBlockRendererOptions,
   fireAnalyticsEvent,
+  getAccountId,
   getPrefetchedData
 }) => {
   const syncBlockStoreManager = useMemoizedSyncBlockStoreManager(syncBlockProvider, fireAnalyticsEvent);
@@ -49,6 +50,7 @@ export const useMemoizedSyncedBlockNodeComponent = ({
     key: props.localId,
     nodeProps: props,
     syncBlockStoreManager: syncBlockStoreManager,
-    rendererOptions: syncBlockRendererOptions
-  }))), [syncBlockStoreManager, syncBlockRendererOptions, fireAnalyticsEvent]);
+    rendererOptions: syncBlockRendererOptions,
+    getAccountId: getAccountId
+  }))), [syncBlockStoreManager, syncBlockRendererOptions, fireAnalyticsEvent, getAccountId]);
 };

package/dist/esm/getSyncedBlockRenderer.js

@@ -2,14 +2,16 @@ import React from 'react';
 import { SyncedBlockRenderer } from './ui/SyncedBlockRenderer';
 // For rendering reference synced block nodes in Editor
 export var getSyncedBlockRenderer = function getSyncedBlockRenderer(_ref) {
-  var syncBlockRendererOptions = _ref.syncBlockRendererOptions;
+  var syncBlockRendererOptions = _ref.syncBlockRendererOptions,
+    getAccountId = _ref.getAccountId;
   return function (_ref2) {
     var syncBlockFetchResult = _ref2.syncBlockFetchResult,
       api = _ref2.api;
     return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
       syncBlockRendererOptions: syncBlockRendererOptions,
       syncBlockFetchResult: syncBlockFetchResult,
-      api: api
+      api: api,
+      getAccountId: getAccountId
     });
   };
 };

package/dist/esm/ui/SyncedBlockErrorComponent.js

@@ -10,8 +10,9 @@ import { SyncedBlockNotFoundError } from './SyncedBlockNotFoundError';
 import { SyncedBlockOfflineError } from './SyncedBlockOfflineError';
 import { SyncedBlockPermissionDenied } from './SyncedBlockPermissionDenied';
 import { SyncedBlockUnpublishedError } from './SyncedBlockUnpublishedError';
-var getForbiddenErrorContent = function getForbiddenErrorContent(resourceId, fireAnalyticsEvent) {
+var getForbiddenErrorContent = function getForbiddenErrorContent(resourceId, fireAnalyticsEvent, getAccountId) {
   try {
+    var _getAccountId;
     if (!resourceId) {
       throw new Error('Missing resource id');
     }
@@ -20,7 +21,8 @@ var getForbiddenErrorContent = function getForbiddenErrorContent(resourceId, fir
       sourceProduct = _getContentIdAndProdu.sourceProduct;
     return /*#__PURE__*/React.createElement(SyncedBlockPermissionDenied, {
       sourceContentId: sourceContentId,
-      sourceProduct: sourceProduct
+      sourceProduct: sourceProduct,
+      accountId: (_getAccountId = getAccountId === null || getAccountId === void 0 ? void 0 : getAccountId()) !== null && _getAccountId !== void 0 ? _getAccountId : null
     });
   } catch (error) {
     logException(error, {
@@ -36,7 +38,8 @@ export var SyncedBlockErrorComponent = function SyncedBlockErrorComponent(_ref)
     onRetry = _ref.onRetry,
     resourceId = _ref.resourceId,
     fireAnalyticsEvent = _ref.fireAnalyticsEvent,
-    sourceURL = _ref.sourceURL;
+    sourceURL = _ref.sourceURL,
+    getAccountId = _ref.getAccountId;
   useEffect(function () {
     fireAnalyticsEvent === null || fireAnalyticsEvent === void 0 || fireAnalyticsEvent({
       action: ACTION.ERROR,
@@ -56,7 +59,7 @@ export var SyncedBlockErrorComponent = function SyncedBlockErrorComponent(_ref)
       case SyncBlockError.Offline:
         return /*#__PURE__*/React.createElement(SyncedBlockOfflineError, null);
       case SyncBlockError.Forbidden:
-        return getForbiddenErrorContent(resourceId, fireAnalyticsEvent);
+        return getForbiddenErrorContent(resourceId, fireAnalyticsEvent, getAccountId);
       case SyncBlockError.NotFound:
         return /*#__PURE__*/React.createElement(SyncedBlockNotFoundError, {
           reason: error.reason,
@@ -76,7 +79,7 @@ export var SyncedBlockErrorComponent = function SyncedBlockErrorComponent(_ref)
       default:
         return /*#__PURE__*/React.createElement(SyncedBlockGenericError, null);
     }
-  }, [error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL]);
+  }, [error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL, getAccountId]);
   return (
     /*#__PURE__*/
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop

package/dist/esm/ui/SyncedBlockNodeComponentRenderer.js

@@ -11,7 +11,8 @@ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentR
   var _syncBlockInstance$er, _syncBlockInstance$da, _syncBlockInstance$da2;
   var nodeProps = _ref.nodeProps,
     syncBlockStoreManager = _ref.syncBlockStoreManager,
-    rendererOptions = _ref.rendererOptions;
+    rendererOptions = _ref.rendererOptions,
+    getAccountId = _ref.getAccountId;
   var resourceId = nodeProps.resourceId,
     localId = nodeProps.localId,
     fireAnalyticsEvent = nodeProps.fireAnalyticsEvent;
@@ -67,7 +68,8 @@ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentR
     reloadData: reloadData,
     fireAnalyticsEvent: fireAnalyticsEvent,
     resourceId: resourceId,
-    error: errorForDisplay
+    error: errorForDisplay,
+    getAccountId: getAccountId
   });
   if (result.isSuccess) {
     return /*#__PURE__*/React.createElement("div", _extends({

package/dist/esm/ui/SyncedBlockPermissionDenied.js

@@ -1,16 +1,20 @@
 /* SyncedBlockPermissionDenied.tsx generated by @compiled/babel-plugin v0.39.1 */
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./SyncedBlockPermissionDenied.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _SyncedBlockPermissionDeniedRequestAccessMutation from "./__generated__/SyncedBlockPermissionDeniedRequestAccessMutation.graphql";
-import React, { useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import { useIntl } from 'react-intl';
 import { useMutation, graphql } from 'react-relay';
 import Button from '@atlaskit/button/new';
 import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
+import { requestJiraSpaceAccess } from '@atlaskit/editor-synced-block-provider/requestJiraIssueAccess';
 import Heading from '@atlaskit/heading';
 import StatusSuccessIcon from '@atlaskit/icon/core/status-success';
 import Image from '@atlaskit/image';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text, Flex, Stack, Box } from '@atlaskit/primitives/compiled';
 import PermissionDenied from './assets/PermissionDenied.svg';
 import { SyncedBlockGenericError } from './SyncedBlockGenericError';
@@ -94,14 +98,101 @@ var SyncedBlockPermissionDeniedConfluencePage = function SyncedBlockPermissionDe
     testId: "sync-block-access-error-msg"
   }, formatMessage(messages.requestAccessError)))));
 };
-export var SyncedBlockPermissionDenied = function SyncedBlockPermissionDenied(_ref2) {
+
+/**
+ * For Jira we deliberately collapse "success" and "failure" into a single
+ * `pending` state — matching the behaviour of `useRequestAccessSubmit` in
+ * `jira/src/packages/issue/request-access-modal`. The endpoint returns no
+ * distinguishable error information for security reasons.
+ */
+
+var SyncedBlockPermissionDeniedJiraWorkItem = function SyncedBlockPermissionDeniedJiraWorkItem(_ref2) {
   var sourceContentId = _ref2.sourceContentId,
-    sourceProduct = _ref2.sourceProduct;
+    accountId = _ref2.accountId;
+  var _useIntl2 = useIntl(),
+    formatMessage = _useIntl2.formatMessage;
+  var _useState3 = useState(RequestAccessState.default),
+    _useState4 = _slicedToArray(_useState3, 2),
+    requestAccessState = _useState4[0],
+    setRequestAccessState = _useState4[1];
+  var onClick = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          setRequestAccessState(RequestAccessState.loading);
+          // Fire and forget. Per the Jira backend contract the response is
+          // intentionally opaque (empty 204 on success, generic on failure) to
+          // prevent issue-existence enumeration. We always end in `pending`.
+          _context.prev = 1;
+          _context.next = 4;
+          return requestJiraSpaceAccess({
+            accountId: accountId,
+            issueId: Number(sourceContentId) || null,
+            projectKey: null
+          });
+        case 4:
+          _context.next = 8;
+          break;
+        case 6:
+          _context.prev = 6;
+          _context.t0 = _context["catch"](1);
+        case 8:
+          setRequestAccessState(RequestAccessState.pending);
+        case 9:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee, null, [[1, 6]]);
+  })), [accountId, sourceContentId]);
+  return /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.wrapper
+  }, /*#__PURE__*/React.createElement(Image, {
+    src: PermissionDenied,
+    alt: formatMessage(messages.permissionDeniedAltText),
+    width: "48",
+    height: "48"
+  }), /*#__PURE__*/React.createElement(Stack, {
+    space: "space.100"
+  }, /*#__PURE__*/React.createElement(Heading, {
+    size: "xsmall"
+  }, formatMessage(messages.permissionDeniedHeading)), /*#__PURE__*/React.createElement(Text, {
+    color: "color.text.subtle"
+  }, formatMessage(messages.permissionDeniedDescription)), requestAccessState === RequestAccessState.pending ? /*#__PURE__*/React.createElement(Flex, {
+    columnGap: "space.050",
+    alignItems: "center"
+  }, /*#__PURE__*/React.createElement(StatusSuccessIcon, {
+    size: "small",
+    color: "var(--ds-icon-subtle, #505258)",
+    label: formatMessage(messages.accessRequested)
+  }), /*#__PURE__*/React.createElement(Text, {
+    color: "color.text.subtlest",
+    weight: "bold",
+    testId: "sync-block-access-requested-msg"
+  }, formatMessage(messages.accessRequested))) : /*#__PURE__*/React.createElement(Flex, {
+    columnGap: "space.100",
+    alignItems: "center"
+  }, /*#__PURE__*/React.createElement(Button, {
+    appearance: "default",
+    spacing: "compact",
+    onClick: onClick,
+    isLoading: requestAccessState === RequestAccessState.loading,
+    testId: "sync-block-request-access-btn"
+  }, formatMessage(messages.requestAccessButton)))));
+};
+export var SyncedBlockPermissionDenied = function SyncedBlockPermissionDenied(_ref4) {
+  var sourceContentId = _ref4.sourceContentId,
+    sourceProduct = _ref4.sourceProduct,
+    accountId = _ref4.accountId;
   switch (sourceProduct) {
     case 'confluence-page':
       return /*#__PURE__*/React.createElement(SyncedBlockPermissionDeniedConfluencePage, {
         sourceContentId: sourceContentId
       });
+    case 'jira-work-item':
+      return fg('platform_synced_block_patch_10') ? /*#__PURE__*/React.createElement(SyncedBlockPermissionDeniedJiraWorkItem, {
+        sourceContentId: sourceContentId,
+        accountId: accountId
+      }) : /*#__PURE__*/React.createElement(SyncedBlockGenericError, null);
     default:
       return /*#__PURE__*/React.createElement(SyncedBlockGenericError, null);
   }

package/dist/esm/ui/SyncedBlockRenderer.js

@@ -10,7 +10,8 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
   var _api$analytics2;
   var syncBlockRendererOptions = _ref.syncBlockRendererOptions,
     syncBlockFetchResult = _ref.syncBlockFetchResult,
-    api = _ref.api;
+    api = _ref.api,
+    getAccountId = _ref.getAccountId;
   useEffect(function () {
     var timeoutId = setTimeout(function () {
       var _api$analytics;
@@ -64,7 +65,8 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
     reloadData: reloadData,
     fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent,
     resourceId: syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.resourceId,
-    isOffline: isCollabOffline
+    isOffline: isCollabOffline,
+    getAccountId: getAccountId
   });
   return result.element;
 };

package/dist/esm/ui/renderSyncedBlockContent.js

@@ -21,7 +21,8 @@ export function renderSyncedBlockContent(_ref) {
     fireAnalyticsEvent = _ref.fireAnalyticsEvent,
     resourceId = _ref.resourceId,
     isOffline = _ref.isOffline,
-    error = _ref.error;
+    error = _ref.error,
+    getAccountId = _ref.getAccountId;
   var isSSRMode = isSSR();
   if (isOffline && !isSSRMode) {
     return {
@@ -59,7 +60,8 @@ export function renderSyncedBlockContent(_ref) {
         resourceId: resourceId,
         onRetry: reloadData,
         isLoading: isLoading,
-        fireAnalyticsEvent: fireAnalyticsEvent
+        fireAnalyticsEvent: fireAnalyticsEvent,
+        getAccountId: getAccountId
       }),
       isSuccess: false
     };
@@ -74,7 +76,8 @@ export function renderSyncedBlockContent(_ref) {
         },
         resourceId: resourceId,
         sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
-        fireAnalyticsEvent: fireAnalyticsEvent
+        fireAnalyticsEvent: fireAnalyticsEvent,
+        getAccountId: getAccountId
       }),
       isSuccess: false
     };

package/dist/esm/useSyncedBlockNodeComponent.js

@@ -19,6 +19,7 @@ export var useMemoizedSyncedBlockNodeComponent = function useMemoizedSyncedBlock
     syncBlockProvider = _ref.syncBlockProvider,
     syncBlockRendererOptions = _ref.syncBlockRendererOptions,
     fireAnalyticsEvent = _ref.fireAnalyticsEvent,
+    getAccountId = _ref.getAccountId,
     getPrefetchedData = _ref.getPrefetchedData;
   var syncBlockStoreManager = useMemoizedSyncBlockStoreManager(syncBlockProvider, fireAnalyticsEvent);
 
@@ -53,7 +54,8 @@ export var useMemoizedSyncedBlockNodeComponent = function useMemoizedSyncedBlock
       key: props.localId,
       nodeProps: props,
       syncBlockStoreManager: syncBlockStoreManager,
-      rendererOptions: syncBlockRendererOptions
+      rendererOptions: syncBlockRendererOptions,
+      getAccountId: getAccountId
     })));
-  }, [syncBlockStoreManager, syncBlockRendererOptions, fireAnalyticsEvent]);
+  }, [syncBlockStoreManager, syncBlockRendererOptions, fireAnalyticsEvent, getAccountId]);
 };

package/dist/types/getSyncedBlockRenderer.d.ts

@@ -2,7 +2,8 @@ import React from 'react';
 import type { SyncedBlockRendererProps } from '@atlaskit/editor-plugin-synced-block';
 import type { SyncedBlockRendererOptions } from './types';
 type GetSyncedBlockRendererProps = {
+    getAccountId?: () => string | null;
     syncBlockRendererOptions: SyncedBlockRendererOptions | undefined;
 };
-export declare const getSyncedBlockRenderer: ({ syncBlockRendererOptions }: GetSyncedBlockRendererProps) => ({ syncBlockFetchResult, api }: SyncedBlockRendererProps) => React.JSX.Element;
+export declare const getSyncedBlockRenderer: ({ syncBlockRendererOptions, getAccountId }: GetSyncedBlockRendererProps) => ({ syncBlockFetchResult, api }: SyncedBlockRendererProps) => React.JSX.Element;
 export {};

package/dist/types/ui/SyncedBlockErrorComponent.d.ts

@@ -1,9 +1,10 @@
 import React from 'react';
 import type { RendererSyncBlockEventPayload } from '@atlaskit/editor-common/analytics';
 import type { SyncBlockInstance } from '@atlaskit/editor-synced-block-provider';
-export declare const SyncedBlockErrorComponent: ({ error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL, }: {
+export declare const SyncedBlockErrorComponent: ({ error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL, getAccountId, }: {
     error: SyncBlockInstance["error"];
     fireAnalyticsEvent?: (payload: RendererSyncBlockEventPayload) => void;
+    getAccountId?: () => string | null;
     isLoading?: boolean;
     onRetry?: () => void;
     resourceId?: string;

package/dist/types/ui/SyncedBlockNodeComponentRenderer.d.ts

@@ -8,8 +8,9 @@ export interface SyncedBlockProps {
 }
 export type SyncedBlockNodeProps = NodeProps<SyncedBlockProps>;
 export type SyncedBlockNodeComponentRendererProps = {
+    getAccountId?: () => string | null;
     nodeProps: SyncedBlockNodeProps;
     rendererOptions: SyncedBlockRendererOptions | undefined;
     syncBlockStoreManager: SyncBlockStoreManager;
 };
-export declare const SyncedBlockNodeComponentRenderer: ({ nodeProps, syncBlockStoreManager, rendererOptions, }: SyncedBlockNodeComponentRendererProps) => React.JSX.Element;
+export declare const SyncedBlockNodeComponentRenderer: ({ nodeProps, syncBlockStoreManager, rendererOptions, getAccountId, }: SyncedBlockNodeComponentRendererProps) => React.JSX.Element;

package/dist/types/ui/SyncedBlockPermissionDenied.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { SyncBlockProduct } from '@atlaskit/editor-synced-block-provider';
 export interface SyncedBlockPermissionDeniedProps {
+    accountId: string | null;
     sourceContentId: string;
     sourceProduct: SyncBlockProduct;
 }
-export declare const SyncedBlockPermissionDenied: ({ sourceContentId, sourceProduct, }: SyncedBlockPermissionDeniedProps) => React.JSX.Element;
+export declare const SyncedBlockPermissionDenied: ({ sourceContentId, sourceProduct, accountId, }: SyncedBlockPermissionDeniedProps) => React.JSX.Element;

package/dist/types/ui/SyncedBlockRenderer.d.ts

@@ -5,7 +5,8 @@ import type { UseFetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-
 import type { SyncedBlockRendererOptions } from '../types';
 export type SyncedBlockRendererProps = {
     api?: ExtractInjectionAPI<SyncedBlockPlugin>;
+    getAccountId?: () => string | null;
     syncBlockFetchResult: UseFetchSyncBlockDataResult;
     syncBlockRendererOptions?: SyncedBlockRendererOptions;
 };
-export declare const SyncedBlockRenderer: React.MemoExoticComponent<({ syncBlockRendererOptions, syncBlockFetchResult, api, }: SyncedBlockRendererProps) => React.JSX.Element>;
+export declare const SyncedBlockRenderer: React.MemoExoticComponent<({ syncBlockRendererOptions, syncBlockFetchResult, api, getAccountId, }: SyncedBlockRendererProps) => React.JSX.Element>;

package/dist/types/ui/renderSyncedBlockContent.d.ts

@@ -6,6 +6,7 @@ import type { SyncedBlockRendererOptions } from '../types';
 export type RenderSyncedBlockContentParams = {
     error?: SyncBlockInstance['error'];
     fireAnalyticsEvent?: (payload: RendererSyncBlockEventPayload) => void;
+    getAccountId?: () => string | null;
     isLoading: boolean;
     isOffline?: boolean;
     providerFactory: ProviderFactory | undefined;
@@ -21,7 +22,7 @@ export type RenderSyncedBlockContentParams = {
  * Handles the common branching: loading -> SSR error -> error/deleted -> unpublished -> success.
  * Returns null if the caller should handle rendering itself (e.g. wrapping in a container div).
  */
-export declare function renderSyncedBlockContent({ syncBlockInstance, isLoading, rendererOptions, providerFactory, reloadData, fireAnalyticsEvent, resourceId, isOffline, error, }: RenderSyncedBlockContentParams): {
+export declare function renderSyncedBlockContent({ syncBlockInstance, isLoading, rendererOptions, providerFactory, reloadData, fireAnalyticsEvent, resourceId, isOffline, error, getAccountId, }: RenderSyncedBlockContentParams): {
     element: React.JSX.Element;
     isSuccess: boolean;
 };

package/dist/types/useSyncedBlockNodeComponent.d.ts

@@ -6,10 +6,11 @@ import type { SyncedBlockRendererOptions } from './types';
 import type { SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';
 export type GetSyncedBlockNodeComponentProps = {
     fireAnalyticsEvent?: (payload: AnalyticsEventPayload) => void;
+    getAccountId?: () => string | null;
     getPrefetchedData?: () => SyncBlockPrefetchData | undefined;
     syncBlockNodes: SyncBlockNode[];
     syncBlockProvider: SyncedBlockProvider;
     syncBlockRendererOptions: SyncedBlockRendererOptions | undefined;
 };
 export declare const getSyncBlockNodesFromDoc: (doc: DocNode) => SyncBlockNode[];
-export declare const useMemoizedSyncedBlockNodeComponent: ({ syncBlockNodes, syncBlockProvider, syncBlockRendererOptions, fireAnalyticsEvent, getPrefetchedData, }: GetSyncedBlockNodeComponentProps) => ((props: SyncedBlockNodeProps) => React.JSX.Element);
+export declare const useMemoizedSyncedBlockNodeComponent: ({ syncBlockNodes, syncBlockProvider, syncBlockRendererOptions, fireAnalyticsEvent, getAccountId, getPrefetchedData, }: GetSyncedBlockNodeComponentProps) => ((props: SyncedBlockNodeProps) => React.JSX.Element);

package/dist/types-ts4.5/getSyncedBlockRenderer.d.ts

@@ -2,7 +2,8 @@ import React from 'react';
 import type { SyncedBlockRendererProps } from '@atlaskit/editor-plugin-synced-block';
 import type { SyncedBlockRendererOptions } from './types';
 type GetSyncedBlockRendererProps = {
+    getAccountId?: () => string | null;
     syncBlockRendererOptions: SyncedBlockRendererOptions | undefined;
 };
-export declare const getSyncedBlockRenderer: ({ syncBlockRendererOptions }: GetSyncedBlockRendererProps) => ({ syncBlockFetchResult, api }: SyncedBlockRendererProps) => React.JSX.Element;
+export declare const getSyncedBlockRenderer: ({ syncBlockRendererOptions, getAccountId }: GetSyncedBlockRendererProps) => ({ syncBlockFetchResult, api }: SyncedBlockRendererProps) => React.JSX.Element;
 export {};

package/dist/types-ts4.5/ui/SyncedBlockErrorComponent.d.ts

@@ -1,9 +1,10 @@
 import React from 'react';
 import type { RendererSyncBlockEventPayload } from '@atlaskit/editor-common/analytics';
 import type { SyncBlockInstance } from '@atlaskit/editor-synced-block-provider';
-export declare const SyncedBlockErrorComponent: ({ error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL, }: {
+export declare const SyncedBlockErrorComponent: ({ error, isLoading, onRetry, resourceId, fireAnalyticsEvent, sourceURL, getAccountId, }: {
     error: SyncBlockInstance["error"];
     fireAnalyticsEvent?: (payload: RendererSyncBlockEventPayload) => void;
+    getAccountId?: () => string | null;
     isLoading?: boolean;
     onRetry?: () => void;
     resourceId?: string;

package/dist/types-ts4.5/ui/SyncedBlockNodeComponentRenderer.d.ts

@@ -8,8 +8,9 @@ export interface SyncedBlockProps {
 }
 export type SyncedBlockNodeProps = NodeProps<SyncedBlockProps>;
 export type SyncedBlockNodeComponentRendererProps = {
+    getAccountId?: () => string | null;
     nodeProps: SyncedBlockNodeProps;
     rendererOptions: SyncedBlockRendererOptions | undefined;
     syncBlockStoreManager: SyncBlockStoreManager;
 };
-export declare const SyncedBlockNodeComponentRenderer: ({ nodeProps, syncBlockStoreManager, rendererOptions, }: SyncedBlockNodeComponentRendererProps) => React.JSX.Element;
+export declare const SyncedBlockNodeComponentRenderer: ({ nodeProps, syncBlockStoreManager, rendererOptions, getAccountId, }: SyncedBlockNodeComponentRendererProps) => React.JSX.Element;

package/dist/types-ts4.5/ui/SyncedBlockPermissionDenied.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { SyncBlockProduct } from '@atlaskit/editor-synced-block-provider';
 export interface SyncedBlockPermissionDeniedProps {
+    accountId: string | null;
     sourceContentId: string;
     sourceProduct: SyncBlockProduct;
 }
-export declare const SyncedBlockPermissionDenied: ({ sourceContentId, sourceProduct, }: SyncedBlockPermissionDeniedProps) => React.JSX.Element;
+export declare const SyncedBlockPermissionDenied: ({ sourceContentId, sourceProduct, accountId, }: SyncedBlockPermissionDeniedProps) => React.JSX.Element;

package/dist/types-ts4.5/ui/SyncedBlockRenderer.d.ts

@@ -5,7 +5,8 @@ import type { UseFetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-
 import type { SyncedBlockRendererOptions } from '../types';
 export type SyncedBlockRendererProps = {
     api?: ExtractInjectionAPI<SyncedBlockPlugin>;
+    getAccountId?: () => string | null;
     syncBlockFetchResult: UseFetchSyncBlockDataResult;
     syncBlockRendererOptions?: SyncedBlockRendererOptions;
 };
-export declare const SyncedBlockRenderer: React.MemoExoticComponent<({ syncBlockRendererOptions, syncBlockFetchResult, api, }: SyncedBlockRendererProps) => React.JSX.Element>;
+export declare const SyncedBlockRenderer: React.MemoExoticComponent<({ syncBlockRendererOptions, syncBlockFetchResult, api, getAccountId, }: SyncedBlockRendererProps) => React.JSX.Element>;

package/dist/types-ts4.5/ui/renderSyncedBlockContent.d.ts

@@ -6,6 +6,7 @@ import type { SyncedBlockRendererOptions } from '../types';
 export type RenderSyncedBlockContentParams = {
     error?: SyncBlockInstance['error'];
     fireAnalyticsEvent?: (payload: RendererSyncBlockEventPayload) => void;
+    getAccountId?: () => string | null;
     isLoading: boolean;
     isOffline?: boolean;
     providerFactory: ProviderFactory | undefined;
@@ -21,7 +22,7 @@ export type RenderSyncedBlockContentParams = {
  * Handles the common branching: loading -> SSR error -> error/deleted -> unpublished -> success.
  * Returns null if the caller should handle rendering itself (e.g. wrapping in a container div).
  */
-export declare function renderSyncedBlockContent({ syncBlockInstance, isLoading, rendererOptions, providerFactory, reloadData, fireAnalyticsEvent, resourceId, isOffline, error, }: RenderSyncedBlockContentParams): {
+export declare function renderSyncedBlockContent({ syncBlockInstance, isLoading, rendererOptions, providerFactory, reloadData, fireAnalyticsEvent, resourceId, isOffline, error, getAccountId, }: RenderSyncedBlockContentParams): {
     element: React.JSX.Element;
     isSuccess: boolean;
 };

package/dist/types-ts4.5/useSyncedBlockNodeComponent.d.ts

@@ -6,10 +6,11 @@ import type { SyncedBlockRendererOptions } from './types';
 import type { SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';
 export type GetSyncedBlockNodeComponentProps = {
     fireAnalyticsEvent?: (payload: AnalyticsEventPayload) => void;
+    getAccountId?: () => string | null;
     getPrefetchedData?: () => SyncBlockPrefetchData | undefined;
     syncBlockNodes: SyncBlockNode[];
     syncBlockProvider: SyncedBlockProvider;
     syncBlockRendererOptions: SyncedBlockRendererOptions | undefined;
 };
 export declare const getSyncBlockNodesFromDoc: (doc: DocNode) => SyncBlockNode[];
-export declare const useMemoizedSyncedBlockNodeComponent: ({ syncBlockNodes, syncBlockProvider, syncBlockRendererOptions, fireAnalyticsEvent, getPrefetchedData, }: GetSyncedBlockNodeComponentProps) => ((props: SyncedBlockNodeProps) => React.JSX.Element);
+export declare const useMemoizedSyncedBlockNodeComponent: ({ syncBlockNodes, syncBlockProvider, syncBlockRendererOptions, fireAnalyticsEvent, getAccountId, getPrefetchedData, }: GetSyncedBlockNodeComponentProps) => ((props: SyncedBlockNodeProps) => React.JSX.Element);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-synced-block-renderer",
-	"version": "8.1.1",
+	"version": "8.2.0",
 	"description": "SyncedBlockRenderer for @atlaskit/editor-plugin-synced-block",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -37,25 +37,25 @@
 	"dependencies": {
 		"@atlaskit/button": "^23.11.0",
 		"@atlaskit/css": "^0.19.0",
-		"@atlaskit/editor-plugin-synced-block": "^8.0.0",
-		"@atlaskit/editor-synced-block-provider": "^6.1.0",
+		"@atlaskit/editor-plugin-synced-block": "^8.1.0",
+		"@atlaskit/editor-synced-block-provider": "^6.3.0",
 		"@atlaskit/heading": "^5.4.0",
-		"@atlaskit/icon": "^34.2.0",
-		"@atlaskit/icon-lab": "^6.5.0",
+		"@atlaskit/icon": "^34.3.0",
+		"@atlaskit/icon-lab": "^6.6.0",
 		"@atlaskit/image": "^3.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^19.0.0",
 		"@atlaskit/renderer": "^130.2.0",
 		"@atlaskit/spinner": "^19.1.0",
 		"@atlaskit/tokens": "^13.0.0",
-		"@atlaskit/tooltip": "^21.1.0",
+		"@atlaskit/tooltip": "^21.2.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.20.0",
 		"react-relay": "npm:atl-react-relay@0.0.0-main-39e79f66",
 		"relay-runtime": "npm:atl-relay-runtime@0.0.0-main-39e79f66"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^114.3.0",
+		"@atlaskit/editor-common": "^114.13.0",
 		"react": "^18.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
 	},
@@ -100,6 +100,9 @@
 	"platform-feature-flags": {
 		"platform_synced_block_patch_8": {
 			"type": "boolean"
+		},
+		"platform_synced_block_patch_10": {
+			"type": "boolean"
 		}
 	}
 }