@atlaskit/editor-synced-block-renderer 5.4.1 → 5.6.0

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.
Files changed (11) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/cjs/ui/SyncedBlockErrorComponent.js +1 -0
  3. package/dist/cjs/ui/SyncedBlockNodeComponentRenderer.js +26 -3
  4. package/dist/cjs/ui/SyncedBlockRenderer.js +6 -3
  5. package/dist/es2019/ui/SyncedBlockErrorComponent.js +1 -0
  6. package/dist/es2019/ui/SyncedBlockNodeComponentRenderer.js +24 -3
  7. package/dist/es2019/ui/SyncedBlockRenderer.js +6 -3
  8. package/dist/esm/ui/SyncedBlockErrorComponent.js +1 -0
  9. package/dist/esm/ui/SyncedBlockNodeComponentRenderer.js +24 -3
  10. package/dist/esm/ui/SyncedBlockRenderer.js +6 -3
  11. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # @atlaskit/editor-synced-block-renderer
2
2
 
3
+ ## 5.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`f998026c7a01a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f998026c7a01a) -
8
+ EDITOR-2849 fix editor SSR
9
+
10
+ ## 5.5.0
11
+
12
+ ### Minor Changes
13
+
14
+ - [`10cc4958a1511`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/10cc4958a1511) -
15
+ EDITOR-2849 add media ssr options to renderer
16
+
3
17
  ## 5.4.1
4
18
 
5
19
  ### Patch Changes
package/dist/cjs/ui/SyncedBlockErrorComponent.js CHANGED
@@ -64,6 +64,7 @@ var SyncedBlockErrorComponent = exports.SyncedBlockErrorComponent = function Syn
64
64
  /*#__PURE__*/
65
65
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
66
66
  _react.default.createElement("div", {
67
+ "data-testid": "sync-block-error",
67
68
  className: _syncBlock.SyncBlockSharedCssClassName.error
68
69
  }, getErrorContent)
69
70
  );
package/dist/cjs/ui/SyncedBlockNodeComponentRenderer.js CHANGED
@@ -1,19 +1,24 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _typeof = require("@babel/runtime/helpers/typeof");
4
5
  Object.defineProperty(exports, "__esModule", {
5
6
  value: true
6
7
  });
7
8
  exports.SyncedBlockNodeComponentRenderer = void 0;
8
9
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
- var _react = _interopRequireDefault(require("react"));
11
+ var _react = _interopRequireWildcard(require("react"));
12
+ var _coreUtils = require("@atlaskit/editor-common/core-utils");
11
13
  var _syncBlock = require("@atlaskit/editor-common/sync-block");
12
14
  var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
13
15
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
14
16
  var _AKRendererWrapper = require("./AKRendererWrapper");
15
17
  var _SyncedBlockErrorComponent = require("./SyncedBlockErrorComponent");
16
18
  var _SyncedBlockLoadingState = require("./SyncedBlockLoadingState");
