diff --git a/src/elements/content-uploader/ContentUploader.js b/src/elements/content-uploader/ContentUploader.js index ca1145829e..c62e9e7530 100644 --- a/src/elements/content-uploader/ContentUploader.js +++ b/src/elements/content-uploader/ContentUploader.js @@ -378,9 +378,7 @@ class ContentUploader extends Component { if (droppedItems.items) { this.addDataTransferItemsToUploadQueue(droppedItems.items, itemUpdateCallback); } else { - Array.from(droppedItems.files).forEach(file => { - this.addFilesToUploadQueue([file], itemUpdateCallback); - }); + this.addFilesToUploadQueue(Array.from(droppedItems.files), itemUpdateCallback); } }; @@ -426,20 +424,20 @@ class ContentUploader extends Component { * @private * @param {Array} dataTransferItems * @param {Function} itemUpdateCallback - * @returns {void} + * @returns {Promise} */ - addFileDataTransferItemsToUploadQueue = ( + addFileDataTransferItemsToUploadQueue = async ( dataTransferItems: Array, itemUpdateCallback: Function, - ): void => { - dataTransferItems.forEach(async item => { - const file = await getFileFromDataTransferItem(item); - if (!file) { - return; + ): Promise => { + const files = await Promise.all(dataTransferItems.map(async item => getFileFromDataTransferItem(item))); + const filesArray = []; + files.forEach(file => { + if (file) { + filesArray.push(file); } - - this.addFilesToUploadQueue([file], itemUpdateCallback); }); + this.addFilesToUploadQueue(filesArray, itemUpdateCallback); }; /** @@ -448,21 +446,22 @@ class ContentUploader extends Component { * @private * @param {Array} dataTransferItems * @param {Function} itemUpdateCallback - * @returns {void} + * @returns {Promise} */ - addPackageDataTransferItemsToUploadQueue = ( + addPackageDataTransferItemsToUploadQueue = async ( dataTransferItems: Array, itemUpdateCallback: Function, - ): void => { - dataTransferItems.forEach(item => { - const file = getPackageFileFromDataTransferItem(item); - - if (!file) { - return; + ): Promise => { + const packageFiles = await Promise.all( + dataTransferItems.map(async item => getPackageFileFromDataTransferItem(item)), + ); + const packageFilesArray = []; + packageFiles.forEach(packageFile => { + if (packageFile) { + packageFilesArray.push(packageFile); } - - this.addFilesToUploadQueue([file], itemUpdateCallback); }); + this.addFilesToUploadQueue(packageFilesArray, itemUpdateCallback); }; /** @@ -494,11 +493,28 @@ class ContentUploader extends Component { const fileAPIOptions: Object = getDataTransferItemAPIOptions(newItems[0]); const { folderId = rootFolderId } = fileAPIOptions; - newItems.forEach(async item => { - const folderUpload = this.getFolderUploadAPI(folderId); - await folderUpload.buildFolderTreeFromDataTransferItem(item); - this.addFolderToUploadQueue(folderUpload, itemUpdateCallback, fileAPIOptions); + const folderUploads = await Promise.all( + newItems.map(async item => { + const folderUpload = this.getFolderUploadAPI(folderId); + await folderUpload.buildFolderTreeFromDataTransferItem(item); + return folderUpload; + }), + ); + const folderUploadsArray = []; + folderUploads.forEach(folderUpload => { + // $FlowFixMe no file property + folderUploadsArray.push({ + api: folderUpload, + extension: '', + isFolder: true, + name: folderUpload.folder.name, + options: fileAPIOptions, + progress: 0, + size: 1, + status: STATUS_PENDING, + }); }); + this.addToQueue(folderUploadsArray, itemUpdateCallback); }; /** diff --git a/src/elements/content-uploader/__tests__/ContentUploader.test.js b/src/elements/content-uploader/__tests__/ContentUploader.test.js index 75737ded54..42887a0263 100644 --- a/src/elements/content-uploader/__tests__/ContentUploader.test.js +++ b/src/elements/content-uploader/__tests__/ContentUploader.test.js @@ -649,4 +649,57 @@ describe('elements/content-uploader/ContentUploader', () => { expect(instance.addFilesToUploadQueue).not.toHaveBeenCalled(); }); }); + + describe('addFileDataTransferItemsToUploadQueue()', () => { + test('should pass multiple files to the upload queue', async () => { + jest.spyOn(UploaderUtils, 'getFileFromDataTransferItem').mockResolvedValue(() => 'file'); + + const itemsLength = 3; + const wrapper = getWrapper(); + const instance = wrapper.instance(); + instance.addFilesToUploadQueue = jest.fn(); + + const files = createMockFiles(itemsLength); + await instance.addFileDataTransferItemsToUploadQueue(files, jest.fn()); + expect(instance.addFilesToUploadQueue).toBeCalledTimes(1); + expect(instance.addFilesToUploadQueue.mock.calls[0][0].length).toBe(itemsLength); + }); + }); + + describe('addPackageDataTransferItemsToUploadQueue()', () => { + test('should pass multiple packages to the upload queue', async () => { + jest.spyOn(UploaderUtils, 'getPackageFileFromDataTransferItem').mockResolvedValue(() => 'package'); + + const itemsLength = 3; + const wrapper = getWrapper(); + const instance = wrapper.instance(); + instance.addFilesToUploadQueue = jest.fn(); + + const files = createMockFiles(itemsLength); + await instance.addPackageDataTransferItemsToUploadQueue(files, jest.fn()); + expect(instance.addFilesToUploadQueue).toBeCalledTimes(1); + expect(instance.addFilesToUploadQueue.mock.calls[0][0].length).toBe(itemsLength); + }); + }); + + describe('addFolderDataTransferItemsToUploadQueue()', () => { + test('should pass multiple folders to the upload queue', async () => { + jest.spyOn(UploaderUtils, 'getDataTransferItemId').mockResolvedValue(() => 'folder123'); + jest.spyOn(UploaderUtils, 'getDataTransferItemAPIOptions').mockResolvedValue(() => {}); + + const wrapper = getWrapper(); + const instance = wrapper.instance(); + const mockFoldersList = ['folder1', 'folder2']; + const mockFolderUpload = { folder: { name: 'mockFolder' } }; + mockFolderUpload.buildFolderTreeFromDataTransferItem = jest.fn(); + + instance.addToQueue = jest.fn(); + instance.getFolderUploadAPI = jest.fn().mockReturnValue(mockFolderUpload); + instance.getNewDataTransferItems = jest.fn().mockReturnValue(mockFoldersList); + + await instance.addFolderDataTransferItemsToUploadQueue(mockFoldersList, jest.fn()); + expect(instance.addToQueue).toBeCalledTimes(1); + expect(instance.addToQueue.mock.calls[0][0].length).toBe(mockFoldersList.length); + }); + }); });