@atlaskit/media-card 71.0.0 → 72.0.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 (110) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/cjs/errors.js +56 -5
  3. package/dist/cjs/files/cardImageView/index.js +53 -104
  4. package/dist/cjs/files/index.js +0 -6
  5. package/dist/cjs/root/card/cardAnalytics.js +3 -15
  6. package/dist/cjs/root/card/cardSSRView.js +4 -2
  7. package/dist/cjs/root/card/cardState.js +50 -0
  8. package/dist/cjs/root/card/getCardPreview/cache.js +5 -0
  9. package/dist/cjs/root/card/getCardPreview/filePreviewStatus.js +50 -0
  10. package/dist/cjs/root/card/getCardPreview/helpers.js +13 -21
  11. package/dist/cjs/root/card/getCardPreview/index.js +91 -94
  12. package/dist/cjs/root/card/getCardStatus.js +7 -1
  13. package/dist/cjs/root/card/index.js +271 -266
  14. package/dist/cjs/root/cardView.js +96 -60
  15. package/dist/cjs/root/inline/loader.js +2 -1
  16. package/dist/cjs/root/inline/mediaInlineCard.js +4 -3
  17. package/dist/cjs/root/ui/iconMessage/index.js +12 -5
  18. package/dist/cjs/root/ui/imageRenderer/imageRenderer.js +30 -124
  19. package/dist/cjs/root/ui/titleBox/failedTitleBox.js +7 -3
  20. package/dist/cjs/utils/analytics.js +6 -44
  21. package/dist/cjs/utils/dimensionComparer.js +1 -1
  22. package/dist/cjs/utils/metadata.js +11 -3
  23. package/dist/cjs/utils/objectURLCache.js +6 -0
  24. package/dist/cjs/utils/shouldDisplayImageThumbnail.js +1 -1
  25. package/dist/cjs/version.json +1 -1
  26. package/dist/es2019/errors.js +34 -2
  27. package/dist/es2019/files/cardImageView/index.js +8 -61
  28. package/dist/es2019/files/index.js +1 -1
  29. package/dist/es2019/root/card/cardAnalytics.js +3 -14
  30. package/dist/es2019/root/card/cardSSRView.js +3 -2
  31. package/dist/es2019/root/card/cardState.js +26 -0
  32. package/dist/es2019/root/card/getCardPreview/cache.js +5 -0
  33. package/dist/es2019/root/card/getCardPreview/filePreviewStatus.js +35 -0
  34. package/dist/es2019/root/card/getCardPreview/helpers.js +2 -12
  35. package/dist/es2019/root/card/getCardPreview/index.js +71 -74
  36. package/dist/es2019/root/card/getCardStatus.js +1 -0
  37. package/dist/es2019/root/card/index.js +193 -171
  38. package/dist/es2019/root/cardView.js +100 -61
  39. package/dist/es2019/root/inline/loader.js +2 -1
  40. package/dist/es2019/root/inline/mediaInlineCard.js +4 -3
  41. package/dist/es2019/root/ui/iconMessage/index.js +5 -3
  42. package/dist/es2019/root/ui/imageRenderer/imageRenderer.js +21 -88
  43. package/dist/es2019/root/ui/titleBox/failedTitleBox.js +5 -3
  44. package/dist/es2019/utils/analytics.js +5 -34
  45. package/dist/es2019/utils/dimensionComparer.js +1 -1
  46. package/dist/es2019/utils/metadata.js +12 -4
  47. package/dist/es2019/utils/objectURLCache.js +5 -0
  48. package/dist/es2019/utils/shouldDisplayImageThumbnail.js +1 -1
  49. package/dist/es2019/version.json +1 -1
  50. package/dist/esm/errors.js +42 -1
  51. package/dist/esm/files/cardImageView/index.js +51 -102
  52. package/dist/esm/files/index.js +1 -1
  53. package/dist/esm/root/card/cardAnalytics.js +3 -15
  54. package/dist/esm/root/card/cardSSRView.js +3 -2
  55. package/dist/esm/root/card/cardState.js +32 -0
  56. package/dist/esm/root/card/getCardPreview/cache.js +6 -0
  57. package/dist/esm/root/card/getCardPreview/filePreviewStatus.js +35 -0
  58. package/dist/esm/root/card/getCardPreview/helpers.js +13 -21
  59. package/dist/esm/root/card/getCardPreview/index.js +79 -88
  60. package/dist/esm/root/card/getCardStatus.js +3 -0
  61. package/dist/esm/root/card/index.js +278 -268
  62. package/dist/esm/root/cardView.js +98 -61
  63. package/dist/esm/root/inline/loader.js +2 -1
  64. package/dist/esm/root/inline/mediaInlineCard.js +4 -3
  65. package/dist/esm/root/ui/iconMessage/index.js +7 -3
  66. package/dist/esm/root/ui/imageRenderer/imageRenderer.js +23 -118
  67. package/dist/esm/root/ui/titleBox/failedTitleBox.js +6 -3
  68. package/dist/esm/utils/analytics.js +5 -36
  69. package/dist/esm/utils/dimensionComparer.js +1 -1
  70. package/dist/esm/utils/metadata.js +12 -4
  71. package/dist/esm/utils/objectURLCache.js +6 -0
  72. package/dist/esm/utils/shouldDisplayImageThumbnail.js +1 -1
  73. package/dist/esm/version.json +1 -1
  74. package/dist/types/errors.d.ts +9 -1
  75. package/dist/types/files/cardImageView/index.d.ts +4 -13
  76. package/dist/types/files/cardImageView/styled.d.ts +1 -1
  77. package/dist/types/files/index.d.ts +1 -1
  78. package/dist/types/index.d.ts +4 -3
  79. package/dist/types/root/card/cardAnalytics.d.ts +1 -6
  80. package/dist/types/root/card/cardSSRView.d.ts +1 -1
  81. package/dist/types/root/card/cardState.d.ts +5 -0
  82. package/dist/types/root/card/getCardPreview/cache.d.ts +3 -1
  83. package/dist/types/root/card/getCardPreview/filePreviewStatus.d.ts +5 -0
  84. package/dist/types/root/card/getCardPreview/helpers.d.ts +3 -4
  85. package/dist/types/root/card/getCardPreview/index.d.ts +17 -13
  86. package/dist/types/root/card/getCardStatus.d.ts +1 -0
  87. package/dist/types/root/card/index.d.ts +11 -10
  88. package/dist/types/root/cardView.d.ts +11 -8
  89. package/dist/types/root/inlinePlayer.d.ts +1 -1
  90. package/dist/types/root/ui/iconMessage/index.d.ts +2 -1
  91. package/dist/types/root/ui/imageRenderer/imageRenderer.d.ts +2 -13
  92. package/dist/types/root/ui/styledSSR.d.ts +1 -1
  93. package/dist/types/root/ui/titleBox/failedTitleBox.d.ts +2 -0
  94. package/dist/types/styles/mixins.d.ts +1 -1
  95. package/dist/types/types.d.ts +7 -1
  96. package/dist/types/utils/analytics.d.ts +6 -15
  97. package/dist/types/utils/cardDimensions.d.ts +4 -4
  98. package/dist/types/utils/dimensionComparer.d.ts +1 -1
  99. package/dist/types/utils/metadata.d.ts +2 -2
  100. package/dist/types/utils/objectURLCache.d.ts +2 -1
  101. package/example-helpers/index.tsx +21 -0
  102. package/package.json +6 -5
  103. package/dist/cjs/root/card/getCardPreview/types.js +0 -5
  104. package/dist/cjs/utils/fileAttributesContext.js +0 -40
  105. package/dist/es2019/root/card/getCardPreview/types.js +0 -1
  106. package/dist/es2019/utils/fileAttributesContext.js +0 -19
  107. package/dist/esm/root/card/getCardPreview/types.js +0 -1
  108. package/dist/esm/utils/fileAttributesContext.js +0 -18
  109. package/dist/types/root/card/getCardPreview/types.d.ts +0 -5
  110. package/dist/types/utils/fileAttributesContext.d.ts +0 -10
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/media-card
2
2
 