19
+ 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); }
20
+ 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; }
21
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
17
22
  var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentRenderer(_ref) {
18
23
  var nodeProps = _ref.nodeProps,
19
24
  syncBlockStoreManager = _ref.syncBlockStoreManager,
@@ -26,7 +31,25 @@ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer
26
31
  syncBlockInstance = _useFetchSyncBlockDat.syncBlockInstance,
27
32
  isLoading = _useFetchSyncBlockDat.isLoading,
28
33
  reloadData = _useFetchSyncBlockDat.reloadData,
29
- providerFactory = _useFetchSyncBlockDat.providerFactory;
34
+ providerFactory = _useFetchSyncBlockDat.providerFactory,
35
+ ssrProviders = _useFetchSyncBlockDat.ssrProviders;
36
+ var finalRendererOptions = (0, _react.useMemo)(function () {
37
+ var _rendererOptions$medi, _ssrProviders$media;
38
+ if (!(0, _coreUtils.isSSR)() || rendererOptions !== null && rendererOptions !== void 0 && (_rendererOptions$medi = rendererOptions.media) !== null && _rendererOptions$medi !== void 0 && _rendererOptions$medi.ssr ||
39
+ // already has ssr config
40
+ !(ssrProviders !== null && ssrProviders !== void 0 && (_ssrProviders$media = ssrProviders.media) !== null && _ssrProviders$media !== void 0 && _ssrProviders$media.viewMediaClientConfig) || !(0, _platformFeatureFlags.fg)('platform_synced_block_dogfooding')) {
41
+ return rendererOptions;
42
+ }
43
+ var mediaSSR = {
44
+ mode: 'server',
45
+ config: ssrProviders === null || ssrProviders === void 0 ? void 0 : ssrProviders.media.viewMediaClientConfig
46
+ };
47
+ return _objectSpread(_objectSpread({}, rendererOptions), {}, {
48
+ media: _objectSpread(_objectSpread({}, (rendererOptions === null || rendererOptions === void 0 ? void 0 : rendererOptions.media) || {}), {}, {
49
+ ssr: mediaSSR
50
+ })
51
+ });
52
+ }, [rendererOptions, ssrProviders]);
30
53
  if (isLoading && !syncBlockInstance) {
31
54
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
32
55
  }
@@ -52,6 +75,6 @@ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer
52
75
  }, (0, _defineProperty2.default)({}, _syncBlock.SyncBlockRendererDataAttributeName, true)), /*#__PURE__*/_react.default.createElement(_AKRendererWrapper.AKRendererWrapper, {
53
76
  doc: syncBlockDoc,
54
77
  dataProviders: providerFactory,
55
- options: rendererOptions
78
+ options: finalRendererOptions
56
79
  }));
57
80
  };
package/dist/cjs/ui/SyncedBlockRenderer.js CHANGED
@@ -47,11 +47,14 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
47
47
  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['connectivity'], function (_ref2) {
48
48
  var connectivityState = _ref2.connectivityState;
49
49
  return {
50
- isInternetOffline: (connectivityState === null || connectivityState === void 0 ? void 0 : connectivityState.mode) === 'collab-offline'
50
+ isCollabOffline: (connectivityState === null || connectivityState === void 0 ? void 0 : connectivityState.mode) === 'collab-offline'
51
51
  };
52
52
  }),
53
- isInternetOffline = _useSharedPluginState.isInternetOffline;
54
- if (isInternetOffline) {
53
+ isCollabOffline = _useSharedPluginState.isCollabOffline;
54
+
55
+ // Show offline error only when collaboration is offline and not in SSR mode
56
+ // In SSR, we should always attempt to render content
57
+ if (isCollabOffline && !(0, _coreUtils.isSSR)()) {
55
58
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
56
59
  error: _editorSyncedBlockProvider.SyncBlockError.Offline
57
60
  });
