@uppy/transloadit: simplify plugin to always run a single assembly

[Murderlon]

Closes #4765

Tip

Click "Remove whitespace" and review by commit with the commits dropdown.

I tried to do atomic commits so you can review per commit to see the changes more in isolation. Tried to find a balance between removing enough complexity but going too far that there's a high risk of breaking things. More simplifications can be made, but these are the ones focussed on managing a single assembly instead of multiple.

I think it would be good if at least one other person tries to break this locally with pause/cancel/resume/local/remote states.

[github-actions]

Diff output files

diff --git a/packages/@uppy/transloadit/lib/Client.js b/packages/@uppy/transloadit/lib/Client.js
index 2fd888d..3c83a61 100644
--- a/packages/@uppy/transloadit/lib/Client.js
+++ b/packages/@uppy/transloadit/lib/Client.js
@@ -126,7 +126,7 @@ export default class Client {
   }
   async cancelAssembly(assembly) {
     const url = assembly.assembly_ssl_url;
-    return _classPrivateFieldLooseBase(this, _fetchJSON)[_fetchJSON](url, {
+    await _classPrivateFieldLooseBase(this, _fetchWithNetworkError)[_fetchWithNetworkError](url, {
       method: "DELETE",
       headers: _classPrivateFieldLooseBase(this, _headers)[_headers],
     }).catch(err =>
diff --git a/packages/@uppy/transloadit/lib/index.js b/packages/@uppy/transloadit/lib/index.js
index a396b49..96094ef 100644
--- a/packages/@uppy/transloadit/lib/index.js
+++ b/packages/@uppy/transloadit/lib/index.js
@@ -12,22 +12,12 @@ import ErrorWithCause from "@uppy/utils/lib/ErrorWithCause";
 import hasProperty from "@uppy/utils/lib/hasProperty";
 import { RateLimitedQueue } from "@uppy/utils/lib/RateLimitedQueue";
 import Assembly from "./Assembly.js";
-import AssemblyOptionsBuilder from "./AssemblyOptions.js";
 import AssemblyWatcher from "./AssemblyWatcher.js";
 import Client from "./Client.js";
 import locale from "./locale.js";
 const packageJson = {
   "version": "4.0.0-beta.8",
 };
-const sendErrorToConsole = originalErr => err => {
-  const error = new ErrorWithCause("Failed to send error to the client", {
-    cause: err,
-  });
-  console.error(error, originalErr);
-};
-const COMPANION_URL = "https://api2.transloadit.com/companion";
-const COMPANION_ALLOWED_HOSTS = /\.transloadit\.com$/;
-const TL_COMPANION = /https?:\/\/api2(?:-\w+)?\.transloadit\.com\/companion/;
 const defaultOptions = {
   service: "https://api2.transloadit.com",
   errorReporting: true,
@@ -39,7 +29,37 @@ const defaultOptions = {
   retryDelays: [7000, 10000, 15000, 20000],
   clientName: null,
 };
+const sendErrorToConsole = originalErr => err => {
+  const error = new ErrorWithCause("Failed to send error to the client", {
+    cause: err,
+  });
+  console.error(error, originalErr);
+};
+function validateParams(params) {
+  if (params == null) {
+    throw new Error("Transloadit: The `params` option is required.");
+  }
+  if (typeof params === "string") {
+    try {
+      params = JSON.parse(params);
+    } catch (err) {
+      throw new ErrorWithCause("Transloadit: The `params` option is a malformed JSON string.", {
+        cause: err,
+      });
+    }
+  }
+  if (!params.auth || !params.auth.key) {
+    throw new Error(
+      "Transloadit: The `params.auth.key` option is required. "
+        + "You can find your Transloadit API key at https://transloadit.com/c/template-credentials",
+    );
+  }
+}
+const COMPANION_URL = "https://api2.transloadit.com/companion";
+const COMPANION_ALLOWED_HOSTS = /\.transloadit\.com$/;
+const TL_COMPANION = /https?:\/\/api2(?:-\w+)?\.transloadit\.com\/companion/;
 var _rateLimitedQueue = _classPrivateFieldLooseKey("rateLimitedQueue");
+var _watcher = _classPrivateFieldLooseKey("watcher");
 var _getClientVersion = _classPrivateFieldLooseKey("getClientVersion");
 var _attachAssemblyMetadata = _classPrivateFieldLooseKey("attachAssemblyMetadata");
 var _createAssembly = _classPrivateFieldLooseKey("createAssembly");
@@ -107,6 +127,10 @@ export default class Transloadit extends BasePlugin {
       writable: true,
       value: void 0,
     });
+    Object.defineProperty(this, _watcher, {
+      writable: true,
+      value: void 0,
+    });
     Object.defineProperty(this, _onFileUploadURLAvailable, {
       writable: true,
       value: rawFile => {
@@ -116,12 +140,11 @@ export default class Transloadit extends BasePlugin {
           return;
         }
         const {
-          assemblies,
-        } = this.getPluginState();
-        const assembly = assemblies[file.transloadit.assembly];
-        this.client.addFile(assembly, file).catch(err => {
+          status,
+        } = this.assembly;
+        this.client.addFile(status, file).catch(err => {
           this.uppy.log(err);
-          this.uppy.emit("transloadit:import-error", assembly, file.id, err);
+          this.uppy.emit("transloadit:import-error", status, file.id, err);
         });
       },
     });
@@ -129,14 +152,7 @@ export default class Transloadit extends BasePlugin {
       writable: true,
       value: async () => {
         try {
-          const {
-            uploadsAssemblies,
-          } = this.getPluginState();
-          const assemblyIDs = Object.values(uploadsAssemblies).flat(1);
-          const assemblies = assemblyIDs.map(assemblyID => this.getAssembly(assemblyID));
-          await Promise.all(
-            assemblies.map(assembly => _classPrivateFieldLooseBase(this, _cancelAssembly)[_cancelAssembly](assembly)),
-          );
+          await _classPrivateFieldLooseBase(this, _cancelAssembly)[_cancelAssembly](this.assembly.status);
         } catch (err) {
           this.uppy.log(err);
         }
@@ -145,90 +161,71 @@ export default class Transloadit extends BasePlugin {
     Object.defineProperty(this, _getPersistentData, {
       writable: true,
       value: setData => {
-        const {
-          assemblies,
-          uploadsAssemblies,
-        } = this.getPluginState();
-        setData({
-          [this.id]: {
-            assemblies,
-            uploadsAssemblies,
-          },
-        });
+        if (this.assembly) {
+          setData({
+            [this.id]: {
+              assemblyResponse: this.assembly.status,
+            },
+          });
+        }
       },
     });
     Object.defineProperty(this, _onRestored, {
       writable: true,
       value: pluginData => {
         const savedState = pluginData && pluginData[this.id] ? pluginData[this.id] : {};
-        const previousAssemblies = savedState.assemblies || {};
-        const uploadsAssemblies = savedState.uploadsAssemblies || {};
-        if (Object.keys(uploadsAssemblies).length === 0) {
+        const previousAssembly = savedState.assemblyResponse;
+        if (!previousAssembly) {
           return;
         }
-        const restoreState = assemblies => {
+        const restoreState = () => {
           const files = {};
           const results = [];
-          for (const [id, status] of Object.entries(assemblies)) {
-            status.uploads.forEach(uploadedFile => {
-              const file = _classPrivateFieldLooseBase(this, _findFile)[_findFile](uploadedFile);
-              files[uploadedFile.id] = {
-                id: file.id,
+          const {
+            assembly_id: id,
+          } = previousAssembly;
+          previousAssembly.uploads.forEach(uploadedFile => {
+            const file = _classPrivateFieldLooseBase(this, _findFile)[_findFile](uploadedFile);
+            files[uploadedFile.id] = {
+              id: file.id,
+              assembly: id,
+              uploadedFile,
+            };
+          });
+          const state = this.getPluginState();
+          Object.keys(previousAssembly.results).forEach(stepName => {
+            for (const result of previousAssembly.results[stepName]) {
+              const file = state.files[result.original_id];
+              result.localId = file ? file.id : null;
+              results.push({
+                id: result.id,
+                result,
+                stepName,
                 assembly: id,
-                uploadedFile,
-              };
-            });
-            const state = this.getPluginState();
-            Object.keys(status.results).forEach(stepName => {
-              for (const result of status.results[stepName]) {
-                const file = state.files[result.original_id];
-                result.localId = file ? file.id : null;
-                results.push({
-                  id: result.id,
-                  result,
-                  stepName,
-                  assembly: id,
-                });
-              }
-            });
-          }
+              });
+            }
+          });
+          this.assembly = new Assembly(
+            previousAssembly,
+            _classPrivateFieldLooseBase(this, _rateLimitedQueue)[_rateLimitedQueue],
+          );
+          this.assembly.status = previousAssembly;
           this.setPluginState({
-            assemblies,
             files,
             results,
-            uploadsAssemblies,
           });
         };
         const restoreAssemblies = () => {
-          const {
-            assemblies,
-            uploadsAssemblies,
-          } = this.getPluginState();
-          Object.keys(uploadsAssemblies).forEach(uploadID => {
-            const assemblyIDs = uploadsAssemblies[uploadID];
-            _classPrivateFieldLooseBase(this, _createAssemblyWatcher)[_createAssemblyWatcher](assemblyIDs, uploadID);
-          });
-          const allAssemblyIDs = Object.keys(assemblies);
-          allAssemblyIDs.forEach(id => {
-            const assembly = new Assembly(
-              assemblies[id],
-              _classPrivateFieldLooseBase(this, _rateLimitedQueue)[_rateLimitedQueue],
-            );
-            _classPrivateFieldLooseBase(this, _connectAssembly)[_connectAssembly](assembly);
-          });
+          _classPrivateFieldLooseBase(this, _createAssemblyWatcher)[_createAssemblyWatcher](
+            previousAssembly.assembly_id,
+          );
+          _classPrivateFieldLooseBase(this, _connectAssembly)[_connectAssembly](this.assembly);
         };
         const updateAssemblies = () => {
-          const {
-            assemblies,
-          } = this.getPluginState();
-          return Promise.all(
-            Object.keys(assemblies).map(id => {
-              return this.activeAssemblies[id].update();
-            }),
-          );
+          return this.assembly.update();
         };
         this.restored = Promise.resolve().then(() => {
-          restoreState(previousAssemblies);
+          restoreState();
           restoreAssemblies();
           updateAssemblies();
         });
@@ -239,74 +236,37 @@ export default class Transloadit extends BasePlugin {
     });
     Object.defineProperty(this, _prepareUpload, {
       writable: true,
-      value: async (fileIDs, uploadID) => {
-        const files = fileIDs.map(id => this.uppy.getFile(id));
-        const filesWithoutErrors = files.filter(file => {
-          if (!file.error) {
-            this.uppy.emit("preprocess-progress", file, {
-              mode: "indeterminate",
-              message: this.i18n("creatingAssembly"),
-            });
-            return true;
-          }
-          return false;
-        });
-        const createAssembly = async _ref => {
-          let {
-            fileIDs,
-            options,
-          } = _ref;
-          try {
-            const assembly = await _classPrivateFieldLooseBase(this, _createAssembly)[_createAssembly](
-              fileIDs,
-              uploadID,
-              options,
-            );
-            if (this.opts.importFromUploadURLs) {
-              await _classPrivateFieldLooseBase(this, _reserveFiles)[_reserveFiles](assembly, fileIDs);
-            }
-            fileIDs.forEach(fileID => {
-              const file = this.uppy.getFile(fileID);
-              this.uppy.emit("preprocess-complete", file);
-            });
-            return assembly;
-          } catch (err) {
-            fileIDs.forEach(fileID => {
-              const file = this.uppy.getFile(fileID);
-              this.uppy.emit("preprocess-complete", file);
-              this.uppy.emit("upload-error", file, err);
-            });
-            throw err;
+      value: async fileIDs => {
+        var _assemblyOptions$fiel;
+        const assemblyOptions = typeof this.opts.assemblyOptions === "function"
+          ? await this.opts.assemblyOptions()
+          : this.opts.assemblyOptions;
+        (_assemblyOptions$fiel = assemblyOptions.fields) != null ? _assemblyOptions$fiel : assemblyOptions.fields = {};
+        validateParams(assemblyOptions.params);
+        try {
+          var _this$assembly;
+          const assembly = (_this$assembly = this.assembly) != null
+            ? _this$assembly
+            : await _classPrivateFieldLooseBase(this, _createAssembly)[_createAssembly](fileIDs, assemblyOptions);
+          if (this.opts.importFromUploadURLs) {
+            await _classPrivateFieldLooseBase(this, _reserveFiles)[_reserveFiles](assembly, fileIDs);
           }
-        };
-        const {
-          uploadsAssemblies,
-        } = this.getPluginState();
-        this.setPluginState({
-          uploadsAssemblies: {
-            ...uploadsAssemblies,
-            [uploadID]: [],
-          },
-        });
-        const builder = new AssemblyOptionsBuilder(filesWithoutErrors, this.opts);
-        await builder.build().then(assemblies => Promise.all(assemblies.map(createAssembly))).then(
-          maybeCreatedAssemblies => {
-            const createdAssemblies = maybeCreatedAssemblies.filter(Boolean);
-            const assemblyIDs = createdAssemblies.map(assembly => assembly.status.assembly_id);
-            _classPrivateFieldLooseBase(this, _createAssemblyWatcher)[_createAssemblyWatcher](assemblyIDs, uploadID);
-            return Promise.all(
-              createdAssemblies.map(assembly =>
-                _classPrivateFieldLooseBase(this, _connectAssembly)[_connectAssembly](assembly)
-              ),
-            );
-          },
-        ).catch(err => {
-          filesWithoutErrors.forEach(file => {
+          fileIDs.forEach(fileID => {
+            const file = this.uppy.getFile(fileID);
+            this.uppy.emit("preprocess-complete", file);
+          });
+          _classPrivateFieldLooseBase(this, _createAssemblyWatcher)[_createAssemblyWatcher](
+            assembly.status.assembly_id,
+          );
+          _classPrivateFieldLooseBase(this, _connectAssembly)[_connectAssembly](assembly);
+        } catch (err) {
+          fileIDs.forEach(fileID => {
+            const file = this.uppy.getFile(fileID);
             this.uppy.emit("preprocess-complete", file);
             this.uppy.emit("upload-error", file, err);
           });
           throw err;
-        });
+        }
       },
     });
     Object.defineProperty(this, _afterUpload, {
@@ -314,29 +274,23 @@ export default class Transloadit extends BasePlugin {
       value: (fileIDs, uploadID) => {
         const files = fileIDs.map(fileID => this.uppy.getFile(fileID));
         const filteredFileIDs = files.filter(file => !file.error).map(file => file.id);
-        const state = this.getPluginState();
         if (this.restored) {
           return this.restored.then(() => {
             return _classPrivateFieldLooseBase(this, _afterUpload)[_afterUpload](filteredFileIDs, uploadID);
           });
         }
-        const assemblyIDs = state.uploadsAssemblies[uploadID];
+        const assemblyID = this.assembly.status.assembly_id;
         const closeSocketConnections = () => {
-          assemblyIDs.forEach(assemblyID => {
-            const assembly = this.activeAssemblies[assemblyID];
-            assembly.close();
-            delete this.activeAssemblies[assemblyID];
-          });
+          this.assembly.close();
         };
         if (!_classPrivateFieldLooseBase(this, _shouldWaitAfterUpload)[_shouldWaitAfterUpload]()) {
           closeSocketConnections();
-          const assemblies = assemblyIDs.map(id => this.getAssembly(id));
           this.uppy.addResultData(uploadID, {
-            transloadit: assemblies,
+            transloadit: [this.assembly.status],
           });
           return Promise.resolve();
         }
-        if (assemblyIDs.length === 0) {
+        if (!assemblyID) {
           this.uppy.addResultData(uploadID, {
             transloadit: [],
           });
@@ -349,44 +303,34 @@ export default class Transloadit extends BasePlugin {
             message: this.i18n("encoding"),
           });
         });
-        const watcher = this.assemblyWatchers[uploadID];
-        return watcher.promise.then(() => {
+        return _classPrivateFieldLooseBase(this, _watcher)[_watcher].promise.then(() => {
           closeSocketConnections();
-          const assemblies = assemblyIDs.map(id => this.getAssembly(id));
-          const uploadsAssemblies = {
-            ...this.getPluginState().uploadsAssemblies,
-          };
-          delete uploadsAssemblies[uploadID];
-          this.setPluginState({
-            uploadsAssemblies,
-          });
           this.uppy.addResultData(uploadID, {
-            transloadit: assemblies,
+            transloadit: [this.assembly.status],
           });
         });
       },
     });
     Object.defineProperty(this, _closeAssemblyIfExists, {
       writable: true,
-      value: assemblyID => {
-        var _this$activeAssemblie;
-        if (!assemblyID) return;
-        (_this$activeAssemblie = this.activeAssemblies[assemblyID]) == null || _this$activeAssemblie.close();
+      value: () => {
+        var _this$assembly2;
+        (_this$assembly2 = this.assembly) == null || _this$assembly2.close();
       },
     });
     Object.defineProperty(this, _onError, {
       writable: true,
       value: err => {
+        _classPrivateFieldLooseBase(this, _closeAssemblyIfExists)[_closeAssemblyIfExists]();
+        this.assembly = null;
         this.client.submitError(err).catch(sendErrorToConsole(err));
       },
     });
     Object.defineProperty(this, _onTusError, {
       writable: true,
-      value: (file, err) => {
-        var _file$transloadit2, _err$message;
-        _classPrivateFieldLooseBase(this, _closeAssemblyIfExists)[_closeAssemblyIfExists](
-          file == null || (_file$transloadit2 = file.transloadit) == null ? void 0 : _file$transloadit2.assembly,
-        );
+      value: (_, err) => {
+        var _err$message;
+        _classPrivateFieldLooseBase(this, _closeAssemblyIfExists)[_closeAssemblyIfExists]();
         if (err != null && (_err$message = err.message) != null && _err$message.startsWith("tus: ")) {
           var _originalRequest;
           const endpoint = (_originalRequest = err.originalRequest) == null
@@ -410,8 +354,6 @@ export default class Transloadit extends BasePlugin {
       errorReporting: this.opts.errorReporting,
       rateLimitedQueue: _classPrivateFieldLooseBase(this, _rateLimitedQueue)[_rateLimitedQueue],
     });
-    this.activeAssemblies = {};
-    this.assemblyWatchers = {};
     this.completedFiles = Object.create(null);
   }
   install() {
@@ -428,7 +370,7 @@ export default class Transloadit extends BasePlugin {
     } else {
       this.uppy.use(Tus, {
         storeFingerprintForResuming: false,
-        allowedMetaFields: ["assembly_url", "filename", "fieldname"],
+        allowedMetaFields: true,
         limit: this.opts.limit,
         rateLimitedQueue: _classPrivateFieldLooseBase(this, _rateLimitedQueue)[_rateLimitedQueue],
         retryDelays: this.opts.retryDelays,
@@ -437,8 +379,6 @@ export default class Transloadit extends BasePlugin {
     this.uppy.on("restore:get-data", _classPrivateFieldLooseBase(this, _getPersistentData)[_getPersistentData]);
     this.uppy.on("restored", _classPrivateFieldLooseBase(this, _onRestored)[_onRestored]);
     this.setPluginState({
-      assemblies: {},
-      uploadsAssemblies: {},
       files: {},
       results: [],
     });
@@ -472,16 +412,13 @@ export default class Transloadit extends BasePlugin {
       },
     });
   }
-  getAssembly(id) {
-    const {
-      assemblies,
-    } = this.getPluginState();
-    return assemblies[id];
+  getAssembly() {
+    return this.assembly.status;
   }
   getAssemblyFiles(assemblyID) {
     return this.uppy.getFiles().filter(file => {
-      var _file$transloadit3;
-      return (file == null || (_file$transloadit3 = file.transloadit) == null ? void 0 : _file$transloadit3.assembly)
+      var _file$transloadit2;
+      return (file == null || (_file$transloadit2 = file.transloadit) == null ? void 0 : _file$transloadit2.assembly)
         === assemblyID;
     });
   }
@@ -555,16 +492,16 @@ function _attachAssemblyMetadata2(file, status) {
   }
   return newFile;
 }
-function _createAssembly2(fileIDs, uploadID, assemblyOptions) {
+function _createAssembly2(fileIDs, assemblyOptions) {
   this.uppy.log("[Transloadit] Create Assembly");
   return this.client.createAssembly({
     ...assemblyOptions,
     expectedFiles: fileIDs.length,
   }).then(async newAssembly => {
-    const files = this.uppy.getFiles().filter(_ref2 => {
+    const files = this.uppy.getFiles().filter(_ref => {
       let {
         id,
-      } = _ref2;
+      } = _ref;
       return fileIDs.includes(id);
     });
     if (files.length === 0) {
@@ -576,20 +513,6 @@ function _createAssembly2(fileIDs, uploadID, assemblyOptions) {
       status,
     } = assembly;
     const assemblyID = status.assembly_id;
-    const {
-      assemblies,
-      uploadsAssemblies,
-    } = this.getPluginState();
-    this.setPluginState({
-      assemblies: {
-        ...assemblies,
-        [assemblyID]: status,
-      },
-      uploadsAssemblies: {
-        ...uploadsAssemblies,
-        [uploadID]: [...uploadsAssemblies[uploadID], assemblyID],
-      },
-    });
     const updatedFiles = {};
     files.forEach(file => {
       updatedFiles[file.id] = _classPrivateFieldLooseBase(this, _attachAssemblyMetadata)[_attachAssemblyMetadata](
@@ -603,13 +526,6 @@ function _createAssembly2(fileIDs, uploadID, assemblyOptions) {
         ...updatedFiles,
       },
     });
-    const fileRemovedHandler = () => {
-      var _assembly$status;
-      if (((_assembly$status = assembly.status) == null ? void 0 : _assembly$status.ok) === "ASSEMBLY_COMPLETED") {
-        this.uppy.off("file-removed", fileRemovedHandler);
-      }
-    };
-    this.uppy.on("file-removed", fileRemovedHandler);
     this.uppy.emit("transloadit:assembly-created", status, fileIDs);
     this.uppy.log(`[Transloadit] Created Assembly ${assemblyID}`);
     return assembly;
@@ -626,7 +542,7 @@ function _createAssembly2(fileIDs, uploadID, assemblyOptions) {
     throw wrapped;
   });
 }
-function _createAssemblyWatcher2(idOrArrayOfIds, uploadID) {
+function _createAssemblyWatcher2(idOrArrayOfIds) {
   const ids = Array.isArray(idOrArrayOfIds) ? idOrArrayOfIds : [idOrArrayOfIds];
   const watcher = new AssemblyWatcher(this.uppy, ids);
   watcher.on("assembly-complete", id => {
@@ -651,7 +567,7 @@ function _createAssemblyWatcher2(idOrArrayOfIds, uploadID) {
     });
     this.uppy.emit("error", error);
   });
-  this.assemblyWatchers[uploadID] = watcher;
+  _classPrivateFieldLooseBase(this, _watcher)[_watcher] = watcher;
 }
 function _shouldWaitAfterUpload2() {
   return this.opts.waitForEncoding || this.opts.waitForMetadata;
@@ -697,7 +613,7 @@ function _onFileUploadComplete2(assemblyId, uploadedFile) {
       },
     },
   });
-  this.uppy.emit("transloadit:upload", uploadedFile, this.getAssembly(assemblyId));
+  this.uppy.emit("transloadit:upload", uploadedFile, this.getAssembly());
 }
 function _onResult2(assemblyId, stepName, result) {
   const state = this.getPluginState();
@@ -712,19 +628,12 @@ function _onResult2(assemblyId, stepName, result) {
   this.setPluginState({
     results: [...state.results, entry],
   });
-  this.uppy.emit("transloadit:result", stepName, result, this.getAssembly(assemblyId));
+  this.uppy.emit("transloadit:result", stepName, result, this.getAssembly());
 }
 function _onAssemblyFinished2(status) {
   const url = status.assembly_ssl_url;
   this.client.getAssemblyStatus(url).then(finalStatus => {
-    const assemblyId = finalStatus.assembly_id;
-    const state = this.getPluginState();
-    this.setPluginState({
-      assemblies: {
-        ...state.assemblies,
-        [assemblyId]: finalStatus,
-      },
-    });
+    this.assembly.status = finalStatus;
     this.uppy.emit("transloadit:complete", finalStatus);
   });
 }
@@ -737,18 +646,7 @@ function _connectAssembly2(assembly) {
     status,
   } = assembly;
   const id = status.assembly_id;
-  this.activeAssemblies[id] = assembly;
-  assembly.on("status", newStatus => {
-    const {
-      assemblies,
-    } = this.getPluginState();
-    this.setPluginState({
-      assemblies: {
-        ...assemblies,
-        [id]: newStatus,
-      },
-    });
-  });
+  this.assembly = assembly;
   assembly.on("upload", file => {
     _classPrivateFieldLooseBase(this, _onFileUploadComplete)[_onFileUploadComplete](id, file);
   });