@atlaskit/media-card 71.0.0 → 73.1.0

package/dist/esm/root/card/getCardPreview/filePreviewStatus.js

@@ -0,0 +1,38 @@
+import { isMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
+import { isPreviewableFileState, isPreviewableType, isImageRepresentationReady } from '@atlaskit/media-client';
+import { isSupportedLocalPreview } from './helpers'; // TODO: align these checks with helpers from Media Client
+// https://product-fabric.atlassian.net/browse/BMPT-1300
+
+export var extractFilePreviewStatus = function extractFilePreviewStatus(fileState, isBannedLocalPreview, featureFlags) {
+  var hasFilesize = 'size' in fileState && !!fileState.size;
+
+  var _ref = 'mediaType' in fileState && fileState || {},
+      mediaType = _ref.mediaType;
+
+  var _ref2 = 'mimeType' in fileState && fileState || {},
+      mimeType = _ref2.mimeType;
+
+  var isPreviewable = !!mediaType && isPreviewableType(mediaType, featureFlags); // Local preview is available only if it's supported by browser and supported by Media Card (isSupportedLocalPreview)
+  // For example, SVGs are mime type NOT supported by browser but media type supported by Media Card (image)
+  // Then, local Preview NOT available
+
+  var hasLocalPreview = !isBannedLocalPreview && isPreviewableFileState(fileState) && isSupportedLocalPreview(mediaType) && !!mimeType && isMimeTypeSupportedByBrowser(mimeType);
+  var hasRemotePreview = isImageRepresentationReady(fileState);
+  var hasPreview = hasLocalPreview || hasRemotePreview;
+  var isSupportedByBrowser = !!mimeType && isMimeTypeSupportedByBrowser(mimeType);
+  return {
+    hasFilesize: hasFilesize,
+    isPreviewable: isPreviewable,
+    hasPreview: hasPreview,
+    isSupportedByBrowser: isSupportedByBrowser
+  };
+};
+export var isPreviewableStatus = function isPreviewableStatus(cardStatus, _ref3) {
+  var isPreviewable = _ref3.isPreviewable,
+      hasPreview = _ref3.hasPreview,
+      isSupportedByBrowser = _ref3.isSupportedByBrowser;
+  return hasPreview && isPreviewable && (cardStatus === 'complete' || cardStatus === 'loading-preview' || cardStatus === 'uploading' || // For Video, we can have local or remote preview while processing.
+  // Then, we only want to show the thumbnail if the file is supported by the browser,
+  // this way we prevent playing unsupported videos that are not procesed
+  cardStatus === 'processing' && isSupportedByBrowser);
+};

package/dist/esm/root/card/getCardPreview/helpers.js

@@ -157,25 +157,17 @@ export var getCardPreviewFromFilePreview = /*#__PURE__*/function () {
   };
 }();
 export var getCardPreviewFromBackend = /*#__PURE__*/function () {
-  var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(mediaClient, id, _ref4, collectionName, resizeMode) {
-    var width, height, mode, blob;
+  var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(mediaClient, id, params) {
+    var blob;
     return _regeneratorRuntime.wrap(function _callee4$(_context4) {
       while (1) {
         switch (_context4.prev = _context4.next) {
           case 0:
-            width = _ref4.width, height = _ref4.height;
-            _context4.prev = 1;
-            mode = resizeMode === 'stretchy-fit' ? 'full-fit' : resizeMode;
-            _context4.next = 5;
-            return mediaClient.getImage(id, {
-              collection: collectionName,
-              mode: mode,
-              width: width,
-              height: height,
-              allowAnimated: true
-            });
+            _context4.prev = 0;
+            _context4.next = 3;
+            return mediaClient.getImage(id, params);
 
-          case 5:
+          case 3:
             blob = _context4.sent;
             return _context4.abrupt("return", {
               dataURI: URL.createObjectURL(blob),
@@ -183,20 +175,20 @@ export var getCardPreviewFromBackend = /*#__PURE__*/function () {
               source: 'remote'
             });
 
-          case 9:
-            _context4.prev = 9;
-            _context4.t0 = _context4["catch"](1);
+          case 7:
+            _context4.prev = 7;
+            _context4.t0 = _context4["catch"](0);
             throw new RemotePreviewError('remote-preview-fetch', _context4.t0);
 
-          case 12:
+          case 10:
           case "end":
             return _context4.stop();
         }
       }
-    }, _callee4, null, [[1, 9]]);
+    }, _callee4, null, [[0, 7]]);
   }));
 
