@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 +19 -0
- package/dist/cjs/ui/SyncedBlockLoadingState.js +6 -1
- package/dist/cjs/ui/SyncedBlockNodeComponentRenderer.js +9 -0
- package/dist/cjs/ui/SyncedBlockNotFoundError.js +15 -12
- package/dist/cjs/ui/SyncedBlockPermissionDenied.js +2 -1
- package/dist/cjs/ui/SyncedBlockRenderer.js +20 -8
- package/dist/cjs/ui/SyncedBlockUnpublishedError.js +2 -0
- package/dist/cjs/useSyncedBlockNodeComponent.js +12 -3
- package/dist/es2019/ui/SyncedBlockLoadingState.js +7 -1
- package/dist/es2019/ui/SyncedBlockNodeComponentRenderer.js +11 -2
- package/dist/es2019/ui/SyncedBlockNotFoundError.js +4 -1
- package/dist/es2019/ui/SyncedBlockPermissionDenied.js +2 -1
- package/dist/es2019/ui/SyncedBlockRenderer.js +21 -9
- package/dist/es2019/ui/SyncedBlockUnpublishedError.js +2 -0
- package/dist/es2019/useSyncedBlockNodeComponent.js +12 -3
- package/dist/esm/ui/SyncedBlockLoadingState.js +6 -1
- package/dist/esm/ui/SyncedBlockNodeComponentRenderer.js +11 -2
- package/dist/esm/ui/SyncedBlockNotFoundError.js +15 -12
- package/dist/esm/ui/SyncedBlockPermissionDenied.js +2 -1
- package/dist/esm/ui/SyncedBlockRenderer.js +21 -9
- package/dist/esm/ui/SyncedBlockUnpublishedError.js +2 -0
- package/dist/esm/useSyncedBlockNodeComponent.js +12 -3
- package/dist/types/ui/SyncedBlockLoadError.d.ts +2 -3
- package/dist/types-ts4.5/ui/SyncedBlockLoadError.d.ts +2 -3
- package/package.json +6 -3
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:
|
|
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 =
|
|
73
|
-
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(
|
|
91
|
+
var SyncedBlockNotFoundError = exports.SyncedBlockNotFoundError = function SyncedBlockNotFoundError(_ref2) {
|
|
89
92
|
var _useSyncBlockActions;
|
|
90
|
-
var
|
|
91
|
-
reason =
|
|
92
|
-
sourceAri =
|
|
93
|
-
var
|
|
94
|
-
deleteSyncBlock =
|
|
95
|
-
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
|
|
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
|
|
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 (!
|
|
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 && !
|
|
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 (
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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
|
-
|
|
38
|
-
|
|
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:
|
|
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 (!
|
|
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 && !
|
|
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 (
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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
|
-
|
|
29
|
-
|
|
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:
|
|
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 =
|
|
64
|
-
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(
|
|
82
|
+
export var SyncedBlockNotFoundError = function SyncedBlockNotFoundError(_ref2) {
|
|
80
83
|
var _useSyncBlockActions;
|
|
81
|
-
var
|
|
82
|
-
reason =
|
|
83
|
-
sourceAri =
|
|
84
|
-
var
|
|
85
|
-
deleteSyncBlock =
|
|
86
|
-
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
|
|
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
|
|
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 (!
|
|
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 && !
|
|
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 (
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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
|
-
|
|
30
|
-
|
|
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
|
|
3
|
-
contentId?: string;
|
|
2
|
+
interface SyncedBlockLoadErrorProps {
|
|
4
3
|
isLoading?: boolean;
|
|
5
4
|
onRetry?: () => void;
|
|
6
5
|
}
|
|
7
|
-
export declare const SyncedBlockLoadError: ({ onRetry, isLoading, }:
|
|
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
|
|
3
|
-
contentId?: string;
|
|
2
|
+
interface SyncedBlockLoadErrorProps {
|
|
4
3
|
isLoading?: boolean;
|
|
5
4
|
onRetry?: () => void;
|
|
6
5
|
}
|
|
7
|
-
export declare const SyncedBlockLoadError: ({ onRetry, isLoading, }:
|
|
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.
|
|
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.
|
|
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.
|
|
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
|
}
|