3
+ ## 72.0.0
4
+
5
+ ### Major Changes
6
+
7
+ - [`b3606652fa1`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b3606652fa1) - [ux] Editor integration for Media Inline component
8
+
9
+ ### Minor Changes
10
+
11
+ - [`269ee940b87`](https://bitbucket.org/atlassian/atlassian-frontend/commits/269ee940b87) - redesign error UI on new media card experience
12
+
13
+ ### Patch Changes
14
+
15
+ - [`a81fdad4b7b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a81fdad4b7b) - Refactored the internal status logic based on file processing status and preview render outcome
16
+ - [`b51fc0a9062`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b51fc0a9062) - Refactored internal helpers to match common type definitions from Media Client
17
+ - [`ebad8bc86e5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ebad8bc86e5) - Moved analytics from image renderer to root component
18
+ - [`fe9ced0cd70`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fe9ced0cd70) - Removed feature flags for polling settings
19
+ - Updated dependencies
20
+
3
21
  ## 71.0.0
4
22
 
5
23
  ### Major Changes
@@ -6,7 +6,8 @@ Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
8
  exports.isMediaCardError = isMediaCardError;
9
- exports.ensureMediaCardError = exports.isUnsupportedLocalPreviewError = exports.isRemotePreviewError = exports.isLocalPreviewError = exports.RemotePreviewError = exports.LocalPreviewError = exports.MediaCardError = void 0;
9
+ exports.isImageLoadError = isImageLoadError;
10
+ exports.isUploadError = exports.ensureMediaCardError = exports.isUnsupportedLocalPreviewError = exports.isRemotePreviewError = exports.isLocalPreviewError = exports.ImageLoadError = exports.getImageLoadPrimaryReason = exports.RemotePreviewError = exports.LocalPreviewError = exports.MediaCardError = void 0;
10
11
 
11
12
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
12
13
 
@@ -91,6 +92,46 @@ var RemotePreviewError = /*#__PURE__*/function (_MediaCardError2) {
91
92
 
92
93
  exports.RemotePreviewError = RemotePreviewError;
93
94
 
95
+ var getImageLoadPrimaryReason = function getImageLoadPrimaryReason(source) {
96
+ switch (source) {
97
+ case 'cache-remote':
98
+ return 'cache-remote-uri';
99
+
100
+ case 'cache-local':
101
+ return 'cache-local-uri';
102
+
103
+ case 'external':
104
+ return 'external-uri';
105
+
106
+ case 'local':
107
+ return 'local-uri';
108
+
109
+ case 'remote':
110
+ return 'remote-uri';
111
+ // This fail reason will come from a bug, most likely.
112
+
113
+ default:
114
+ return "unknown-uri";
115
+ }
116
+ };
117
+
118
+ exports.getImageLoadPrimaryReason = getImageLoadPrimaryReason;
119
+
120
+ var ImageLoadError = /*#__PURE__*/function (_MediaCardError3) {
121
+ (0, _inherits2.default)(ImageLoadError, _MediaCardError3);
122
+
123
+ var _super4 = _createSuper(ImageLoadError);
124
+
125
+ function ImageLoadError(source) {
126
+ (0, _classCallCheck2.default)(this, ImageLoadError);
127
+ return _super4.call(this, getImageLoadPrimaryReason(source));
128
+ }
129
+
130
+ return ImageLoadError;
131
+ }(MediaCardError);
132
+
133
+ exports.ImageLoadError = ImageLoadError;
134
+
94
135
  function isMediaCardError(err) {
95
136
  return err instanceof MediaCardError;
96
137
  }
@@ -109,14 +150,24 @@ exports.isRemotePreviewError = isRemotePreviewError;
109
150
 
110
151
  var isUnsupportedLocalPreviewError = function isUnsupportedLocalPreviewError(err) {
111
152
  return isMediaCardError(err) && err.primaryReason === 'local-preview-unsupported';
112
- }; // In a try/catch statement, the error caught is the type of any.
113
- // We can use this helper to ensure that the error handled is the type of MediaCardError if unsure
114
-
153
+ };
115
154
 
116
155
  exports.isUnsupportedLocalPreviewError = isUnsupportedLocalPreviewError;
117
156
 
157
+ function isImageLoadError(err) {
158
+ return err instanceof ImageLoadError;
159
+ } // In a try/catch statement, the error caught is the type of any.
160
+ // We can use this helper to ensure that the error handled is the type of MediaCardError if unsure
161
+
162
+
118
163
  var ensureMediaCardError = function ensureMediaCardError(primaryReason, error) {
119
164
  return isMediaCardError(error) ? error : new MediaCardError(primaryReason, error);
120
165
  };
121
166
 
122
- exports.ensureMediaCardError = ensureMediaCardError;
167
+ exports.ensureMediaCardError = ensureMediaCardError;
168
+
169
+ var isUploadError = function isUploadError(error) {
170
+ return error.primaryReason === 'upload';
171
+ };
172
+
173
+ exports.isUploadError = isUploadError;
@@ -7,7 +7,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
7
7
  Object.defineProperty(exports, "__esModule", {
8
8
  value: true
9
9
  });
10
- exports.FileCardImageView = exports.FileCardImageViewBase = exports.fileCardImageViewSelectedSelector = exports.fileCardImageViewSelector = void 0;
10
+ exports.FileCardImageView = exports.fileCardImageViewSelectedSelector = exports.fileCardImageViewSelector = void 0;
11
11
 
12
12
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
13
13
 
@@ -41,12 +41,6 @@ var _progressBar = require("../../utils/progressBar");
41
41
 
42
42
  var _cardActions = _interopRequireDefault(require("../../utils/cardActions"));
43
43
 
44
- var _analyticsNext = require("@atlaskit/analytics-next");
45
-
46
- var _analytics = require("../../utils/analytics");
47
-
48
- var _fileAttributesContext = require("../../utils/fileAttributesContext");
49
-
50
44
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
51
45
 
52
46
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -60,15 +54,15 @@ exports.fileCardImageViewSelector = fileCardImageViewSelector;
60
54
  var fileCardImageViewSelectedSelector = 'media-file-card-view-selected';
61
55
  exports.fileCardImageViewSelectedSelector = fileCardImageViewSelectedSelector;
62
56
 
63
- var FileCardImageViewBase = /*#__PURE__*/function (_Component) {
64
- (0, _inherits2.default)(FileCardImageViewBase, _Component);
57
+ var FileCardImageView = /*#__PURE__*/function (_Component) {
58
+ (0, _inherits2.default)(FileCardImageView, _Component);
65
59
 
66
- var _super = _createSuper(FileCardImageViewBase);
60
+ var _super = _createSuper(FileCardImageView);
67
61
 
68
- function FileCardImageViewBase() {
62
+ function FileCardImageView() {
69
63
  var _this;
70
64
 
71
- (0, _classCallCheck2.default)(this, FileCardImageViewBase);
65
+ (0, _classCallCheck2.default)(this, FileCardImageView);
72
66
 
73
67
  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
74
68
  args[_key] = arguments[_key];
@@ -186,58 +180,18 @@ var FileCardImageViewBase = /*#__PURE__*/function (_Component) {
186
180
  size: "large"
187
181
  })));
188
182
  });
