@atlaskit/media-picker 64.3.0 → 64.4.0

package/dist/esm/service/uploadServiceImpl.js

@@ -22,21 +22,19 @@ export var UploadServiceImpl = /*#__PURE__*/function () {
       var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(cancellableFileUpload, fileId, traceContext) {
         var mediaFile;
         return _regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                mediaFile = cancellableFileUpload.mediaFile;
-                _this.emit('file-converting', {
-                  file: mediaFile,
-                  traceContext: traceContext
-                });
-                cancellableFileUpload.cancel = function () {
-                  _this.releaseCancellableFile(mediaFile);
-                };
-              case 3:
-              case "end":
-                return _context.stop();
-            }
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              mediaFile = cancellableFileUpload.mediaFile;
+              _this.emit('file-converting', {
+                file: mediaFile,
+                traceContext: traceContext
+              });
+              cancellableFileUpload.cancel = function () {
+                _this.releaseCancellableFile(mediaFile);
+              };
+            case 3:
+            case "end":
+              return _context.stop();
           }
         }, _callee);
       }));
@@ -103,121 +101,171 @@ export var UploadServiceImpl = /*#__PURE__*/function () {
     }
   }, {
     key: "addFilesWithSource",
-    value: function addFilesWithSource(files, featureFlags) {
-      var _this2 = this;
-      if (files.length === 0) {
-        return;
-      }
-      var creationDate = Date.now();
-      var userMediaClient = this.userMediaClient,
-        tenantMediaClient = this.tenantMediaClient,
-        shouldCopyFileToRecents = this.shouldCopyFileToRecents;
-      var mediaClient = shouldCopyFileToRecents ? tenantMediaClient : userMediaClient;
-      var _this$tenantUploadPar = this.tenantUploadParams,
-        collectionTentant = _this$tenantUploadPar.collection,
-        expireAfter = _this$tenantUploadPar.expireAfter;
-      var collection = shouldCopyFileToRecents ? collectionTentant : RECENTS_COLLECTION;
-      if (!mediaClient) {
-        return;
-      }
-      var touchFileDescriptors = [];
-      for (var i = 0; i < files.length; i++) {
-        var replaceFileId = files[i].replaceFileId;
-        touchFileDescriptors.push({
-          fileId: replaceFileId || uuidV4(),
-          occurrenceKey: uuidV4(),
-          collection: collection,
-          expireAfter: expireAfter
-        });
-      }
-      var traceContext = {
-        traceId: getRandomHex(8)
-      };
-      var promisedTouchFiles = mediaClient.file.touchFiles(touchFileDescriptors, collection, traceContext);
-      var cancellableFileUploads = files.map(function (fileWithSource, i) {
-        var file = fileWithSource.file,
-          source = fileWithSource.source;
-        var _touchFileDescriptors = touchFileDescriptors[i],
-          id = _touchFileDescriptors.fileId,
-          occurrenceKey = _touchFileDescriptors.occurrenceKey;
-        var deferredUploadId = promisedTouchFiles.then(function (touchedFiles) {
-          var touchedFile = touchedFiles.created.find(function (touchedFile) {
-            return touchedFile.fileId === id;
-          });
-          if (!touchedFile) {
-            // TODO No one seems to be caring about this error
-            throw new Error('Cant retrieve uploadId from result of touch endpoint call');
-          }
-          return touchedFile.uploadId;
-        }).catch(function (error) {
-          // note: any failures in this block will result in an error event being bubbled as required
-          if (error instanceof RequestError) {
-            var requestError = error;
-            if (requestError.metadata && requestError.metadata.statusCode === 409) {
-              return mediaClient.mediaStore.createUpload(1, collection, traceContext).then(function (res) {
-                return res.data[0].id;
-              });
-            }
-          }
-          throw error;
-        });
-        var uploadableFile = {
-          collection: collection,
-          content: file,
-          name: file.name,
-          mimeType: file.type
-        };
-        var uploadableUpfrontIds = {
-          id: id,
-          occurrenceKey: occurrenceKey,
-          deferredUploadId: deferredUploadId
-        };
-        var controller = _this2.createUploadController();
-        var sourceFileObservable = mediaClient.file.upload(uploadableFile, controller, uploadableUpfrontIds, traceContext, featureFlags);
-        var mediaFile = {
-          id: id,
-          name: file.name,
-          size: file.size,
-          creationDate: creationDate,
-          type: file.type,
-          occurrenceKey: occurrenceKey
-        };
-        var cancellableFileUpload = {
-          mediaFile: mediaFile,
-          file: file,
-          source: source,
-          cancel: function cancel() {
-            // we can't do "cancellableFileUpload.cancel = controller.abort" because will change the "this" mediaClient
-            controller.abort();
-          }
-        };
-        var onFileSuccess = _this2.onFileSuccess.bind(_this2);
-        sourceFileObservable.subscribe({
-          next: function next(state) {
-            if (state.status === 'processing') {
-              this.unsubscribe();
-              if (shouldCopyFileToRecents) {
-                mediaClient.emit('file-added', state);
-                globalMediaEventEmitter.emit('file-added', state);
+    value: function () {
+      var _addFilesWithSource = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(files, featureFlags) {
+        var _this2 = this;
+        var creationDate, userMediaClient, tenantMediaClient, shouldCopyFileToRecents, mediaClient, _this$tenantUploadPar, collectionTentant, expireAfter, collection, touchFileDescriptors, i, _files$i, replaceFileId, file, traceContext, touchedFiles, caughtError, cancellableFileUploads, filteredCancellableFileUploads, mediaFiles;
+        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              if (!(files.length === 0)) {
+                _context2.next = 2;
+                break;
+              }
+              return _context2.abrupt("return");
+            case 2:
+              creationDate = Date.now();
+              userMediaClient = this.userMediaClient, tenantMediaClient = this.tenantMediaClient, shouldCopyFileToRecents = this.shouldCopyFileToRecents;
+              mediaClient = shouldCopyFileToRecents ? tenantMediaClient : userMediaClient;
+              _this$tenantUploadPar = this.tenantUploadParams, collectionTentant = _this$tenantUploadPar.collection, expireAfter = _this$tenantUploadPar.expireAfter;
+              collection = shouldCopyFileToRecents ? collectionTentant : RECENTS_COLLECTION;
+              if (mediaClient) {
+                _context2.next = 9;
+                break;
               }
-              onFileSuccess(cancellableFileUpload, id, traceContext);
-            }
-          },
-          error: function error(_error) {
-            _this2.onFileError(mediaFile, 'upload_fail', _error, traceContext);
+              return _context2.abrupt("return");
+            case 9:
+              touchFileDescriptors = [];
+              for (i = 0; i < files.length; i++) {
+                _files$i = files[i], replaceFileId = _files$i.replaceFileId, file = _files$i.file;
+                touchFileDescriptors.push({
+                  fileId: replaceFileId || uuidV4(),
+                  occurrenceKey: uuidV4(),
+                  collection: collection,
+                  size: file.size,
+                  expireAfter: expireAfter
+                });
+              }
+              traceContext = {
+                traceId: getRandomHex(8)
+              };
+              _context2.prev = 12;
+              _context2.next = 15;
+              return mediaClient.file.touchFiles(touchFileDescriptors, collection, traceContext);
+            case 15:
+              touchedFiles = _context2.sent;
+              _context2.next = 21;
+              break;
+            case 18:
+              _context2.prev = 18;
+              _context2.t0 = _context2["catch"](12);
+              caughtError = _context2.t0;
+            case 21:
+              cancellableFileUploads = files.map(function (_ref2, i) {
+                var _touchedFiles, _touchedFiles2;
+                var file = _ref2.file,
+                  source = _ref2.source;
+                var _touchFileDescriptors = touchFileDescriptors[i],
+                  id = _touchFileDescriptors.fileId,
+                  occurrenceKey = _touchFileDescriptors.occurrenceKey;
+
+                // exclude rejected files from being uploaded
+                var rejectedFile = (_touchedFiles = touchedFiles) === null || _touchedFiles === void 0 ? void 0 : _touchedFiles.rejected.find(function (_ref3) {
+                  var rejectedFileId = _ref3.fileId;
+                  return rejectedFileId === id;
+                });
+                if (rejectedFile) {
+                  if (_this2.fileRejectionHandler) {
+                    _this2.fileRejectionHandler({
+                      reason: 'fileSizeLimitExceeded',
+                      file: file,
+                      limit: rejectedFile.error.limit
+                    });
+                  }
+                  return null;
+                }
+                var touchedFile = (_touchedFiles2 = touchedFiles) === null || _touchedFiles2 === void 0 ? void 0 : _touchedFiles2.created.find(function (touchedFile) {
+                  return touchedFile.fileId === id;
+                });
+                var deferredUploadId;
+                var isIdConflictError = caughtError && caughtError instanceof RequestError && caughtError.metadata && caughtError.metadata.statusCode === 409;
+                if (touchedFile) {
+                  deferredUploadId = Promise.resolve(touchedFile.uploadId);
+                } else if (isIdConflictError) {
+                  // will occur when the backend receives a fileId that already exists in which case
+                  // we will create a single upload session for that file and use that uploadId
+                  deferredUploadId = mediaClient.mediaStore.createUpload(1, collection, traceContext).then(function (res) {
+                    return res.data[0].id;
+                  });
+                } else {
+                  // in the case of unexpected errors, we want to defer the throwing of the error
+                  // until after the files-added has been emitted,
+                  // allows editor to show a broken media card for unexpected errors
+                  deferredUploadId = Promise.reject(caughtError);
+                }
+                var uploadableFile = {
+                  collection: collection,
+                  content: file,
+                  name: file.name,
+                  mimeType: file.type
+                };
+                var uploadableUpfrontIds = {
+                  id: id,
+                  occurrenceKey: occurrenceKey,
+                  deferredUploadId: deferredUploadId
+                };
+                var controller = _this2.createUploadController();
+                var sourceFileObservable = mediaClient.file.upload(uploadableFile, controller, uploadableUpfrontIds, traceContext, featureFlags);
+                var mediaFile = {
+                  id: id,
+                  name: file.name,
+                  size: file.size,
+                  creationDate: creationDate,
+                  type: file.type,
+                  occurrenceKey: occurrenceKey
+                };
+                var cancellableFileUpload = {
+                  mediaFile: mediaFile,
+                  file: file,
+                  source: source,
+                  cancel: function cancel() {
+                    // we can't do "cancellableFileUpload.cancel = controller.abort" because will change the "this" mediaClient
+                    controller.abort();
+                  }
+                };
+                var _sourceFileObservable = sourceFileObservable.subscribe({
+                    next: function next(state) {
+                      if (state.status === 'processing') {
+                        unsubscribe();
+                        if (shouldCopyFileToRecents) {
+                          mediaClient.emit('file-added', state);
+                          globalMediaEventEmitter.emit('file-added', state);
+                        }
+                        _this2.onFileSuccess(cancellableFileUpload, id, traceContext);
+                      }
+                    },
+                    error: function error(_error) {
+                      _this2.onFileError(mediaFile, 'upload_fail', _error, traceContext);
+                    }
+                  }),
+                  unsubscribe = _sourceFileObservable.unsubscribe;
+                _this2.cancellableFilesUploads[id] = cancellableFileUpload;
+                return cancellableFileUpload;
+              });
+              filteredCancellableFileUploads = cancellableFileUploads.filter(this.isCancellableFileUpload);
+              mediaFiles = filteredCancellableFileUploads.map(function (cancellableFileUpload) {
+                return cancellableFileUpload.mediaFile;
+              });
+              this.emit('files-added', {
+                files: mediaFiles,
+                traceContext: traceContext
+              });
+              this.emitPreviews(filteredCancellableFileUploads);
+            case 26:
+            case "end":
+              return _context2.stop();
           }
-        });
-        _this2.cancellableFilesUploads[id] = cancellableFileUpload;
-        return cancellableFileUpload;
-      });
-      var mediaFiles = cancellableFileUploads.map(function (cancellableFileUpload) {
-        return cancellableFileUpload.mediaFile;
-      });
-      this.emit('files-added', {
-        files: mediaFiles,
-        traceContext: traceContext
-      });
-      this.emitPreviews(cancellableFileUploads);
+        }, _callee2, this, [[12, 18]]);
+      }));
+      function addFilesWithSource(_x4, _x5) {
+        return _addFilesWithSource.apply(this, arguments);
+      }
+      return addFilesWithSource;
+    }()
+  }, {
+    key: "isCancellableFileUpload",
+    value: function isCancellableFileUpload(fileUpload) {
+      return fileUpload !== null;
     }
   }, {
     key: "cancel",
@@ -297,6 +345,11 @@ export var UploadServiceImpl = /*#__PURE__*/function () {
     value: function releaseCancellableFile(mediaFile) {
       delete this.cancellableFilesUploads[mediaFile.id];
     }
+  }, {
+    key: "onFileRejection",
+    value: function onFileRejection(handler) {
+      this.fileRejectionHandler = handler;
+    }
   }]);
   return UploadServiceImpl;
 }();

