@uppy/provider-views - npm Package Compare versions

Comparing version 3.2.0 to 3.3.0

CHANGELOG.md

 # @uppy/provider-views
 
+## 3.3.0
+
+Released: 2023-04-18
+Included in: Uppy v3.8.0
+
+- @uppy/provider-views: Concurrent file listing (Mikael Finstad / #4401)
+- @uppy/core,@uppy/locales,@uppy/provider-views: User feedback adding recursive folders take 2 (Mikael Finstad / #4399)
+
 ## 3.2.0
@@ -4,0 +12,0 @@

lib/Loader.js

 import { h } from 'preact';
 export default (_ref => {
   let {
-    i18n
+    i18n,
+    loading
   } = _ref;
   return h("div", {
     className: "uppy-Provider-loading"
-  }, h("span", null, i18n('loading')));
+  }, h("span", null, i18n('loading')), typeof loading === 'string' && // todo improve this, see discussion in https://github.com/transloadit/uppy/pull/4399#discussion_r1162564445
+  h("span", {
+    style: {
+      marginTop: '.7em'
+    }
+  }, loading));
 });

lib/ProviderView/ProviderView.js

@@ -7,3 +7,5 @@ function _classPrivateFieldLooseBase(receiver, privateKey) { if (!Object.prototype.hasOwnProperty.call(receiver, privateKey)) { throw new TypeError("attempted to use private field on non-instance"); } return receiver; }
 
-import { h } from 'preact';
+import { h } from 'preact'; // eslint-disable-next-line import/no-unresolved
+
+import PQueue from 'p-queue';
 import { getSafeFileId } from '@uppy/utils/lib/generateFileID';
@@ -17,3 +19,3 @@ import AuthView from "./AuthView.js";
 const packageJson = {
-  "version": "3.2.0"
+  "version": "3.3.0"
 };
@@ -262,18 +264,14 @@
 
