@atlaskit/editor-plugin-card 12.2.5 → 12.3.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 (8) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/cjs/nodeviews/inlineCard.js +18 -2
  3. package/dist/cjs/nodeviews/lazy-inline-card.js +2 -1
  4. package/dist/es2019/nodeviews/inlineCard.js +18 -2
  5. package/dist/es2019/nodeviews/lazy-inline-card.js +2 -1
  6. package/dist/esm/nodeviews/inlineCard.js +18 -2
  7. package/dist/esm/nodeviews/lazy-inline-card.js +2 -1
  8. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @atlaskit/editor-plugin-card
2
2
 
3
+ ## 12.3.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`506d872ef2503`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/506d872ef2503) -
8
+ Add smartlink response caching to browser storage to reduce layoutshift on transition and page
9
+ load
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
3
15
  ## 12.2.5
4
16
 
5
17
  ### Patch Changes
package/dist/cjs/nodeviews/inlineCard.js CHANGED
@@ -16,7 +16,9 @@ var _analytics = require("@atlaskit/editor-common/analytics");
16
16
  var _hooks = require("@atlaskit/editor-common/hooks");
17
17
  var _ui = require("@atlaskit/editor-common/ui");
18
18
  var _smartCard = require("@atlaskit/smart-card");
19
+ var _hooks2 = require("@atlaskit/smart-card/hooks");
19
20
  var _ssr = require("@atlaskit/smart-card/ssr");
21
+ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
20
22
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
21
23
  var _actions = require("../pm-plugins/actions");
22
24
  var _utils = require("../pm-plugins/utils");
@@ -27,6 +29,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
27
29
  // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
28
30
 
29
31
  var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_ref) {
32
+ var _cardContext$value3;
30
33
  var node = _ref.node,
31
34
  cardContext = _ref.cardContext,
32
35
  actionOptions = _ref.actionOptions,
@@ -46,6 +49,9 @@ var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_r
46
49
  data = _node$attrs.data;
47
50
  // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
48
51
  var refId = (0, _react.useRef)((0, _v.default)());
52
+ var reload = (0, _hooks2.useSmartLinkReload)({
53
+ url: url
54
+ });
49
55
  (0, _react.useEffect)(function () {
50
56
  var id = refId.current;
51
57
  return function () {
@@ -56,6 +62,14 @@ var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_r
56
62
  view.dispatch(tr);
57
63
  };
58
64
  }, [getPos, view]);
65
+ (0, _react.useEffect)(function () {
66
+ var _cardContext$value;
67
+ // if we render from cache, we want to make sure we reload the data in the background
68
+ var cardState = cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 || (_cardContext$value = _cardContext$value.store) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.getState()[url || ''];
69
+ if ((0, _expValEquals.expValEquals)('platform_editor_smartlink_local_cache', 'isEnabled', true) && !isPageSSRed && (cardState === null || cardState === void 0 ? void 0 : cardState.status) === 'resolved') {
70
+ reload();
71
+ }
72
+ });
59
73
  var scrollContainer = (0, _react.useMemo)(
60
74
  // Ignored via go/ees005
61
75
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
@@ -111,7 +125,9 @@ var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_r
111
125
  }, [propsOnClick, url, view, pluginInjectionApi]);
112
126
  var onClick = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? handleOnClick : propsOnClick;
113
127
  var card = (0, _react.useMemo)(function () {
114
- if (isPageSSRed && url) {
128
+ var _cardContext$value2;
129
+ var cardState = cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 || (_cardContext$value2 = _cardContext$value2.store) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.getState()[url || ''];
130
+ if ((isPageSSRed || cardState && (0, _expValEquals.expValEquals)('platform_editor_smartlink_local_cache', 'isEnabled', true)) && url) {
115
131
  return /*#__PURE__*/_react.default.createElement(_ssr.CardSSR, {
116
132
  key: url,
117
133
  url: url,
@@ -144,7 +160,7 @@ var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_r
144
160
  hoverPreviewOptions: hoverPreviewOptions,
145
161
  disablePreviewPanel: disablePreviewPanel
146
162
  });
147
- }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, disablePreviewPanel]);
163
+ }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, disablePreviewPanel, cardContext === null || cardContext === void 0 || (_cardContext$value3 = cardContext.value) === null || _cardContext$value3 === void 0 ? void 0 : _cardContext$value3.store]);
148
164
 
149
165
  // [WS-2307]: we only render card wrapped into a Provider when the value is ready,
150
166
  // otherwise if we got data, we can render the card directly since it doesn't need the Provider
package/dist/cjs/nodeviews/lazy-inline-card.js CHANGED
@@ -7,13 +7,14 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.lazyInlineCardView = void 0;
8
8
  var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
9
9
  var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
10
+ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
10
11
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
11
12
  var _inlineCard = require("./inlineCard");
12
13
  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" != (0, _typeof2.default)(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); }