-  return function getCardPreviewFromBackend(_x4, _x5, _x6, _x7, _x8) {
-    return _ref5.apply(this, arguments);
+  return function getCardPreviewFromBackend(_x4, _x5, _x6) {
+    return _ref4.apply(this, arguments);
   };
 }();

package/dist/esm/root/card/getCardPreview/index.js

@@ -1,53 +1,22 @@
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 
-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; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-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) { _defineProperty(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; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import { isPreviewableFileState, isPreviewableType, isImageRepresentationReady } from '@atlaskit/media-client';
+import { isPreviewableFileState, addFileAttrsToUrl } from '@atlaskit/media-client';
 import { isMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
 import cardPreviewCache from './cache';
-import { getCardPreviewFromFilePreview, getCardPreviewFromBackend, isSupportedLocalPreview } from './helpers';
-import { MediaCardError, isUnsupportedLocalPreviewError } from '../../../errors';
-export { getCardPreviewFromFilePreview, getCardPreviewFromBackend, isSupportedLocalPreview } from './helpers'; // TODO: align these checks with helpers from Media Client
-// https://product-fabric.atlassian.net/browse/BMPT-1300
-
-export var extractFilePreviewStatus = function extractFilePreviewStatus(fileState, featureFlags) {
-  var hasFilesize = 'size' in fileState && !!fileState.size;
-
-  var _ref = 'mediaType' in fileState && fileState || {},
-      mediaType = _ref.mediaType;
-
-  var _ref2 = 'mimeType' in fileState && fileState || {},
-      mimeType = _ref2.mimeType;
-
-  var isPreviewable = !!mediaType && isPreviewableType(mediaType, featureFlags);
-  /**
-   * Local preview is available only if it's supported by browser and supported by Media Card (isSupportedLocalPreview)
-   * For example, SVGs are mime type NOT supported by browser but media type supported by Media Card (image)
-   * Then, local Preview NOT available
-   */
-
-  var hasLocalPreview = isPreviewableFileState(fileState) && isSupportedLocalPreview(mediaType) && !!mimeType && isMimeTypeSupportedByBrowser(mimeType);
-  var hasRemotePreview = isImageRepresentationReady(fileState);
-  var hasPreview = hasLocalPreview || hasRemotePreview;
-  var isSupportedByBrowser = !!mimeType && isMimeTypeSupportedByBrowser(mimeType);
-  return {
-    hasFilesize: hasFilesize,
-    isPreviewable: isPreviewable,
-    hasPreview: hasPreview,
-    isSupportedByBrowser: isSupportedByBrowser
-  };
-};
-export var shouldGetCardPreview = function shouldGetCardPreview(cardStatus, _ref3) {
-  var isPreviewable = _ref3.isPreviewable,
-      hasPreview = _ref3.hasPreview,
-      isSupportedByBrowser = _ref3.isSupportedByBrowser;
-  return cardStatus === 'loading-preview' || cardStatus === 'uploading' && hasPreview && isPreviewable || cardStatus === 'processing' && hasPreview && isPreviewable && isSupportedByBrowser;
-};
+import { getCardPreviewFromFilePreview, getCardPreviewFromBackend } from './helpers';
+import { MediaCardError, SsrPreviewError, isUnsupportedLocalPreviewError } from '../../../errors';
+import { isBigger } from '../../../utils/dimensionComparer';
+import { extractFilePreviewStatus, isPreviewableStatus } from './filePreviewStatus';
+export { getCardPreviewFromFilePreview, getCardPreviewFromBackend, isSupportedLocalPreview } from './helpers';
+export { extractFilePreviewStatus } from './filePreviewStatus';
 export var getCardPreviewFromCache = cardPreviewCache.get;
+export var removeCardPreviewFromCache = cardPreviewCache.remove;
 /**
  * Will return the preview if available and supported by the browser
  * See extractFilePreviewStatus "hasLocalPreview" logic
@@ -57,6 +26,41 @@ export var getFilePreviewFromFileState = function getFilePreviewFromFileState(fi
   return 'mimeType' in fileState && isMimeTypeSupportedByBrowser(fileState.mimeType) && isPreviewableFileState(fileState) ? fileState.preview : undefined;
 };
 
+var extendAndCachePreview = function extendAndCachePreview(id, dimensions, preview, mediaBlobUrlAttrs) {
+  var source;
+
+  switch (preview.source) {
+    case 'local':
+      source = 'cache-local';
+      break;
+
+    case 'remote':
+      source = 'cache-remote';
+      break;
+
+    case 'ssr-server':
+      source = 'cache-ssr-server';
+      break;
+
+    case 'ssr-client':
+      source = 'cache-ssr-client';
+      break;
+
+    default:
+      source = preview.source;
+  } // We want to embed some meta context into dataURI for Copy/Paste to work.
+
+
+  var dataURI = mediaBlobUrlAttrs ? addFileAttrsToUrl(preview.dataURI, mediaBlobUrlAttrs) : preview.dataURI; // We store new cardPreview into cache
+
+  cardPreviewCache.set(id, dimensions, _objectSpread(_objectSpread({}, preview), {}, {
+    source: source,
+    dataURI: dataURI
+  }));
+  return _objectSpread(_objectSpread({}, preview), {}, {
+    dataURI: dataURI
+  });
+};
 /**
  * This function will try to return a Card preview, either from cache, local preview or remote preview.
  * It should only be called if there is a chance to get either a remote or a local preview, or both.
@@ -67,49 +71,48 @@ export var getFilePreviewFromFileState = function getFilePreviewFromFileState(fi
  * In that case, we still want to report the local preview error to the caller, for feature realiability track.
  * hence the use of the optional callback onLocalPreviewError
  */
+
+
 export var getCardPreview = /*#__PURE__*/function () {
-  var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref4) {
-    var mediaClient, id, collectionName, requestedDimensions, isRemotePreviewReady, addContextToDataURI, filePreview, _ref4$dimensions, dimensions, resizeMode, onLocalPreviewError, cardPreview;
+  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref) {
+    var mediaClient, id, _ref$dimensions, dimensions, filePreview, onLocalPreviewError, isRemotePreviewReady, imageUrlParams, mediaBlobUrlAttrs, cachedPreview, localPreview;
 
     return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) {
         switch (_context.prev = _context.next) {
           case 0:
-            mediaClient = _ref4.mediaClient, id = _ref4.id, collectionName = _ref4.collectionName, requestedDimensions = _ref4.requestedDimensions, isRemotePreviewReady = _ref4.isRemotePreviewReady, addContextToDataURI = _ref4.addContextToDataURI, filePreview = _ref4.filePreview, _ref4$dimensions = _ref4.dimensions, dimensions = _ref4$dimensions === void 0 ? {} : _ref4$dimensions, resizeMode = _ref4.resizeMode, onLocalPreviewError = _ref4.onLocalPreviewError;
-            cardPreview = cardPreviewCache.get(id, dimensions);
+            mediaClient = _ref.mediaClient, id = _ref.id, _ref$dimensions = _ref.dimensions, dimensions = _ref$dimensions === void 0 ? {} : _ref$dimensions, filePreview = _ref.filePreview, onLocalPreviewError = _ref.onLocalPreviewError, isRemotePreviewReady = _ref.isRemotePreviewReady, imageUrlParams = _ref.imageUrlParams, mediaBlobUrlAttrs = _ref.mediaBlobUrlAttrs;
+            cachedPreview = cardPreviewCache.get(id, dimensions);
 
-            if (!cardPreview) {
+            if (!cachedPreview) {
               _context.next = 4;
               break;
             }
 
-            return _context.abrupt("return", _objectSpread(_objectSpread({}, cardPreview), {}, {
-              source: 'cache'
-            }));
+            return _context.abrupt("return", cachedPreview);
 
           case 4:
             _context.prev = 4;
-            _context.t0 = filePreview;
 
-            if (!_context.t0) {
+            if (!filePreview) {
               _context.next = 10;
               break;
             }
 
-            _context.next = 9;
+            _context.next = 8;
             return getCardPreviewFromFilePreview(filePreview);
 
-          case 9:
-            _context.t0 = _context.sent;
+          case 8:
+            localPreview = _context.sent;
+            return _context.abrupt("return", extendAndCachePreview(id, dimensions, localPreview, mediaBlobUrlAttrs));
 
           case 10:
-            cardPreview = _context.t0;
-            _context.next = 18;
+            _context.next = 17;
             break;
 
-          case 13:
-            _context.prev = 13;
-            _context.t1 = _context["catch"](4);
+          case 12:
+            _context.prev = 12;
+            _context.t0 = _context["catch"](4);
 
             /**
              * We report the error if:
@@ -121,8 +124,8 @@ export var getCardPreview = /*#__PURE__*/function () {
              *   i.e. local preview is available and not supported,
              *   but we are after the remote preview instead.
              */
-            if (!isUnsupportedLocalPreviewError(_context.t1) || isUnsupportedLocalPreviewError(_context.t1) && !isRemotePreviewReady) {
-              onLocalPreviewError && onLocalPreviewError(_context.t1);
+            if (!isUnsupportedLocalPreviewError(_context.t0) || isUnsupportedLocalPreviewError(_context.t0) && !isRemotePreviewReady) {
+              onLocalPreviewError && onLocalPreviewError(_context.t0);
             }
             /**
              * No matter the reason why the local preview failed, we break the process
@@ -131,53 +134,103 @@ export var getCardPreview = /*#__PURE__*/function () {
 
 
             if (isRemotePreviewReady) {
-              _context.next = 18;
+              _context.next = 17;
               break;
             }
 
-            throw _context.t1;
-
-          case 18:
-            if (cardPreview) {
-              _context.next = 24;
-              break;
-            }
+            throw _context.t0;
 
+          case 17:
             if (isRemotePreviewReady) {
-              _context.next = 21;
+              _context.next = 19;
               break;
             }
 
             throw new MediaCardError('remote-preview-not-ready');
 
-          case 21:
-            _context.next = 23;
-            return getCardPreviewFromBackend(mediaClient, id, requestedDimensions, collectionName, resizeMode);
+          case 19:
+            return _context.abrupt("return", fetchAndCacheRemotePreview(mediaClient, id, dimensions, imageUrlParams, mediaBlobUrlAttrs));
 
-          case 23:
-            cardPreview = _context.sent;
+          case 20:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee, null, [[4, 12]]);
+  }));
 
-          case 24:
-            /**
-             * In case we've retrieved cardPreview using one of the two methods above,
-             * we want to embed some meta context into dataURI for Copy/Paste to work.
-             */
-            cardPreview = _objectSpread(_objectSpread({}, cardPreview), {}, {
-              dataURI: addContextToDataURI(cardPreview.dataURI)
-            }); // We store new cardPreview into cache
+  return function getCardPreview(_x) {
+    return _ref2.apply(this, arguments);
+  };
+}();
+export var shouldResolvePreview = function shouldResolvePreview(_ref3) {
+  var status = _ref3.status,
+      fileState = _ref3.fileState,
+      dimensions = _ref3.dimensions,
+      prevDimensions = _ref3.prevDimensions,
+      hasCardPreview = _ref3.hasCardPreview,
+      isBannedLocalPreview = _ref3.isBannedLocalPreview,
+      featureFlags = _ref3.featureFlags;
+  var statusIsPreviewable = isPreviewableStatus(status, extractFilePreviewStatus(fileState, isBannedLocalPreview, featureFlags));
+  var dimensionsAreBigger = isBigger(prevDimensions, dimensions);
+  return statusIsPreviewable && (!hasCardPreview || dimensionsAreBigger);
+};
+export var getSSRCardPreview = function getSSRCardPreview(ssr, mediaClient, id, params, mediaBlobUrlAttrs) {
+  var dataURI;
+
+  try {
+    var rawDataURI = mediaClient.getImageUrlSync(id, params); // We want to embed some meta context into dataURI for Copy/Paste to work.
+
+    dataURI = mediaBlobUrlAttrs ? addFileAttrsToUrl(rawDataURI, mediaBlobUrlAttrs) : rawDataURI;
+    var source = ssr === 'client' ? 'ssr-client' : 'ssr-server';
+    return {
+      dataURI: dataURI,
+      source: source,
+      orientation: 1
+    };
+  } catch (e) {
+    var reason = ssr === 'server' ? 'ssr-server-uri' : 'ssr-client-uri';
+    throw new SsrPreviewError(reason, e);
+  }
+};
+export var isLocalPreview = function isLocalPreview(preview) {
+  var localSources = ['local', 'cache-local'];
+  return localSources.includes(preview.source);
+};
+export var isSSRPreview = function isSSRPreview(preview) {
+  return isSSRClientPreview(preview) || isSSRServerPreview(preview);
+};
+export var isSSRServerPreview = function isSSRServerPreview(preview) {
+  var ssrClientSources = ['ssr-server', 'cache-ssr-server'];
+  return ssrClientSources.includes(preview.source);
+};
+export var isSSRClientPreview = function isSSRClientPreview(preview) {
+  var ssrClientSources = ['ssr-client', 'cache-ssr-client'];
+  return ssrClientSources.includes(preview.source);
+};
+export var fetchAndCacheRemotePreview = /*#__PURE__*/function () {
+  var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(mediaClient, id, dimensions, params, mediaBlobUrlAttrs) {
+    var remotePreview;
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.next = 2;
+            return getCardPreviewFromBackend(mediaClient, id, params);
 
-            cardPreviewCache.set(id, dimensions, cardPreview);
-            return _context.abrupt("return", cardPreview);
+          case 2:
+            remotePreview = _context2.sent;
+            return _context2.abrupt("return", extendAndCachePreview(id, dimensions, remotePreview, mediaBlobUrlAttrs));
 
-          case 27:
+          case 4:
           case "end":
-            return _context.stop();
+            return _context2.stop();
         }
       }
-    }, _callee, null, [[4, 13]]);
+    }, _callee2);
   }));
 
-  return function getCardPreview(_x) {
-    return _ref5.apply(this, arguments);
+  return function fetchAndCacheRemotePreview(_x2, _x3, _x4, _x5, _x6) {
+    return _ref4.apply(this, arguments);
   };
 }();

package/dist/esm/root/card/getCardStatus.js

@@ -1,3 +1,6 @@
+export var isFinalCardStatus = function isFinalCardStatus(status) {
+  return ['complete', 'error', 'failed-processing'].includes(status);
+};
 export var getCardStatus = function getCardStatus(fileStatus, _ref) {
   var hasFilesize = _ref.hasFilesize,
       isPreviewable = _ref.isPreviewable,