package/dist/esm/util/analytics.js

@@ -1,6 +1,9 @@
 import { isRequestError } from '@atlaskit/media-client';
+
+// Component name will be prefixed with "media-picker-" in logs. Check ufoExperiences in utils files
+
 var packageName = "@atlaskit/media-picker";
-var packageVersion = "64.3.0";
+var packageVersion = "64.4.0";
 export function getPackageAttributes(componentName) {
   return {
     packageName: packageName,

package/dist/esm/util/getPreviewFromBlob.js

@@ -11,39 +11,37 @@ function _getPreviewFromBlob() {
   _getPreviewFromBlob = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(mediaType, file) {
     var dimensions;
     return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _context.t0 = mediaType;
-            _context.next = _context.t0 === 'image' ? 3 : _context.t0 === 'video' ? 3 : 9;
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _context.t0 = mediaType;
+          _context.next = _context.t0 === 'image' ? 3 : _context.t0 === 'video' ? 3 : 9;
+          break;
+        case 3:
+          _context.next = 5;
+          return getDimensionsFromBlob(mediaType, file);
+        case 5:
+          dimensions = _context.sent;
+          if (!isUnknownDimensions(dimensions)) {
+            _context.next = 8;
             break;
-          case 3:
-            _context.next = 5;
-            return getDimensionsFromBlob(mediaType, file);
-          case 5:
-            dimensions = _context.sent;
-            if (!isUnknownDimensions(dimensions)) {
-              _context.next = 8;
-              break;
-            }
-            return _context.abrupt("return", {
-              file: file,
-              scaleFactor: 1
-            });
-          case 8:
-            return _context.abrupt("return", {
-              file: file,
-              dimensions: dimensions,
-              scaleFactor: 1
-            });
-          case 9:
-            return _context.abrupt("return", {
-              file: file
-            });
-          case 10:
-          case "end":
-            return _context.stop();
-        }
+          }
+          return _context.abrupt("return", {
+            file: file,
+            scaleFactor: 1
+          });
+        case 8:
+          return _context.abrupt("return", {
+            file: file,
+            dimensions: dimensions,
+            scaleFactor: 1
+          });
+        case 9:
+          return _context.abrupt("return", {
+            file: file
+          });
+        case 10:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   }));