package/dist/es2019/ui/SyncedBlockErrorComponent.js CHANGED
@@ -58,6 +58,7 @@ export const SyncedBlockErrorComponent = ({
58
58
  /*#__PURE__*/
59
59
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
60
60
  React.createElement("div", {
61
+ "data-testid": "sync-block-error",
61
62
  className: SyncBlockSharedCssClassName.error
62
63
  }, getErrorContent)
63
64
  );
package/dist/es2019/ui/SyncedBlockNodeComponentRenderer.js CHANGED
@@ -1,4 +1,5 @@
1
- import React from 'react';
1
+ import React, { useMemo } from 'react';
2
+ import { isSSR } from '@atlaskit/editor-common/core-utils';
2
3
  import { SyncBlockSharedCssClassName, SyncBlockRendererDataAttributeName } from '@atlaskit/editor-common/sync-block';
3
4
  import { SyncBlockError, useFetchSyncBlockData } from '@atlaskit/editor-synced-block-provider';
4
5
  import { fg } from '@atlaskit/platform-feature-flags';
@@ -20,8 +21,28 @@ export const SyncedBlockNodeComponentRenderer = ({
20
21
  syncBlockInstance,
21
22
  isLoading,
22
23
  reloadData,
23
- providerFactory
24
+ providerFactory,
25
+ ssrProviders
24
26
  } = useFetchSyncBlockData(syncBlockStoreManager, resourceId, localId, fireAnalyticsEvent);
27
+ const finalRendererOptions = useMemo(() => {
28
+ var _rendererOptions$medi, _ssrProviders$media;
29
+ if (!isSSR() || rendererOptions !== null && rendererOptions !== void 0 && (_rendererOptions$medi = rendererOptions.media) !== null && _rendererOptions$medi !== void 0 && _rendererOptions$medi.ssr ||
30
+ // already has ssr config
31
+ !(ssrProviders !== null && ssrProviders !== void 0 && (_ssrProviders$media = ssrProviders.media) !== null && _ssrProviders$media !== void 0 && _ssrProviders$media.viewMediaClientConfig) || !fg('platform_synced_block_dogfooding')) {
32
+ return rendererOptions;
33
+ }
34
+ const mediaSSR = {
35
+ mode: 'server',
36
+ config: ssrProviders === null || ssrProviders === void 0 ? void 0 : ssrProviders.media.viewMediaClientConfig
37
+ };
38
+ return {
39
+ ...rendererOptions,
40
+ media: {
41
+ ...((rendererOptions === null || rendererOptions === void 0 ? void 0 : rendererOptions.media) || {}),
42
+ ssr: mediaSSR
43
+ }
44
+ };
45
+ }, [rendererOptions, ssrProviders]);
25
46
  if (isLoading && !syncBlockInstance) {
26
47
  return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
27
48
  }
@@ -49,6 +70,6 @@ export const SyncedBlockNodeComponentRenderer = ({
49
70
  }, /*#__PURE__*/React.createElement(AKRendererWrapper, {
50
71
  doc: syncBlockDoc,
51
72
  dataProviders: providerFactory,
52
- options: rendererOptions
73
+ options: finalRendererOptions
53
74
  }));
54
75
  };
package/dist/es2019/ui/SyncedBlockRenderer.js CHANGED
@@ -38,13 +38,16 @@ const SyncedBlockRendererComponent = ({
38
38
  };
39
39
  }, [syncBlockRendererOptions, ssrProviders]);
40
40
  const {
41
- isInternetOffline
41
+ isCollabOffline
42
42
  } = useSharedPluginStateWithSelector(api, ['connectivity'], ({
43
43
  connectivityState
44
44
  }) => ({
45
- isInternetOffline: (connectivityState === null || connectivityState === void 0 ? void 0 : connectivityState.mode) === 'collab-offline'
45
+ isCollabOffline: (connectivityState === null || connectivityState === void 0 ? void 0 : connectivityState.mode) === 'collab-offline'
46
46
  }));
47
- if (isInternetOffline) {
47
+
48
+ // Show offline error only when collaboration is offline and not in SSR mode
49
+ // In SSR, we should always attempt to render content
50
+ if (isCollabOffline && !isSSR()) {
48
51
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
49
52
  error: SyncBlockError.Offline
50
53
  });
package/dist/esm/ui/SyncedBlockErrorComponent.js CHANGED
@@ -56,6 +56,7 @@ export var SyncedBlockErrorComponent = function SyncedBlockErrorComponent(_ref)
56
56
  /*#__PURE__*/
57
57
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
58
58
  React.createElement("div", {
59
+ "data-testid": "sync-block-error",
59
60
  className: SyncBlockSharedCssClassName.error
60
61
  }, getErrorContent)
61
62
  );
package/dist/esm/ui/SyncedBlockNodeComponentRenderer.js CHANGED
@@ -1,6 +1,9 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
- import React from 'react';
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
+ 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';
6
+ import { isSSR } from '@atlaskit/editor-common/core-utils';
4
7
  import { SyncBlockSharedCssClassName, SyncBlockRendererDataAttributeName } from '@atlaskit/editor-common/sync-block';
5
8
  import { SyncBlockError, useFetchSyncBlockData } from '@atlaskit/editor-synced-block-provider';
6
9
  import { fg } from '@atlaskit/platform-feature-flags';
@@ -19,7 +22,25 @@ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentR
19
22
  syncBlockInstance = _useFetchSyncBlockDat.syncBlockInstance,