-  async *recursivelyListAllFiles(path) {
-    let curPath = path; // need to repeat the list call until there are no more pages
+  async recursivelyListAllFiles(path, queue, onFiles) {
+    let curPath = path;
 
     while (curPath) {
       const res = await this.provider.list(curPath);
+      curPath = res.nextPagePath;
+      const files = res.items.filter(item => !item.isFolder);
+      const folders = res.items.filter(item => item.isFolder);
+      onFiles(files); // recursively queue call to self for each folder
 
-      for (const item of res.items) {
-        if (item.isFolder) {
-          // recursively call self for folder
-          yield* this.recursivelyListAllFiles(item.requestPath);
-        } else {
-          yield item;
-        }
-      }
-
-      curPath = res.nextPagePath;
+      const promises = folders.map(async folder => queue.add(async () => this.recursivelyListAllFiles(folder.requestPath, queue, onFiles)));
+      await Promise.all(promises); // in case we get an error
     }
@@ -290,3 +288,3 @@ }
       const messages = [];
-      const newFiles = []; // eslint-disable-next-line no-unreachable-loop
+      const newFiles = [];
 
@@ -301,18 +299,28 @@ for (const file of currentSelection) {
           let numNewFiles = 0;
+          const queue = new PQueue({
+            concurrency: 6
+          });
 
-          for await (const fileInFolder of this.recursivelyListAllFiles(requestPath)) {
-            const tagFile = this.getTagFile(fileInFolder);
-            const id = getSafeFileId(tagFile); // If the same folder is added again, we don't want to send
-            // X amount of duplicate file notifications, we want to say
-            // the folder was already added. This checks if all files are duplicate,
-            // if that's the case, we don't add the files.
+          const onFiles = files => {
+            for (const newFile of files) {
+              const tagFile = this.getTagFile(newFile);
+              const id = getSafeFileId(tagFile); // If the same folder is added again, we don't want to send
+              // X amount of duplicate file notifications, we want to say
+              // the folder was already added. This checks if all files are duplicate,
+              // if that's the case, we don't add the files.
 
-            if (!this.plugin.uppy.checkIfFileAlreadyExists(id)) {
-              newFiles.push(fileInFolder);
-              numNewFiles++;
+              if (!this.plugin.uppy.checkIfFileAlreadyExists(id)) {
+                newFiles.push(newFile);
+                numNewFiles++;
+                this.setLoading(this.plugin.uppy.i18n('addedNumFiles', {
+                  numFiles: numNewFiles
+                }));
+              }
+
+              isEmpty = false;
             }
+          };
 
-            isEmpty = false;
-          }
-
+          await this.recursivelyListAllFiles(requestPath, queue, onFiles);
+          await queue.onIdle();
           let message;
@@ -327,2 +335,5 @@
           } else {
+            // TODO we don't really know at this point whether any files were actually added
+            // (only later after addFiles has been called) so we should probably rewrite this.
+            // Example: If all files fail to add due to restriction error, it will still say "Added 100 files from folder"
             message = this.plugin.uppy.i18n('folderAdded', {
@@ -445,3 +456,4 @@ smart_count: numNewFiles,
       }, h(LoaderView, {
-        i18n: this.plugin.uppy.i18n
+        i18n: this.plugin.uppy.i18n,
+        loading: loading
       }));
@@ -448,0 +460,0 @@ }

lib/SearchProviderView/SearchProviderView.js

@@ -13,3 +13,3 @@ function _classPrivateFieldLooseBase(receiver, privateKey) { if (!Object.prototype.hasOwnProperty.call(receiver, privateKey)) { throw new TypeError("attempted to use private field on non-instance"); } return receiver; }
 const packageJson = {
-  "version": "3.2.0"
+  "version": "3.3.0"
 };
@@ -16,0 +16,0 @@ /**

package.json

 {
   "name": "@uppy/provider-views",
   "description": "View library for Uppy remote provider plugins.",
-  "version": "3.2.0",
+  "version": "3.3.0",
   "license": "MIT",
@@ -23,10 +23,11 @@ "main": "lib/index.js",
   "dependencies": {
-    "@uppy/utils": "^5.2.0",
+    "@uppy/utils": "^5.3.0",
     "classnames": "^2.2.6",
     "nanoid": "^4.0.0",
+    "p-queue": "^7.3.4",
     "preact": "^10.5.13"
   },
   "peerDependencies": {
-    "@uppy/core": "^3.1.2"
+    "@uppy/core": "^3.2.0"
   }
 }

README.md

 # @uppy/provider-views
 
-<img src="https://uppy.io/images/logos/uppy-dog-head-arrow.svg" width="120" alt="Uppy logo: a superman puppy in a pink suit" align="right">
+<img src="https://uppy.io/img/logo.svg" width="120" alt="Uppy logo: a smiling puppy above a pink upwards arrow" align="right">
 
@@ -5,0 +5,0 @@ [![npm version](https://img.shields.io/npm/v/@uppy/provider-views.svg?style=flat-square)](https://www.npmjs.com/package/@uppy/provider-views)

src/Loader.jsx

 import { h } from 'preact'
 
-export default ({ i18n }) => {
+export default ({ i18n, loading }) => {
   return (
     <div className="uppy-Provider-loading">
       <span>{i18n('loading')}</span>
+      {typeof loading === 'string' && ( // todo improve this, see discussion in https://github.com/transloadit/uppy/pull/4399#discussion_r1162564445
+        <span style={{ marginTop: '.7em' }}>{loading}</span>
+      )}
     </div>
   )
 }

src/ProviderView/ProviderView.jsx

 import { h } from 'preact'
+// eslint-disable-next-line import/no-unresolved
+import PQueue from 'p-queue'
 
@@ -238,19 +240,19 @@ import { getSafeFileId } from '@uppy/utils/lib/generateFileID'
 
-  async* recursivelyListAllFiles (path) {
+  async recursivelyListAllFiles (path, queue, onFiles) {
     let curPath = path
 
-    // need to repeat the list call until there are no more pages
     while (curPath) {
       const res = await this.provider.list(curPath)
+      curPath = res.nextPagePath
 
-      for (const item of res.items) {
-        if (item.isFolder) {
-          // recursively call self for folder
-          yield* this.recursivelyListAllFiles(item.requestPath)
-        } else {
-          yield item
-        }
-      }
+      const files = res.items.filter((item) => !item.isFolder)
+      const folders = res.items.filter((item) => item.isFolder)
 
-      curPath = res.nextPagePath
+      onFiles(files)
+
+      // recursively queue call to self for each folder
+      const promises = folders.map(async (folder) => queue.add(async () => (
+        this.recursivelyListAllFiles(folder.requestPath, queue, onFiles)
+      )))
+      await Promise.all(promises) // in case we get an error
     }
@@ -267,3 +269,2 @@ }
 
-      // eslint-disable-next-line no-unreachable-loop
       for (const file of currentSelection) {
@@ -275,16 +276,24 @@ if (file.isFolder) {
 
-          for await (const fileInFolder of this.recursivelyListAllFiles(requestPath)) {
-            const tagFile = this.getTagFile(fileInFolder)
-            const id = getSafeFileId(tagFile)
-            // If the same folder is added again, we don't want to send
-            // X amount of duplicate file notifications, we want to say
-            // the folder was already added. This checks if all files are duplicate,
-            // if that's the case, we don't add the files.
-            if (!this.plugin.uppy.checkIfFileAlreadyExists(id)) {
-              newFiles.push(fileInFolder)
-              numNewFiles++
+          const queue = new PQueue({ concurrency: 6 })
+
+          const onFiles = (files) => {
+            for (const newFile of files) {
+              const tagFile = this.getTagFile(newFile)
+              const id = getSafeFileId(tagFile)
+              // If the same folder is added again, we don't want to send
+              // X amount of duplicate file notifications, we want to say
+              // the folder was already added. This checks if all files are duplicate,
+              // if that's the case, we don't add the files.
+              if (!this.plugin.uppy.checkIfFileAlreadyExists(id)) {
+                newFiles.push(newFile)
+                numNewFiles++
+                this.setLoading(this.plugin.uppy.i18n('addedNumFiles', { numFiles: numNewFiles }))
+              }
+              isEmpty = false
             }
-            isEmpty = false
           }
 
+          await this.recursivelyListAllFiles(requestPath, queue, onFiles)
+          await queue.onIdle()
+
           let message
@@ -298,2 +307,5 @@ if (isEmpty) {
           } else {
+            // TODO we don't really know at this point whether any files were actually added
+            // (only later after addFiles has been called) so we should probably rewrite this.
+            // Example: If all files fail to add due to restriction error, it will still say "Added 100 files from folder"
             message = this.plugin.uppy.i18n('folderAdded', {
@@ -391,3 +403,3 @@ smart_count: numNewFiles, folder: name,
         <CloseWrapper onUnmount={this.clearSelection}>
-          <LoaderView i18n={this.plugin.uppy.i18n} />
+          <LoaderView i18n={this.plugin.uppy.i18n} loading={loading} />
         </CloseWrapper>
@@ -394,0 +406,0 @@ )

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

240201

increased by1.79%

Lines of code

3421

increased by0.88%

Worsened metrics

Dependency count

6

increased by20%

Dependency changes

• + Addedp-queue@^7.3.4

• + Addedeventemitter3@5.0.1(transitive)

• + Addedp-queue@7.4.1(transitive)

• + Addedp-timeout@5.1.0(transitive)

• Updated@uppy/utils@^5.3.0