package/dist/esm/util/getPreviewFromImage.js

@@ -8,39 +8,37 @@ function _getPreviewFromImage() {
   _getPreviewFromImage = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(file, devicePixelRatio) {
     var fileInfo, imageInfo, width, height, scaleFactor, preview;
     return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _context.next = 2;
-            return getFileInfo(file);
-          case 2:
-            fileInfo = _context.sent;
-            _context.next = 5;
-            return getImageInfo(fileInfo);
-          case 5:
-            imageInfo = _context.sent;
-            if (!(imageInfo === null)) {
-              _context.next = 10;
-              break;
-            }
-            return _context.abrupt("return", {
-              file: file
-            });
-          case 10:
-            width = imageInfo.width, height = imageInfo.height, scaleFactor = imageInfo.scaleFactor;
-            preview = {
-              file: file,
-              dimensions: {
-                width: width,
-                height: height
-              },
-              scaleFactor: devicePixelRatio || scaleFactor
-            };
-            return _context.abrupt("return", preview);
-          case 13:
-          case "end":
-            return _context.stop();
-        }
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _context.next = 2;
+          return getFileInfo(file);
+        case 2:
+          fileInfo = _context.sent;
+          _context.next = 5;
+          return getImageInfo(fileInfo);
+        case 5:
+          imageInfo = _context.sent;
+          if (!(imageInfo === null)) {
+            _context.next = 10;
+            break;
+          }
+          return _context.abrupt("return", {
+            file: file
+          });
+        case 10:
+          width = imageInfo.width, height = imageInfo.height, scaleFactor = imageInfo.scaleFactor;
+          preview = {
+            file: file,
+            dimensions: {
+              width: width,
+              height: height
+            },
+            scaleFactor: devicePixelRatio || scaleFactor
+          };
+          return _context.abrupt("return", preview);
+        case 13:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   }));