189
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onImageLoad", function () {
190
- var _this$props6 = _this.props,
191
- createAnalyticsEvent = _this$props6.createAnalyticsEvent,
192
- fileAttributes = _this$props6.fileAttributes,
193
- timeElapsedTillCommenced = _this$props6.timeElapsedTillCommenced;
194
-
195
- if (fileAttributes && _this.shouldFireEvent(_analytics.RenderEventAction.SUCCEEDED)) {
196
- var timeElapsedTillSucceeded = performance.now();
197
- var durationSinceCommenced = timeElapsedTillCommenced && timeElapsedTillSucceeded - timeElapsedTillCommenced;
198
- var performanceAttributes = {
199
- overall: {
200
- durationSincePageStart: timeElapsedTillSucceeded,
201
- durationSinceCommenced: durationSinceCommenced
202
- }
203
- };
204
- (0, _analytics.fireMediaCardEvent)((0, _analytics.getRenderSucceededEventPayload)(fileAttributes, performanceAttributes), createAnalyticsEvent);
205
- }
206
- });
207
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onImageError", function () {
208
- var fileAttributes = _this.props.fileAttributes;
209
-
210
- if (fileAttributes && _this.shouldFireEvent(_analytics.RenderEventAction.FAILED)) {
211
- var _this$props7 = _this.props,
212
- createAnalyticsEvent = _this$props7.createAnalyticsEvent,
213
- mediaItemType = _this$props7.mediaItemType,
214
- timeElapsedTillCommenced = _this$props7.timeElapsedTillCommenced;
215
- var timeElapsedTillFailed = performance.now();
216
- var durationSinceCommenced = timeElapsedTillCommenced && timeElapsedTillFailed - timeElapsedTillCommenced;
217
- var performanceAttributes = {
218
- overall: {
219
- durationSincePageStart: timeElapsedTillFailed,
220
- durationSinceCommenced: durationSinceCommenced
221
- }
222
- };
223
-
224
- if (mediaItemType === 'file') {
225
- (0, _analytics.fireMediaCardEvent)((0, _analytics.getRenderFailedFileUriPayload)(fileAttributes, performanceAttributes), createAnalyticsEvent);
226
- } else if (mediaItemType === 'external-image') {
227
- (0, _analytics.fireMediaCardEvent)((0, _analytics.getRenderFailedExternalUriPayload)(fileAttributes, performanceAttributes), createAnalyticsEvent);
228
- }
229
- }
230
- });
231
183
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderMediaImage", function () {
232
- var _this$props8 = _this.props,
233
- status = _this$props8.status,
234
- mediaItemType = _this$props8.mediaItemType,
235
- dataURI = _this$props8.dataURI,
236
- mediaType = _this$props8.mediaType,
237
- mimeType = _this$props8.mimeType,
238
- previewOrientation = _this$props8.previewOrientation,
239
- onDisplayImage = _this$props8.onDisplayImage,
240
- alt = _this$props8.alt;
184
+ var _this$props6 = _this.props,
185
+ status = _this$props6.status,
186
+ mediaItemType = _this$props6.mediaItemType,
187
+ dataURI = _this$props6.dataURI,
188
+ mediaType = _this$props6.mediaType,
189
+ mimeType = _this$props6.mimeType,
190
+ previewOrientation = _this$props6.previewOrientation,
191
+ onDisplayImage = _this$props6.onDisplayImage,
192
+ alt = _this$props6.alt,
193
+ onImageLoad = _this$props6.onImageLoad,
194
+ onImageError = _this$props6.onImageError;
241
195
 
