transloadit: add error reporting

packages/@uppy/transloadit/src/Client.js

@@ -4,6 +4,8 @@
 module.exports = class Client {
   constructor (opts = {}) {
     this.opts = opts
+
+    this._reportError = this._reportError.bind(this)
   }
 
   /**
@@ -31,7 +33,8 @@ module.exports = class Client {
     })
     data.append('num_expected_upload_files', expectedFiles)
 
-    return fetch(`${this.opts.service}/assemblies`, {
+    const url = `${this.opts.service}/assemblies`
+    return fetch(url, {
       method: 'post',
       body: data
     }).then((response) => response.json()).then((assembly) => {
@@ -43,7 +46,7 @@ module.exports = class Client {
       }
 
       return assembly
-    })
+    }).catch((err) => this._reportError(err, { url }))
   }
 
   /**
@@ -54,8 +57,10 @@ module.exports = class Client {
    */
   reserveFile (assembly, file) {
     const size = encodeURIComponent(file.size)
-    return fetch(`${assembly.assembly_ssl_url}/reserve_file?size=${size}`, { method: 'post' })
+    const url = `${assembly.assembly_ssl_url}/reserve_file?size=${size}`
+    return fetch(url, { method: 'post' })
       .then((response) => response.json())
+      .catch((err) => this._reportError(err, { assembly, file, url }))
   }
 
   /**
@@ -69,13 +74,15 @@ module.exports = class Client {
       return Promise.reject(new Error('File does not have an `uploadURL`.'))
     }
     const size = encodeURIComponent(file.size)
-    const url = encodeURIComponent(file.uploadURL)
+    const uploadUrl = encodeURIComponent(file.uploadURL)
     const filename = encodeURIComponent(file.name)
     const fieldname = 'file'
 
-    const qs = `size=${size}&filename=${filename}&fieldname=${fieldname}&s3Url=${url}`
-    return fetch(`${assembly.assembly_ssl_url}/add_file?${qs}`, { method: 'post' })
+    const qs = `size=${size}&filename=${filename}&fieldname=${fieldname}&s3Url=${uploadUrl}`
+    const url = `${assembly.assembly_ssl_url}/add_file?${qs}`
+    return fetch(url, { method: 'post' })
       .then((response) => response.json())
+      .catch((err) => this._reportError(err, { assembly, file, url }))
   }
 
   /**
@@ -96,5 +103,37 @@ module.exports = class Client {
   getAssemblyStatus (url) {
     return fetch(url)
       .then((response) => response.json())
+      .catch((err) => this._reportError(err, { url }))
+  }
+
+  submitError (err, { endpoint, instance, assembly }) {
+    return fetch('https://status.transloadit.com/client_error', {
+      method: 'post',
+      body: JSON.stringify({
+        endpoint,
+        instance,
+        assembly_id: assembly,
+        ip: null, // can't this just be done by statuspage?
+        agent: typeof navigator !== 'undefined' ? navigator.userAgent : '',
+        error: err.message
+      })
+    }).then((response) => response.json())
+  }
+
+  _reportError (err, params = {}) {
+    const opts = {}
+    if (params.assembly) {
+      opts.assembly = params.assembly.assembly_id
+      opts.instance = params.assembly.instance
+    }
+    if (params.url) {
+      opts.endpoint = params.url
+    }
+
+    this.submitError(err, opts).catch((_) => {
+      // not much we can do then is there
+    })
+
+    throw err
   }
 }