13
14
  var lazyInlineCardView = exports.lazyInlineCardView = function lazyInlineCardView(props) {
14
15
  var _props$isPageSSRed = props.isPageSSRed,
15
16
  isPageSSRed = _props$isPageSSRed === void 0 ? false : _props$isPageSSRed;
16
- if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false) || isPageSSRed) {
17
+ if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false) || (0, _expValEquals.expValEquals)('platform_editor_smartlink_local_cache', 'isEnabled', true) || isPageSSRed) {
17
18
  return (0, _inlineCard.inlineCardNodeView)(props);
18
19
  }
19
20
  return (0, _lazyNodeView.withLazyLoading)({
package/dist/es2019/nodeviews/inlineCard.js CHANGED
@@ -7,7 +7,9 @@ import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
7
7
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
8
8
  import { UnsupportedInline, findOverflowScrollParent } from '@atlaskit/editor-common/ui';
9
9
  import { Card as SmartCard } from '@atlaskit/smart-card';
10
+ import { useSmartLinkReload } from '@atlaskit/smart-card/hooks';
10
11
  import { CardSSR } from '@atlaskit/smart-card/ssr';
12
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
11
13
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
12
14
  import { registerCard, removeCard } from '../pm-plugins/actions';
13
15
  import { getAwarenessProps } from '../pm-plugins/utils';
@@ -30,12 +32,16 @@ export const InlineCard = /*#__PURE__*/memo(({
30
32
  pluginInjectionApi,
31
33
  disablePreviewPanel
32
34
  }) => {
35
+ var _cardContext$value3;
33
36
  const {
34
37
  url,
35
38
  data
36
39
  } = node.attrs;
37
40
  // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
38
41
  const refId = useRef(uuid());
42
+ const reload = useSmartLinkReload({
43
+ url
44
+ });
39
45
  useEffect(() => {
40
46
  const id = refId.current;
41
47
  return () => {
@@ -48,6 +54,14 @@ export const InlineCard = /*#__PURE__*/memo(({
48
54
  view.dispatch(tr);
49
55
  };
50
56
  }, [getPos, view]);
57
+ useEffect(() => {
58
+ var _cardContext$value, _cardContext$value$st;
59
+ // if we render from cache, we want to make sure we reload the data in the background
60
+ const cardState = cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : (_cardContext$value$st = _cardContext$value.store) === null || _cardContext$value$st === void 0 ? void 0 : _cardContext$value$st.getState()[url || ''];
61
+ if (expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true) && !isPageSSRed && (cardState === null || cardState === void 0 ? void 0 : cardState.status) === 'resolved') {
62
+ reload();
63
+ }
64
+ });
51
65
  const scrollContainer = useMemo(
52
66
  // Ignored via go/ees005
53
67
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
@@ -106,7 +120,9 @@ export const InlineCard = /*#__PURE__*/memo(({
106
120
  }, [propsOnClick, url, view, pluginInjectionApi]);
107
121
  const onClick = editorExperiment('platform_editor_controls', 'variant1') ? handleOnClick : propsOnClick;
108
122
  const card = useMemo(() => {
109
- if (isPageSSRed && url) {
123
+ var _cardContext$value2, _cardContext$value2$s;
124
+ const cardState = cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : (_cardContext$value2$s = _cardContext$value2.store) === null || _cardContext$value2$s === void 0 ? void 0 : _cardContext$value2$s.getState()[url || ''];
125
+ if ((isPageSSRed || cardState && expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true)) && url) {
110
126
  return /*#__PURE__*/React.createElement(CardSSR, {
111
127
  key: url,
112
128
  url: url,
@@ -139,7 +155,7 @@ export const InlineCard = /*#__PURE__*/memo(({
139
155
  hoverPreviewOptions: hoverPreviewOptions,
140
156
  disablePreviewPanel: disablePreviewPanel
141
157
  });
142
- }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, disablePreviewPanel]);
158
+ }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, disablePreviewPanel, cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value3 = cardContext.value) === null || _cardContext$value3 === void 0 ? void 0 : _cardContext$value3.store]);
143
159
 
144
160
  // [WS-2307]: we only render card wrapped into a Provider when the value is ready,
145
161
  // otherwise if we got data, we can render the card directly since it doesn't need the Provider
package/dist/es2019/nodeviews/lazy-inline-card.js CHANGED
@@ -1,11 +1,12 @@
1
1
  import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
2
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
2
3
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
3
4
  import { inlineCardNodeView } from './inlineCard';
4
5
  export const lazyInlineCardView = props => {
5
6
  const {
6
7
  isPageSSRed = false
7
8
  } = props;
8
- if (editorExperiment('platform_editor_exp_lazy_node_views', false) || isPageSSRed) {
9
+ if (editorExperiment('platform_editor_exp_lazy_node_views', false) || expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true) || isPageSSRed) {
9
10
  return inlineCardNodeView(props);
10
11
  }
11
12
  return withLazyLoading({
package/dist/esm/nodeviews/inlineCard.js CHANGED
@@ -7,7 +7,9 @@ import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
7
7
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
8
8
  import { UnsupportedInline, findOverflowScrollParent } from '@atlaskit/editor-common/ui';
9
9
  import { Card as SmartCard } from '@atlaskit/smart-card';
10
+ import { useSmartLinkReload } from '@atlaskit/smart-card/hooks';
10
11
  import { CardSSR } from '@atlaskit/smart-card/ssr';
12
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
11
13
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
12
14
  import { registerCard, removeCard } from '../pm-plugins/actions';
13
15
  import { getAwarenessProps } from '../pm-plugins/utils';
@@ -15,6 +17,7 @@ import { visitCardLinkAnalytics } from '../ui/toolbar';
15
17
  import { Card } from './genericCard';
16
18
  import { InlineCardWithAwareness } from './inlineCardWithAwareness';
17
19
  export var InlineCard = /*#__PURE__*/memo(function (_ref) {
20
+ var _cardContext$value3;
18
21
  var node = _ref.node,
19
22
  cardContext = _ref.cardContext,
20
23
  actionOptions = _ref.actionOptions,
@@ -34,6 +37,9 @@ export var InlineCard = /*#__PURE__*/memo(function (_ref) {
34
37
  data = _node$attrs.data;
35
38
  // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
36
39
  var refId = useRef(uuid());
40
+ var reload = useSmartLinkReload({
41
+ url: url
42
+ });
37
43
  useEffect(function () {
38
44
  var id = refId.current;
39
45
  return function () {
@@ -44,6 +50,14 @@ export var InlineCard = /*#__PURE__*/memo(function (_ref) {
44
50
  view.dispatch(tr);
45
51
  };
46
52
  }, [getPos, view]);
53
+ useEffect(function () {
54
+ var _cardContext$value;
55
+ // if we render from cache, we want to make sure we reload the data in the background
56
+ var cardState = cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 || (_cardContext$value = _cardContext$value.store) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.getState()[url || ''];
57
+ if (expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true) && !isPageSSRed && (cardState === null || cardState === void 0 ? void 0 : cardState.status) === 'resolved') {
58
+ reload();
59
+ }
60
+ });
47
61
  var scrollContainer = useMemo(
48
62
  // Ignored via go/ees005
49
63
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
@@ -99,7 +113,9 @@ export var InlineCard = /*#__PURE__*/memo(function (_ref) {
99
113
  }, [propsOnClick, url, view, pluginInjectionApi]);
100
114
  var onClick = editorExperiment('platform_editor_controls', 'variant1') ? handleOnClick : propsOnClick;
101
115
  var card = useMemo(function () {
102
- if (isPageSSRed && url) {
116
+ var _cardContext$value2;
117
+ var cardState = cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 || (_cardContext$value2 = _cardContext$value2.store) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.getState()[url || ''];
118
+ if ((isPageSSRed || cardState && expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true)) && url) {
103
119
  return /*#__PURE__*/React.createElement(CardSSR, {
104
120
  key: url,
105
121
  url: url,
@@ -132,7 +148,7 @@ export var InlineCard = /*#__PURE__*/memo(function (_ref) {
132
148
  hoverPreviewOptions: hoverPreviewOptions,
133
149
  disablePreviewPanel: disablePreviewPanel
134
150
  });
135
- }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, disablePreviewPanel]);
151
+ }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, disablePreviewPanel, cardContext === null || cardContext === void 0 || (_cardContext$value3 = cardContext.value) === null || _cardContext$value3 === void 0 ? void 0 : _cardContext$value3.store]);
136
152
 
137
153
  // [WS-2307]: we only render card wrapped into a Provider when the value is ready,
138
154
  // otherwise if we got data, we can render the card directly since it doesn't need the Provider
package/dist/esm/nodeviews/lazy-inline-card.js CHANGED
@@ -1,10 +1,11 @@
1
1
  import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
2
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
2
3
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
3
4
  import { inlineCardNodeView } from './inlineCard';
4
5
  export var lazyInlineCardView = function lazyInlineCardView(props) {
5
6
  var _props$isPageSSRed = props.isPageSSRed,
6
7
  isPageSSRed = _props$isPageSSRed === void 0 ? false : _props$isPageSSRed;
7
- if (editorExperiment('platform_editor_exp_lazy_node_views', false) || isPageSSRed) {
8
+ if (editorExperiment('platform_editor_exp_lazy_node_views', false) || expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true) || isPageSSRed) {
8
9
  return inlineCardNodeView(props);
9
10
  }
10
11
  return withLazyLoading({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-card",
3
- "version": "12.2.5",
3
+ "version": "12.3.0",
4
4
  "description": "Card plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -61,7 +61,7 @@
61
61
  "@atlaskit/prosemirror-history": "^0.2.0",
62
62
  "@atlaskit/smart-card": "^43.23.0",
63
63
  "@atlaskit/theme": "^21.0.0",
64
- "@atlaskit/tmp-editor-statsig": "^21.0.0",
64
+ "@atlaskit/tmp-editor-statsig": "^21.2.0",
65
65
  "@atlaskit/tokens": "^11.0.0",
66
66
  "@babel/runtime": "^7.0.0",
67
67
  "@emotion/react": "^11.7.1",