242
196
  if (!(0, _shouldDisplayImageThumbnail.shouldDisplayImageThumbnail)(status, mediaItemType, dataURI, mediaType, mimeType)) {
243
197
  return null;
@@ -254,19 +208,16 @@ var FileCardImageViewBase = /*#__PURE__*/function (_Component) {
254
208
  crop: _this.isCropped,
255
209
  stretch: _this.isStretched,
256
210
  previewOrientation: previewOrientation,
257
- onImageLoad: _this.onImageLoad,
258
- onImageError: _this.onImageError
211
+ onImageLoad: onImageLoad,
212
+ onImageError: onImageError
259
213
  });
260
214
  });
261
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "shouldFireEvent", function (action) {
262
- return !_this.lastAnalyticsAction || _this.lastAnalyticsAction !== action;
263
- });
264
215
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderProgressBar", function () {
265
- var _this$props9 = _this.props,
266
- mediaName = _this$props9.mediaName,
267
- progress = _this$props9.progress,
268
- actions = _this$props9.actions,
269
- status = _this$props9.status;
216
+ var _this$props7 = _this.props,
217
+ mediaName = _this$props7.mediaName,
218
+ progress = _this$props7.progress,
219
+ actions = _this$props7.actions,
220
+ status = _this$props7.status;
270
221
 
