@atlaskit/editor-synced-block-renderer 5.8.4 → 5.9.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/editor-synced-block-renderer
2
2
 
3
+ ## 5.9.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`1a363f7706a2f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1a363f7706a2f) -
8
+ EDITOR-4193 add anaytics for ssr errors
9
+
10
+ ### Patch Changes
11
+
12
+ - Updated dependencies
13
+
14
+ ## 5.8.5
15
+
16
+ ### Patch Changes
17
+
18
+ - [`e794387202d1b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e794387202d1b) -
19
+ EDITOR-4824 add analytics event whenever sync block error component is first shown
20
+ - Updated dependencies
21
+
3
22
  ## 5.8.4
4
23
 
5
24
  ### Patch Changes
@@ -6,9 +6,11 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.SyncedBlockErrorComponent = void 0;
8
8
  var _react = _interopRequireWildcard(require("react"));
9
+ var _analytics = require("@atlaskit/editor-common/analytics");
9
10
  var _monitoring = require("@atlaskit/editor-common/monitoring");
10
11
  var _syncBlock = require("@atlaskit/editor-common/sync-block");
11
12
  var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
13
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
12
14
  var _SyncedBlockGenericError = require("./SyncedBlockGenericError");
13
15
  var _SyncedBlockLoadError = require("./SyncedBlockLoadError");
14
16
  var _SyncedBlockNotFoundError = require("./SyncedBlockNotFoundError");
@@ -43,6 +45,21 @@ var SyncedBlockErrorComponent = exports.SyncedBlockErrorComponent = function Syn
43
45
  resourceId = _ref.resourceId,
44
46
  fireAnalyticsEvent = _ref.fireAnalyticsEvent,
45
47
  sourceURL = _ref.sourceURL;
48
+ (0, _react.useEffect)(function () {
49
+ if (!(0, _platformFeatureFlags.fg)('platform_synced_block_patch_3')) {
50
+ return;
51
+ }
52
+ fireAnalyticsEvent === null || fireAnalyticsEvent === void 0 || fireAnalyticsEvent({
53
+ action: _analytics.ACTION.ERROR,
54
+ actionSubject: _analytics.ACTION_SUBJECT.SYNCED_BLOCK,
55
+ actionSubjectId: _analytics.ACTION_SUBJECT_ID.SYNCED_BLOCK_FETCH,
56
+ attributes: {
57
+ error: "".concat((error === null || error === void 0 ? void 0 : error.reason) || (error === null || error === void 0 ? void 0 : error.type), ": error component rendered"),
58
+ resourceId: resourceId
59
+ },
60
+ eventType: _analytics.EVENT_TYPE.OPERATIONAL
61
+ });
62
+ }, [error === null || error === void 0 ? void 0 : error.reason, error === null || error === void 0 ? void 0 : error.type, resourceId, fireAnalyticsEvent]);
46
63
  var getErrorContent = (0, _react.useMemo)(function () {
47
64
  switch (error === null || error === void 0 ? void 0 : error.type) {
48
65
  case _editorSyncedBlockProvider.SyncBlockError.Offline:
@@ -12,6 +12,7 @@ var _react = _interopRequireWildcard(require("react"));
12
12
  var _coreUtils = require("@atlaskit/editor-common/core-utils");
13
13
  var _syncBlock = require("@atlaskit/editor-common/sync-block");
14
14
  var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
15
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
16
  var _AKRendererWrapper = require("./AKRendererWrapper");
16
17
  var _SyncedBlockErrorComponent = require("./SyncedBlockErrorComponent");
17
18
  var _SyncedBlockLoadingState = require("./SyncedBlockLoadingState");
@@ -19,13 +20,22 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
19
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; }
20
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; }
21
22
  var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentRenderer(_ref) {
22
- var _syncBlockInstance$da2;
23
+ var _syncBlockInstance$da4;
23
24
  var nodeProps = _ref.nodeProps,
24
25
  syncBlockStoreManager = _ref.syncBlockStoreManager,
25
26
  rendererOptions = _ref.rendererOptions;
26
27
  var resourceId = nodeProps.resourceId,
27
28
  localId = nodeProps.localId,
28
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
+ }, []);
29
39
  syncBlockStoreManager.referenceManager.updateFireAnalyticsEvent(fireAnalyticsEvent);
30
40
  var _useFetchSyncBlockDat = (0, _editorSyncedBlockProvider.useFetchSyncBlockData)(syncBlockStoreManager, resourceId, localId, fireAnalyticsEvent),
31
41
  syncBlockInstance = _useFetchSyncBlockDat.syncBlockInstance,
@@ -60,9 +70,16 @@ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer
60
70
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
61
71
  }
62
72
  if (!resourceId || syncBlockInstance !== null && syncBlockInstance !== void 0 && syncBlockInstance.error || !(syncBlockInstance !== null && syncBlockInstance !== void 0 && syncBlockInstance.data) || syncBlockInstance.data.status === 'deleted') {
63
- var _syncBlockInstance$er, _syncBlockInstance$da;
73
+ var _syncBlockInstance$er, _syncBlockInstance$da, _syncBlockInstance$da2, _syncBlockInstance$er2, _syncBlockInstance$da3;
74
+ var errorMessage = (_syncBlockInstance$er = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : 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' ? {
75
+ type: _editorSyncedBlockProvider.SyncBlockError.NotFound,
76
+ reason: (_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.deletionReason
77
+ } : {
78
+ type: _editorSyncedBlockProvider.SyncBlockError.Errored,
79
+ reason: !resourceId ? 'missing resource id' : "missing data for block ".concat(resourceId)
80
+ };
64
81
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
65
- error: (_syncBlockInstance$er = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : 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' ? {
82
+ error: (0, _platformFeatureFlags.fg)('platform_synced_block_patch_3') ? errorMessage : (_syncBlockInstance$er2 = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.error) !== null && _syncBlockInstance$er2 !== void 0 ? _syncBlockInstance$er2 : (syncBlockInstance === null || syncBlockInstance === void 0 || (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.status) === 'deleted' ? {
66
83
  type: _editorSyncedBlockProvider.SyncBlockError.NotFound
67
84
  } : {
68
85
  type: _editorSyncedBlockProvider.SyncBlockError.Errored
@@ -73,14 +90,14 @@ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer
73
90
  fireAnalyticsEvent: fireAnalyticsEvent
74
91
  });
75
92
  }
76
- if ((syncBlockInstance === null || syncBlockInstance === void 0 || (_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
77
- var _syncBlockInstance$da3;
93
+ if ((syncBlockInstance === null || syncBlockInstance === void 0 || (_syncBlockInstance$da4 = syncBlockInstance.data) === null || _syncBlockInstance$da4 === void 0 ? void 0 : _syncBlockInstance$da4.status) === 'unpublished') {
94
+ var _syncBlockInstance$da5;
78
95
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
79
96
  error: {
80
97
  type: _editorSyncedBlockProvider.SyncBlockError.Unpublished
81
98
  },
82
99
  resourceId: syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.resourceId,
83
- sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
100
+ sourceURL: (_syncBlockInstance$da5 = syncBlockInstance.data) === null || _syncBlockInstance$da5 === void 0 ? void 0 : _syncBlockInstance$da5.sourceURL,
84
101
  fireAnalyticsEvent: fireAnalyticsEvent
85
102
  });
86
103
  }
@@ -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,6 +23,16 @@ 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,
@@ -71,7 +82,7 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
71
82
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
72
83
  }
73
84
  if (syncBlockInstance.error || !syncBlockInstance.data || syncBlockInstance.data.status === 'deleted') {
74
- var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics;
85
+ var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics2;
75
86
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
76
87
  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
88
  type: _editorSyncedBlockProvider.SyncBlockError.NotFound
@@ -81,20 +92,20 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
81
92
  resourceId: syncBlockInstance.resourceId,
82
93
  onRetry: reloadData,
83
94
  isLoading: isLoading,
84
- fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent
95
+ fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
85
96
  });
86
97
  }
87
98
 
88
99
  // Check for unpublished status
89
100
  if (((_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
90
- var _syncBlockInstance$da3, _api$analytics2;
101
+ var _syncBlockInstance$da3, _api$analytics3;
91
102
  return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
92
103
  error: {
93
104
  type: _editorSyncedBlockProvider.SyncBlockError.Unpublished
94
105
  },
95
106
  resourceId: syncBlockInstance.resourceId,
96
107
  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
108
+ fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent
98
109
  });
99
110
  }
100
111
  var syncBlockDoc = {
@@ -1,7 +1,9 @@
1
- import React, { useMemo } from 'react';
1
+ import React, { useMemo, useEffect } from 'react';
2
+ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
2
3
  import { logException } from '@atlaskit/editor-common/monitoring';
3
4
  import { SyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
4
5
  import { fetchErrorPayload, getContentIdAndProductFromResourceId, SyncBlockError } from '@atlaskit/editor-synced-block-provider';
6
+ import { fg } from '@atlaskit/platform-feature-flags';
5
7
  import { SyncedBlockGenericError } from './SyncedBlockGenericError';
6
8
  import { SyncedBlockLoadError } from './SyncedBlockLoadError';
7
9
  import { SyncedBlockNotFoundError } from './SyncedBlockNotFoundError';
@@ -37,6 +39,21 @@ export const SyncedBlockErrorComponent = ({
37
39
  fireAnalyticsEvent,
38
40
  sourceURL
39
41
  }) => {
42
+ useEffect(() => {
43
+ if (!fg('platform_synced_block_patch_3')) {
44
+ return;
45
+ }
46
+ fireAnalyticsEvent === null || fireAnalyticsEvent === void 0 ? void 0 : fireAnalyticsEvent({
47
+ action: ACTION.ERROR,
48
+ actionSubject: ACTION_SUBJECT.SYNCED_BLOCK,
49
+ actionSubjectId: ACTION_SUBJECT_ID.SYNCED_BLOCK_FETCH,
50
+ attributes: {
51
+ error: `${(error === null || error === void 0 ? void 0 : error.reason) || (error === null || error === void 0 ? void 0 : error.type)}: error component rendered`,
52
+ resourceId: resourceId
53
+ },
54
+ eventType: EVENT_TYPE.OPERATIONAL
55
+ });
56
+ }, [error === null || error === void 0 ? void 0 : error.reason, error === null || error === void 0 ? void 0 : error.type, resourceId, fireAnalyticsEvent]);
40
57
  const getErrorContent = useMemo(() => {
41
58
  switch (error === null || error === void 0 ? void 0 : error.type) {
42
59
  case SyncBlockError.Offline:
@@ -1,7 +1,8 @@
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
+ import { fg } from '@atlaskit/platform-feature-flags';
5
6
  import { AKRendererWrapper } from './AKRendererWrapper';
6
7
  import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
7
8
  import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
@@ -10,12 +11,21 @@ export const SyncedBlockNodeComponentRenderer = ({
10
11
  syncBlockStoreManager,
11
12
  rendererOptions
12
13
  }) => {
13
- var _syncBlockInstance$da2;
14
+ var _syncBlockInstance$da4;
14
15
  const {
15
16
  resourceId,
16
17
  localId,
17
18
  fireAnalyticsEvent
18
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
+ }, []);
19
29
  syncBlockStoreManager.referenceManager.updateFireAnalyticsEvent(fireAnalyticsEvent);
20
30
  const {
21
31
  syncBlockInstance,
@@ -53,9 +63,16 @@ export const SyncedBlockNodeComponentRenderer = ({
53
63
  return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
54
64
  }
55
65
  if (!resourceId || syncBlockInstance !== null && syncBlockInstance !== void 0 && syncBlockInstance.error || !(syncBlockInstance !== null && syncBlockInstance !== void 0 && syncBlockInstance.data) || syncBlockInstance.data.status === 'deleted') {
56
- var _syncBlockInstance$er, _syncBlockInstance$da;
66
+ var _syncBlockInstance$er, _syncBlockInstance$da, _syncBlockInstance$da2, _syncBlockInstance$er2, _syncBlockInstance$da3;
67
+ const errorMessage = (_syncBlockInstance$er = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : 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' ? {
68
+ type: SyncBlockError.NotFound,
69
+ reason: (_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.deletionReason
70
+ } : {
71
+ type: SyncBlockError.Errored,
72
+ reason: !resourceId ? 'missing resource id' : `missing data for block ${resourceId}`
73
+ };
57
74
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
58
- error: (_syncBlockInstance$er = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : 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' ? {
75
+ error: fg('platform_synced_block_patch_3') ? errorMessage : (_syncBlockInstance$er2 = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.error) !== null && _syncBlockInstance$er2 !== void 0 ? _syncBlockInstance$er2 : (syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.status) === 'deleted' ? {
59
76
  type: SyncBlockError.NotFound
60
77
  } : {
61
78
  type: SyncBlockError.Errored
@@ -66,14 +83,14 @@ export const SyncedBlockNodeComponentRenderer = ({
66
83
  fireAnalyticsEvent: fireAnalyticsEvent
67
84
  });
68
85
  }
69
- if ((syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : (_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
70
- var _syncBlockInstance$da3;
86
+ if ((syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : (_syncBlockInstance$da4 = syncBlockInstance.data) === null || _syncBlockInstance$da4 === void 0 ? void 0 : _syncBlockInstance$da4.status) === 'unpublished') {
87
+ var _syncBlockInstance$da5;
71
88
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
72
89
  error: {
73
90
  type: SyncBlockError.Unpublished
74
91
  },
75
92
  resourceId: syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.resourceId,
76
- sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
93
+ sourceURL: (_syncBlockInstance$da5 = syncBlockInstance.data) === null || _syncBlockInstance$da5 === void 0 ? void 0 : _syncBlockInstance$da5.sourceURL,
77
94
  fireAnalyticsEvent: fireAnalyticsEvent
78
95
  });
79
96
  }
@@ -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,
@@ -64,7 +75,7 @@ const SyncedBlockRendererComponent = ({
64
75
  return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
65
76
  }
66
77
  if (syncBlockInstance.error || !syncBlockInstance.data || syncBlockInstance.data.status === 'deleted') {
67
- var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics;
78
+ var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics2;
68
79
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
69
80
  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
81
  type: SyncBlockError.NotFound
@@ -74,20 +85,20 @@ const SyncedBlockRendererComponent = ({
74
85
  resourceId: syncBlockInstance.resourceId,
75
86
  onRetry: reloadData,
76
87
  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
88
+ fireAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
78
89
  });
79
90
  }
80
91
 
81
92
  // Check for unpublished status
82
93
  if (((_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
83
- var _syncBlockInstance$da3, _api$analytics2;
94
+ var _syncBlockInstance$da3, _api$analytics3;
84
95
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
85
96
  error: {
86
97
  type: SyncBlockError.Unpublished
87
98
  },
88
99
  resourceId: syncBlockInstance.resourceId,
89
100
  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
101
+ fireAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent
91
102
  });
92
103
  }
93
104
  const syncBlockDoc = {
@@ -1,7 +1,9 @@
1
- import React, { useMemo } from 'react';
1
+ import React, { useMemo, useEffect } from 'react';
2
+ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
2
3
  import { logException } from '@atlaskit/editor-common/monitoring';
3
4
  import { SyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
4
5
  import { fetchErrorPayload, getContentIdAndProductFromResourceId, SyncBlockError } from '@atlaskit/editor-synced-block-provider';
6
+ import { fg } from '@atlaskit/platform-feature-flags';
5
7
  import { SyncedBlockGenericError } from './SyncedBlockGenericError';
6
8
  import { SyncedBlockLoadError } from './SyncedBlockLoadError';
7
9
  import { SyncedBlockNotFoundError } from './SyncedBlockNotFoundError';
@@ -35,6 +37,21 @@ export var SyncedBlockErrorComponent = function SyncedBlockErrorComponent(_ref)
35
37
  resourceId = _ref.resourceId,
36
38
  fireAnalyticsEvent = _ref.fireAnalyticsEvent,
37
39
  sourceURL = _ref.sourceURL;
40
+ useEffect(function () {
41
+ if (!fg('platform_synced_block_patch_3')) {
42
+ return;
43
+ }
44
+ fireAnalyticsEvent === null || fireAnalyticsEvent === void 0 || fireAnalyticsEvent({
45
+ action: ACTION.ERROR,
46
+ actionSubject: ACTION_SUBJECT.SYNCED_BLOCK,
47
+ actionSubjectId: ACTION_SUBJECT_ID.SYNCED_BLOCK_FETCH,
48
+ attributes: {
49
+ error: "".concat((error === null || error === void 0 ? void 0 : error.reason) || (error === null || error === void 0 ? void 0 : error.type), ": error component rendered"),
50
+ resourceId: resourceId
51
+ },
52
+ eventType: EVENT_TYPE.OPERATIONAL
53
+ });
54
+ }, [error === null || error === void 0 ? void 0 : error.reason, error === null || error === void 0 ? void 0 : error.type, resourceId, fireAnalyticsEvent]);
38
55
  var getErrorContent = useMemo(function () {
39
56
  switch (error === null || error === void 0 ? void 0 : error.type) {
40
57
  case SyncBlockError.Offline:
@@ -2,21 +2,31 @@ 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
+ import { fg } from '@atlaskit/platform-feature-flags';
9
10
  import { AKRendererWrapper } from './AKRendererWrapper';
10
11
  import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
11
12
  import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
12
13
  export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentRenderer(_ref) {
13
- var _syncBlockInstance$da2;
14
+ var _syncBlockInstance$da4;
14
15
  var nodeProps = _ref.nodeProps,
15
16
  syncBlockStoreManager = _ref.syncBlockStoreManager,
16
17
  rendererOptions = _ref.rendererOptions;
17
18
  var resourceId = nodeProps.resourceId,
18
19
  localId = nodeProps.localId,
19
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
+ }, []);
20
30
  syncBlockStoreManager.referenceManager.updateFireAnalyticsEvent(fireAnalyticsEvent);
21
31
  var _useFetchSyncBlockDat = useFetchSyncBlockData(syncBlockStoreManager, resourceId, localId, fireAnalyticsEvent),
22
32
  syncBlockInstance = _useFetchSyncBlockDat.syncBlockInstance,
@@ -51,9 +61,16 @@ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentR
51
61
  return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
52
62
  }
53
63
  if (!resourceId || syncBlockInstance !== null && syncBlockInstance !== void 0 && syncBlockInstance.error || !(syncBlockInstance !== null && syncBlockInstance !== void 0 && syncBlockInstance.data) || syncBlockInstance.data.status === 'deleted') {
54
- var _syncBlockInstance$er, _syncBlockInstance$da;
64
+ var _syncBlockInstance$er, _syncBlockInstance$da, _syncBlockInstance$da2, _syncBlockInstance$er2, _syncBlockInstance$da3;
65
+ var errorMessage = (_syncBlockInstance$er = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : 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' ? {
66
+ type: SyncBlockError.NotFound,
67
+ reason: (_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.deletionReason
68
+ } : {
69
+ type: SyncBlockError.Errored,
70
+ reason: !resourceId ? 'missing resource id' : "missing data for block ".concat(resourceId)
71
+ };
55
72
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
56
- error: (_syncBlockInstance$er = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : 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' ? {
73
+ error: fg('platform_synced_block_patch_3') ? errorMessage : (_syncBlockInstance$er2 = syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.error) !== null && _syncBlockInstance$er2 !== void 0 ? _syncBlockInstance$er2 : (syncBlockInstance === null || syncBlockInstance === void 0 || (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.status) === 'deleted' ? {
57
74
  type: SyncBlockError.NotFound
58
75
  } : {
59
76
  type: SyncBlockError.Errored
@@ -64,14 +81,14 @@ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentR
64
81
  fireAnalyticsEvent: fireAnalyticsEvent
65
82
  });
66
83
  }
67
- if ((syncBlockInstance === null || syncBlockInstance === void 0 || (_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
68
- var _syncBlockInstance$da3;
84
+ if ((syncBlockInstance === null || syncBlockInstance === void 0 || (_syncBlockInstance$da4 = syncBlockInstance.data) === null || _syncBlockInstance$da4 === void 0 ? void 0 : _syncBlockInstance$da4.status) === 'unpublished') {
85
+ var _syncBlockInstance$da5;
69
86
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
70
87
  error: {
71
88
  type: SyncBlockError.Unpublished
72
89
  },
73
90
  resourceId: syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.resourceId,
74
- sourceURL: (_syncBlockInstance$da3 = syncBlockInstance.data) === null || _syncBlockInstance$da3 === void 0 ? void 0 : _syncBlockInstance$da3.sourceURL,
91
+ sourceURL: (_syncBlockInstance$da5 = syncBlockInstance.data) === null || _syncBlockInstance$da5 === void 0 ? void 0 : _syncBlockInstance$da5.sourceURL,
75
92
  fireAnalyticsEvent: fireAnalyticsEvent
76
93
  });
77
94
  }
@@ -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,6 +14,16 @@ 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,
@@ -62,7 +73,7 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
62
73
  return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
63
74
  }
64
75
  if (syncBlockInstance.error || !syncBlockInstance.data || syncBlockInstance.data.status === 'deleted') {
65
- var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics;
76
+ var _syncBlockInstance$er, _syncBlockInstance$da, _api$analytics2;
66
77
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
67
78
  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
79
  type: SyncBlockError.NotFound
@@ -72,20 +83,20 @@ var SyncedBlockRendererComponent = function SyncedBlockRendererComponent(_ref) {
72
83
  resourceId: syncBlockInstance.resourceId,
73
84
  onRetry: reloadData,
74
85
  isLoading: isLoading,
75
- fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent
86
+ fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent
76
87
  });
77
88
  }
78
89
 
79
90
  // Check for unpublished status
80
91
  if (((_syncBlockInstance$da2 = syncBlockInstance.data) === null || _syncBlockInstance$da2 === void 0 ? void 0 : _syncBlockInstance$da2.status) === 'unpublished') {
81
- var _syncBlockInstance$da3, _api$analytics2;
92
+ var _syncBlockInstance$da3, _api$analytics3;
82
93
  return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
83
94
  error: {
84
95
  type: SyncBlockError.Unpublished
85
96
  },
86
97
  resourceId: syncBlockInstance.resourceId,
87
98
  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
99
+ fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent
89
100
  });
90
101
  }
91
102
  var syncBlockDoc = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-synced-block-renderer",
3
- "version": "5.8.4",
3
+ "version": "5.9.0",
4
4
  "description": "SyncedBlockRenderer for @atlaskit/editor-plugin-synced-block",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -31,14 +31,14 @@
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.29.0",
34
+ "@atlaskit/editor-synced-block-provider": "^3.30.0",
35
35
  "@atlaskit/heading": "^5.3.0",
36
36
  "@atlaskit/icon": "^31.0.0",
37
37
  "@atlaskit/icon-lab": "^5.16.0",
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.8.0",
41
+ "@atlaskit/renderer": "^126.11.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.14.0",
51
+ "@atlaskit/editor-common": "^111.18.0",
52
52
  "react": "^18.2.0",
53
53
  "react-intl-next": "npm:react-intl@^5.18.1"
54
54
  },
@@ -87,5 +87,10 @@
87
87
  "import-no-extraneous-disable-for-examples-and-docs"
88
88
  ]
89
89
  }
90
+ },
91
+ "platform-feature-flags": {
92
+ "platform_synced_block_patch_3": {
93
+ "type": "boolean"
94
+ }
90
95
  }
91
96
  }