20
23
  isLoading = _useFetchSyncBlockDat.isLoading,
21
24
  reloadData = _useFetchSyncBlockDat.reloadData,
22
- providerFactory = _useFetchSyncBlockDat.providerFactory;
25
+ providerFactory = _useFetchSyncBlockDat.providerFactory,
26
+ ssrProviders = _useFetchSyncBlockDat.ssrProviders;
27
+ var finalRendererOptions = useMemo(function () {
28
+ var _rendererOptions$medi, _ssrProviders$media;
29
+ if (!isSSR() || rendererOptions !== null && rendererOptions !== void 0 && (_rendererOptions$medi = rendererOptions.media) !== null && _rendererOptions$medi !== void 0 && _rendererOptions$medi.ssr ||
30
+ // already has ssr config
31
+ !(ssrProviders !== null && ssrProviders !== void 0 && (_ssrProviders$media = ssrProviders.media) !== null && _ssrProviders$media !== void 0 && _ssrProviders$media.viewMediaClientConfig) || !fg('platform_synced_block_dogfooding')) {
32
+ return rendererOptions;
33
+ }
34
+ var mediaSSR = {
35
+ mode: 'server',
36
+ config: ssrProviders === null || ssrProviders === void 0 ? void 0 : ssrProviders.media.viewMediaClientConfig
37
+ };
38
+ return _objectSpread(_objectSpread({}, rendererOptions), {}, {
39
+ media: _objectSpread(_objectSpread({}, (rendererOptions === null || rendererOptions === void 0 ? void 0 : rendererOptions.media) || {}), {}, {
40
+ ssr: mediaSSR
41
+ })
42
+ });
43
+ }, [rendererOptions, ssrProviders]);
23
44
  if (isLoading && !syncBlockInstance) {
24
45
  return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
25
46
  }
@@ -45,6 +66,6 @@ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentR
45
66
  }, _defineProperty({}, SyncBlockRendererDataAttributeName, true)), /*#__PURE__*/React.createElement(AKRendererWrapper, {
46
67
  doc: syncBlockDoc,
47
68
  dataProviders: providerFactory,
48
- options: rendererOptions
69
+ options: finalRendererOptions
49
70
  }));
50
71
  };
package/dist/esm/ui/SyncedBlockRenderer.js CHANGED
@@ -38,11 +38,14 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
38
38
  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['connectivity'], function (_ref2) {
39
39
  var connectivityState = _ref2.connectivityState;
40
40
  return {
41
- isInternetOffline: (connectivityState === null || connectivityState === void 0 ? void 0 : connectivityState.mode) === 'collab-offline'
41
+ isCollabOffline: (connectivityState === null || connectivityState === void 0 ? void 0 : connectivityState.mode) === 'collab-offline'
42
42
  };
43
43
  }),
44
- isInternetOffline = _useSharedPluginState.isInternetOffline;
45
- if (isInternetOffline) {
44
+ isCollabOffline = _useSharedPluginState.isCollabOffline;
45
+
46
+ // Show offline error only when collaboration is offline and not in SSR mode
47
+ // In SSR, we should always attempt to render content
48
+ if (isCollabOffline && !isSSR()) {
46
49
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
47
50
  error: SyncBlockError.Offline
48
51
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-synced-block-renderer",
3
- "version": "5.4.1",
3
+ "version": "5.6.0",
4
4
  "description": "SyncedBlockRenderer for @atlaskit/editor-plugin-synced-block",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -31,7 +31,7 @@
31
31
  "@atlaskit/button": "^23.9.0",
32
32
  "@atlaskit/css": "^0.19.0",
33
33
  "@atlaskit/editor-plugin-synced-block": "^5.3.0",
34
- "@atlaskit/editor-synced-block-provider": "^3.13.0",
34
+ "@atlaskit/editor-synced-block-provider": "^3.14.0",
35
35
  "@atlaskit/heading": "^5.2.0",
36
36
  "@atlaskit/icon": "^30.0.0",
37
37
  "@atlaskit/icon-lab": "^5.14.0",