271
222
  if (status !== 'uploading') {
272
223
  return null;
@@ -284,10 +235,10 @@ var FileCardImageViewBase = /*#__PURE__*/function (_Component) {
284
235
  }) : null))));
285
236
  });
286
237
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderSuccessCardContents", function () {
287
- var _this$props10 = _this.props,
288
- disableOverlay = _this$props10.disableOverlay,
289
- selectable = _this$props10.selectable,
290
- status = _this$props10.status;
238
+ var _this$props8 = _this.props,
239
+ disableOverlay = _this$props8.disableOverlay,
240
+ selectable = _this$props8.selectable,
241
+ status = _this$props8.status;
291
242
  var overlay = null;
292
243
 
293
244
  if (!disableOverlay) {
@@ -307,15 +258,15 @@ var FileCardImageViewBase = /*#__PURE__*/function (_Component) {
307
258
  }, _this.renderMediaImage(), _this.renderProgressBar(), _this.renderPlayButton()), overlay);
308
259
  });
309
260
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderSuccessCardOverlay", function () {
310
- var _this$props11 = _this.props,
311
- status = _this$props11.status,
312
- mediaName = _this$props11.mediaName,
313
- mediaType = _this$props11.mediaType,
314
- fileSize = _this$props11.fileSize,
315
- dataURI = _this$props11.dataURI,
316
- selectable = _this$props11.selectable,
317
- selected = _this$props11.selected,
318
- actions = _this$props11.actions;
261
+ var _this$props9 = _this.props,
262
+ status = _this$props9.status,
263
+ mediaName = _this$props9.mediaName,
264
+ mediaType = _this$props9.mediaType,
265
+ fileSize = _this$props9.fileSize,
266
+ dataURI = _this$props9.dataURI,
267
+ selectable = _this$props9.selectable,
268
+ selected = _this$props9.selected,
269
+ actions = _this$props9.actions;
319
270
  var isPersistent = mediaType === 'doc' || !dataURI;