package/dist/esm/util/ufoExperiences.js

@@ -5,7 +5,7 @@ import { ConcurrentExperience, ExperiencePerformanceTypes, ExperienceTypes } fro
 import { getFeatureFlagKeysAllProducts } from '@atlaskit/media-common';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 var packageName = "@atlaskit/media-picker";
-var packageVersion = "64.3.0";
+var packageVersion = "64.4.0";
 var ufoExperience;
 var initExperience = function initExperience(id, componentName) {
   if (!ufoExperience) {

package/dist/esm/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/media-picker",
-	"version": "64.3.0"
+	"version": "64.4.0"
 }

package/dist/types/service/types.d.ts

@@ -13,11 +13,17 @@ export interface UploadService {
     setUploadParams(uploadParams: UploadParams): void;
     addFile(file: File, replaceFileId?: string, featureFlags?: MediaFeatureFlags): void;
     addFiles(files: File[], featureFlags?: MediaFeatureFlags): void;
-    addFilesWithSource(files: LocalFileWithSource[], featureFlags?: MediaFeatureFlags): void;
+    addFilesWithSource(files: LocalFileWithSource[], featureFlags?: MediaFeatureFlags): Promise<void>;
     cancel(id?: string): void;
     on<E extends keyof UploadServiceEventPayloadTypes>(event: E, listener: UploadServiceEventListener<E>): void;
     off<E extends keyof UploadServiceEventPayloadTypes>(event: E, listener: UploadServiceEventListener<E>): void;
+    onFileRejection(handler: (rejectionData: RejectionData) => void): void;
 }
+export declare type RejectionData = {
+    reason: 'fileSizeLimitExceeded';
+    file: File;
+    limit: number;
+};
 export declare enum LocalFileSource {
     PastedFile = "pastedFile",
     PastedScreenshot = "pastedScreenshot",

package/dist/types/service/uploadServiceImpl.d.ts

@@ -1,6 +1,6 @@
 import { MediaClient } from '@atlaskit/media-client';
 import { MediaFile, UploadParams } from '../types';
-import { UploadService, UploadServiceEventListener, UploadServiceEventPayloadTypes } from './types';
+import { RejectionData, UploadService, UploadServiceEventListener, UploadServiceEventPayloadTypes } from './types';
 import { LocalFileSource, LocalFileWithSource } from '../service/types';
 import { MediaFeatureFlags } from '@atlaskit/media-common';
 export interface CancellableFileUpload {
@@ -16,12 +16,14 @@ export declare class UploadServiceImpl implements UploadService {
     private readonly userMediaClient?;
     private readonly emitter;
     private cancellableFilesUploads;
+    private fileRejectionHandler?;
     constructor(tenantMediaClient: MediaClient, tenantUploadParams: UploadParams, shouldCopyFileToRecents: boolean);
     setUploadParams(uploadParams: UploadParams): void;
     private createUploadController;
     addFiles(files: File[], featureFlags?: MediaFeatureFlags): void;
     addFile(file: File, replaceFileId?: string): void;
-    addFilesWithSource(files: LocalFileWithSource[], featureFlags?: MediaFeatureFlags): void;
+    addFilesWithSource(files: LocalFileWithSource[], featureFlags?: MediaFeatureFlags): Promise<void>;
+    isCancellableFileUpload(fileUpload: null | CancellableFileUpload): fileUpload is CancellableFileUpload;
     cancel(id?: string): void;
     on<E extends keyof UploadServiceEventPayloadTypes>(event: E, listener: UploadServiceEventListener<E>): void;
     off<E extends keyof UploadServiceEventPayloadTypes>(event: E, listener: UploadServiceEventListener<E>): void;
@@ -31,4 +33,5 @@ export declare class UploadServiceImpl implements UploadService {
     private releaseCancellableFile;
     private readonly onFileSuccess;
     private readonly onFileError;
+    onFileRejection(handler: (rejectionData: RejectionData) => void): void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/media-picker",
-  "version": "64.3.0",
+  "version": "64.4.0",
   "description": "Library for handling file uploads",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@atlaskit/analytics-next": "^9.0.0",
-    "@atlaskit/media-client": "^20.2.0",
+    "@atlaskit/media-client": "^21.1.0",
     "@atlaskit/media-common": "^4.0.0",
     "@atlaskit/media-ui": "^22.3.0",
     "@atlaskit/ufo": "^0.1.0",
@@ -36,7 +36,6 @@
     "exenv": "^1.2.2",
     "flat-files": "^1.0.6",
     "perf-marks": "^1.5.0",
-    "rxjs": "^5.5.0",
     "uuid": "^3.1.0",
     "uuid-validate": "^0.0.3"
   },
@@ -47,14 +46,14 @@
     "react-intl-next": "npm:react-intl@^5.18.1"
   },
   "devDependencies": {
-    "@atlaskit/analytics-listeners": "^8.5.0",
+    "@atlaskit/analytics-listeners": "^8.6.0",
     "@atlaskit/analytics-namespaced-context": "^6.6.0",
     "@atlaskit/button": "^16.6.0",
     "@atlaskit/docs": "*",
     "@atlaskit/dropdown-menu": "^11.7.0",
     "@atlaskit/media-card": "^74.7.0",
     "@atlaskit/media-core": "^34.0.0",
-    "@atlaskit/media-test-helpers": "^31.0.0",
+    "@atlaskit/media-test-helpers": "^32.1.0",
     "@atlaskit/spinner": "^15.4.0",
     "@atlaskit/ssr": "*",
     "@atlaskit/toggle": "^12.5.0",