@atlaskit/editor-synced-block-renderer 5.8.5 → 5.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/editor-synced-block-renderer
2
2
 
3
+ ## 5.9.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`e18437c28f9ab`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e18437c28f9ab) -
8
+ Improve synced blocks robustness.
9
+ - Updated dependencies
10
+
11
+ ## 5.9.0
12
+
13
+ ### Minor Changes
14
+
15
+ - [`1a363f7706a2f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1a363f7706a2f) -
16
+ EDITOR-4193 add anaytics for ssr errors
17
+
18
+ ### Patch Changes
19
+
20
+ - Updated dependencies
21
+
3
22
  ## 5.8.5
4
23
 
5
24
  ### Patch Changes
@@ -9,13 +9,18 @@ exports.SyncedBlockLoadingState = void 0;
9
9
  require("./SyncedBlockLoadingState.compiled.css");
10
10
  var _runtime = require("@compiled/react/runtime");
11
11
  var _react = _interopRequireDefault(require("react"));
12
+ var _reactIntlNext = require("react-intl-next");
13
+ var _messages = require("@atlaskit/editor-common/messages");
12
14
  var _syncBlock = require("@atlaskit/editor-common/sync-block");
15
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
13
16
  var _compiled = require("@atlaskit/primitives/compiled");
14
17
  var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
15
18
  var styles = {
16
19
  wrapper: "_1tkevbgk _1e0c1txw _1bah1h6o _4cvr1h6o"
17
20
  };
18
21
  var SyncedBlockLoadingState = exports.SyncedBlockLoadingState = function SyncedBlockLoadingState() {
22
+ var _useIntl = (0, _reactIntlNext.useIntl)(),
23
+ formatMessage = _useIntl.formatMessage;
19
24
  return (
20
25
  /*#__PURE__*/
21
26
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides
@@ -25,7 +30,7 @@ var SyncedBlockLoadingState = exports.SyncedBlockLoadingState = function SyncedB
25
30
  xcss: styles.wrapper
26
31
  }, /*#__PURE__*/_react.default.createElement(_spinner.default, {
27
32
  size: "small",
28
- label: "Loading synced content"
33
+ label: (0, _platformFeatureFlags.fg)('platform_synced_block_patch_4') ? formatMessage(_messages.syncBlockMessages.loadingSyncedContent) : 'Loading synced content'
29
34
  })))
30
35
  );
31
36
  };
@@ -27,6 +27,15 @@ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer
27
27
  var resourceId = nodeProps.resourceId,
28
28
  localId = nodeProps.localId,
29
29
  fireAnalyticsEvent = nodeProps.fireAnalyticsEvent;
30
+ (0, _react.useEffect)(function () {
31
+ var timeoutId = setTimeout(function () {
32
+ (0, _syncBlock.handleSSRErrorsAnalytics)(fireAnalyticsEvent);
33
+ }, 0);
34
+ return function () {
35
+ clearTimeout(timeoutId);
36
+ };
37
+ // eslint-disable-next-line react-hooks/exhaustive-deps
38
+ }, []);
30
39
  syncBlockStoreManager.referenceManager.updateFireAnalyticsEvent(fireAnalyticsEvent);
31
40
  var _useFetchSyncBlockDat = (0, _editorSyncedBlockProvider.useFetchSyncBlockData)(syncBlockStoreManager, resourceId, localId, fireAnalyticsEvent),
32
41
  syncBlockInstance = _useFetchSyncBlockDat.syncBlockInstance,
@@ -20,6 +20,7 @@ var _syncBlock = require("@atlaskit/editor-common/sync-block");
20
20
  var _cross = _interopRequireDefault(require("@atlaskit/icon/core/cross"));
21
21
  var _eyeOpenStrikethrough = _interopRequireDefault(require("@atlaskit/icon/core/eye-open-strikethrough"));
22
22
  var _linkBroken = _interopRequireDefault(require("@atlaskit/icon/core/link-broken"));
23
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
23
24
  var _compiled = require("@atlaskit/primitives/compiled");
24
25
  var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
25
26
  var _SyncedBlockErrorStateCard = require("./SyncedBlockErrorStateCard");
@@ -48,6 +49,7 @@ var errorMap = {
48
49
  }
49
50
  };
50
51
  var useErrorInfo = function useErrorInfo(reason, url, title) {
52
+ var _errorMap;
51
53
  var _useIntl = (0, _reactIntlNext.useIntl)(),
52
54
  formatMessage = _useIntl.formatMessage;
53
55
  if (reason === 'source-document-deleted') {
@@ -68,9 +70,9 @@ var useErrorInfo = function useErrorInfo(reason, url, title) {
68
70
  icon: _icon2
69
71
  };
70
72
  }
71
- var _errorMap = errorMap[reason || 'generic'],
72
- icon = _errorMap.icon,
73
- description = _errorMap.description;
73
+ var _ref = (0, _platformFeatureFlags.fg)('platform_synced_block_patch_4') ? (_errorMap = errorMap[reason || 'generic']) !== null && _errorMap !== void 0 ? _errorMap : errorMap['generic'] : errorMap[reason || 'generic'],
74
+ icon = _ref.icon,
75
+ description = _ref.description;
74
76
  return {
75
77
  description: formatMessage(description, {
76
78
  title: title,
@@ -78,6 +80,7 @@ var useErrorInfo = function useErrorInfo(reason, url, title) {
78
80
  return /*#__PURE__*/_react.default.createElement(_compiled.Anchor, {
79
81
  href: url,
80
82
  target: "_blank",
83
+ rel: (0, _platformFeatureFlags.fg)('platform_synced_block_patch_4') ? 'noopener noreferrer' : undefined,
81
84
  xcss: styles.link
82
85
  }, chunk);
83
86
  }
@@ -85,14 +88,14 @@ var useErrorInfo = function useErrorInfo(reason, url, title) {
85
88
  icon: icon
86
89
  };
87
90
  };
88
- var SyncedBlockNotFoundError = exports.SyncedBlockNotFoundError = function SyncedBlockNotFoundError(_ref) {
91
+ var SyncedBlockNotFoundError = exports.SyncedBlockNotFoundError = function SyncedBlockNotFoundError(_ref2) {
89
92
  var _useSyncBlockActions;
90
- var _ref$reason = _ref.reason,
91
- reason = _ref$reason === void 0 ? 'source-block-deleted' : _ref$reason,
92
- sourceAri = _ref.sourceAri;
93
- var _ref2 = (_useSyncBlockActions = (0, _syncBlock.useSyncBlockActions)()) !== null && _useSyncBlockActions !== void 0 ? _useSyncBlockActions : {},
94
- deleteSyncBlock = _ref2.deleteSyncBlock,
95
- fetchSourceInfo = _ref2.fetchSourceInfo;
93
+ var _ref2$reason = _ref2.reason,
94
+ reason = _ref2$reason === void 0 ? 'source-block-deleted' : _ref2$reason,
95
+ sourceAri = _ref2.sourceAri;
96
+ var _ref3 = (_useSyncBlockActions = (0, _syncBlock.useSyncBlockActions)()) !== null && _useSyncBlockActions !== void 0 ? _useSyncBlockActions : {},
97
+ deleteSyncBlock = _ref3.deleteSyncBlock,
98
+ fetchSourceInfo = _ref3.fetchSourceInfo;
96
99
  var _useState = (0, _react.useState)(undefined),
97
100
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
98
101
  sourceInfo = _useState2[0],
@@ -107,7 +110,7 @@ var SyncedBlockNotFoundError = exports.SyncedBlockNotFoundError = function Synce
107
110
  return;
108
111
  }
109
112
  var getSourceInfo = /*#__PURE__*/function () {
110
- var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
113
+ var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
111
114
  var sourceInfo;
112
115
  return _regenerator.default.wrap(function _callee$(_context) {
113
116
  while (1) switch (_context.prev = _context.next) {
@@ -127,7 +130,7 @@ var SyncedBlockNotFoundError = exports.SyncedBlockNotFoundError = function Synce
127
130
  }, _callee);
128
131
  }));
129
132
  return function getSourceInfo() {
130
- return _ref3.apply(this, arguments);
133
+ return _ref4.apply(this, arguments);
131
134
  };
132
135
  }();
133
136
  getSourceInfo();
@@ -19,6 +19,7 @@ var _messages = require("@atlaskit/editor-common/messages");
19
19
  var _heading = _interopRequireDefault(require("@atlaskit/heading"));
20
20
  var _statusSuccess = _interopRequireDefault(require("@atlaskit/icon/core/status-success"));
21
21
  var _image = _interopRequireDefault(require("@atlaskit/image"));
22
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
22
23
  var _compiled = require("@atlaskit/primitives/compiled");
23
24
  var _PermissionDenied = _interopRequireDefault(require("./assets/PermissionDenied.svg"));
24
25
  var _SyncedBlockGenericError = require("./SyncedBlockGenericError");
@@ -84,7 +85,7 @@ var SyncedBlockPermissionDeniedConfluencePage = function SyncedBlockPermissionDe
84
85
  }, /*#__PURE__*/_react.default.createElement(_statusSuccess.default, {
85
86
  size: "small",
86
87
  color: "var(--ds-icon-subtle, #505258)",
87
- label: ""
88
+ label: (0, _platformFeatureFlags.fg)('platform_synced_block_patch_4') ? formatMessage(_messages.syncBlockMessages.accessRequested) : ''
88
89
  }), /*#__PURE__*/_react.default.createElement(_compiled.Text, {
89
90
  color: "color.text.subtlest",
90
91
  weight: "bold",
@@ -10,6 +10,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
10
10
  var _react = _interopRequireWildcard(require("react"));
11
11
  var _coreUtils = require("@atlaskit/editor-common/core-utils");
12
12
  var _hooks = require("@atlaskit/editor-common/hooks");
13
+ var _syncBlock = require("@atlaskit/editor-common/sync-block");
13
14
  var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
14
15
  var _AKRendererWrapper = require("./AKRendererWrapper");
15
16
  var _SyncedBlockErrorComponent = require("./SyncedBlockErrorComponent");
@@ -22,14 +23,25 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
22
23
  var syncBlockRendererOptions = _ref.syncBlockRendererOptions,
23
24
  syncBlockFetchResult = _ref.syncBlockFetchResult,
24
25
  api = _ref.api;
26
+ (0, _react.useEffect)(function () {
27
+ var timeoutId = setTimeout(function () {
28
+ var _api$analytics;
29
+ (0, _syncBlock.handleSSRErrorsAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent);
30
+ }, 0);
31
+ return function () {
32
+ clearTimeout(timeoutId);
33
+ };
34
+ // eslint-disable-next-line react-hooks/exhaustive-deps
35
+ }, []);
25
36
  var isLoading = syncBlockFetchResult.isLoading,
26
37
  providerFactory = syncBlockFetchResult.providerFactory,
27
38
  reloadData = syncBlockFetchResult.reloadData,
28
39
  ssrProviders = syncBlockFetchResult.ssrProviders,
29
40
  syncBlockInstance = syncBlockFetchResult.syncBlockInstance;
41
+ var isSSRMode = (0, _coreUtils.isSSR)();
30
42
  var rendererOptions = (0, _react.useMemo)(function () {
31
43
  var _syncBlockRendererOpt, _ssrProviders$media;
32
- if (!(0, _coreUtils.isSSR)() || syncBlockRendererOptions !== null && syncBlockRendererOptions !== void 0 && (_syncBlockRendererOpt = syncBlockRendererOptions.media) !== null && _syncBlockRendererOpt !== void 0 && _syncBlockRendererOpt.ssr ||
44
+ if (!isSSRMode || syncBlockRendererOptions !== null && syncBlockRendererOptions !== void 0 && (_syncBlockRendererOpt = syncBlockRendererOptions.media) !== null && _syncBlockRendererOpt !== void 0 && _syncBlockRendererOpt.ssr ||
33
45
  // already has ssr config
34
46
  !(ssrProviders !== null && ssrProviders !== void 0 && (_ssrProviders$media = ssrProviders.media) !== null && _ssrProviders$media !== void 0 && _ssrProviders$media.viewMediaClientConfig)) {
35
47
  return syncBlockRendererOptions;
@@ -43,7 +55,7 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
43
55
  ssr: mediaSSR
44
56
  })
45
57
  });
46
- }, [syncBlockRendererOptions, ssrProviders]);
58
+ }, [syncBlockRendererOptions, ssrProviders, isSSRMode]);
47
59
  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['connectivity'], function (_ref2) {
48
60
  var connectivityState = _ref2.connectivityState;
49
61
  return {
@@ -54,7 +66,7 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
54
66
 
55
67
  // Show offline error only when collaboration is offline and not in SSR mode
56
68
  // In SSR, we should always attempt to render content
57
- if (isCollabOffline && !(0, _coreUtils.isSSR)()) {
69
+ if (isCollabOffline && !isSSRMode) {
58
70
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
59
71
  error: {
60
72
  type: _editorSyncedBlockProvider.SyncBlockError.Offline
@@ -67,11 +79,11 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
67
79
 
68
80
  // In SSR, if server returned error, we should render loading state instead of error state
69
81
  // since FE will do another fetch and render the error state or proper data then
70
- if ((0, _coreUtils.isSSR)() && syncBlockInstance.error) {
82
+ if (isSSRMode && syncBlockInstance.error) {
71
83
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
72
84
  }
73
85
  if (syncBlockInstance.error || !syncBlockInstance.data || syncBlockInstance.data.status === 'deleted') {
74
- var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics;
86
+ var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics2;
75
87
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
76
88
  error: (_syncBlockInstance$er = syncBlockInstance.error) !== null && _syncBlockInstance$er !== void 0 ? _syncBlockInstance$er : (syncBlockInstance === null || syncBlockInstance === void 0 || (_syncBlockInstance$da = syncBlockInstance.data) === null || _syncBlockInstance$da === void 0 ? void 0 : _syncBlockInstance$da.status) === 'deleted' ? {
77
89
  type: _editorSyncedBlockProvider.SyncBlockError.NotFound
@@ -81,20 +93,20 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
81
93
  resourceId: syncBlockInstance.resourceId,
82
94
  onRetry: reloadData,
83
95
  isLoading: isLoading,
84
- fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent
96
+ fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
85
97
  });
86
98
  }
87
99
 
88
100
  // Check for unpublished status
89
101
  if (((_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
90
- var _syncBlockInstance$da3, _api$analytics2;
102
+ var _syncBlockInstance$da3, _api$analytics3;
91
103
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
92
104
  error: {
93
105
  type: _editorSyncedBlockProvider.SyncBlockError.Unpublished
94
106
  },
95
107
  resourceId: syncBlockInstance.resourceId,
96
108
  sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
97
- fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
109
+ fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent
98
110
  });
99
111
  }
100
112
  var syncBlockDoc = {
@@ -12,6 +12,7 @@ var _react = _interopRequireDefault(require("react"));
12
12
  var _reactIntlNext = require("react-intl-next");
13
13
  var _messages = require("@atlaskit/editor-common/messages");
14
14
  var _eyeOpenStrikethrough = _interopRequireDefault(require("@atlaskit/icon/core/eye-open-strikethrough"));
15
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
16
  var _compiled = require("@atlaskit/primitives/compiled");
16
17
  var _SyncedBlockErrorStateCard = require("./SyncedBlockErrorStateCard");
17
18
  var styles = {
@@ -26,6 +27,7 @@ var SyncedBlockUnpublishedError = exports.SyncedBlockUnpublishedError = function
26
27
  return sourceURL ? /*#__PURE__*/_react.default.createElement(_compiled.Text, null, /*#__PURE__*/_react.default.createElement(_compiled.Anchor, {
27
28
  href: sourceURL,
28
29
  target: "_blank",
30
+ rel: (0, _platformFeatureFlags.fg)('platform_synced_block_patch_4') ? 'noopener noreferrer' : undefined,
29
31
  xcss: styles.link
30
32
  }, chunks)) : chunks;
31
33
  }
@@ -10,6 +10,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
10
10
  var _errorBoundary = require("@atlaskit/editor-common/error-boundary");
11
11
  var _syncBlock = require("@atlaskit/editor-common/sync-block");
12
12
  var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
13
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
13
14
  var _SyncedBlockNodeComponentRenderer = require("./ui/SyncedBlockNodeComponentRenderer");
14
15
  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); }
15
16
  var getSyncBlockNodesFromDoc = exports.getSyncBlockNodesFromDoc = function getSyncBlockNodesFromDoc(doc) {
@@ -32,10 +33,18 @@ var useMemoizedSyncedBlockNodeComponent = exports.useMemoizedSyncedBlockNodeComp
32
33
 
33
34
  // Process prefetched data early, if available
34
35
  (0, _react.useEffect)(function () {
35
- var prefetchedData;
36
36
  if (getPrefetchedData) {
37
- prefetchedData = getPrefetchedData();
38
- syncBlockStoreManager.referenceManager.processPrefetchedData(prefetchedData);
37
+ if ((0, _platformFeatureFlags.fg)('platform_synced_block_patch_4')) {
38
+ try {
39
+ var prefetchedData = getPrefetchedData();
40
+ syncBlockStoreManager.referenceManager.processPrefetchedData(prefetchedData);
41
+ } catch (_unused) {
42
+ // Silently ignore errors from getPrefetchedData so the fetch effect can still run
43
+ }
44
+ } else {
45
+ var _prefetchedData = getPrefetchedData();
46
+ syncBlockStoreManager.referenceManager.processPrefetchedData(_prefetchedData);
47
+ }
39
48
  }
40
49
  }, [getPrefetchedData, syncBlockStoreManager.referenceManager]);
41
50
 
@@ -2,13 +2,19 @@
2
2
  import "./SyncedBlockLoadingState.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
4
  import React from 'react';
5
+ import { useIntl } from 'react-intl-next';
6
+ import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
5
7
  import { SyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
8
+ import { fg } from '@atlaskit/platform-feature-flags';
6
9
  import { Box } from '@atlaskit/primitives/compiled';
7
10
  import Spinner from '@atlaskit/spinner';
8
11
  const styles = {
9
12
  wrapper: "_1tkevbgk _1e0c1txw _1bah1h6o _4cvr1h6o"
10
13
  };
11
14
  export const SyncedBlockLoadingState = () => {
15
+ const {
16
+ formatMessage
17
+ } = useIntl();
12
18
  return (
13
19
  /*#__PURE__*/
14
20
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides
@@ -18,7 +24,7 @@ export const SyncedBlockLoadingState = () => {
18
24
  xcss: styles.wrapper
19
25
  }, /*#__PURE__*/React.createElement(Spinner, {
20
26
  size: "small",
21
- label: "Loading synced content"
27
+ label: fg('platform_synced_block_patch_4') ? formatMessage(messages.loadingSyncedContent) : 'Loading synced content'
22
28
  })))
23
29
  );
24
30
  };
@@ -1,6 +1,6 @@
1
- import React, { useMemo } from 'react';
1
+ import React, { useEffect, useMemo } from 'react';
2
2
  import { isSSR } from '@atlaskit/editor-common/core-utils';
3
- import { SyncBlockSharedCssClassName, SyncBlockRendererDataAttributeName } from '@atlaskit/editor-common/sync-block';
3
+ import { SyncBlockSharedCssClassName, SyncBlockRendererDataAttributeName, handleSSRErrorsAnalytics } from '@atlaskit/editor-common/sync-block';
4
4
  import { SyncBlockError, useFetchSyncBlockData } from '@atlaskit/editor-synced-block-provider';
5
5
  import { fg } from '@atlaskit/platform-feature-flags';
6
6
  import { AKRendererWrapper } from './AKRendererWrapper';
@@ -17,6 +17,15 @@ export const SyncedBlockNodeComponentRenderer = ({
17
17
  localId,
18
18
  fireAnalyticsEvent
19
19
  } = nodeProps;
20
+ useEffect(() => {
21
+ const timeoutId = setTimeout(() => {
22
+ handleSSRErrorsAnalytics(fireAnalyticsEvent);
23
+ }, 0);
24
+ return () => {
25
+ clearTimeout(timeoutId);
26
+ };
27
+ // eslint-disable-next-line react-hooks/exhaustive-deps
28
+ }, []);
20
29
  syncBlockStoreManager.referenceManager.updateFireAnalyticsEvent(fireAnalyticsEvent);
21
30
  const {
22
31
  syncBlockInstance,
@@ -9,6 +9,7 @@ import { useSyncBlockActions } from '@atlaskit/editor-common/sync-block';
9
9
  import CrossIcon from '@atlaskit/icon/core/cross';
10
10
  import EyeOpenStrikethroughIcon from '@atlaskit/icon/core/eye-open-strikethrough';
11
11
  import LinkBrokenIcon from '@atlaskit/icon/core/link-broken';
12
+ import { fg } from '@atlaskit/platform-feature-flags';
12
13
  import { Anchor, Box } from '@atlaskit/primitives/compiled';
13
14
  import Spinner from '@atlaskit/spinner';
14
15
  import { SyncedBlockErrorStateCard } from './SyncedBlockErrorStateCard';
@@ -36,6 +37,7 @@ const errorMap = {
36
37
  }
37
38
  };
38
39
  const useErrorInfo = (reason, url, title) => {
40
+ var _errorMap;
39
41
  const {
40
42
  formatMessage
41
43
  } = useIntl();
@@ -62,13 +64,14 @@ const useErrorInfo = (reason, url, title) => {
62
64
  const {
63
65
  icon,
64
66
  description
65
- } = errorMap[reason || 'generic'];
67
+ } = fg('platform_synced_block_patch_4') ? (_errorMap = errorMap[reason || 'generic']) !== null && _errorMap !== void 0 ? _errorMap : errorMap['generic'] : errorMap[reason || 'generic'];
66
68
  return {
67
69
  description: formatMessage(description, {
68
70
  title,
69
71
  a: chunk => /*#__PURE__*/React.createElement(Anchor, {
70
72
  href: url,
71
73
  target: "_blank",
74
+ rel: fg('platform_synced_block_patch_4') ? 'noopener noreferrer' : undefined,
72
75
  xcss: styles.link
73
76
  }, chunk)
74
77
  }),
@@ -10,6 +10,7 @@ import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages'
10
10
  import Heading from '@atlaskit/heading';
11
11
  import StatusSuccessIcon from '@atlaskit/icon/core/status-success';
12
12
  import Image from '@atlaskit/image';
13
+ import { fg } from '@atlaskit/platform-feature-flags';
13
14
  import { Text, Flex, Stack, Box } from '@atlaskit/primitives/compiled';
14
15
  import PermissionDenied from './assets/PermissionDenied.svg';
15
16
  import { SyncedBlockGenericError } from './SyncedBlockGenericError';
@@ -71,7 +72,7 @@ const SyncedBlockPermissionDeniedConfluencePage = ({
71
72
  }, /*#__PURE__*/React.createElement(StatusSuccessIcon, {
72
73
  size: "small",
73
74
  color: "var(--ds-icon-subtle, #505258)",
74
- label: ""
75
+ label: fg('platform_synced_block_patch_4') ? formatMessage(messages.accessRequested) : ''
75
76
  }), /*#__PURE__*/React.createElement(Text, {
76
77
  color: "color.text.subtlest",
77
78
  weight: "bold",
@@ -1,6 +1,7 @@
1
- import React, { memo, useMemo } from 'react';
1
+ import React, { memo, useEffect, useMemo } from 'react';
2
2
  import { isSSR } from '@atlaskit/editor-common/core-utils';
3
3
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
4
+ import { handleSSRErrorsAnalytics } from '@atlaskit/editor-common/sync-block';
4
5
  import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
5
6
  import { AKRendererWrapper } from './AKRendererWrapper';
6
7
  import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
@@ -11,6 +12,16 @@ const SyncedBlockRendererComponent = ({
11
12
  api
12
13
  }) => {
13
14
  var _syncBlockInstance$da2;
15
+ useEffect(() => {
16
+ const timeoutId = setTimeout(() => {
17
+ var _api$analytics;
18
+ handleSSRErrorsAnalytics(api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent);
19
+ }, 0);
20
+ return () => {
21
+ clearTimeout(timeoutId);
22
+ };
23
+ // eslint-disable-next-line react-hooks/exhaustive-deps
24
+ }, []);
14
25
  const {
15
26
  isLoading,
16
27
  providerFactory,
@@ -18,9 +29,10 @@ const SyncedBlockRendererComponent = ({
18
29
  ssrProviders,
19
30
  syncBlockInstance
20
31
  } = syncBlockFetchResult;
32
+ const isSSRMode = isSSR();
21
33
  const rendererOptions = useMemo(() => {
22
34
  var _syncBlockRendererOpt, _ssrProviders$media;
23
- if (!isSSR() || syncBlockRendererOptions !== null && syncBlockRendererOptions !== void 0 && (_syncBlockRendererOpt = syncBlockRendererOptions.media) !== null && _syncBlockRendererOpt !== void 0 && _syncBlockRendererOpt.ssr ||
35
+ if (!isSSRMode || syncBlockRendererOptions !== null && syncBlockRendererOptions !== void 0 && (_syncBlockRendererOpt = syncBlockRendererOptions.media) !== null && _syncBlockRendererOpt !== void 0 && _syncBlockRendererOpt.ssr ||
24
36
  // already has ssr config
25
37
  !(ssrProviders !== null && ssrProviders !== void 0 && (_ssrProviders$media = ssrProviders.media) !== null && _ssrProviders$media !== void 0 && _ssrProviders$media.viewMediaClientConfig)) {
26
38
  return syncBlockRendererOptions;
@@ -36,7 +48,7 @@ const SyncedBlockRendererComponent = ({
36
48
  ssr: mediaSSR
37
49
  }
38
50
  };
39
- }, [syncBlockRendererOptions, ssrProviders]);
51
+ }, [syncBlockRendererOptions, ssrProviders, isSSRMode]);
40
52
  const {
41
53
  isCollabOffline
42
54
  } = useSharedPluginStateWithSelector(api, ['connectivity'], ({
@@ -47,7 +59,7 @@ const SyncedBlockRendererComponent = ({
47
59
 
48
60
  // Show offline error only when collaboration is offline and not in SSR mode
49
61
  // In SSR, we should always attempt to render content
50
- if (isCollabOffline && !isSSR()) {
62
+ if (isCollabOffline && !isSSRMode) {
51
63
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
52
64
  error: {
53
65
  type: SyncBlockError.Offline
@@ -60,11 +72,11 @@ const SyncedBlockRendererComponent = ({
60
72
 
61
73
  // In SSR, if server returned error, we should render loading state instead of error state
62
74
  // since FE will do another fetch and render the error state or proper data then
63
- if (isSSR() && syncBlockInstance.error) {
75
+ if (isSSRMode && syncBlockInstance.error) {
64
76
  return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
65
77
  }
66
78
  if (syncBlockInstance.error || !syncBlockInstance.data || syncBlockInstance.data.status === 'deleted') {
67
- var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics;
79
+ var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics2;
68
80
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
69
81
  error: (_syncBlockInstance$er = syncBlockInstance.error) !== null && _syncBlockInstance$er !== void 0 ? _syncBlockInstance$er : (syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : (_syncBlockInstance$da = syncBlockInstance.data) === null || _syncBlockInstance$da === void 0 ? void 0 : _syncBlockInstance$da.status) === 'deleted' ? {
70
82
  type: SyncBlockError.NotFound
@@ -74,20 +86,20 @@ const SyncedBlockRendererComponent = ({
74
86
  resourceId: syncBlockInstance.resourceId,
75
87
  onRetry: reloadData,
76
88
  isLoading: isLoading,
77
- fireAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent
89
+ fireAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
78
90
  });
79
91
  }
80
92
 
81
93
  // Check for unpublished status
82
94
  if (((_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
83
- var _syncBlockInstance$da3, _api$analytics2;
95
+ var _syncBlockInstance$da3, _api$analytics3;
84
96
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
85
97
  error: {
86
98
  type: SyncBlockError.Unpublished
87
99
  },
88
100
  resourceId: syncBlockInstance.resourceId,
89
101
  sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
90
- fireAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
102
+ fireAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent
91
103
  });
92
104
  }
93
105
  const syncBlockDoc = {
@@ -5,6 +5,7 @@ import React from 'react';
5
5
  import { useIntl } from 'react-intl-next';
6
6
  import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
7
7
  import EyeOpenStrikethroughIcon from '@atlaskit/icon/core/eye-open-strikethrough';
8
+ import { fg } from '@atlaskit/platform-feature-flags';
8
9
  import { Anchor, Text } from '@atlaskit/primitives/compiled';
9
10
  import { SyncedBlockErrorStateCard } from './SyncedBlockErrorStateCard';
10
11
  const styles = {
@@ -20,6 +21,7 @@ export const SyncedBlockUnpublishedError = ({
20
21
  link: chunks => sourceURL ? /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(Anchor, {
21
22
  href: sourceURL,
22
23
  target: "_blank",
24
+ rel: fg('platform_synced_block_patch_4') ? 'noopener noreferrer' : undefined,
23
25
  xcss: styles.link
24
26
  }, chunks)) : chunks
25
27
  });
@@ -3,6 +3,7 @@ import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
3
3
  import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
4
4
  import { SyncBlockActionsProvider } from '@atlaskit/editor-common/sync-block';
5
5
  import { convertSyncBlockJSONNodeToSyncBlockNode, useMemoizedSyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
6
+ import { fg } from '@atlaskit/platform-feature-flags';
6
7
  import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
7
8
  export const getSyncBlockNodesFromDoc = doc => {
8
9
  const {
@@ -23,10 +24,18 @@ export const useMemoizedSyncedBlockNodeComponent = ({
23
24
 
24
25
  // Process prefetched data early, if available
25
26
  useEffect(() => {
26
- let prefetchedData;
27
27
  if (getPrefetchedData) {
28
- prefetchedData = getPrefetchedData();
29
- syncBlockStoreManager.referenceManager.processPrefetchedData(prefetchedData);
28
+ if (fg('platform_synced_block_patch_4')) {
29
+ try {
30
+ const prefetchedData = getPrefetchedData();
31
+ syncBlockStoreManager.referenceManager.processPrefetchedData(prefetchedData);
32
+ } catch {
33
+ // Silently ignore errors from getPrefetchedData so the fetch effect can still run
34
+ }
35
+ } else {
36
+ const prefetchedData = getPrefetchedData();
37
+ syncBlockStoreManager.referenceManager.processPrefetchedData(prefetchedData);
38
+ }
30
39
  }
31
40
  }, [getPrefetchedData, syncBlockStoreManager.referenceManager]);
32
41
 
@@ -2,13 +2,18 @@
2
2
  import "./SyncedBlockLoadingState.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
4
  import React from 'react';
5
+ import { useIntl } from 'react-intl-next';
6
+ import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
5
7
  import { SyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
8
+ import { fg } from '@atlaskit/platform-feature-flags';
6
9
  import { Box } from '@atlaskit/primitives/compiled';
7
10
  import Spinner from '@atlaskit/spinner';
8
11
  var styles = {
9
12
  wrapper: "_1tkevbgk _1e0c1txw _1bah1h6o _4cvr1h6o"
10
13
  };
11
14
  export var SyncedBlockLoadingState = function SyncedBlockLoadingState() {
15
+ var _useIntl = useIntl(),
16
+ formatMessage = _useIntl.formatMessage;
12
17
  return (
13
18
  /*#__PURE__*/
14
19
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides
@@ -18,7 +23,7 @@ export var SyncedBlockLoadingState = function SyncedBlockLoadingState() {
18
23
  xcss: styles.wrapper
19
24
  }, /*#__PURE__*/React.createElement(Spinner, {
20
25
  size: "small",
21
- label: "Loading synced content"
26
+ label: fg('platform_synced_block_patch_4') ? formatMessage(messages.loadingSyncedContent) : 'Loading synced content'
22
27
  })))
23
28
  );
24
29
  };
@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  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; }
4
4
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
5
- import React, { useMemo } from 'react';
5
+ import React, { useEffect, useMemo } from 'react';
6
6
  import { isSSR } from '@atlaskit/editor-common/core-utils';
7
- import { SyncBlockSharedCssClassName, SyncBlockRendererDataAttributeName } from '@atlaskit/editor-common/sync-block';
7
+ import { SyncBlockSharedCssClassName, SyncBlockRendererDataAttributeName, handleSSRErrorsAnalytics } from '@atlaskit/editor-common/sync-block';
8
8
  import { SyncBlockError, useFetchSyncBlockData } from '@atlaskit/editor-synced-block-provider';
9
9
  import { fg } from '@atlaskit/platform-feature-flags';
10
10
  import { AKRendererWrapper } from './AKRendererWrapper';
@@ -18,6 +18,15 @@ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentR
18
18
  var resourceId = nodeProps.resourceId,
19
19
  localId = nodeProps.localId,
20
20
  fireAnalyticsEvent = nodeProps.fireAnalyticsEvent;
21
+ useEffect(function () {
22
+ var timeoutId = setTimeout(function () {
23
+ handleSSRErrorsAnalytics(fireAnalyticsEvent);
24
+ }, 0);
25
+ return function () {
26
+ clearTimeout(timeoutId);
27
+ };
28
+ // eslint-disable-next-line react-hooks/exhaustive-deps
29
+ }, []);
21
30
  syncBlockStoreManager.referenceManager.updateFireAnalyticsEvent(fireAnalyticsEvent);
22
31
  var _useFetchSyncBlockDat = useFetchSyncBlockData(syncBlockStoreManager, resourceId, localId, fireAnalyticsEvent),
23
32
  syncBlockInstance = _useFetchSyncBlockDat.syncBlockInstance,
@@ -12,6 +12,7 @@ import { useSyncBlockActions } from '@atlaskit/editor-common/sync-block';
12
12
  import CrossIcon from '@atlaskit/icon/core/cross';
13
13
  import EyeOpenStrikethroughIcon from '@atlaskit/icon/core/eye-open-strikethrough';
14
14
  import LinkBrokenIcon from '@atlaskit/icon/core/link-broken';
15
+ import { fg } from '@atlaskit/platform-feature-flags';
15
16
  import { Anchor, Box } from '@atlaskit/primitives/compiled';
16
17
  import Spinner from '@atlaskit/spinner';
17
18
  import { SyncedBlockErrorStateCard } from './SyncedBlockErrorStateCard';
@@ -39,6 +40,7 @@ var errorMap = {
39
40
  }
40
41
  };
41
42
  var useErrorInfo = function useErrorInfo(reason, url, title) {
43
+ var _errorMap;
42
44
  var _useIntl = useIntl(),
43
45
  formatMessage = _useIntl.formatMessage;
44
46
  if (reason === 'source-document-deleted') {
@@ -59,9 +61,9 @@ var useErrorInfo = function useErrorInfo(reason, url, title) {
59
61
  icon: _icon2
60
62
  };
61
63
  }
62
- var _errorMap = errorMap[reason || 'generic'],
63
- icon = _errorMap.icon,
64
- description = _errorMap.description;
64
+ var _ref = fg('platform_synced_block_patch_4') ? (_errorMap = errorMap[reason || 'generic']) !== null && _errorMap !== void 0 ? _errorMap : errorMap['generic'] : errorMap[reason || 'generic'],
65
+ icon = _ref.icon,
66
+ description = _ref.description;
65
67
  return {
66
68
  description: formatMessage(description, {
67
69
  title: title,
@@ -69,6 +71,7 @@ var useErrorInfo = function useErrorInfo(reason, url, title) {
69
71
  return /*#__PURE__*/React.createElement(Anchor, {
70
72
  href: url,
71
73
  target: "_blank",
74
+ rel: fg('platform_synced_block_patch_4') ? 'noopener noreferrer' : undefined,
72
75
  xcss: styles.link
73
76
  }, chunk);
74
77
  }
@@ -76,14 +79,14 @@ var useErrorInfo = function useErrorInfo(reason, url, title) {
76
79
  icon: icon
77
80
  };
78
81
  };
79
- export var SyncedBlockNotFoundError = function SyncedBlockNotFoundError(_ref) {
82
+ export var SyncedBlockNotFoundError = function SyncedBlockNotFoundError(_ref2) {
80
83
  var _useSyncBlockActions;
81
- var _ref$reason = _ref.reason,
82
- reason = _ref$reason === void 0 ? 'source-block-deleted' : _ref$reason,
83
- sourceAri = _ref.sourceAri;
84
- var _ref2 = (_useSyncBlockActions = useSyncBlockActions()) !== null && _useSyncBlockActions !== void 0 ? _useSyncBlockActions : {},
85
- deleteSyncBlock = _ref2.deleteSyncBlock,
86
- fetchSourceInfo = _ref2.fetchSourceInfo;
84
+ var _ref2$reason = _ref2.reason,
85
+ reason = _ref2$reason === void 0 ? 'source-block-deleted' : _ref2$reason,
86
+ sourceAri = _ref2.sourceAri;
87
+ var _ref3 = (_useSyncBlockActions = useSyncBlockActions()) !== null && _useSyncBlockActions !== void 0 ? _useSyncBlockActions : {},
88
+ deleteSyncBlock = _ref3.deleteSyncBlock,
89
+ fetchSourceInfo = _ref3.fetchSourceInfo;
87
90
  var _useState = useState(undefined),
88
91
  _useState2 = _slicedToArray(_useState, 2),
89
92
  sourceInfo = _useState2[0],
@@ -98,7 +101,7 @@ export var SyncedBlockNotFoundError = function SyncedBlockNotFoundError(_ref) {
98
101
  return;
99
102
  }
100
103
  var getSourceInfo = /*#__PURE__*/function () {
101
- var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
104
+ var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
102
105
  var sourceInfo;
103
106
  return _regeneratorRuntime.wrap(function _callee$(_context) {
104
107
  while (1) switch (_context.prev = _context.next) {
@@ -118,7 +121,7 @@ export var SyncedBlockNotFoundError = function SyncedBlockNotFoundError(_ref) {
118
121
  }, _callee);
119
122
  }));
120
123
  return function getSourceInfo() {
121
- return _ref3.apply(this, arguments);
124
+ return _ref4.apply(this, arguments);
122
125
  };
123
126
  }();
124
127
  getSourceInfo();
@@ -11,6 +11,7 @@ import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages'
11
11
  import Heading from '@atlaskit/heading';
12
12
  import StatusSuccessIcon from '@atlaskit/icon/core/status-success';
13
13
  import Image from '@atlaskit/image';
14
+ import { fg } from '@atlaskit/platform-feature-flags';
14
15
  import { Text, Flex, Stack, Box } from '@atlaskit/primitives/compiled';
15
16
  import PermissionDenied from './assets/PermissionDenied.svg';
16
17
  import { SyncedBlockGenericError } from './SyncedBlockGenericError';
@@ -75,7 +76,7 @@ var SyncedBlockPermissionDeniedConfluencePage = function SyncedBlockPermissionDe
75
76
  }, /*#__PURE__*/React.createElement(StatusSuccessIcon, {
76
77
  size: "small",
77
78
  color: "var(--ds-icon-subtle, #505258)",
78
- label: ""
79
+ label: fg('platform_synced_block_patch_4') ? formatMessage(messages.accessRequested) : ''
79
80
  }), /*#__PURE__*/React.createElement(Text, {
80
81
  color: "color.text.subtlest",
81
82
  weight: "bold",
@@ -1,9 +1,10 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  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; }
3
3
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
- import React, { memo, useMemo } from 'react';
4
+ import React, { memo, useEffect, useMemo } from 'react';
5
5
  import { isSSR } from '@atlaskit/editor-common/core-utils';
6
6
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
7
+ import { handleSSRErrorsAnalytics } from '@atlaskit/editor-common/sync-block';
7
8
  import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
8
9
  import { AKRendererWrapper } from './AKRendererWrapper';
9
10
  import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
@@ -13,14 +14,25 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
13
14
  var syncBlockRendererOptions = _ref.syncBlockRendererOptions,
14
15
  syncBlockFetchResult = _ref.syncBlockFetchResult,
15
16
  api = _ref.api;
17
+ useEffect(function () {
18
+ var timeoutId = setTimeout(function () {
19
+ var _api$analytics;
20
+ handleSSRErrorsAnalytics(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent);
21
+ }, 0);
22
+ return function () {
23
+ clearTimeout(timeoutId);
24
+ };
25
+ // eslint-disable-next-line react-hooks/exhaustive-deps
26
+ }, []);
16
27
  var isLoading = syncBlockFetchResult.isLoading,
17
28
  providerFactory = syncBlockFetchResult.providerFactory,
18
29
  reloadData = syncBlockFetchResult.reloadData,
19
30
  ssrProviders = syncBlockFetchResult.ssrProviders,
20
31
  syncBlockInstance = syncBlockFetchResult.syncBlockInstance;
32
+ var isSSRMode = isSSR();
21
33
  var rendererOptions = useMemo(function () {
22
34
  var _syncBlockRendererOpt, _ssrProviders$media;
23
- if (!isSSR() || syncBlockRendererOptions !== null && syncBlockRendererOptions !== void 0 && (_syncBlockRendererOpt = syncBlockRendererOptions.media) !== null && _syncBlockRendererOpt !== void 0 && _syncBlockRendererOpt.ssr ||
35
+ if (!isSSRMode || syncBlockRendererOptions !== null && syncBlockRendererOptions !== void 0 && (_syncBlockRendererOpt = syncBlockRendererOptions.media) !== null && _syncBlockRendererOpt !== void 0 && _syncBlockRendererOpt.ssr ||
24
36
  // already has ssr config
25
37
  !(ssrProviders !== null && ssrProviders !== void 0 && (_ssrProviders$media = ssrProviders.media) !== null && _ssrProviders$media !== void 0 && _ssrProviders$media.viewMediaClientConfig)) {
26
38
  return syncBlockRendererOptions;
@@ -34,7 +46,7 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
34
46
  ssr: mediaSSR
35
47
  })
36
48
  });
37
- }, [syncBlockRendererOptions, ssrProviders]);
49
+ }, [syncBlockRendererOptions, ssrProviders, isSSRMode]);
38
50
  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['connectivity'], function (_ref2) {
39
51
  var connectivityState = _ref2.connectivityState;
40
52
  return {
@@ -45,7 +57,7 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
45
57
 
46
58
  // Show offline error only when collaboration is offline and not in SSR mode
47
59
  // In SSR, we should always attempt to render content
48
- if (isCollabOffline && !isSSR()) {
60
+ if (isCollabOffline && !isSSRMode) {
49
61
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
50
62
  error: {
51
63
  type: SyncBlockError.Offline
@@ -58,11 +70,11 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
58
70
 
59
71
  // In SSR, if server returned error, we should render loading state instead of error state
60
72
  // since FE will do another fetch and render the error state or proper data then
61
- if (isSSR() && syncBlockInstance.error) {
73
+ if (isSSRMode && syncBlockInstance.error) {
62
74
  return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
63
75
  }
64
76
  if (syncBlockInstance.error || !syncBlockInstance.data || syncBlockInstance.data.status === 'deleted') {
65
- var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics;
77
+ var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics2;
66
78
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
67
79
  error: (_syncBlockInstance$er = syncBlockInstance.error) !== null && _syncBlockInstance$er !== void 0 ? _syncBlockInstance$er : (syncBlockInstance === null || syncBlockInstance === void 0 || (_syncBlockInstance$da = syncBlockInstance.data) === null || _syncBlockInstance$da === void 0 ? void 0 : _syncBlockInstance$da.status) === 'deleted' ? {
68
80
  type: SyncBlockError.NotFound
@@ -72,20 +84,20 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
72
84
  resourceId: syncBlockInstance.resourceId,
73
85
  onRetry: reloadData,
74
86
  isLoading: isLoading,
75
- fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent
87
+ fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
76
88
  });
77
89
  }
78
90
 
79
91
  // Check for unpublished status
80
92
  if (((_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
81
- var _syncBlockInstance$da3, _api$analytics2;
93
+ var _syncBlockInstance$da3, _api$analytics3;
82
94
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
83
95
  error: {
84
96
  type: SyncBlockError.Unpublished
85
97
  },
86
98
  resourceId: syncBlockInstance.resourceId,
87
99
  sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
88
- fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
100
+ fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent
89
101
  });
90
102
  }
91
103
  var syncBlockDoc = {
@@ -5,6 +5,7 @@ import React from 'react';
5
5
  import { useIntl } from 'react-intl-next';
6
6
  import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
7
7
  import EyeOpenStrikethroughIcon from '@atlaskit/icon/core/eye-open-strikethrough';
8
+ import { fg } from '@atlaskit/platform-feature-flags';
8
9
  import { Anchor, Text } from '@atlaskit/primitives/compiled';
9
10
  import { SyncedBlockErrorStateCard } from './SyncedBlockErrorStateCard';
10
11
  var styles = {
@@ -19,6 +20,7 @@ export var SyncedBlockUnpublishedError = function SyncedBlockUnpublishedError(_r
19
20
  return sourceURL ? /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(Anchor, {
20
21
  href: sourceURL,
21
22
  target: "_blank",
23
+ rel: fg('platform_synced_block_patch_4') ? 'noopener noreferrer' : undefined,
22
24
  xcss: styles.link
23
25
  }, chunks)) : chunks;
24
26
  }
@@ -3,6 +3,7 @@ import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
3
3
  import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
4
4
  import { SyncBlockActionsProvider } from '@atlaskit/editor-common/sync-block';
5
5
  import { convertSyncBlockJSONNodeToSyncBlockNode, useMemoizedSyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
6
+ import { fg } from '@atlaskit/platform-feature-flags';
6
7
  import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
7
8
  export var getSyncBlockNodesFromDoc = function getSyncBlockNodesFromDoc(doc) {
8
9
  var content = doc.content;
@@ -24,10 +25,18 @@ export var useMemoizedSyncedBlockNodeComponent = function useMemoizedSyncedBlock
24
25
 
25
26
  // Process prefetched data early, if available
26
27
  useEffect(function () {
27
- var prefetchedData;
28
28
  if (getPrefetchedData) {
29
- prefetchedData = getPrefetchedData();
30
- syncBlockStoreManager.referenceManager.processPrefetchedData(prefetchedData);
29
+ if (fg('platform_synced_block_patch_4')) {
30
+ try {
31
+ var prefetchedData = getPrefetchedData();
32
+ syncBlockStoreManager.referenceManager.processPrefetchedData(prefetchedData);
33
+ } catch (_unused) {
34
+ // Silently ignore errors from getPrefetchedData so the fetch effect can still run
35
+ }
36
+ } else {
37
+ var _prefetchedData = getPrefetchedData();
38
+ syncBlockStoreManager.referenceManager.processPrefetchedData(_prefetchedData);
39
+ }
31
40
  }
32
41
  }, [getPrefetchedData, syncBlockStoreManager.referenceManager]);
33
42
 
@@ -1,8 +1,7 @@
1
1
  import React from 'react';
2
- interface SyncedBlockNotFoundProps {
3
- contentId?: string;
2
+ interface SyncedBlockLoadErrorProps {
4
3
  isLoading?: boolean;
5
4
  onRetry?: () => void;
6
5
  }
7
- export declare const SyncedBlockLoadError: ({ onRetry, isLoading, }: SyncedBlockNotFoundProps) => React.JSX.Element;
6
+ export declare const SyncedBlockLoadError: ({ onRetry, isLoading, }: SyncedBlockLoadErrorProps) => React.JSX.Element;
8
7
  export {};
@@ -1,8 +1,7 @@
1
1
  import React from 'react';
2
- interface SyncedBlockNotFoundProps {
3
- contentId?: string;
2
+ interface SyncedBlockLoadErrorProps {
4
3
  isLoading?: boolean;
5
4
  onRetry?: () => void;
6
5
  }
7
- export declare const SyncedBlockLoadError: ({ onRetry, isLoading, }: SyncedBlockNotFoundProps) => React.JSX.Element;
6
+ export declare const SyncedBlockLoadError: ({ onRetry, isLoading, }: SyncedBlockLoadErrorProps) => React.JSX.Element;
8
7
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-synced-block-renderer",
3
- "version": "5.8.5",
3
+ "version": "5.9.1",
4
4
  "description": "SyncedBlockRenderer for @atlaskit/editor-plugin-synced-block",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -38,7 +38,7 @@
38
38
  "@atlaskit/image": "^3.0.0",
39
39
  "@atlaskit/platform-feature-flags": "^1.1.0",
40
40
  "@atlaskit/primitives": "^18.0.0",
41
- "@atlaskit/renderer": "^126.9.0",
41
+ "@atlaskit/renderer": "^126.12.0",
42
42
  "@atlaskit/spinner": "^19.0.0",
43
43
  "@atlaskit/tokens": "^11.0.0",
44
44
  "@atlaskit/tooltip": "^20.14.0",
@@ -48,7 +48,7 @@
48
48
  "relay-runtime": "npm:atl-relay-runtime@0.0.0-main-39e79f66"
49
49
  },
50
50
  "peerDependencies": {
51
- "@atlaskit/editor-common": "^111.16.0",
51
+ "@atlaskit/editor-common": "^111.19.0",
52
52
  "react": "^18.2.0",
53
53
  "react-intl-next": "npm:react-intl@^5.18.1"
54
54
  },
@@ -91,6 +91,9 @@
91
91
  "platform-feature-flags": {
92
92
  "platform_synced_block_patch_3": {
93
93
  "type": "boolean"
94
+ },
95
+ "platform_synced_block_patch_4": {
96
+ "type": "boolean"
94
97
  }
95
98
  }
96
99
  }