320
271
  return /*#__PURE__*/_react.default.createElement(_cardOverlay.CardOverlay, {
321
272
  cardStatus: status,
@@ -331,17 +282,17 @@ var FileCardImageViewBase = /*#__PURE__*/function (_Component) {
331
282
  return _this;
332
283
  }
333
284
 
334
- (0, _createClass2.default)(FileCardImageViewBase, [{
285
+ (0, _createClass2.default)(FileCardImageView, [{
335
286
  key: "render",
336
287
  value: function render() {
337
- var _this$props12 = this.props,
338
- disableOverlay = _this$props12.disableOverlay,
339
- selectable = _this$props12.selectable,
340
- selected = _this$props12.selected,
341
- mediaType = _this$props12.mediaType,
342
- progress = _this$props12.progress,
343
- status = _this$props12.status,
344
- mediaName = _this$props12.mediaName;
288
+ var _this$props10 = this.props,
289
+ disableOverlay = _this$props10.disableOverlay,
290
+ selectable = _this$props10.selectable,
291
+ selected = _this$props10.selected,
292
+ mediaType = _this$props10.mediaType,
293
+ progress = _this$props10.progress,
294
+ status = _this$props10.status,
295
+ mediaName = _this$props10.mediaName;
345
296
  return /*#__PURE__*/_react.default.createElement(_styled.Wrapper, {
346
297
  "data-testid": "media-file-card-view",
347
298
  "data-test-media-name": mediaName,
@@ -358,9 +309,9 @@ var FileCardImageViewBase = /*#__PURE__*/function (_Component) {
358
309
  }, {
359
310
  key: "isFileCardImageReadyForDisplay",
360
311
  get: function get() {
361
- var _this$props13 = this.props,
362
- dataURI = _this$props13.dataURI,
363
- status = _this$props13.status;
312
+ var _this$props11 = this.props,
313
+ dataURI = _this$props11.dataURI,
314
+ status = _this$props11.status;
364
315
  return !!dataURI || !['loading', 'processing', 'loading-preview'].includes(status);
365
316
  }
366
317
  }, {
@@ -376,13 +327,11 @@ var FileCardImageViewBase = /*#__PURE__*/function (_Component) {
376
327
  return resizeMode === 'stretchy-fit';
377
328
  }
378
329
  }]);
379
- return FileCardImageViewBase;
330
+ return FileCardImageView;
380
331
  }(_react.Component);
381
332
 
382
- exports.FileCardImageViewBase = FileCardImageViewBase;
383
- (0, _defineProperty2.default)(FileCardImageViewBase, "defaultProps", {
333
+ exports.FileCardImageView = FileCardImageView;
334
+ (0, _defineProperty2.default)(FileCardImageView, "defaultProps", {
384
335
  resizeMode: 'crop',
385
336
  disableOverlay: false
386
- });
387
- var FileCardImageView = (0, _analyticsNext.withAnalyticsEvents)()((0, _fileAttributesContext.withFileAttributes)(FileCardImageViewBase));
388
- exports.FileCardImageView = FileCardImageView;
337
+ });
@@ -9,11 +9,5 @@ Object.defineProperty(exports, "FileCardImageView", {
9
9
  return _cardImageView.FileCardImageView;
10
10
  }
11
11
  });
12
- Object.defineProperty(exports, "FileCardImageViewBase", {
13
- enumerable: true,
14
- get: function get() {
15
- return _cardImageView.FileCardImageViewBase;
16
- }
17
- });
18
12
 
19
13
  var _cardImageView = require("./cardImageView");
@@ -7,29 +7,17 @@ exports.fireScreenEvent = exports.fireCopiedEvent = exports.fireCommencedEvent =
7
7
 
8
8
  var _analytics = require("../../utils/analytics");
9
9
 
10
- var relevantFeatureFlagNames = ['newCardExperience', 'poll_intervalMs', 'poll_maxAttempts', 'poll_backoffFactor', 'poll_maxIntervalMs', 'captions'];
10
+ var relevantFeatureFlagNames = ['newCardExperience', 'captions'];
11
11
  exports.relevantFeatureFlagNames = relevantFeatureFlagNames;
12
12
 
13
- var fireOperationalEvent = function fireOperationalEvent(createAnalyticsEvent, status, fileAttributes, performanceAttributes) {
14
- var _ref = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {},
15
- cardPreview = _ref.cardPreview,
16
- error = _ref.error;
17
-
13
+ var fireOperationalEvent = function fireOperationalEvent(createAnalyticsEvent, status, fileAttributes, performanceAttributes, error) {
18
14
  var fireEvent = function fireEvent(payload) {
19
15
  return (0, _analytics.fireMediaCardEvent)(payload, createAnalyticsEvent);
20
16
  };
21
17
 
22
18
  switch (status) {
23
19
  case 'complete':
24
- /**
25
- * A Card that is considered Complete and has no preview,
26
- * reflects an expected behaviour, and thus a legitimate
27
- * success case to be logged.
28
- */
29
- if (!(cardPreview !== null && cardPreview !== void 0 && cardPreview.dataURI)) {
30
- fireEvent((0, _analytics.getRenderSucceededEventPayload)(fileAttributes, performanceAttributes));
31
- }
32
-
20
+ fireEvent((0, _analytics.getRenderSucceededEventPayload)(fileAttributes, performanceAttributes));
33
21
  break;
34
22
 
35
23
  case 'failed-processing':
@@ -11,6 +11,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
11
11
 
12
12
  var _react = _interopRequireDefault(require("react"));
13
13
 
14
+ var _mediaClient = require("@atlaskit/media-client");
15
+
14
16
  var _mediaUi = require("@atlaskit/media-ui");
15
17
 
16
18
  var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
@@ -51,7 +53,7 @@ var CardSSRView = function CardSSRView(_ref) {
51
53
  width = _getRequestedDimensio.width,
52
54
  height = _getRequestedDimensio.height;
53
55
 
54
- var mode = resizeMode === 'stretchy-fit' ? 'full-fit' : resizeMode;
56
+ var mode = (0, _mediaClient.imageResizeModeToFileImageMode)(resizeMode);
55
57
  dataURI = mediaClient.getImageUrlSync(identifier.id, {
56
58
  collection: identifier.collectionName,
57
59
  mode: mode,
@@ -71,7 +73,7 @@ var CardSSRView = function CardSSRView(_ref) {
71
73
  breakpoint: calculateBreakpoint(dimensions),
72
74
  shouldUsePointerCursor: Boolean(dataURI),
73
75
  displayBackground: shouldDisplayBackground,
74
- disableOverlay: disableOverlay,
76
+ disableOverlay: !!disableOverlay,
75
77
  selected: false,
76
78
  "data-testid": "media-card-view"
77
79
  }, /*#__PURE__*/_react.default.createElement(_styledSSR.CardImageContainer, {
@@ -0,0 +1,50 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.getCardStateFromFileState = exports.createStateUpdater = void 0;
9
+
10
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
+
12
+ var _mediaClient = require("@atlaskit/media-client");
13
+
14
+ var _errors = require("../../errors");
15
+
16
+ var _getCardStatus = require("./getCardStatus");
17
+
18
+ var _getCardPreview = require("./getCardPreview");
19
+
20
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
21
+
22
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
23
+
24
+ var createStateUpdater = function createStateUpdater(newState) {
25
+ return function (prevState) {
26
+ // Only override if previous status is non-final
27
+ // or new status is 'complete'
28
+ if ((0, _getCardStatus.isFinalCardStatus)(prevState.status) && newState.status !== 'complete') {
29
+ return prevState;
30
+ }
31
+
32
+ return _objectSpread(_objectSpread({}, prevState), newState);
33
+ };
34
+ };
35
+
36
+ exports.createStateUpdater = createStateUpdater;
37
+
38
+ var getCardStateFromFileState = function getCardStateFromFileState(fileState, isBannedLocalPreview, featureFlags) {
39
+ var status = (0, _getCardStatus.getCardStatus)(fileState.status, (0, _getCardPreview.extractFilePreviewStatus)(fileState, isBannedLocalPreview, featureFlags));
40
+ var error = status === 'error' && (0, _mediaClient.isErrorFileState)(fileState) ? new _errors.MediaCardError('error-file-state', new Error(fileState.message)) : undefined;
41
+ var progress = status === 'uploading' && fileState.status === 'uploading' ? fileState.progress : 1;
42
+ return {
43
+ fileState: fileState,
44
+ status: status,
45
+ progress: progress,
46
+ error: error
47
+ };
48
+ };
49
+
50
+ exports.getCardStateFromFileState = getCardStateFromFileState;
@@ -34,6 +34,11 @@ var CardPreviewCacheImpl = function CardPreviewCacheImpl(previewCache) {
34
34
 
35
35
  _this.previewCache.set(cacheKey, cardPreview);
36
36
  });
37
+ (0, _defineProperty2.default)(this, "remove", function (id, dimensions) {
38
+ var cacheKey = getCacheKey(id, dimensions);
39
+
40
+ _this.previewCache.remove(cacheKey);
41
+ });
37
42
  this.previewCache = previewCache;
38
43
  };
39
44
 
@@ -0,0 +1,50 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.isPreviewableStatus = exports.extractFilePreviewStatus = void 0;
7
+
8
+ var _mediaCommon = require("@atlaskit/media-common");
9
+
10
+ var _mediaClient = require("@atlaskit/media-client");
11
+
12
+ var _helpers = require("./helpers");
13
+
14
+ // TODO: align these checks with helpers from Media Client
15
+ // https://product-fabric.atlassian.net/browse/BMPT-1300
16
+ var extractFilePreviewStatus = function extractFilePreviewStatus(fileState, isBannedLocalPreview, featureFlags) {
17
+ var hasFilesize = 'size' in fileState && !!fileState.size;
18
+
19
+ var _ref = 'mediaType' in fileState && fileState || {},
20
+ mediaType = _ref.mediaType;
21
+
22
+ var _ref2 = 'mimeType' in fileState && fileState || {},
23
+ mimeType = _ref2.mimeType;
24
+
25
+ var isPreviewable = !!mediaType && (0, _mediaClient.isPreviewableType)(mediaType, featureFlags); // Local preview is available only if it's supported by browser and supported by Media Card (isSupportedLocalPreview)
26
+ // For example, SVGs are mime type NOT supported by browser but media type supported by Media Card (image)
27
+ // Then, local Preview NOT available
28
+
29
+ var hasLocalPreview = !isBannedLocalPreview && (0, _mediaClient.isPreviewableFileState)(fileState) && (0, _helpers.isSupportedLocalPreview)(mediaType) && !!mimeType && (0, _mediaCommon.isMimeTypeSupportedByBrowser)(mimeType);
30
+ var hasRemotePreview = (0, _mediaClient.isImageRepresentationReady)(fileState);
31
+ var hasPreview = hasLocalPreview || hasRemotePreview;
32
+ var isSupportedByBrowser = !!mimeType && (0, _mediaCommon.isMimeTypeSupportedByBrowser)(mimeType);
33
+ return {
34
+ hasFilesize: hasFilesize,
35
+ isPreviewable: isPreviewable,
36
+ hasPreview: hasPreview,
37
+ isSupportedByBrowser: isSupportedByBrowser
38
+ };
39
+ };
40
+
41
+ exports.extractFilePreviewStatus = extractFilePreviewStatus;
42
+
43
+ var isPreviewableStatus = function isPreviewableStatus(cardStatus, _ref3) {
44
+ var isPreviewable = _ref3.isPreviewable,
45
+ hasPreview = _ref3.hasPreview,
46
+ isSupportedByBrowser = _ref3.isSupportedByBrowser;
47
+ return hasPreview && isPreviewable && (cardStatus === 'complete' || cardStatus === 'loading-preview' || cardStatus === 'uploading' || cardStatus === 'processing' && isSupportedByBrowser);
48
+ };
49
+
50
+ exports.isPreviewableStatus = isPreviewableStatus;
@@ -176,25 +176,17 @@ var getCardPreviewFromFilePreview = /*#__PURE__*/function () {
176
176
  exports.getCardPreviewFromFilePreview = getCardPreviewFromFilePreview;
177
177
 
178
178
  var getCardPreviewFromBackend = /*#__PURE__*/function () {
179
- var _ref5 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(mediaClient, id, _ref4, collectionName, resizeMode) {
180
- var width, height, mode, blob;
179
+ var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(mediaClient, id, params) {
180
+ var blob;
181
181
  return _regenerator.default.wrap(function _callee4$(_context4) {
182
182
  while (1) {
183
183
  switch (_context4.prev = _context4.next) {
184
184
  case 0:
185
- width = _ref4.width, height = _ref4.height;
186
- _context4.prev = 1;
187
- mode = resizeMode === 'stretchy-fit' ? 'full-fit' : resizeMode;
188
- _context4.next = 5;
189
- return mediaClient.getImage(id, {
190
- collection: collectionName,
191
- mode: mode,
192
- width: width,
193
- height: height,
194
- allowAnimated: true
195
- });
185
+ _context4.prev = 0;
186
+ _context4.next = 3;
187
+ return mediaClient.getImage(id, params);
196
188
 
197
- case 5:
189
+ case 3:
198
190
  blob = _context4.sent;
199
191
  return _context4.abrupt("return", {
200
192
  dataURI: URL.createObjectURL(blob),
@@ -202,21 +194,21 @@ var getCardPreviewFromBackend = /*#__PURE__*/function () {
202
194
  source: 'remote'
203
195
  });
204
196
 
205
- case 9:
206
- _context4.prev = 9;
207
- _context4.t0 = _context4["catch"](1);
197
+ case 7:
198
+ _context4.prev = 7;
199
+ _context4.t0 = _context4["catch"](0);
208
200
  throw new _errors.RemotePreviewError('remote-preview-fetch', _context4.t0);
209
201
 
210
- case 12:
202
+ case 10:
211
203
  case "end":
212
204
  return _context4.stop();
213
205
  }
214
206
  }
215
- }, _callee4, null, [[1, 9]]);
207
+ }, _callee4, null, [[0, 7]]);
216
208
  }));
217
209
 
218
- return function getCardPreviewFromBackend(_x4, _x5, _x6, _x7, _x8) {
219
- return _ref5.apply(this, arguments);
210
+ return function getCardPreviewFromBackend(_x4, _x5, _x6) {
211
+ return _ref4.apply(this, arguments);
220
212
  };
221
213
  }();
222
214