Update Linter (#2796)

* relocate .vscode

* Switch to transloadit linter

* Update .eslintrc.json

* autofix code

* unlink and install eslint-config-transloadit@1.1.1

* Change 0 to "off"

* Don't change 'use strict'

* Do not vertically align

* disable key-spacing

* add import/no-extraneous-dependencies per package

* add more react/a11y warnings

* Revert "autofix code"

This reverts commit 14c8a8cde84aed8df3ce28041553444f8ea01ad6.

* add import/no-extraneous-dependencies per example and main package

* autofix code (2)

* Allow devDependencies in ./bin

* Change import/no-extraneous-dependencies to warn again

* upgrade linter

* Set import/no-extraneous-dependencies to warn

.eslintrc.json

@@ -1,22 +1,111 @@
 {
-  "parser": "@babel/eslint-parser",
-  "extends": ["standard", "standard-jsx"],
+  "extends": ["transloadit"],
   "env": {
-    "browser": true,
+    "es6": true,
+    "jest": true,
     "node": true,
-    "jest": true
+    // extra:
+    "browser": true
   },
   "globals": {
     "window": true,
     "hexo": true
   },
-  "plugins": ["jest", "compat", "jsdoc", "@babel/eslint-plugin"],
+  "plugins": [
+    "@babel/eslint-plugin",
+    "jest",
+    "node",
+    "prefer-import",
+    "promise",
+    "react",
+    // extra:
+    "compat",
+    "jsdoc"
+  ],
+  "parser": "@babel/eslint-parser",
+  "parserOptions": {
+    "ecmaVersion": 2020,
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
   "rules": {
-    "jsx-quotes": ["error", "prefer-double"],
+    // transloadit rules we are actually ok with in the uppy repo
+    ////////////////////////////////////////////////////////////
+    "guard-for-in": ["off"],
+    "import/extensions": ["off"],
+    "strict": ["off"],
+    "key-spacing": ["off"],
+
+    // transloadit rules we would like to enforce in the future
+    // but will require separate PRs to gradually get there
+    // and so the meantime: just warn
+    ////////////////////////////////////////////////////////////
+    "array-callback-return": ["warn"],
+    "block-scoped-var": ["warn"],
+    "class-methods-use-this": ["warn"],
+    "consistent-return": ["warn"],
+    "default-case": ["warn"],
+    "global-require": ["warn"],
+    "implicit-arrow-linebreak": ["warn"],
+    "import/no-dynamic-require": ["warn"],
+    "import/no-unresolved": ["warn"],
+    "import/order": ["warn"],
+    "jsx-a11y/alt-text": ["warn"],
+    "jsx-a11y/anchor-has-content": ["warn"],
+    "jsx-a11y/click-events-have-key-events": ["warn"],
+    "jsx-a11y/control-has-associated-label": ["warn"],
+    "jsx-a11y/label-has-associated-control": ["warn"],
+    "jsx-a11y/media-has-caption": ["warn"],
+    "jsx-a11y/mouse-events-have-key-events": ["warn"],
+    "jsx-a11y/no-interactive-element-to-noninteractive-role": ["warn"],
+    "jsx-a11y/no-noninteractive-element-interactions": ["warn"],
+    "jsx-a11y/no-static-element-interactions": ["warn"],
+    "no-await-in-loop": ["warn"],
+    "no-bitwise": ["warn"],
+    "no-continue": ["warn"],
+    "no-empty": ["warn"],
+    "no-lonely-if": ["warn"],
+    "no-mixed-operators": ["warn"],
+    "no-nested-ternary": ["warn"],
+    "no-param-reassign": ["warn"],
+    "no-redeclare": ["warn"],
+    "no-restricted-globals": ["warn"],
+    "no-restricted-properties": ["warn"],
+    "no-restricted-syntax": ["warn"],
+    "no-return-assign": ["warn"],
+    "no-shadow": ["warn"],
+    "no-underscore-dangle": ["warn"],
+    "no-unused-expressions": ["warn"],
+    "no-unused-vars": ["warn"],
+    "no-use-before-define": ["warn"],
+    "no-useless-concat": ["warn"],
+    "no-var": ["warn"],
+    "node/handle-callback-err": ["warn"],
+    "prefer-destructuring": ["warn"],
+    "prefer-spread": ["warn"],
+    "radix": ["warn"],
+    "react/button-has-type": ["warn"],
+    "react/destructuring-assignment": ["warn"],
+    "react/forbid-prop-types": ["warn"],
+    "react/jsx-props-no-spreading": ["warn"],
+    "react/no-access-state-in-setstate": ["warn"],
+    "react/no-array-index-key": ["warn"],
+    "react/no-deprecated": ["warn"],
+    "react/no-this-in-sfc": ["warn"],
+    "react/no-will-update-set-state": ["warn"],
+    "react/prefer-stateless-function": ["warn"],
+    "react/sort-comp": ["warn"],
+    "react/style-prop-object": ["warn"],
+    "vars-on-top": ["warn"],
+    "import/no-extraneous-dependencies": ["warn"],
+
+    // compat
+    ////////////////////////////////////////////////////////////
     "compat/compat": ["error"],
-    "react/jsx-handler-names": ["off"],
-    "react/react-in-jsx-scope": ["error"],
 
+    // jsdoc
+    ////////////////////////////////////////////////////////////
     "jsdoc/check-alignment": ["warn"],
     "jsdoc/check-examples": ["warn"],
     "jsdoc/check-param-names": ["warn"],
@@ -41,24 +130,103 @@
       "document.querySelector"
     ]
   },
-  "overrides": [{
-    "files": [
-      "*.test.js",
-      "test/endtoend/*.js",
-      "website/*.js",
-      "bin/*.js"
-    ],
-    "rules": {
-      "compat/compat": "off"
-    }
-  },{
-    "files": [
-      "packages/@uppy/locales/src/*.js",
-      "packages/@uppy/locales/template.js"
-    ],
-    "rules": {
-      "camelcase": "off",
-      "quote-props": "off"
-    }
-  }]
+  "overrides": [
+    {
+      "files": [
+        "*.test.js",
+        "test/endtoend/*.js",
+        "website/*.js",
+        "bin/*.js"
+      ],
+      "rules": {
+        "compat/compat": ["off"]
+      }
+    },
+    {
+      "files": [
+        "packages/@uppy/locales/src/*.js",
+        "packages/@uppy/locales/template.js"
+      ],
+      "rules": {
+        "camelcase": ["off"],
+        "quote-props": ["off"]
+      }
+    },
+    {
+      "files": [
+        "website/themes/uppy/source/js/*.js"
+      ],
+      "rules": {
+        "prefer-const": ["off"]
+      }
+    },
+
+    { "files": ["bin/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"devDependencies": true}] } },
+
+
+    { "files": ["packages/uppy/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/uppy/"}] } },
+
+    { "files": ["packages/@uppy/aws-s3/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/aws-s3/"}] } },
+    { "files": ["packages/@uppy/aws-s3-multipart/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/aws-s3-multipart/"}] } },
+    { "files": ["packages/@uppy/box/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/box/"}] } },
+    { "files": ["packages/@uppy/companion/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/companion/"}] } },
+    { "files": ["packages/@uppy/companion-client/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/companion-client/"}] } },
+    { "files": ["packages/@uppy/core/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/core/"}] } },
+    { "files": ["packages/@uppy/dashboard/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/dashboard/"}] } },
+    { "files": ["packages/@uppy/drag-drop/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/drag-drop/"}] } },
+    { "files": ["packages/@uppy/dropbox/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/dropbox/"}] } },
+    { "files": ["packages/@uppy/facebook/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/facebook/"}] } },
+    { "files": ["packages/@uppy/file-input/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/file-input/"}] } },
+    { "files": ["packages/@uppy/form/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/form/"}] } },
+    { "files": ["packages/@uppy/golden-retriever/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/golden-retriever/"}] } },
+    { "files": ["packages/@uppy/google-drive/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/google-drive/"}] } },
+    { "files": ["packages/@uppy/image-editor/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/image-editor/"}] } },
+    { "files": ["packages/@uppy/informer/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/informer/"}] } },
+    { "files": ["packages/@uppy/instagram/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/instagram/"}] } },
+    { "files": ["packages/@uppy/locales/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/locales/"}] } },
+    { "files": ["packages/@uppy/onedrive/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/onedrive/"}] } },
+    { "files": ["packages/@uppy/progress-bar/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/progress-bar/"}] } },
+    { "files": ["packages/@uppy/provider-views/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/provider-views/"}] } },
+    { "files": ["packages/@uppy/react/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/react/"}] } },
+    { "files": ["packages/@uppy/react-native/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/react-native/"}] } },
+    { "files": ["packages/@uppy/redux-dev-tools/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/redux-dev-tools/"}] } },
+    { "files": ["packages/@uppy/robodog/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/robodog/"}] } },
+    { "files": ["packages/@uppy/screen-capture/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/screen-capture/"}] } },
+    { "files": ["packages/@uppy/status-bar/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/status-bar/"}] } },
+    { "files": ["packages/@uppy/store-default/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/store-default/"}] } },
+    { "files": ["packages/@uppy/store-redux/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/store-redux/"}] } },
+    { "files": ["packages/@uppy/svelte/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/svelte/"}] } },
+    { "files": ["packages/@uppy/thumbnail-generator/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/thumbnail-generator/"}] } },
+    { "files": ["packages/@uppy/transloadit/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/transloadit/"}] } },
+    { "files": ["packages/@uppy/tus/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/tus/"}] } },
+    { "files": ["packages/@uppy/unsplash/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/unsplash/"}] } },
+    { "files": ["packages/@uppy/url/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/url/"}] } },
+    { "files": ["packages/@uppy/utils/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/utils/"}] } },
+    { "files": ["packages/@uppy/vue/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/vue/"}] } },
+    { "files": ["packages/@uppy/webcam/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/webcam/"}] } },
+    { "files": ["packages/@uppy/xhr-upload/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/xhr-upload/"}] } },
+    { "files": ["packages/@uppy/zoom/**.js"], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "packages/@uppy/zoom/"}] } },
+
+
+    { "files": ["examples/aws-companion/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/aws-companion/"}] } },
+    { "files": ["examples/aws-presigned-url/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/aws-presigned-url/"}] } },
+    { "files": ["examples/bundled/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/bundled/"}] } },
+    { "files": ["examples/cdn-example/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/cdn-example/"}] } },
+    { "files": ["examples/custom-provider/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/custom-provider/"}] } },
+    { "files": ["examples/dev/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/dev/"}] } },
+    { "files": ["examples/digitalocean-spaces/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/digitalocean-spaces/"}] } },
+    { "files": ["examples/multiple-instances/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/multiple-instances/"}] } },
+    { "files": ["examples/node-xhr/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/node-xhr/"}] } },
+    { "files": ["examples/php-xhr/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/php-xhr/"}] } },
+    { "files": ["examples/python-xhr/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/python-xhr/"}] } },
+    { "files": ["examples/react-example/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/react-example/"}] } },
+    { "files": ["examples/react-native-expo/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/react-native-expo/"}] } },
+    { "files": ["examples/redux/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/redux/"}] } },
+    { "files": ["examples/svelte-example/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/svelte-example/"}] } },
+    { "files": ["examples/transloadit/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/transloadit/"}] } },
+    { "files": ["examples/transloadit-textarea/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/transloadit-textarea/"}] } },
+    { "files": ["examples/uppy-with-companion/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/uppy-with-companion/"}] } },
+    { "files": ["examples/vue/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/vue/"}] } },
+    { "files": ["examples/xhr-bundle/**.js" ], "rules": { "import/no-extraneous-dependencies": ["warn", {"packageDir": "examples/xhr-bundle/"}] } }
+  ]
 }

.vscode/uppy.code-workspace

@@ -0,0 +1,29 @@
+{
+	"folders": [
+		{
+			"path": ".."
+		}
+	],
+	"settings": {
+		"workbench.colorCustomizations": {
+			"titleBar.activeForeground": "#ffffff",
+			"titleBar.activeBackground": "#ff009d",
+		},
+		"search.exclude": {
+			"website/public/": true,
+			"node_modules/": true,
+			"website/node_modules/": true,
+			"dist/": true,
+			"lib/": true,
+			"package-lock.json": true,
+			"website/package-lock.json": true,
+			"yarn-error.log": true,
+			"website/.deploy_git": true,
+			"npm-debug.log": true,
+			"website/npm-debug.log": true,
+			"website/debug.log": true,
+			"nohup.out": true,
+			"yarn.lock": true
+		}		
+	}
+}

babel.config.js

@@ -9,14 +9,14 @@ module.exports = (api) => {
       ['@babel/preset-env', {
         modules: false,
         loose: true,
-        targets
-      }]
+        targets,
+      }],
     ],
     plugins: [
       ['@babel/plugin-proposal-class-properties', { loose: true }],
       '@babel/plugin-transform-object-assign',
       ['@babel/plugin-transform-react-jsx', { pragma: 'h' }],
-      process.env.IS_RELEASE_BUILD && 'babel-plugin-inline-package-json'
-    ].filter(Boolean)
+      process.env.IS_RELEASE_BUILD && 'babel-plugin-inline-package-json',
+    ].filter(Boolean),
   }
 }

bin/after-version-bump.js

@@ -16,6 +16,7 @@ const { promisify } = require('util')
 const once = require('events.once')
 const globby = require('globby')
 const fs = require('fs')
+
 const readFile = promisify(fs.readFile)
 const writeFile = promisify(fs.writeFile)
 
@@ -36,7 +37,7 @@ async function updateVersions (files, packageName) {
   const urlPart = packageName === 'uppy' ? packageName : packageName.slice(1)
 
   const replacements = new Map([
-    [RegExp(`${urlPart}/v\\d+\\.\\d+\\.\\d+\\/`, 'g'), `${urlPart}/v${version}/`]
+    [RegExp(`${urlPart}/v\\d+\\.\\d+\\.\\d+\\/`, 'g'), `${urlPart}/v${version}/`],
     // maybe more later
   ])
 
@@ -62,8 +63,8 @@ async function npmRunBuild () {
     env: {
       ...process.env,
       FRESH: true, // force rebuild everything
-      IS_RELEASE_BUILD: true
-    }
+      IS_RELEASE_BUILD: true,
+    },
   })
   const [exitCode] = await once(npmRun, 'exit')
   if (exitCode !== 0) {
@@ -91,7 +92,7 @@ async function main () {
     'website/src/docs/**',
     'website/src/examples/**',
     'website/themes/uppy/layout/**',
-    '!**/node_modules/**'
+    '!**/node_modules/**',
   ])
 
   await updateVersions(files, 'uppy')
@@ -106,7 +107,7 @@ async function main () {
   await npmRunBuild()
 }
 
-main().catch(function (err) {
+main().catch((err) => {
   console.error(err.stack)
   process.exit(1)
 })

bin/build-bundle.js

@@ -20,12 +20,12 @@ function buildBundle (srcFile, bundleFile, { minify = false, standalone = '' } =
   b.transform(babelify)
   b.on('error', handleErr)
 
-  return new Promise(function (resolve, reject) {
+  return new Promise((resolve, reject) => {
     b.bundle()
-      .pipe(exorcist(bundleFile + '.map'))
+      .pipe(exorcist(`${bundleFile}.map`))
       .pipe(fs.createWriteStream(bundleFile), 'utf8')
       .on('error', handleErr)
-      .on('finish', function () {
+      .on('finish', () => {
         if (minify) {
           console.info(chalk.green(`✓ Built Minified Bundle [${standalone}]:`), chalk.magenta(bundleFile))
         } else {
@@ -60,7 +60,7 @@ const methods = [
     './packages/@uppy/robodog/bundle.js',
     './packages/@uppy/robodog/dist/robodog.min.js',
     { standalone: 'Robodog', minify: true }
-  )
+  ),
 ]
 
 // Build minified versions of all the locales
@@ -76,6 +76,6 @@ glob.sync(localePackagePath).forEach((localePath) => {
   )
 })
 
-Promise.all(methods).then(function () {
+Promise.all(methods).then(() => {
   console.info(chalk.yellow('✓ JS bundles 🎉'))
 })

bin/build-css.js

@@ -32,7 +32,7 @@ async function compileCSS () {
         resolve(url, {
           basedir: path.dirname(from),
           filename: from,
-          extensions: ['.scss']
+          extensions: ['.scss'],
         }, (err, res) => {
           if (err) return done(err)
 
@@ -43,17 +43,17 @@ async function compileCSS () {
 
           done({ file: res })
         })
-      }
+      },
     })
 
     const plugins = [
       autoprefixer,
       postcssLogical(),
-      postcssDirPseudoClass()
+      postcssDirPseudoClass(),
     ]
     const postcssResult = await postcss(plugins)
       .process(scssResult.css, { from: file })
-    postcssResult.warnings().forEach(function (warn) {
+    postcssResult.warnings().forEach((warn) => {
       console.warn(warn.toString())
     })
 
@@ -76,9 +76,9 @@ async function compileCSS () {
     )
 
     const minifiedResult = await postcss([
-      cssnano({ safe: true })
+      cssnano({ safe: true }),
     ]).process(postcssResult.css, { from: outfile })
-    minifiedResult.warnings().forEach(function (warn) {
+    minifiedResult.warnings().forEach((warn) => {
       console.warn(warn.toString())
     })
     await writeFile(outfile.replace(/\.css$/, '.min.css'), minifiedResult.css)

bin/build-lib.js

@@ -18,7 +18,7 @@ const META_FILES = [
   'babel.config.js',
   'package.json',
   'package-lock.json',
-  'bin/build-lib.js'
+  'bin/build-lib.js',
 ]
 
 function lastModified (file) {
@@ -27,8 +27,7 @@ function lastModified (file) {
 
 async function buildLib () {
   const metaMtimes = await Promise.all(META_FILES.map((filename) =>
-    lastModified(path.join(__dirname, '..', filename))
-  ))
+    lastModified(path.join(__dirname, '..', filename))))
   const metaMtime = Math.max(...metaMtimes)
 
   const files = await glob(SOURCE)
@@ -51,13 +50,14 @@ async function buildLib () {
     await mkdirp(path.dirname(libFile))
     await Promise.all([
       writeFile(libFile, code),
-      writeFile(libFile + '.map', JSON.stringify(map))
+      writeFile(`${libFile}.map`, JSON.stringify(map)),
     ])
     console.log(chalk.green('Compiled lib:'), chalk.magenta(libFile))
   }
 }
 
 console.log('Using Babel version:', require('@babel/core/package.json').version)
+
 buildLib().catch((err) => {
   console.error(err.stack)
   process.exit(1)

bin/check-npm-version.js

@@ -1,4 +1,5 @@
 #!/usr/bin/env node
+
 'use strict'
 
 const userAgent = process.env.npm_config_user_agent

bin/disc.js

@@ -14,7 +14,7 @@ function minifyify (filename) {
     return minify({
       sourceMap: false,
       toplevel: true,
-      compress: { unsafe: true }
+      compress: { unsafe: true },
     })
   }
   return new PassThrough()
@@ -22,7 +22,7 @@ function minifyify (filename) {
 
 const bundler = browserify(path.join(__dirname, '../packages/uppy/index.js'), {
   fullPaths: true,
-  standalone: 'Uppy'
+  standalone: 'Uppy',
 })
 
 bundler.transform(babelify)

bin/locale-packs.js

@@ -4,6 +4,7 @@ const chalk = require('chalk')
 const path = require('path')
 const stringifyObject = require('stringify-object')
 const fs = require('fs')
+
 const uppy = new Uppy()
 let localePack = {}
 const plugins = {}
@@ -23,7 +24,7 @@ if (mode === 'build') {
 function getSources (pluginName) {
   const dependencies = {
     // because 'provider-views' doesn't have its own locale, it uses Core's defaultLocale
-    core: ['provider-views']
+    core: ['provider-views'],
   }
 
   const globPath = path.join(__dirname, '..', 'packages', '@uppy', pluginName, 'lib', '**', '*.js')
@@ -52,10 +53,10 @@ function buildPluginsList () {
   for (const file of files) {
     const dirName = path.dirname(file)
     const pluginName = path.basename(dirName)
-    if (pluginName === 'locales' ||
-        pluginName === 'react-native' ||
-        pluginName === 'vue' ||
-        pluginName === 'svelte') {
+    if (pluginName === 'locales'
+        || pluginName === 'react-native'
+        || pluginName === 'vue'
+        || pluginName === 'svelte') {
       continue
     }
     const Plugin = require(dirName)
@@ -69,24 +70,24 @@ function buildPluginsList () {
     global.navigator = { userAgent: '' }
     global.localStorage = {
       key: () => { },
-      getItem: () => { }
+      getItem: () => { },
     }
     global.window = {
       indexedDB: {
-        open: () => { return {} }
-      }
+        open: () => { return {} },
+      },
     }
     global.document = {
       createElement: () => {
         return { style: {} }
-      }
+      },
     }
 
     try {
       if (pluginName === 'provider-views') {
         plugin = new Plugin(plugins['drag-drop'], {
           companionPattern: '',
-          companionUrl: 'https://companion.uppy.io'
+          companionUrl: 'https://companion.uppy.io',
         })
       } else if (pluginName === 'store-redux') {
         plugin = new Plugin({ store: { dispatch: () => { } } })
@@ -96,9 +97,9 @@ function buildPluginsList () {
           companionUrl: 'https://companion.uppy.io',
           params: {
             auth: {
-              key: 'x'
-            }
-          }
+              key: 'x',
+            },
+          },
         })
       }
     } catch (err) {
@@ -150,7 +151,7 @@ function checkForUnused (fileContents, pluginName, localePack) {
 }
 
 function sortObjectAlphabetically (obj, sortFunc) {
-  return Object.keys(obj).sort(sortFunc).reduce(function (result, key) {
+  return Object.keys(obj).sort(sortFunc).reduce((result, key) => {
     result[key] = obj[key]
     return result
   }, {})
@@ -164,14 +165,14 @@ function createTypeScriptLocale (plugin, pluginName) {
   const pluginClassName = pluginName === 'core' ? 'Core' : plugin.id
   const localePath = path.join(__dirname, '..', 'packages', '@uppy', pluginName, 'types', 'generatedLocale.d.ts')
 
-  const localeTypes =
-    'import Uppy = require(\'@uppy/core\')\n' +
-    '\n' +
-    `type ${pluginClassName}Locale = Uppy.Locale` + '<\n' +
-    allowedStringTypes + '\n' +
-    '>\n' +
-    '\n' +
-    `export = ${pluginClassName}Locale\n`
+  const localeTypes
+    = `${'import Uppy = require(\'@uppy/core\')\n'
+    + '\n'
+    + `type ${pluginClassName}Locale = Uppy.Locale` + '<\n'}${
+      allowedStringTypes}\n`
+    + `>\n`
+    + `\n`
+    + `export = ${pluginClassName}Locale\n`
 
   fs.writeFileSync(localePath, localeTypes)
 }
@@ -196,13 +197,13 @@ function build () {
   const prettyLocale = stringifyObject(localePack, {
     indent: '  ',
     singleQuotes: true,
-    inlineCharacterLimit: 12
+    inlineCharacterLimit: 12,
   })
 
   const localeTemplatePath = path.join(__dirname, '..', 'packages', '@uppy', 'locales', 'template.js')
   const template = fs.readFileSync(localeTemplatePath, 'utf-8')
 
-  const finalLocale = template.replace('en_US.strings = {}', 'en_US.strings = ' + prettyLocale)
+  const finalLocale = template.replace('en_US.strings = {}', `en_US.strings = ${prettyLocale}`)
 
   const localePackagePath = path.join(__dirname, '..', 'packages', '@uppy', 'locales', 'src', 'en_US.js')
   fs.writeFileSync(localePackagePath, finalLocale, 'utf-8')

bin/run-example.js

@@ -13,6 +13,7 @@
 
 const path = require('path')
 const { execSync } = require('child_process')
+
 const exampleName = process.argv[2]
 
 if (!exampleName) {

bin/update-contributors.js

@@ -11,7 +11,7 @@ async function updateContributorsListInReadme () {
     '--cols', '6',
     '--format', 'md',
     '--showlogin', 'true',
-    '--sortOrder', 'desc'
+    '--sortOrder', 'desc',
   ]
 
   if (process.env.GITHUB_TOKEN) {

bin/upload-to-cdn.js

@@ -85,7 +85,7 @@ async function getLocalDistFiles (packagePath) {
   const entries = await Promise.all(
     files.map(async (f) => [
       f,
-      await readFile(path.join(packagePath, 'dist', f))
+      await readFile(path.join(packagePath, 'dist', f)),
     ])
   )
 
@@ -112,9 +112,9 @@ async function main (packageName, version) {
   const s3 = new AWS.S3({
     credentials: new AWS.Credentials({
       accessKeyId: process.env.EDGLY_KEY,
-      secretAccessKey: process.env.EDGLY_SECRET
+      secretAccessKey: process.env.EDGLY_SECRET,
     }),
-    region: AWS_REGION
+    region: AWS_REGION,
   })
 
   const remote = !!version
@@ -145,7 +145,7 @@ async function main (packageName, version) {
 
   const { Contents: existing } = await s3.listObjects({
     Bucket: AWS_BUCKET,
-    Prefix: outputPath
+    Prefix: outputPath,
   }).promise()
   if (existing.length > 0) {
     if (process.argv.includes('--force')) {
@@ -177,7 +177,7 @@ async function main (packageName, version) {
       Bucket: AWS_BUCKET,
       Key: key,
       ContentType: mime.lookup(filename),
-      Body: buffer
+      Body: buffer,
     }).promise()
   }
 }

examples/aws-companion/main.js

@@ -6,18 +6,18 @@ const AwsS3 = require('@uppy/aws-s3')
 
 const uppy = new Uppy({
   debug: true,
-  autoProceed: false
+  autoProceed: false,
 })
 
 uppy.use(GoogleDrive, {
-  companionUrl: 'http://localhost:3020'
+  companionUrl: 'http://localhost:3020',
 })
 uppy.use(Webcam)
 uppy.use(Dashboard, {
   inline: true,
   target: 'body',
-  plugins: ['GoogleDrive', 'Webcam']
+  plugins: ['GoogleDrive', 'Webcam'],
 })
 uppy.use(AwsS3, {
-  companionUrl: 'http://localhost:3020'
+  companionUrl: 'http://localhost:3020',
 })

examples/aws-companion/server.js

@@ -8,19 +8,19 @@ const DATA_DIR = path.join(__dirname, 'tmp')
 
 app.use(require('cors')({
   origin: true,
-  credentials: true
+  credentials: true,
 }))
 app.use(require('cookie-parser')())
 app.use(require('body-parser').json())
 app.use(require('express-session')({
-  secret: 'hello planet'
+  secret: 'hello planet',
 }))
 
 const options = {
   providerOptions: {
     drive: {
       key: process.env.COMPANION_GOOGLE_KEY,
-      secret: process.env.COMPANION_GOOGLE_SECRET
+      secret: process.env.COMPANION_GOOGLE_SECRET,
     },
     s3: {
       getKey: (req, filename) =>
@@ -29,13 +29,13 @@ const options = {
       secret: process.env.COMPANION_AWS_SECRET,
       bucket: process.env.COMPANION_AWS_BUCKET,
       region: process.env.COMPANION_AWS_REGION,
-      endpoint: process.env.COMPANION_AWS_ENDPOINT
-    }
+      endpoint: process.env.COMPANION_AWS_ENDPOINT,
+    },
   },
   server: { host: 'localhost:3020' },
   filePath: DATA_DIR,
   secret: 'blah blah',
-  debug: true
+  debug: true,
 }
 
 // Create the data directory here for the sake of the example.
@@ -44,7 +44,7 @@ try {
 } catch (err) {
   fs.mkdirSync(DATA_DIR)
 }
-process.on('exit', function () {
+process.on('exit', () => {
   rimraf.sync(DATA_DIR)
 })
 

examples/aws-presigned-url/main.js

@@ -3,12 +3,12 @@ const Dashboard = require('@uppy/dashboard')
 const AwsS3 = require('@uppy/aws-s3')
 
 const uppy = new Uppy({
-  debug: true
+  debug: true,
 })
 
 uppy.use(Dashboard, {
   inline: true,
-  target: 'body'
+  target: 'body',
 })
 uppy.use(AwsS3, {
   getUploadParameters (file) {
@@ -18,12 +18,12 @@ uppy.use(AwsS3, {
       // Send and receive JSON.
       headers: {
         accept: 'application/json',
-        'content-type': 'application/json'
+        'content-type': 'application/json',
       },
       body: JSON.stringify({
         filename: file.name,
-        contentType: file.type
-      })
+        contentType: file.type,
+      }),
     }).then((response) => {
       // Parse the JSON response.
       return response.json()
@@ -33,8 +33,8 @@ uppy.use(AwsS3, {
         method: data.method,
         url: data.url,
         fields: data.fields,
-        headers: data.headers
+        headers: data.headers,
       }
     })
-  }
+  },
 })

examples/aws-presigned-url/serve.js

@@ -13,7 +13,7 @@ const b = browserify({
   cache: {},
   packageCache: {},
   debug: true,
-  entries: path.join(__dirname, './main.js')
+  entries: path.join(__dirname, './main.js'),
 })
 
 b.plugin(watchify)
@@ -21,8 +21,8 @@ b.plugin(watchify)
 b.transform(babelify)
 b.transform(aliasify, {
   aliases: {
-    '@uppy': path.join(__dirname, '../../packages/@uppy')
-  }
+    '@uppy': path.join(__dirname, '../../packages/@uppy'),
+  },
 })
 
 function bundle () {
@@ -43,6 +43,6 @@ console.log('bundling...')
 bundle().on('finish', () => {
   // Start the PHP delevopment server.
   spawn('php', ['-S', `localhost:${port}`], {
-    stdio: 'inherit'
+    stdio: 'inherit',
   })
 })

examples/bundled/index.js

@@ -17,8 +17,8 @@ const uppy = new Uppy({
   debug: true,
   meta: {
     username: 'John',
-    license: 'Creative Commons'
-  }
+    license: 'Creative Commons',
+  },
 })
   .use(Dashboard, {
     trigger: '#pick-files',
@@ -27,11 +27,11 @@ const uppy = new Uppy({
     replaceTargetContent: true,
     metaFields: [
       { id: 'license', name: 'License', placeholder: 'specify license' },
-      { id: 'caption', name: 'Caption', placeholder: 'add caption' }
+      { id: 'caption', name: 'Caption', placeholder: 'add caption' },
     ],
     showProgressDetails: true,
     proudlyDisplayPoweredByUppy: true,
-    note: '2 files, images and video only'
+    note: '2 files, images and video only',
   })
   .use(GoogleDrive, { target: Dashboard, companionUrl: 'http://localhost:3020' })
   .use(Instagram, { target: Dashboard, companionUrl: 'http://localhost:3020' })

examples/bundled/sw.js

@@ -45,8 +45,8 @@ function removeFile (store, fileID) {
 function getFiles (store) {
   sendMessageToAllClients({
     type: 'uppy/ALL_FILES',
-    store: store,
-    files: getCache(store)
+    store,
+    files: getCache(store),
   })
 }
 

examples/custom-provider/babel.config.js

@@ -4,11 +4,11 @@ module.exports = (api) => {
     presets: [
       ['@babel/preset-env', {
         modules: false,
-        loose: true
-      }]
+        loose: true,
+      }],
     ],
     plugins: [
-      ['@babel/plugin-transform-react-jsx', { pragma: 'h' }]
-    ].filter(Boolean)
+      ['@babel/plugin-transform-react-jsx', { pragma: 'h' }],
+    ].filter(Boolean),
   }
 }

examples/custom-provider/client/MyCustomProvider.js

@@ -13,7 +13,7 @@ module.exports = class MyCustomProvider extends Plugin {
     this.title = 'MyUnsplash'
     this.icon = () => (
       <svg width="32" height="32" xmlns="http://www.w3.org/2000/svg">
-        <path d="M10 9V0h12v9H10zm12 5h10v18H0V14h10v9h12v-9z" fill="#000000" fill-rule="nonzero" />
+        <path d="M10 9V0h12v9H10zm12 5h10v18H0V14h10v9h12v-9z" fill="#000000" fillRule="nonzero" />
       </svg>
     )
 
@@ -21,7 +21,7 @@ module.exports = class MyCustomProvider extends Plugin {
       companionUrl: this.opts.companionUrl,
       companionHeaders: this.opts.companionHeaders || this.opts.serverHeaders,
       provider: 'myunsplash',
-      pluginId: this.id
+      pluginId: this.id,
     })
 
     this.files = []
@@ -29,12 +29,12 @@ module.exports = class MyCustomProvider extends Plugin {
     this.render = this.render.bind(this)
 
     // merge default options with the ones set by user
-    this.opts = Object.assign({}, opts)
+    this.opts = { ...opts }
   }
 
   install () {
     this.view = new ProviderViews(this, {
-      provider: this.provider
+      provider: this.provider,
     })
 
     const target = this.opts.target

examples/custom-provider/client/main.js

@@ -5,21 +5,21 @@ const MyCustomProvider = require('./MyCustomProvider')
 const Dashboard = require('@uppy/dashboard')
 
 const uppy = new Uppy({
-  debug: true
+  debug: true,
 })
 
 uppy.use(GoogleDrive, {
-  companionUrl: 'http://localhost:3020'
+  companionUrl: 'http://localhost:3020',
 })
 
 uppy.use(MyCustomProvider, {
-  companionUrl: 'http://localhost:3020'
+  companionUrl: 'http://localhost:3020',
 })
 
 uppy.use(Dashboard, {
   inline: true,
   target: 'body',
-  plugins: ['GoogleDrive', 'MyCustomProvider']
+  plugins: ['GoogleDrive', 'MyCustomProvider'],
 })
 
 uppy.use(Tus, { endpoint: 'https://tusd.tusdemo.net/files/' })

examples/custom-provider/server/customprovider.js

@@ -1,4 +1,5 @@
 const request = require('request')
+
 const BASE_URL = 'https://api.unsplash.com'
 
 /**
@@ -16,8 +17,8 @@ class MyCustomProvider {
       method: 'GET',
       json: true,
       headers: {
-        Authorization: `Bearer ${token}`
-      }
+        Authorization: `Bearer ${token}`,
+      },
     }
 
     request(options, (err, resp, body) => {
@@ -37,8 +38,8 @@ class MyCustomProvider {
       method: 'GET',
       json: true,
       headers: {
-        Authorization: `Bearer ${token}`
-      }
+        Authorization: `Bearer ${token}`,
+      },
     }
 
     request(options, (err, resp, body) => {
@@ -61,8 +62,8 @@ class MyCustomProvider {
       method: 'GET',
       json: true,
       headers: {
-        Authorization: `Bearer ${token}`
-      }
+        Authorization: `Bearer ${token}`,
+      },
     }
 
     request(options, (err, resp, body) => {
@@ -80,14 +81,14 @@ class MyCustomProvider {
     const data = {
       username: null,
       items: [],
-      nextPagePath: null
+      nextPagePath: null,
     }
 
     const items = res
     items.forEach((item) => {
       const isFolder = !!item.published_at
       data.items.push({
-        isFolder: isFolder,
+        isFolder,
         icon: isFolder ? item.cover_photo.urls.thumb : item.urls.thumb,
         name: item.title || item.description,
         mimeType: isFolder ? null : 'image/jpeg',
@@ -95,7 +96,7 @@ class MyCustomProvider {
         thumbnail: isFolder ? item.cover_photo.urls.thumb : item.urls.thumb,
         requestPath: item.id,
         modifiedDate: item.updated_at,
-        size: null
+        size: null,
       })
     })
 

examples/custom-provider/server/index.js

@@ -11,7 +11,7 @@ app.use(bodyParser.json())
 app.use(session({
   secret: 'some-secret',
   resave: true,
-  saveUninitialized: true
+  saveUninitialized: true,
 }))
 
 app.use((req, res, next) => {
@@ -42,8 +42,8 @@ const uppyOptions = {
   providerOptions: {
     drive: {
       key: 'your google drive key',
-      secret: 'your google drive secret'
-    }
+      secret: 'your google drive secret',
+    },
   },
   customProviders: {
     myunsplash: {
@@ -53,19 +53,19 @@ const uppyOptions = {
         access_url: ACCESS_URL,
         oauth: 2,
         key: 'your unsplash key here',
-        secret: 'your unsplash secret here'
+        secret: 'your unsplash secret here',
       },
       // you provider module
-      module: require('./customprovider')
-    }
+      module: require('./customprovider'),
+    },
   },
   server: {
     host: 'localhost:3020',
-    protocol: 'http'
+    protocol: 'http',
   },
   filePath: './output',
   secret: 'some-secret',
-  debug: true
+  debug: true,
 }
 
 app.use(uppy.app(uppyOptions))

examples/dev/Dashboard.js

@@ -52,8 +52,8 @@ module.exports = () => {
     logger: Uppy.debugLogger,
     meta: {
       username: 'John',
-      license: 'Creative Commons'
-    }
+      license: 'Creative Commons',
+    },
   })
     .use(Dashboard, {
       trigger: '#pick-files',
@@ -61,11 +61,11 @@ module.exports = () => {
       target: '.foo',
       metaFields: [
         { id: 'license', name: 'License', placeholder: 'specify license' },
-        { id: 'caption', name: 'Caption', placeholder: 'add caption' }
+        { id: 'caption', name: 'Caption', placeholder: 'add caption' },
       ],
       showProgressDetails: true,
       proudlyDisplayPoweredByUppy: true,
-      note: '2 files, images and video only'
+      note: '2 files, images and video only',
     })
     .use(GoogleDrive, { target: Dashboard, companionUrl: COMPANION_URL })
     .use(Instagram, { target: Dashboard, companionUrl: COMPANION_URL })
@@ -79,7 +79,7 @@ module.exports = () => {
     .use(Webcam, {
       target: Dashboard,
       showVideoSourceDropdown: true,
-      showRecordingLength: true
+      showRecordingLength: true,
     })
     .use(ScreenCapture, { target: Dashboard })
     .use(Form, { target: '#upload-form' })
@@ -103,8 +103,8 @@ module.exports = () => {
         waitForEncoding: true,
         params: {
           auth: { key: TRANSLOADIT_KEY },
-          template_id: TRANSLOADIT_TEMPLATE
-        }
+          template_id: TRANSLOADIT_TEMPLATE,
+        },
       })
       break
     case 'transloadit-s3':
@@ -114,22 +114,22 @@ module.exports = () => {
         importFromUploadURLs: true,
         params: {
           auth: { key: TRANSLOADIT_KEY },
-          template_id: TRANSLOADIT_TEMPLATE
-        }
+          template_id: TRANSLOADIT_TEMPLATE,
+        },
       })
       break
     case 'transloadit-xhr':
       uppyDashboard.setMeta({
         params: JSON.stringify({
           auth: { key: TRANSLOADIT_KEY },
-          template_id: TRANSLOADIT_TEMPLATE
-        })
+          template_id: TRANSLOADIT_TEMPLATE,
+        }),
       })
       uppyDashboard.use(XHRUpload, {
         method: 'POST',
         endpoint: 'https://api2.transloadit.com/assemblies',
         metaFields: ['params'],
-        bundle: true
+        bundle: true,
       })
       break
   }

examples/dev/DragDrop.js

@@ -7,10 +7,10 @@ const ProgressBar = require('@uppy/progress-bar/src')
 module.exports = () => {
   const uppyDragDrop = new Uppy({
     debug: true,
-    autoProceed: true
+    autoProceed: true,
   })
     .use(DragDrop, {
-      target: '#uppyDragDrop'
+      target: '#uppyDragDrop',
     })
     .use(ProgressBar, { target: '#uppyDragDrop-progress', hideAfterFinish: false })
     .use(Tus, { endpoint: 'https://tusd.tusdemo.net/files/' })

examples/dev/index.js

@@ -19,6 +19,6 @@ if ('serviceWorker' in navigator) {
       console.log('ServiceWorker registration successful with scope: ', registration.scope)
     })
     .catch((error) => {
-      console.log('Registration failed with ' + error)
+      console.log(`Registration failed with ${error}`)
     })
 }

examples/dev/sw.js

@@ -41,8 +41,8 @@ function removeFile (store, fileID) {
 function getFiles (store) {
   sendMessageToAllClients({
     type: 'uppy/ALL_FILES',
-    store: store,
-    files: getCache(store)
+    store,
+    files: getCache(store),
   })
 }
 

examples/digitalocean-spaces/main.js

@@ -3,12 +3,12 @@ const Dashboard = require('@uppy/dashboard')
 const AwsS3 = require('@uppy/aws-s3')
 
 const uppy = new Uppy({
-  debug: true
+  debug: true,
 })
 
 uppy.use(Dashboard, {
   inline: true,
-  target: 'body'
+  target: 'body',
 })
 
 // No client side changes needed!

examples/digitalocean-spaces/server.js

@@ -26,6 +26,7 @@ const app = router()
 // Set up the /params endpoint that will create signed URLs for us.
 app.use(require('cors')())
 app.use(require('body-parser').json())
+
 app.use('/companion', companion.app({
   providerOptions: {
     s3: {
@@ -36,10 +37,10 @@ app.use('/companion', companion.app({
       key: process.env.COMPANION_AWS_KEY,
       secret: process.env.COMPANION_AWS_SECRET,
       bucket: process.env.COMPANION_AWS_BUCKET,
-      region: process.env.COMPANION_AWS_REGION
-    }
+      region: process.env.COMPANION_AWS_REGION,
+    },
   },
-  server: { serverUrl: `localhost:${PORT}` }
+  server: { serverUrl: `localhost:${PORT}` },
 }))
 
 // Serve the built CSS file.
@@ -59,9 +60,9 @@ budo(path.join(__dirname, 'main.js'), {
       'babelify',
       ['aliasify', {
         aliases: {
-          '@uppy': path.join(__dirname, '../../packages/@uppy')
-        }
-      }]
-    ]
-  }
+          '@uppy': path.join(__dirname, '../../packages/@uppy'),
+        },
+      }],
+    ],
+  },
 })

examples/multiple-instances/main.js

@@ -6,23 +6,23 @@ const GoldenRetriever = require('@uppy/golden-retriever')
 // but with different `id`s.
 const a = new Uppy({
   id: 'a',
-  debug: true
+  debug: true,
 })
   .use(Dashboard, {
     target: '#a',
     inline: true,
-    width: 400
+    width: 400,
   })
   .use(GoldenRetriever, { serviceWorker: false })
 
 const b = new Uppy({
   id: 'b',
-  debug: true
+  debug: true,
 })
   .use(Dashboard, {
     target: '#b',
     inline: true,
-    width: 400
+    width: 400,
   })
   .use(GoldenRetriever, { serviceWorker: false })
 

examples/node-xhr/main.js

@@ -5,15 +5,15 @@ const xhr = require('@uppy/xhr-upload')
 
 const uppy = new Uppy({
   debug: true,
-  autoProceed: false
+  autoProceed: false,
 })
 
 uppy.use(Webcam)
 uppy.use(Dashboard, {
   inline: true,
   target: 'body',
-  plugins: ['Webcam']
+  plugins: ['Webcam'],
 })
 uppy.use(xhr, {
-  endpoint: 'http://localhost:3020/upload'
+  endpoint: 'http://localhost:3020/upload',
 })

examples/node-xhr/server.js

@@ -1,12 +1,12 @@
 var formidable = require('formidable')
 var http = require('http')
 
-http.createServer(function (req, res) {
+http.createServer((req, res) => {
   const headers = {
     'Content-Type': 'application/json',
     'Access-Control-Allow-Origin': '*',
     'Access-Control-Allow-Methods': 'OPTIONS, POST, GET',
-    'Access-Control-Max-Age': 2592000 // 30 days
+    'Access-Control-Max-Age': 2592000, // 30 days
     /** add other headers as per requirement */
   }
 
@@ -21,7 +21,7 @@ http.createServer(function (req, res) {
     form.uploadDir = './uploads'
     form.keepExtensions = true
 
-    form.parse(req, function (err, fields, files) {
+    form.parse(req, (err, fields, files) => {
       if (err) {
         console.log('some error', err)
         res.writeHead(200, headers)

examples/php-xhr/main.js

@@ -5,15 +5,15 @@ const XHRUpload = require('@uppy/xhr-upload')
 
 const uppy = new Uppy({
   debug: true,
-  autoProceed: false
+  autoProceed: false,
 })
 
 uppy.use(Webcam)
 uppy.use(Dashboard, {
   inline: true,
   target: 'body',
-  plugins: ['Webcam']
+  plugins: ['Webcam'],
 })
 uppy.use(XHRUpload, {
-  endpoint: 'http://localhost:3020/upload.php'
+  endpoint: 'http://localhost:3020/upload.php',
 })

examples/python-xhr/main.js

@@ -5,15 +5,15 @@ const XHRUpload = require('@uppy/xhr-upload')
 
 const uppy = new Uppy({
   debug: true,
-  autoProceed: false
+  autoProceed: false,
 })
 
 uppy.use(Webcam)
 uppy.use(Dashboard, {
   inline: true,
   target: 'body',
-  plugins: ['Webcam']
+  plugins: ['Webcam'],
 })
 uppy.use(XHRUpload, {
-  endpoint: 'http://localhost:3020/upload'
+  endpoint: 'http://localhost:3020/upload',
 })

examples/react-native-expo/App.js

@@ -29,12 +29,12 @@ export default class App extends React.Component {
       uploadStarted: false,
       uploadComplete: false,
       info: null,
-      totalProgress: 0
+      totalProgress: 0,
     }
 
-    this.isReactNative = (typeof navigator !== 'undefined' &&
-      typeof navigator.product === 'string' &&
-      navigator.product.toLowerCase() === 'reactnative')
+    this.isReactNative = (typeof navigator !== 'undefined'
+      && typeof navigator.product === 'string'
+      && navigator.product.toLowerCase() === 'reactnative')
 
     this.showFilePicker = this.showFilePicker.bind(this)
     this.hideFilePicker = this.hideFilePicker.bind(this)
@@ -46,14 +46,14 @@ export default class App extends React.Component {
       endpoint: 'https://tusd.tusdemo.net/files/',
       urlStorage: AsyncStorage,
       fileReader: getTusFileReader,
-      chunkSize: 10 * 1024 * 1024 // keep the chunk size small to avoid memory exhaustion
+      chunkSize: 10 * 1024 * 1024, // keep the chunk size small to avoid memory exhaustion
     })
     this.uppy.on('upload-progress', (file, progress) => {
       this.setState({
         progress: progress.bytesUploaded,
         total: progress.bytesTotal,
         totalProgress: this.uppy.state.totalProgress,
-        uploadStarted: true
+        uploadStarted: true,
       })
     })
     this.uppy.on('upload-success', (file, response) => {
@@ -64,7 +64,7 @@ export default class App extends React.Component {
         status: 'Upload complete ✅',
         uploadURL: result.successful[0] ? result.successful[0].uploadURL : null,
         uploadComplete: true,
-        uploadStarted: false
+        uploadStarted: false,
       })
       console.log('Upload complete:', result)
     })
@@ -72,14 +72,14 @@ export default class App extends React.Component {
     this.uppy.on('info-visible', () => {
       const info = this.uppy.getState().info
       this.setState({
-        info: info
+        info,
       })
       console.log('uppy-info:', info)
     })
 
     this.uppy.on('info-hidden', () => {
       this.setState({
-        info: null
+        info: null,
       })
     })
   }
@@ -88,13 +88,13 @@ export default class App extends React.Component {
     this.setState({
       isFilePickerVisible: true,
       uploadStarted: false,
-      uploadComplete: false
+      uploadComplete: false,
     })
   }
 
   hideFilePicker () {
     this.setState({
-      isFilePickerVisible: false
+      isFilePickerVisible: false,
     })
   }
 
@@ -102,12 +102,12 @@ export default class App extends React.Component {
     if (this.state.isPaused) {
       this.uppy.resumeAll()
       this.setState({
-        isPaused: false
+        isPaused: false,
       })
     } else {
       this.uppy.pauseAll()
       this.setState({
-        isPaused: true
+        isPaused: true,
       })
     }
   }
@@ -118,15 +118,16 @@ export default class App extends React.Component {
         paddingTop: 100,
         paddingLeft: 50,
         paddingRight: 50,
-        flex: 1
+        flex: 1,
       }}
       >
         <Text style={{
           fontSize: 25,
           marginBottom: 20,
-          textAlign: 'center'
+          textAlign: 'center',
         }}
-        >Uppy in React Native
+        >
+          Uppy in React Native
         </Text>
         <View style={{ alignItems: 'center' }}>
           <Image
@@ -141,7 +142,7 @@ export default class App extends React.Component {
             style={{
               marginBottom: 10,
               marginTop: 10,
-              color: '#b8006b'
+              color: '#b8006b',
             }}
           >
             {this.state.info.message}

examples/react-native-expo/FileList.js

@@ -36,7 +36,7 @@ function UppyDashboardFileIcon (props) {
     <View
       style={{
         ...styles.itemIconContainer,
-        backgroundColor: color
+        backgroundColor: color,
       }}
     >
       <SvgUri
@@ -87,19 +87,19 @@ const styles = StyleSheet.create({
     marginTop: 20,
     marginBottom: 20,
     flex: 1,
-    justifyContent: 'center'
+    justifyContent: 'center',
   },
   item: {
     width: 100,
     marginTop: 5,
     marginBottom: 15,
-    marginRight: 25
+    marginRight: 25,
   },
   itemImage: {
     width: 100,
     height: 100,
     borderRadius: 5,
-    marginBottom: 5
+    marginBottom: 5,
   },
   itemIconContainer: {
     width: 100,
@@ -108,24 +108,24 @@ const styles = StyleSheet.create({
     marginBottom: 5,
     backgroundColor: '#cfd3d6',
     alignItems: 'center',
-    justifyContent: 'center'
+    justifyContent: 'center',
   },
   itemIcon: {
     width: 42,
-    height: 56
+    height: 56,
   },
   itemIconSVG: {
     width: 50,
-    height: 50
+    height: 50,
   },
   itemName: {
     fontSize: 13,
     color: '#2c3e50',
-    fontWeight: '600'
+    fontWeight: '600',
   },
   itemType: {
     fontWeight: '600',
     fontSize: 12,
-    color: '#95a5a6'
-  }
+    color: '#95a5a6',
+  },
 })

examples/react-native-expo/PauseResumeButton.js

@@ -13,7 +13,8 @@ export default function PauseResumeButton (props) {
     >
       <Text
         style={styles.text}
-      >{props.isPaused ? 'Resume' : 'Pause'}
+      >
+        {props.isPaused ? 'Resume' : 'Pause'}
       </Text>
     </TouchableHighlight>
   )
@@ -22,11 +23,11 @@ export default function PauseResumeButton (props) {
 const styles = StyleSheet.create({
   button: {
     backgroundColor: '#cc0077',
-    padding: 10
+    padding: 10,
   },
   text: {
     color: '#fff',
     textAlign: 'center',
-    fontSize: 17
-  }
+    fontSize: 17,
+  },
 })

examples/react-native-expo/ProgressBar.js

@@ -10,24 +10,24 @@ export default function ProgressBar (props) {
   return (
     <View style={{
       marginTop: 15,
-      marginBottom: 15
+      marginBottom: 15,
     }}
     >
       <View
         style={{
           height: 5,
           overflow: 'hidden',
-          backgroundColor: '#dee1e3'
+          backgroundColor: '#dee1e3',
         }}
       >
         <View style={{
           height: 5,
           backgroundColor: progress === 100 ? colorGreen : colorBlue,
-          width: progress + '%'
+          width: `${progress}%`,
         }}
         />
       </View>
-      <Text>{progress ? progress + '%' : null}</Text>
+      <Text>{progress ? `${progress}%` : null}</Text>
     </View>
   )
 }

examples/react-native-expo/SelectFilesButton.js

@@ -15,11 +15,11 @@ export default function SelectFiles (props) {
 const styles = StyleSheet.create({
   button: {
     backgroundColor: '#cc0077',
-    padding: 15
+    padding: 15,
   },
   text: {
     color: '#fff',
     textAlign: 'center',
-    fontSize: 17
-  }
+    fontSize: 17,
+  },
 })

examples/react-native-expo/babel.config.js

@@ -1,6 +1,6 @@
 module.exports = function (api) {
   api.cache(true)
   return {
-    presets: ['babel-preset-expo']
+    presets: ['babel-preset-expo'],
   }
 }

examples/react-native-expo/tusFileReader.js

@@ -18,7 +18,7 @@ class TusFileReader {
     const options = {
       encoding: Expo.FileSystem.EncodingTypes.Base64,
       length: end - start,
-      position: start
+      position: start,
     }
     Expo.FileSystem.readAsStringAsync(this.file.uri, options).then((data) => {
       cb(null, base64.toByteArray(data))

examples/redux/main.js

@@ -17,10 +17,10 @@ function counter (state = 0, action) {
 }
 
 const reducer = combineReducers({
-  counter: counter,
+  counter,
   // You don't have to use the `uppy` key. But if you don't,
   // you need to provide a custom `selector` to the `uppyReduxStore` call below.
-  uppy: uppyReduxStore.reducer
+  uppy: uppyReduxStore.reducer,
 })
 
 let enhancer = applyMiddleware(
@@ -61,7 +61,7 @@ document.querySelector('#incrementAsync').onclick = () => {
 // Uppy using the same store
 const uppy = new Uppy({
   id: 'redux',
-  store: uppyReduxStore({ store: store }),
+  store: uppyReduxStore({ store }),
   // If we had placed our `reducer` elsewhere in Redux, eg. under an `uppy` key in the state for a profile page,
   // we'd do something like:
   //
@@ -70,12 +70,12 @@ const uppy = new Uppy({
   //   id: 'avatar',
   //   selector: state => state.pages.profile.uppy
   // }),
-  debug: true
+  debug: true,
 })
 uppy.use(Dashboard, {
   target: '#app',
   inline: true,
-  width: 400
+  width: 400,
 })
 uppy.use(Tus, { endpoint: 'https://tusd.tusdemo.net/' })
 

examples/svelte-example/postcss.config.js

@@ -1,5 +1,5 @@
 module.exports = {
   plugins: [
-    require('postcss-import')()
-  ]
+    require('postcss-import')(),
+  ],
 }

examples/svelte-example/rollup.config.js

@@ -21,12 +21,12 @@ function serve () {
       if (server) return
       server = require('child_process').spawn('npm', ['run', 'start', '--', '--dev'], {
         stdio: ['ignore', 'inherit', 'inherit'],
-        shell: true
+        shell: true,
       })
 
       process.on('SIGTERM', toExit)
       process.on('exit', toExit)
-    }
+    },
   }
 }
 
@@ -36,17 +36,17 @@ export default {
     sourcemap: true,
     format: 'iife',
     name: 'app',
-    file: 'public/build/bundle.js'
+    file: 'public/build/bundle.js',
   },
   plugins: [
     svelte({
       preprocess: sveltePreprocess({
-        postcss: true
+        postcss: true,
       }),
       compilerOptions: {
         // enable run-time checks when not in production
-        dev: !production
-      }
+        dev: !production,
+      },
     }),
     // we'll extract any component CSS out into
     // a separate file - better for performance
@@ -59,12 +59,12 @@ export default {
     // https://github.com/rollup/plugins/tree/master/packages/commonjs
     resolve({
       browser: true,
-      dedupe: ['svelte', '@uppy/core']
+      dedupe: ['svelte', '@uppy/core'],
     }),
     commonjs(),
     typescript({
       sourceMap: !production,
-      inlineSources: !production
+      inlineSources: !production,
     }),
 
     // In dev mode, call `npm run start` once
@@ -77,9 +77,9 @@ export default {
 
     // If we're building for production (npm run build
     // instead of npm run dev), minify
-    production && terser()
+    production && terser(),
   ],
   watch: {
-    clearScreen: false
-  }
+    clearScreen: false,
+  },
 }

examples/transloadit-textarea/main.js

@@ -26,7 +26,8 @@ class MarkdownTextarea {
     this.uploadLine.classList.add('mdtxt-upload')
 
     this.uploadLine.appendChild(
-      document.createTextNode('Upload an attachment'))
+      document.createTextNode('Upload an attachment')
+    )
   }
 
   install () {
@@ -106,8 +107,8 @@ class MarkdownTextarea {
       waitForEncoding: true,
       params: {
         auth: { key: TRANSLOADIT_EXAMPLE_KEY },
-        template_id: TRANSLOADIT_EXAMPLE_TEMPLATE
-      }
+        template_id: TRANSLOADIT_EXAMPLE_TEMPLATE,
+      },
     }).then((result) => {
       // Was cancelled
       if (result == null) return
@@ -125,8 +126,8 @@ class MarkdownTextarea {
       waitForEncoding: true,
       params: {
         auth: { key: TRANSLOADIT_EXAMPLE_KEY },
-        template_id: TRANSLOADIT_EXAMPLE_TEMPLATE
-      }
+        template_id: TRANSLOADIT_EXAMPLE_TEMPLATE,
+      },
     }).then((result) => {
       // Was cancelled
       if (result == null) return
@@ -141,7 +142,8 @@ class MarkdownTextarea {
 }
 
 const textarea = new MarkdownTextarea(
-  document.querySelector('#new textarea'))
+  document.querySelector('#new textarea')
+)
 textarea.install()
 
 function renderSnippet (title, text) {
@@ -173,8 +175,8 @@ function loadSnippets () {
 document.querySelector('#new').addEventListener('submit', (event) => {
   event.preventDefault()
 
-  const title = event.target.querySelector('input[name="title"]').value ||
-    'Unnamed Snippet'
+  const title = event.target.querySelector('input[name="title"]').value
+    || 'Unnamed Snippet'
   const text = textarea.element.value
 
   saveSnippet(title, text)

examples/transloadit/main.js

@@ -24,15 +24,15 @@ const formUppy = robodog.form('#test-form', {
   debug: true,
   fields: ['message'],
   restrictions: {
-    allowedFileTypes: ['.png']
+    allowedFileTypes: ['.png'],
   },
   waitForEncoding: true,
   params: {
     auth: { key: TRANSLOADIT_KEY },
-    template_id: TEMPLATE_ID
+    template_id: TEMPLATE_ID,
   },
   modal: true,
-  progressBar: '#test-form .progress'
+  progressBar: '#test-form .progress',
 })
 
 formUppy.on('error', (err) => {
@@ -51,15 +51,15 @@ const formUppyWithDashboard = robodog.form('#dashboard-form', {
   debug: true,
   fields: ['message'],
   restrictions: {
-    allowedFileTypes: ['.png']
+    allowedFileTypes: ['.png'],
   },
   waitForEncoding: true,
   note: 'Only PNG files please!',
   params: {
     auth: { key: TRANSLOADIT_KEY },
-    template_id: TEMPLATE_ID
+    template_id: TEMPLATE_ID,
   },
-  dashboard: '#dashboard-form .dashboard'
+  dashboard: '#dashboard-form .dashboard',
 })
 
 window.formUppyWithDashboard = formUppyWithDashboard
@@ -70,8 +70,8 @@ const dashboard = robodog.dashboard('#dashboard', {
   note: 'Images will be resized with Transloadit',
   params: {
     auth: { key: TRANSLOADIT_KEY },
-    template_id: TEMPLATE_ID
-  }
+    template_id: TEMPLATE_ID,
+  },
 })
 
 window.dashboard = dashboard
@@ -83,16 +83,16 @@ window.dashboard = dashboard
 function openModal () {
   robodog.pick({
     restrictions: {
-      allowedFileTypes: ['.png']
+      allowedFileTypes: ['.png'],
     },
     waitForEncoding: true,
     params: {
       auth: { key: TRANSLOADIT_KEY },
-      template_id: TEMPLATE_ID
+      template_id: TEMPLATE_ID,
     },
     providers: [
-      'webcam'
-    ]
+      'webcam',
+    ],
     // if providers need custom config
     // webcam: {
     //   option: 'whatever'
@@ -113,8 +113,8 @@ window.doUpload = (event) => {
     waitForEncoding: true,
     params: {
       auth: { key: TRANSLOADIT_KEY },
-      template_id: TEMPLATE_ID
-    }
+      template_id: TEMPLATE_ID,
+    },
   }).then((result) => {
     resultEl.classList.remove('hidden')
     errorEl.classList.add('hidden')

examples/uppy-with-companion/server/index.js

@@ -9,7 +9,7 @@ app.use(bodyParser.json())
 app.use(session({
   secret: 'some-secret',
   resave: true,
-  saveUninitialized: true
+  saveUninitialized: true,
 }))
 
 app.use((req, res, next) => {
@@ -36,29 +36,29 @@ const uppyOptions = {
   providerOptions: {
     drive: {
       key: 'your google key',
-      secret: 'your google secret'
+      secret: 'your google secret',
     },
     instagram: {
       key: 'your instagram key',
-      secret: 'your instagram secret'
+      secret: 'your instagram secret',
     },
     dropbox: {
       key: 'your dropbox key',
-      secret: 'your dropbox secret'
+      secret: 'your dropbox secret',
     },
     box: {
       key: 'your box key',
-      secret: 'your box secret'
-    }
+      secret: 'your box secret',
+    },
     // you can also add options for additional providers here
   },
   server: {
     host: 'localhost:3020',
-    protocol: 'http'
+    protocol: 'http',
   },
   filePath: './output',
   secret: 'some-secret',
-  debug: true
+  debug: true,
 }
 
 app.use(companion.app(uppyOptions))

examples/vue/babel.config.js

@@ -1,5 +1,5 @@
 module.exports = {
   presets: [
-    '@vue/cli-plugin-babel/preset'
-  ]
+    '@vue/cli-plugin-babel/preset',
+  ],
 }

examples/vue/src/main.js

@@ -4,5 +4,5 @@ import App from './App.vue'
 Vue.config.productionTip = false
 
 new Vue({
-  render: h => h(App)
+  render: h => h(App),
 }).$mount('#app')

examples/xhr-bundle/main.js

@@ -4,19 +4,19 @@ const XHRUpload = require('@uppy/xhr-upload')
 
 const uppy = new Uppy({
   debug: true,
-  meta: { something: 'xyz' }
+  meta: { something: 'xyz' },
 })
 
 uppy.use(Dashboard, {
   target: '#app',
   inline: true,
   hideRetryButton: true,
-  hideCancelButton: true
+  hideCancelButton: true,
 })
 
 uppy.use(XHRUpload, {
   bundle: true,
   endpoint: 'http://localhost:9967/upload',
   metaFields: ['something'],
-  fieldName: 'files'
+  fieldName: 'files',
 })

examples/xhr-bundle/serve.js

@@ -3,7 +3,7 @@ var cors = require('cors')
 var multer = require('multer')
 
 var upload = multer({
-  storage: multer.memoryStorage()
+  storage: multer.memoryStorage(),
 })
 
 app.use(cors())
@@ -13,9 +13,9 @@ app.listen(9967)
 
 function uploadRoute (req, res) {
   res.json({
-    files: req.files.map(function (file) {
+    files: req.files.map((file) => {
       delete file.buffer
       return file
-    })
+    }),
   })
 }

package.json

@@ -79,6 +79,7 @@
     "@uppy/xhr-upload": "file:packages/@uppy/xhr-upload",
     "@uppy/zoom": "file:packages/@uppy/zoom",
     "deep-freeze": "0.0.1",
+    "eslint-config-transloadit": "^1.1.4",
     "remark-lint-uppy": "file:private/remark-lint-uppy",
     "uppy": "file:packages/uppy",
     "uppy.io": "file:website"
@@ -149,6 +150,7 @@
     "eslint-plugin-jest": "23.20.0",
     "eslint-plugin-jsdoc": "30.2.2",
     "eslint-plugin-node": "11.1.0",
+    "eslint-plugin-prefer-import": "0.0.1",
     "eslint-plugin-promise": "4.2.1",
     "eslint-plugin-react": "7.20.6",
     "eslint-plugin-standard": "4.0.1",

packages/@uppy/aws-s3-multipart/src/MultipartUploader.js

@@ -15,7 +15,7 @@ const defaultOptions = {
   onSuccess () {},
   onError (err) {
     throw err
-  }
+  },
 }
 
 function ensureInt (value) {
@@ -32,7 +32,7 @@ class MultipartUploader {
   constructor (file, options) {
     this.options = {
       ...defaultOptions,
-      ...options
+      ...options,
     }
     // Use default `getChunkSize` if it was null or something
     if (!this.options.getChunkSize) {
@@ -96,20 +96,19 @@ class MultipartUploader {
     this.chunkState = chunks.map(() => ({
       uploaded: 0,
       busy: false,
-      done: false
+      done: false,
     }))
   }
 
   _createUpload () {
     this.createdPromise = Promise.resolve().then(() =>
-      this.options.createMultipartUpload()
-    )
+      this.options.createMultipartUpload())
     return this.createdPromise.then((result) => {
       if (this._aborted()) throw createAbortError()
 
-      const valid = typeof result === 'object' && result &&
-        typeof result.uploadId === 'string' &&
-        typeof result.key === 'string'
+      const valid = typeof result === 'object' && result
+        && typeof result.uploadId === 'string'
+        && typeof result.key === 'string'
       if (!valid) {
         throw new TypeError('AwsS3/Multipart: Got incorrect result from `createMultipartUpload()`, expected an object `{ uploadId, key }`.')
       }
@@ -128,9 +127,8 @@ class MultipartUploader {
     return Promise.resolve().then(() =>
       this.options.listParts({
         uploadId: this.uploadId,
-        key: this.key
-      })
-    ).then((parts) => {
+        key: this.key,
+      })).then((parts) => {
       if (this._aborted()) throw createAbortError()
 
       parts.forEach((part) => {
@@ -139,14 +137,14 @@ class MultipartUploader {
         this.chunkState[i] = {
           uploaded: ensureInt(part.Size),
           etag: part.ETag,
-          done: true
+          done: true,
         }
 
         // Only add if we did not yet know about this part.
         if (!this.parts.some((p) => p.PartNumber === part.PartNumber)) {
           this.parts.push({
             PartNumber: part.PartNumber,
-            ETag: part.ETag
+            ETag: part.ETag,
           })
         }
       })
@@ -211,9 +209,8 @@ class MultipartUploader {
         if (shouldRetry(err) && retryAttempt < retryDelays.length) {
           return delay(retryDelays[retryAttempt], { signal })
             .then(() => doAttempt(retryAttempt + 1))
-        } else {
-          throw err
         }
+        throw err
       })
 
     return doAttempt(0).then((result) => {
@@ -233,7 +230,7 @@ class MultipartUploader {
       attempt: () => this._uploadPart(index),
       after: () => {
         this.partsInProgress -= 1
-      }
+      },
     })
   }
 
@@ -246,11 +243,10 @@ class MultipartUploader {
         key: this.key,
         uploadId: this.uploadId,
         body,
-        number: index + 1
-      })
-    ).then((result) => {
-      const valid = typeof result === 'object' && result &&
-        typeof result.url === 'string'
+        number: index + 1,
+      })).then((result) => {
+      const valid = typeof result === 'object' && result
+        && typeof result.url === 'string'
       if (!valid) {
         throw new TypeError('AwsS3/Multipart: Got incorrect result from `prepareUploadPart()`, expected an object `{ url }`.')
       }
@@ -279,7 +275,7 @@ class MultipartUploader {
 
     const part = {
       PartNumber: index + 1,
-      ETag: etag
+      ETag: etag,
     }
     this.parts.push(part)
 
@@ -371,9 +367,8 @@ class MultipartUploader {
       this.options.completeMultipartUpload({
         key: this.key,
         uploadId: this.uploadId,
-        parts: this.parts
-      })
-    ).then((result) => {
+        parts: this.parts,
+      })).then((result) => {
       this.options.onSuccess(result)
     }, (err) => {
       this._onError(err)
@@ -386,7 +381,7 @@ class MultipartUploader {
     this.createdPromise.then(() => {
       this.options.abortMultipartUpload({
         key: this.key,
-        uploadId: this.uploadId
+        uploadId: this.uploadId,
       })
     }, () => {
       // if the creation failed we do not need to abort

packages/@uppy/aws-s3-multipart/src/index.js

@@ -33,7 +33,7 @@ module.exports = class AwsS3Multipart extends Plugin {
       listParts: this.listParts.bind(this),
       prepareUploadPart: this.prepareUploadPart.bind(this),
       abortMultipartUpload: this.abortMultipartUpload.bind(this),
-      completeMultipartUpload: this.completeMultipartUpload.bind(this)
+      completeMultipartUpload: this.completeMultipartUpload.bind(this),
     }
 
     this.opts = { ...defaultOptions, ...opts }
@@ -89,7 +89,7 @@ module.exports = class AwsS3Multipart extends Plugin {
     return this.client.post('s3/multipart', {
       filename: file.name,
       type: file.type,
-      metadata
+      metadata,
     }).then(assertServerError)
   }
 
@@ -135,16 +135,16 @@ module.exports = class AwsS3Multipart extends Plugin {
           s3Multipart: {
             ...cFile.s3Multipart,
             key: data.key,
-            uploadId: data.uploadId
-          }
+            uploadId: data.uploadId,
+          },
         })
       }
 
       const onProgress = (bytesUploaded, bytesTotal) => {
         this.uppy.emit('upload-progress', file, {
           uploader: this,
-          bytesUploaded: bytesUploaded,
-          bytesTotal: bytesTotal
+          bytesUploaded,
+          bytesTotal,
         })
       }
 
@@ -160,9 +160,9 @@ module.exports = class AwsS3Multipart extends Plugin {
       const onSuccess = (result) => {
         const uploadResp = {
           body: {
-            ...result
+            ...result,
           },
-          uploadURL: result.location
+          uploadURL: result.location,
         }
 
         queuedRequest.done()
@@ -171,7 +171,7 @@ module.exports = class AwsS3Multipart extends Plugin {
         this.uppy.emit('upload-success', file, uploadResp)
 
         if (result.location) {
-          this.uppy.log('Download ' + upload.file.name + ' from ' + result.location)
+          this.uppy.log(`Download ${upload.file.name} from ${result.location}`)
         }
 
         resolve(upload)
@@ -203,7 +203,7 @@ module.exports = class AwsS3Multipart extends Plugin {
 
         limit: this.opts.limit || 5,
         retryDelays: this.opts.retryDelays || [],
-        ...file.s3Multipart
+        ...file.s3Multipart,
       })
 
       this.uploaders[file.id] = upload
@@ -286,7 +286,7 @@ module.exports = class AwsS3Multipart extends Plugin {
           ...file.remote.body,
           protocol: 's3-multipart',
           size: file.data.size,
-          metadata: file.meta
+          metadata: file.meta,
         }
       ).then((res) => {
         this.uppy.setFileState(file.id, { serverToken: res.token })
@@ -384,7 +384,7 @@ module.exports = class AwsS3Multipart extends Plugin {
 
       socket.on('success', (data) => {
         const uploadResp = {
-          uploadURL: data.url
+          uploadURL: data.url,
         }
 
         this.uppy.emit('upload-success', file, uploadResp)
@@ -474,8 +474,8 @@ module.exports = class AwsS3Multipart extends Plugin {
     this.uppy.setState({
       capabilities: {
         ...capabilities,
-        resumableUploads: true
-      }
+        resumableUploads: true,
+      },
     })
     this.uppy.addUploader(this.upload)
   }
@@ -485,8 +485,8 @@ module.exports = class AwsS3Multipart extends Plugin {
     this.uppy.setState({
       capabilities: {
         ...capabilities,
-        resumableUploads: false
-      }
+        resumableUploads: false,
+      },
     })
     this.uppy.removeUploader(this.upload)
   }

packages/@uppy/aws-s3/src/MiniXHRUpload.js

@@ -40,7 +40,7 @@ module.exports = class MiniXHRUpload {
       validateStatus (status, responseText, response) {
         return status >= 200 && status < 300
       },
-      ...opts
+      ...opts,
     }
 
     this.requests = opts.__queue
@@ -56,7 +56,7 @@ module.exports = class MiniXHRUpload {
       ...this.opts,
       ...(overrides || {}),
       ...(file.xhrUpload || {}),
-      headers: {}
+      headers: {},
     }
     Object.assign(opts.headers, this.opts.headers)
     if (overrides) {
@@ -176,7 +176,7 @@ module.exports = class MiniXHRUpload {
           this.uppy.emit('upload-progress', file, {
             uploader: this,
             bytesUploaded: ev.loaded,
-            bytesTotal: ev.total
+            bytesTotal: ev.total,
           })
         }
       })
@@ -197,7 +197,7 @@ module.exports = class MiniXHRUpload {
           const uploadResp = {
             status: ev.target.status,
             body,
-            uploadURL
+            uploadURL,
           }
 
           this.uppy.emit('upload-success', file, uploadResp)
@@ -207,18 +207,17 @@ module.exports = class MiniXHRUpload {
           }
 
           return resolve(file)
-        } else {
-          const body = opts.getResponseData(xhr.responseText, xhr)
-          const error = buildResponseError(xhr, opts.getResponseError(xhr.responseText, xhr))
-
-          const response = {
-            status: ev.target.status,
-            body
-          }
+        }
+        const body = opts.getResponseData(xhr.responseText, xhr)
+        const error = buildResponseError(xhr, opts.getResponseError(xhr.responseText, xhr))
 
-          this.uppy.emit('upload-error', file, error, response)
-          return reject(error)
+        const response = {
+          status: ev.target.status,
+          body,
         }
+
+        this.uppy.emit('upload-error', file, error, response)
+        return reject(error)
       })
 
       xhr.addEventListener('error', (ev) => {
@@ -293,7 +292,7 @@ module.exports = class MiniXHRUpload {
         metadata: fields,
         httpMethod: opts.method,
         useFormData: opts.formData,
-        headers: opts.headers
+        headers: opts.headers,
       }).then((res) => {
         const token = res.token
         const host = getSocketHost(file.remote.companionUrl)
@@ -331,7 +330,7 @@ module.exports = class MiniXHRUpload {
           const uploadResp = {
             status: data.response.status,
             body,
-            uploadURL
+            uploadURL,
           }
 
           this.uppy.emit('upload-success', file, uploadResp)

packages/@uppy/aws-s3/src/index.js

@@ -81,15 +81,15 @@ module.exports = class AwsS3 extends Plugin {
 
     this.defaultLocale = {
       strings: {
-        timedOut: 'Upload stalled for %{seconds} seconds, aborting.'
-      }
+        timedOut: 'Upload stalled for %{seconds} seconds, aborting.',
+      },
     }
 
     const defaultOptions = {
       timeout: 30 * 1000,
       limit: 0,
       metaFields: [], // have to opt in
-      getUploadParameters: this.getUploadParameters.bind(this)
+      getUploadParameters: this.getUploadParameters.bind(this),
     }
 
     this.opts = { ...defaultOptions, ...opts }
@@ -132,9 +132,9 @@ module.exports = class AwsS3 extends Plugin {
   }
 
   validateParameters (file, params) {
-    const valid = typeof params === 'object' && params &&
-      typeof params.url === 'string' &&
-      (typeof params.fields === 'object' || params.fields == null)
+    const valid = typeof params === 'object' && params
+      && typeof params.url === 'string'
+      && (typeof params.fields === 'object' || params.fields == null)
 
     if (!valid) {
       const err = new TypeError(`AwsS3: got incorrect result from 'getUploadParameters()' for file '${file.name}', expected an object '{ url, method, fields, headers }' but got '${JSON.stringify(params)}' instead.\nSee https://uppy.io/docs/aws-s3/#getUploadParameters-file for more on the expected format.`)
@@ -191,13 +191,13 @@ module.exports = class AwsS3 extends Plugin {
           method = 'post',
           url,
           fields,
-          headers
+          headers,
         } = params
         const xhrOpts = {
           method,
           formData: method.toLowerCase() === 'post',
           endpoint: url,
-          metaFields: fields ? Object.keys(fields) : []
+          metaFields: fields ? Object.keys(fields) : [],
         }
 
         if (headers) {
@@ -206,7 +206,7 @@ module.exports = class AwsS3 extends Plugin {
 
         this.uppy.setFileState(file.id, {
           meta: { ...file.meta, ...fields },
-          xhrUpload: xhrOpts
+          xhrUpload: xhrOpts,
         })
 
         return this._uploader.uploadFile(file.id, index, numberOfFiles)
@@ -262,7 +262,7 @@ module.exports = class AwsS3 extends Plugin {
         location: resolveUrl(xhr.responseURL, getXmlValue(content, 'Location')),
         bucket: getXmlValue(content, 'Bucket'),
         key: getXmlValue(content, 'Key'),
-        etag: getXmlValue(content, 'ETag')
+        etag: getXmlValue(content, 'ETag'),
       }
     }
 
@@ -286,7 +286,7 @@ module.exports = class AwsS3 extends Plugin {
       __queue: this.requests,
       responseType: 'text',
       getResponseData: this.opts.getResponseData || defaultGetResponseData,
-      getResponseError: defaultGetResponseError
+      getResponseError: defaultGetResponseError,
     }
 
     // Only for MiniXHRUpload, remove once we can depend on XHRUpload directly again

packages/@uppy/aws-s3/src/index.test.js

@@ -1,6 +1,6 @@
 require('whatwg-fetch')
 const Core = require('@uppy/core')
-const AwsS3 = require('./')
+const AwsS3 = require('.')
 
 describe('AwsS3', () => {
   it('Registers AwsS3 upload plugin', () => {
@@ -27,8 +27,8 @@ describe('AwsS3', () => {
       const file = {
         meta: {
           name: 'foo.jpg',
-          type: 'image/jpg'
-        }
+          type: 'image/jpg',
+        },
       }
 
       expect(() => awsS3.opts.getUploadParameters(file)).not.toThrow()

packages/@uppy/aws-s3/src/isXml.test.js

@@ -5,59 +5,59 @@ describe('AwsS3', () => {
     it('returns true for XML documents', () => {
       const content = '<?xml version="1.0" encoding="UTF-8"?><Key>image.jpg</Key>'
       expect(isXml(content, {
-        getResponseHeader: () => 'application/xml'
+        getResponseHeader: () => 'application/xml',
       })).toEqual(true)
       expect(isXml(content, {
-        getResponseHeader: () => 'text/xml'
+        getResponseHeader: () => 'text/xml',
       })).toEqual(true)
       expect(isXml(content, {
-        getResponseHeader: () => 'text/xml; charset=utf-8'
+        getResponseHeader: () => 'text/xml; charset=utf-8',
       })).toEqual(true)
       expect(isXml(content, {
-        getResponseHeader: () => 'application/xml; charset=iso-8859-1'
+        getResponseHeader: () => 'application/xml; charset=iso-8859-1',
       })).toEqual(true)
     })
 
     it('returns true for GCS XML documents', () => {
       const content = '<?xml version="1.0" encoding="UTF-8"?><Key>image.jpg</Key>'
       expect(isXml(content, {
-        getResponseHeader: () => 'text/html'
+        getResponseHeader: () => 'text/html',
       })).toEqual(true)
       expect(isXml(content, {
-        getResponseHeader: () => 'text/html; charset=utf8'
+        getResponseHeader: () => 'text/html; charset=utf8',
       })).toEqual(true)
     })
 
     it('returns true for remote response objects', () => {
       const content = '<?xml version="1.0" encoding="UTF-8"?><Key>image.jpg</Key>'
       expect(isXml(content, {
-        headers: { 'content-type': 'application/xml' }
+        headers: { 'content-type': 'application/xml' },
       })).toEqual(true)
       expect(isXml(content, {
-        headers: { 'content-type': 'application/xml' }
+        headers: { 'content-type': 'application/xml' },
       })).toEqual(true)
       expect(isXml(content, {
-        headers: { 'content-type': 'text/html' }
+        headers: { 'content-type': 'text/html' },
       })).toEqual(true)
     })
 
     it('returns false when content-type is missing', () => {
       const content = '<?xml version="1.0" encoding="UTF-8"?><Key>image.jpg</Key>'
       expect(isXml(content, {
-        getResponseHeader: () => null
+        getResponseHeader: () => null,
       })).toEqual(false)
       expect(isXml(content, {
-        headers: { 'content-type': null }
+        headers: { 'content-type': null },
       })).toEqual(false)
       expect(isXml(content, {
-        headers: {}
+        headers: {},
       })).toEqual(false)
     })
 
     it('returns false for HTML documents', () => {
       const content = '<!DOCTYPE html><html>'
       expect(isXml(content, {
-        getResponseHeader: () => 'text/html'
+        getResponseHeader: () => 'text/html',
       })).toEqual(false)
     })
   })

packages/@uppy/box/src/index.js

@@ -13,9 +13,9 @@ module.exports = class Box extends Plugin {
     this.title = this.opts.title || 'Box'
     this.icon = () => (
       <svg aria-hidden="true" focusable="false" width="32" height="32" viewBox="0 0 32 32">
-        <g fill="none" fill-rule="evenodd">
-          <rect class="uppy-ProviderIconBg" fill="#0061D5" width="32" height="32" rx="16" />
-          <g fill="#fff" fill-rule="nonzero">
+        <g fill="none" fillRule="evenodd">
+          <rect className="uppy-ProviderIconBg" fill="#0061D5" width="32" height="32" rx="16" />
+          <g fill="#fff" fillRule="nonzero">
             <path d="m16.4 13.5c-1.6 0-3 0.9-3.7 2.2-0.7-1.3-2.1-2.2-3.7-2.2-1 0-1.8 0.3-2.5 0.8v-3.6c-0.1-0.3-0.5-0.7-1-0.7s-0.8 0.4-0.8 0.8v7c0 2.3 1.9 4.2 4.2 4.2 1.6 0 3-0.9 3.7-2.2 0.7 1.3 2.1 2.2 3.7 2.2 2.3 0 4.2-1.9 4.2-4.2 0.1-2.4-1.8-4.3-4.1-4.3m-7.5 6.8c-1.4 0-2.5-1.1-2.5-2.5s1.1-2.5 2.5-2.5 2.5 1.1 2.5 2.5-1.1 2.5-2.5 2.5m7.5 0c-1.4 0-2.5-1.1-2.5-2.5s1.1-2.5 2.5-2.5 2.5 1.1 2.5 2.5-1.1 2.5-2.5 2.5" />
             <path d="m27.2 20.6l-2.3-2.8 2.3-2.8c0.3-0.4 0.2-0.9-0.2-1.2s-1-0.2-1.3 0.2l-2 2.4-2-2.4c-0.3-0.4-0.9-0.4-1.3-0.2-0.4 0.3-0.5 0.8-0.2 1.2l2.3 2.8-2.3 2.8c-0.3 0.4-0.2 0.9 0.2 1.2s1 0.2 1.3-0.2l2-2.4 2 2.4c0.3 0.4 0.9 0.4 1.3 0.2 0.4-0.3 0.4-0.8 0.2-1.2" />
           </g>
@@ -27,7 +27,7 @@ module.exports = class Box extends Plugin {
       companionUrl: this.opts.companionUrl,
       companionHeaders: this.opts.companionHeaders || this.opts.serverHeaders,
       provider: 'box',
-      pluginId: this.id
+      pluginId: this.id,
     })
 
     this.onFirstRender = this.onFirstRender.bind(this)
@@ -36,7 +36,7 @@ module.exports = class Box extends Plugin {
 
   install () {
     this.view = new ProviderViews(this, {
-      provider: this.provider
+      provider: this.provider,
     })
 
     const target = this.opts.target

packages/@uppy/companion-client/src/Provider.js

@@ -33,7 +33,7 @@ module.exports = class Provider extends RequestClient {
             JSON.stringify({ params: this.companionKeysParams })
           )
         }
-        return Object.assign({}, headers, authHeaders)
+        return { ...headers, ...authHeaders }
       })
   }
 
@@ -90,7 +90,7 @@ module.exports = class Provider extends RequestClient {
     return this.get(`${this.id}/logout`)
       .then((response) => Promise.all([
         response,
-        this.uppy.getPlugin(this.pluginId).storage.removeItem(this.tokenKey)
+        this.uppy.getPlugin(this.pluginId).storage.removeItem(this.tokenKey),
       ])).then(([response]) => response)
   }
 
@@ -98,7 +98,7 @@ module.exports = class Provider extends RequestClient {
     plugin.type = 'acquirer'
     plugin.files = []
     if (defaultOpts) {
-      plugin.opts = Object.assign({}, defaultOpts, opts)
+      plugin.opts = { ...defaultOpts, ...opts }
     }
 
     if (opts.serverUrl || opts.serverPattern) {

packages/@uppy/companion-client/src/RequestClient.js

@@ -29,7 +29,7 @@ module.exports = class RequestClient {
     return {
       Accept: 'application/json',
       'Content-Type': 'application/json',
-      'Uppy-Versions': `@uppy/companion-client=${RequestClient.VERSION}`
+      'Uppy-Versions': `@uppy/companion-client=${RequestClient.VERSION}`,
     }
   }
 
@@ -37,7 +37,7 @@ module.exports = class RequestClient {
     const userHeaders = this.opts.companionHeaders || this.opts.serverHeaders || {}
     return Promise.resolve({
       ...this.defaultHeaders,
-      ...userHeaders
+      ...userHeaders,
     })
   }
 
@@ -59,9 +59,7 @@ module.exports = class RequestClient {
     // Store the self-identified domain name for the Companion instance we just hit.
     if (headers.has('i-am') && headers.get('i-am') !== companion[host]) {
       this.uppy.setState({
-        companion: Object.assign({}, companion, {
-          [host]: headers.get('i-am')
-        })
+        companion: { ...companion, [host]: headers.get('i-am') },
       })
     }
     return response
@@ -97,7 +95,7 @@ module.exports = class RequestClient {
     }
 
     return fetch(this._getUrl(path), {
-      method: 'OPTIONS'
+      method: 'OPTIONS',
     })
       .then((response) => {
         if (response.headers.has('access-control-allow-headers')) {
@@ -134,8 +132,8 @@ module.exports = class RequestClient {
       .then((headers) =>
         fetchWithNetworkError(this._getUrl(path), {
           method: 'get',
-          headers: headers,
-          credentials: this.opts.companionCookiesRule || 'same-origin'
+          headers,
+          credentials: this.opts.companionCookiesRule || 'same-origin',
         }))
       .then(this._getPostResponseFunc(skipPostResponse))
       .then((res) => this._json(res))
@@ -150,9 +148,9 @@ module.exports = class RequestClient {
       .then((headers) =>
         fetchWithNetworkError(this._getUrl(path), {
           method: 'post',
-          headers: headers,
+          headers,
           credentials: this.opts.companionCookiesRule || 'same-origin',
-          body: JSON.stringify(data)
+          body: JSON.stringify(data),
         }))
       .then(this._getPostResponseFunc(skipPostResponse))
       .then((res) => this._json(res))
@@ -167,9 +165,9 @@ module.exports = class RequestClient {
       .then((headers) =>
         fetchWithNetworkError(`${this.hostname}/${path}`, {
           method: 'delete',
-          headers: headers,
+          headers,
           credentials: this.opts.companionCookiesRule || 'same-origin',
-          body: data ? JSON.stringify(data) : null
+          body: data ? JSON.stringify(data) : null,
         }))
       .then(this._getPostResponseFunc(skipPostResponse))
       .then((res) => this._json(res))

packages/@uppy/companion-client/src/Socket.js

@@ -56,7 +56,7 @@ module.exports = class UppySocket {
 
     this.socket.send(JSON.stringify({
       action,
-      payload
+      payload,
     }))
   }
 

packages/@uppy/companion-client/src/Socket.test.js

@@ -40,7 +40,7 @@ describe('Socket', () => {
     expect(UppySocket.name).toEqual('UppySocket')
     expect(
       new UppySocket({
-        target: 'foo'
+        target: 'foo',
       }) instanceof UppySocket
     )
   })
@@ -58,7 +58,7 @@ describe('Socket', () => {
     uppySocket.send('bar', 'boo')
     expect(webSocketSendSpy.mock.calls.length).toEqual(1)
     expect(webSocketSendSpy.mock.calls[0]).toEqual([
-      JSON.stringify({ action: 'bar', payload: 'boo' })
+      JSON.stringify({ action: 'bar', payload: 'boo' }),
     ])
   })
 
@@ -78,7 +78,7 @@ describe('Socket', () => {
     uppySocket.send('moo', 'baa')
     expect(uppySocket._queued).toEqual([
       { action: 'bar', payload: 'boo' },
-      { action: 'moo', payload: 'baa' }
+      { action: 'moo', payload: 'baa' },
     ])
     expect(webSocketSendSpy.mock.calls.length).toEqual(0)
 
@@ -87,10 +87,10 @@ describe('Socket', () => {
     expect(uppySocket._queued).toEqual([])
     expect(webSocketSendSpy.mock.calls.length).toEqual(2)
     expect(webSocketSendSpy.mock.calls[0]).toEqual([
-      JSON.stringify({ action: 'bar', payload: 'boo' })
+      JSON.stringify({ action: 'bar', payload: 'boo' }),
     ])
     expect(webSocketSendSpy.mock.calls[1]).toEqual([
-      JSON.stringify({ action: 'moo', payload: 'baa' })
+      JSON.stringify({ action: 'moo', payload: 'baa' }),
     ])
   })
 
@@ -124,10 +124,10 @@ describe('Socket', () => {
 
     webSocketInstance.triggerOpen()
     webSocketInstance.onmessage({
-      data: JSON.stringify({ action: 'hi', payload: 'ho' })
+      data: JSON.stringify({ action: 'hi', payload: 'ho' }),
     })
     expect(emitterListenerMock.mock.calls).toEqual([
-      ['ho', undefined, undefined, undefined, undefined, undefined]
+      ['ho', undefined, undefined, undefined, undefined, undefined],
     ])
   })
 
@@ -150,8 +150,8 @@ describe('Socket', () => {
         undefined,
         undefined,
         undefined,
-        undefined
-      ]
+        undefined,
+      ],
     ])
   })
 
@@ -167,7 +167,7 @@ describe('Socket', () => {
 
     expect(emitterListenerMock.mock.calls.length).toEqual(1)
     expect(emitterListenerMock.mock.calls).toEqual([
-      ['ho', undefined, undefined, undefined, undefined, undefined]
+      ['ho', undefined, undefined, undefined, undefined, undefined],
     ])
   })
 })

packages/@uppy/companion-client/src/index.js

@@ -13,5 +13,5 @@ module.exports = {
   RequestClient,
   Provider,
   SearchProvider,
-  Socket
+  Socket,
 }

packages/@uppy/core/src/Plugin.js

@@ -56,9 +56,9 @@ module.exports = class Plugin {
         ...plugins,
         [this.id]: {
           ...plugins[this.id],
-          ...update
-        }
-      }
+          ...update,
+        },
+      },
     })
   }
 
@@ -161,15 +161,15 @@ module.exports = class Plugin {
 
     let message = `Invalid target option given to ${callerPluginName}.`
     if (typeof target === 'function') {
-      message += ' The given target is not a Plugin class. ' +
-        'Please check that you\'re not specifying a React Component instead of a plugin. ' +
-        'If you are using @uppy/* packages directly, make sure you have only 1 version of @uppy/core installed: ' +
-        'run `npm ls @uppy/core` on the command line and verify that all the versions match and are deduped correctly.'
+      message += ' The given target is not a Plugin class. '
+        + 'Please check that you\'re not specifying a React Component instead of a plugin. '
+        + 'If you are using @uppy/* packages directly, make sure you have only 1 version of @uppy/core installed: '
+        + 'run `npm ls @uppy/core` on the command line and verify that all the versions match and are deduped correctly.'
     } else {
-      message += 'If you meant to target an HTML element, please make sure that the element exists. ' +
-        'Check that the <script> tag initializing Uppy is right before the closing </body> tag at the end of the page. ' +
-        '(see https://github.com/transloadit/uppy/issues/1042)\n\n' +
-        'If you meant to target a plugin, please confirm that your `import` statements or `require` calls are correct.'
+      message += 'If you meant to target an HTML element, please make sure that the element exists. '
+        + 'Check that the <script> tag initializing Uppy is right before the closing </body> tag at the end of the page. '
+        + '(see https://github.com/transloadit/uppy/issues/1042)\n\n'
+        + 'If you meant to target a plugin, please confirm that your `import` statements or `require` calls are correct.'
     }
     throw new Error(message)
   }

packages/@uppy/core/src/index.js

@@ -11,7 +11,8 @@ const generateFileID = require('@uppy/utils/lib/generateFileID')
 const findIndex = require('@uppy/utils/lib/findIndex')
 const supportsUploadProgress = require('./supportsUploadProgress')
 const { justErrorsLogger, debugLogger } = require('./loggers')
-const Plugin = require('./Plugin') // Exported from here.
+const Plugin = require('./Plugin')
+// Exported from here.
 class RestrictionError extends Error {
   constructor (...args) {
     super(...args)
@@ -37,15 +38,15 @@ class Uppy {
       strings: {
         addBulkFilesFailed: {
           0: 'Failed to add %{smart_count} file due to an internal error',
-          1: 'Failed to add %{smart_count} files due to internal errors'
+          1: 'Failed to add %{smart_count} files due to internal errors',
         },
         youCanOnlyUploadX: {
           0: 'You can only upload %{smart_count} file',
-          1: 'You can only upload %{smart_count} files'
+          1: 'You can only upload %{smart_count} files',
         },
         youHaveToAtLeastSelectX: {
           0: 'You have to select at least %{smart_count} file',
-          1: 'You have to select at least %{smart_count} files'
+          1: 'You have to select at least %{smart_count} files',
         },
         // The default `exceedsSize2` string only combines the `exceedsSize` string (%{backwardsCompat}) with the size.
         // Locales can override `exceedsSize2` to specify a different word order. This is for backwards compat with
@@ -67,7 +68,7 @@ class Uppy {
         noFilesFound: 'You have no files or folders here',
         selectX: {
           0: 'Select %{smart_count}',
-          1: 'Select %{smart_count}'
+          1: 'Select %{smart_count}',
         },
         selectAllFilesFromFolderNamed: 'Select all files from folder %{name}',
         unselectAllFilesFromFolderNamed: 'Unselect all files from folder %{name}',
@@ -87,9 +88,9 @@ class Uppy {
         emptyFolderAdded: 'No files were added from empty folder',
         folderAdded: {
           0: 'Added %{smart_count} file from %{folder}',
-          1: 'Added %{smart_count} files from %{folder}'
-        }
-      }
+          1: 'Added %{smart_count} files from %{folder}',
+        },
+      },
     }
 
     const defaultOptions = {
@@ -103,14 +104,14 @@ class Uppy {
         maxTotalFileSize: null,
         maxNumberOfFiles: null,
         minNumberOfFiles: null,
-        allowedFileTypes: null
+        allowedFileTypes: null,
       },
       meta: {},
       onBeforeFileAdded: (currentFile, files) => currentFile,
       onBeforeUpload: (files) => files,
       store: DefaultStore(),
       logger: justErrorsLogger,
-      infoTimeout: 5000
+      infoTimeout: 5000,
     }
 
     // Merge default options with the ones set by user,
@@ -120,8 +121,8 @@ class Uppy {
       ...opts,
       restrictions: {
         ...defaultOptions.restrictions,
-        ...(opts && opts.restrictions)
-      }
+        ...(opts && opts.restrictions),
+      },
     }
 
     // Support debug: true for backwards-compatability, unless logger is set in opts
@@ -134,9 +135,9 @@ class Uppy {
 
     this.log(`Using Core v${this.constructor.VERSION}`)
 
-    if (this.opts.restrictions.allowedFileTypes &&
-        this.opts.restrictions.allowedFileTypes !== null &&
-        !Array.isArray(this.opts.restrictions.allowedFileTypes)) {
+    if (this.opts.restrictions.allowedFileTypes
+        && this.opts.restrictions.allowedFileTypes !== null
+        && !Array.isArray(this.opts.restrictions.allowedFileTypes)) {
       throw new TypeError('`restrictions.allowedFileTypes` must be an array')
     }
 
@@ -193,15 +194,15 @@ class Uppy {
       capabilities: {
         uploadProgress: supportsUploadProgress(),
         individualCancellation: true,
-        resumableUploads: false
+        resumableUploads: false,
       },
       totalProgress: 0,
       meta: { ...this.opts.meta },
       info: {
         isHidden: true,
         type: 'info',
-        message: ''
-      }
+        message: '',
+      },
     })
 
     this._storeUnsubscribe = this.store.subscribe((prevState, nextState, patch) => {
@@ -286,9 +287,7 @@ class Uppy {
     }
 
     this.setState({
-      files: Object.assign({}, this.getState().files, {
-        [fileID]: Object.assign({}, this.getState().files[fileID], state)
-      })
+      files: { ...this.getState().files, [fileID]: { ...this.getState().files[fileID], ...state } },
     })
   }
 
@@ -305,8 +304,8 @@ class Uppy {
       ...newOpts,
       restrictions: {
         ...this.opts.restrictions,
-        ...(newOpts && newOpts.restrictions)
-      }
+        ...(newOpts && newOpts.restrictions),
+      },
     }
 
     if (newOpts.meta) {
@@ -329,19 +328,19 @@ class Uppy {
       percentage: 0,
       bytesUploaded: 0,
       uploadComplete: false,
-      uploadStarted: null
+      uploadStarted: null,
     }
-    const files = Object.assign({}, this.getState().files)
+    const files = { ...this.getState().files }
     const updatedFiles = {}
     Object.keys(files).forEach(fileID => {
-      const updatedFile = Object.assign({}, files[fileID])
-      updatedFile.progress = Object.assign({}, updatedFile.progress, defaultProgress)
+      const updatedFile = { ...files[fileID] }
+      updatedFile.progress = { ...updatedFile.progress, ...defaultProgress }
       updatedFiles[fileID] = updatedFile
     })
 
     this.setState({
       files: updatedFiles,
-      totalProgress: 0
+      totalProgress: 0,
     })
 
     this.emit('reset-progress')
@@ -381,13 +380,11 @@ class Uppy {
   }
 
   setMeta (data) {
-    const updatedMeta = Object.assign({}, this.getState().meta, data)
-    const updatedFiles = Object.assign({}, this.getState().files)
+    const updatedMeta = { ...this.getState().meta, ...data }
+    const updatedFiles = { ...this.getState().files }
 
     Object.keys(updatedFiles).forEach((fileID) => {
-      updatedFiles[fileID] = Object.assign({}, updatedFiles[fileID], {
-        meta: Object.assign({}, updatedFiles[fileID].meta, data)
-      })
+      updatedFiles[fileID] = { ...updatedFiles[fileID], meta: { ...updatedFiles[fileID].meta, ...data } }
     })
 
     this.log('Adding metadata:')
@@ -395,20 +392,18 @@ class Uppy {
 
     this.setState({
       meta: updatedMeta,
-      files: updatedFiles
+      files: updatedFiles,
     })
   }
 
   setFileMeta (fileID, data) {
-    const updatedFiles = Object.assign({}, this.getState().files)
+    const updatedFiles = { ...this.getState().files }
     if (!updatedFiles[fileID]) {
       this.log('Was trying to set metadata for a file that has been removed: ', fileID)
       return
     }
-    const newMeta = Object.assign({}, updatedFiles[fileID].meta, data)
-    updatedFiles[fileID] = Object.assign({}, updatedFiles[fileID], {
-      meta: newMeta
-    })
+    const newMeta = { ...updatedFiles[fileID].meta, ...data }
+    updatedFiles[fileID] = { ...updatedFiles[fileID], meta: newMeta }
     this.setState({ files: updatedFiles })
   }
 
@@ -441,12 +436,12 @@ class Uppy {
     try {
       this._checkRestrictions(file, files)
       return {
-        result: true
+        result: true,
       }
     } catch (err) {
       return {
         result: false,
-        reason: err.message
+        reason: err.message,
       }
     }
   }
@@ -499,7 +494,7 @@ class Uppy {
       if (totalFilesSize > maxTotalFileSize) {
         throw new RestrictionError(this.i18n('exceedsSize2', {
           backwardsCompat: this.i18n('exceedsSize'),
-          size: prettierBytes(maxTotalFileSize)
+          size: prettierBytes(maxTotalFileSize),
         }))
       }
     }
@@ -509,7 +504,7 @@ class Uppy {
       if (file.size > maxFileSize) {
         throw new RestrictionError(this.i18n('exceedsSize2', {
           backwardsCompat: this.i18n('exceedsSize'),
-          size: prettierBytes(maxFileSize)
+          size: prettierBytes(maxFileSize),
         }))
       }
     }
@@ -518,7 +513,7 @@ class Uppy {
     if (minFileSize && file.size != null) {
       if (file.size < minFileSize) {
         throw new RestrictionError(this.i18n('inferiorSize', {
-          size: prettierBytes(minFileSize)
+          size: prettierBytes(minFileSize),
         }))
       }
     }
@@ -555,7 +550,7 @@ class Uppy {
     // as they are expected and shown in the UI.
     let logMessageWithDetails = message
     if (details) {
-      logMessageWithDetails += ' ' + details
+      logMessageWithDetails += ` ${details}`
     }
     if (err.isRestriction) {
       this.log(logMessageWithDetails)
@@ -567,7 +562,7 @@ class Uppy {
     // Sometimes informer has to be shown manually by the developer,
     // for example, in `onBeforeFileAdded`.
     if (showInformer) {
-      this.info({ message: message, details: details }, 'error', this.opts.infoTimeout)
+      this.info({ message, details }, 'error', this.opts.infoTimeout)
     }
 
     if (throwErr) {
@@ -609,7 +604,7 @@ class Uppy {
     if (file.name) {
       fileName = file.name
     } else if (fileType.split('/')[0] === 'image') {
-      fileName = fileType.split('/')[0] + '.' + fileType.split('/')[1]
+      fileName = `${fileType.split('/')[0]}.${fileType.split('/')[1]}`
     } else {
       fileName = 'noname'
     }
@@ -635,7 +630,7 @@ class Uppy {
       extension: fileExtension || '',
       meta: {
         ...this.getState().meta,
-        ...meta
+        ...meta,
       },
       type: fileType,
       data: file.data,
@@ -644,12 +639,12 @@ class Uppy {
         bytesUploaded: 0,
         bytesTotal: size,
         uploadComplete: false,
-        uploadStarted: null
+        uploadStarted: null,
       },
-      size: size,
-      isRemote: isRemote,
+      size,
+      isRemote,
       remote: file.remote || '',
-      preview: file.preview
+      preview: file.preview,
     }
 
     try {
@@ -693,8 +688,8 @@ class Uppy {
     this.setState({
       files: {
         ...files,
-        [newFile.id]: newFile
-      }
+        [newFile.id]: newFile,
+      },
     })
 
     this.emit('file-added', newFile)
@@ -760,7 +755,7 @@ class Uppy {
 
       this.info({
         message: this.i18n('addBulkFilesFailed', { smart_count: errors.length }),
-        details: message
+        details: message,
       }, 'error', this.opts.infoTimeout)
 
       const err = new Error(message)
@@ -798,7 +793,7 @@ class Uppy {
 
       updatedUploads[uploadID] = {
         ...currentUploads[uploadID],
-        fileIDs: newFileIDs
+        fileIDs: newFileIDs,
       }
     })
 
@@ -808,7 +803,7 @@ class Uppy {
 
     const stateUpdate = {
       currentUploads: updatedUploads,
-      files: updatedFiles
+      files: updatedFiles,
     }
 
     // If all files were removed - allow new uploads!
@@ -837,8 +832,8 @@ class Uppy {
   }
 
   pauseResume (fileID) {
-    if (!this.getState().capabilities.resumableUploads ||
-         this.getFile(fileID).uploadComplete) {
+    if (!this.getState().capabilities.resumableUploads
+         || this.getFile(fileID).uploadComplete) {
       return
     }
 
@@ -846,7 +841,7 @@ class Uppy {
     const isPaused = !wasPaused
 
     this.setFileState(fileID, {
-      isPaused: isPaused
+      isPaused,
     })
 
     this.emit('upload-pause', fileID, isPaused)
@@ -855,16 +850,14 @@ class Uppy {
   }
 
   pauseAll () {
-    const updatedFiles = Object.assign({}, this.getState().files)
+    const updatedFiles = { ...this.getState().files }
     const inProgressUpdatedFiles = Object.keys(updatedFiles).filter((file) => {
-      return !updatedFiles[file].progress.uploadComplete &&
-             updatedFiles[file].progress.uploadStarted
+      return !updatedFiles[file].progress.uploadComplete
+             && updatedFiles[file].progress.uploadStarted
     })
 
     inProgressUpdatedFiles.forEach((file) => {
-      const updatedFile = Object.assign({}, updatedFiles[file], {
-        isPaused: true
-      })
+      const updatedFile = { ...updatedFiles[file], isPaused: true }
       updatedFiles[file] = updatedFile
     })
 
@@ -873,17 +866,18 @@ class Uppy {
   }
 
   resumeAll () {
-    const updatedFiles = Object.assign({}, this.getState().files)
+    const updatedFiles = { ...this.getState().files }
     const inProgressUpdatedFiles = Object.keys(updatedFiles).filter((file) => {
-      return !updatedFiles[file].progress.uploadComplete &&
-             updatedFiles[file].progress.uploadStarted
+      return !updatedFiles[file].progress.uploadComplete
+             && updatedFiles[file].progress.uploadStarted
     })
 
     inProgressUpdatedFiles.forEach((file) => {
-      const updatedFile = Object.assign({}, updatedFiles[file], {
+      const updatedFile = {
+        ...updatedFiles[file],
         isPaused: false,
-        error: null
-      })
+        error: null,
+      }
       updatedFiles[file] = updatedFile
     })
     this.setState({ files: updatedFiles })
@@ -892,21 +886,22 @@ class Uppy {
   }
 
   retryAll () {
-    const updatedFiles = Object.assign({}, this.getState().files)
+    const updatedFiles = { ...this.getState().files }
     const filesToRetry = Object.keys(updatedFiles).filter(file => {
       return updatedFiles[file].error
     })
 
     filesToRetry.forEach((file) => {
-      const updatedFile = Object.assign({}, updatedFiles[file], {
+      const updatedFile = {
+        ...updatedFiles[file],
         isPaused: false,
-        error: null
-      })
+        error: null,
+      }
       updatedFiles[file] = updatedFile
     })
     this.setState({
       files: updatedFiles,
-      error: null
+      error: null,
     })
 
     this.emit('retry-all', filesToRetry)
@@ -914,12 +909,12 @@ class Uppy {
     if (filesToRetry.length === 0) {
       return Promise.resolve({
         successful: [],
-        failed: []
+        failed: [],
       })
     }
 
     const uploadID = this._createUpload(filesToRetry, {
-      forceAllowNewUpload: true // create new upload even if allowNewUpload: false
+      forceAllowNewUpload: true, // create new upload even if allowNewUpload: false
     })
     return this._runUpload(uploadID)
   }
@@ -936,20 +931,20 @@ class Uppy {
 
     this.setState({
       totalProgress: 0,
-      error: null
+      error: null,
     })
   }
 
   retryUpload (fileID) {
     this.setFileState(fileID, {
       error: null,
-      isPaused: false
+      isPaused: false,
     })
 
     this.emit('upload-retry', fileID)
 
     const uploadID = this._createUpload([fileID], {
-      forceAllowNewUpload: true // create new upload even if allowNewUpload: false
+      forceAllowNewUpload: true, // create new upload even if allowNewUpload: false
     })
     return this._runUpload(uploadID)
   }
@@ -975,8 +970,8 @@ class Uppy {
           // TODO(goto-bus-stop) flooring this should probably be the choice of the UI?
           // we get more accurate calculations if we don't round this at all.
           ? Math.round(data.bytesUploaded / data.bytesTotal * 100)
-          : 0
-      }
+          : 0,
+      },
     })
 
     this._calculateTotalProgress()
@@ -988,9 +983,9 @@ class Uppy {
     const files = this.getFiles()
 
     const inProgress = files.filter((file) => {
-      return file.progress.uploadStarted ||
-        file.progress.preprocess ||
-        file.progress.postprocess
+      return file.progress.uploadStarted
+        || file.progress.preprocess
+        || file.progress.postprocess
     })
 
     if (inProgress.length === 0) {
@@ -1052,7 +1047,7 @@ class Uppy {
       }
 
       if (error.details) {
-        errorMsg += ' ' + error.details
+        errorMsg += ` ${error.details}`
       }
 
       this.setState({ error: errorMsg })
@@ -1065,12 +1060,12 @@ class Uppy {
       }
 
       if (error.details) {
-        errorMsg += ' ' + error.details
+        errorMsg += ` ${error.details}`
       }
 
       this.setFileState(file.id, {
         error: errorMsg,
-        response
+        response,
       })
 
       this.setState({ error: error.message })
@@ -1079,15 +1074,15 @@ class Uppy {
         const newError = new Error(error.message)
         newError.details = error.message
         if (error.details) {
-          newError.details += ' ' + error.details
+          newError.details += ` ${error.details}`
         }
         newError.message = this.i18n('failedToUpload', { file: file.name })
         this._showOrLogErrorAndThrow(newError, {
-          throwErr: false
+          throwErr: false,
         })
       } else {
         this._showOrLogErrorAndThrow(error, {
-          throwErr: false
+          throwErr: false,
         })
       }
     })
@@ -1107,8 +1102,8 @@ class Uppy {
           uploadComplete: false,
           percentage: 0,
           bytesUploaded: 0,
-          bytesTotal: file.size
-        }
+          bytesTotal: file.size,
+        },
       })
     })
 
@@ -1122,17 +1117,18 @@ class Uppy {
 
       const currentProgress = this.getFile(file.id).progress
       this.setFileState(file.id, {
-        progress: Object.assign({}, currentProgress, {
+        progress: {
+          ...currentProgress,
           postprocess: this.postProcessors.length > 0 ? {
-            mode: 'indeterminate'
+            mode: 'indeterminate',
           } : null,
           uploadComplete: true,
           percentage: 100,
-          bytesUploaded: currentProgress.bytesTotal
-        }),
+          bytesUploaded: currentProgress.bytesTotal,
+        },
         response: uploadResp,
         uploadURL: uploadResp.uploadURL,
-        isPaused: false
+        isPaused: false,
       })
 
       this._calculateTotalProgress()
@@ -1144,9 +1140,7 @@ class Uppy {
         return
       }
       this.setFileState(file.id, {
-        progress: Object.assign({}, this.getFile(file.id).progress, {
-          preprocess: progress
-        })
+        progress: { ...this.getFile(file.id).progress, preprocess: progress },
       })
     })
 
@@ -1155,13 +1149,11 @@ class Uppy {
         this.log(`Not setting progress for a file that has been removed: ${file.id}`)
         return
       }
-      const files = Object.assign({}, this.getState().files)
-      files[file.id] = Object.assign({}, files[file.id], {
-        progress: Object.assign({}, files[file.id].progress)
-      })
+      const files = { ...this.getState().files }
+      files[file.id] = { ...files[file.id], progress: { ...files[file.id].progress } }
       delete files[file.id].progress.preprocess
 
-      this.setState({ files: files })
+      this.setState({ files })
     })
 
     this.on('postprocess-progress', (file, progress) => {
@@ -1170,9 +1162,7 @@ class Uppy {
         return
       }
       this.setFileState(file.id, {
-        progress: Object.assign({}, this.getState().files[file.id].progress, {
-          postprocess: progress
-        })
+        progress: { ...this.getState().files[file.id].progress, postprocess: progress },
       })
     })
 
@@ -1182,20 +1172,20 @@ class Uppy {
         return
       }
       const files = {
-        ...this.getState().files
+        ...this.getState().files,
       }
       files[file.id] = {
         ...files[file.id],
         progress: {
-          ...files[file.id].progress
-        }
+          ...files[file.id].progress,
+        },
       }
       delete files[file.id].progress.postprocess
       // TODO should we set some kind of `fullyComplete` property on the file object
       // so it's easier to see that the file is upload…fully complete…rather than
       // what we have to do now (`uploadComplete && !postprocess`)
 
-      this.setState({ files: files })
+      this.setState({ files })
     })
 
     this.on('restored', () => {
@@ -1212,8 +1202,8 @@ class Uppy {
   }
 
   updateOnlineStatus () {
-    const online =
-      typeof window.navigator.onLine !== 'undefined'
+    const online
+      = typeof window.navigator.onLine !== 'undefined'
         ? window.navigator.onLine
         : true
     if (!online) {
@@ -1243,8 +1233,8 @@ class Uppy {
    */
   use (Plugin, opts) {
     if (typeof Plugin !== 'function') {
-      const msg = `Expected a plugin class, but got ${Plugin === null ? 'null' : typeof Plugin}.` +
-        ' Please verify that the plugin was imported and spelled correctly.'
+      const msg = `Expected a plugin class, but got ${Plugin === null ? 'null' : typeof Plugin}.`
+        + ' Please verify that the plugin was imported and spelled correctly.'
       throw new TypeError(msg)
     }
 
@@ -1263,9 +1253,9 @@ class Uppy {
 
     const existsPluginAlready = this.getPlugin(pluginId)
     if (existsPluginAlready) {
-      const msg = `Already found a plugin named '${existsPluginAlready.id}'. ` +
-        `Tried to use: '${pluginId}'.\n` +
-        'Uppy plugins must have unique `id` options. See https://uppy.io/docs/plugins/#id.'
+      const msg = `Already found a plugin named '${existsPluginAlready.id}'. `
+        + `Tried to use: '${pluginId}'.\n`
+        + 'Uppy plugins must have unique `id` options. See https://uppy.io/docs/plugins/#id.'
       throw new Error(msg)
     }
 
@@ -1334,8 +1324,8 @@ class Uppy {
     const updatedState = {
       plugins: {
         ...state.plugins,
-        [instance.id]: undefined
-      }
+        [instance.id]: undefined,
+      },
     }
     this.setState(updatedState)
   }
@@ -1370,10 +1360,10 @@ class Uppy {
     this.setState({
       info: {
         isHidden: false,
-        type: type,
+        type,
         message: isComplexMessage ? message.message : message,
-        details: isComplexMessage ? message.details : null
-      }
+        details: isComplexMessage ? message.details : null,
+      },
     })
 
     this.emit('info-visible')
@@ -1389,11 +1379,9 @@ class Uppy {
   }
 
   hideInfo () {
-    const newInfo = Object.assign({}, this.getState().info, {
-      isHidden: true
-    })
+    const newInfo = { ...this.getState().info, isHidden: true }
     this.setState({
-      info: newInfo
+      info: newInfo,
     })
     this.emit('info-hidden')
   }
@@ -1444,7 +1432,7 @@ class Uppy {
    */
   _createUpload (fileIDs, opts = {}) {
     const {
-      forceAllowNewUpload = false // uppy.retryAll sets this to true — when retrying we want to ignore `allowNewUpload: false`
+      forceAllowNewUpload = false, // uppy.retryAll sets this to true — when retrying we want to ignore `allowNewUpload: false`
     } = opts
 
     const { allowNewUpload, currentUploads } = this.getState()
@@ -1456,7 +1444,7 @@ class Uppy {
 
     this.emit('upload', {
       id: uploadID,
-      fileIDs: fileIDs
+      fileIDs,
     })
 
     this.setState({
@@ -1465,11 +1453,11 @@ class Uppy {
       currentUploads: {
         ...currentUploads,
         [uploadID]: {
-          fileIDs: fileIDs,
+          fileIDs,
           step: 0,
-          result: {}
-        }
-      }
+          result: {},
+        },
+      },
     })
 
     return uploadID
@@ -1493,13 +1481,9 @@ class Uppy {
       return
     }
     const currentUploads = this.getState().currentUploads
-    const currentUpload = Object.assign({}, currentUploads[uploadID], {
-      result: Object.assign({}, currentUploads[uploadID].result, data)
-    })
+    const currentUpload = { ...currentUploads[uploadID], result: { ...currentUploads[uploadID].result, ...data } }
     this.setState({
-      currentUploads: Object.assign({}, currentUploads, {
-        [uploadID]: currentUpload
-      })
+      currentUploads: { ...currentUploads, [uploadID]: currentUpload },
     })
   }
 
@@ -1513,7 +1497,7 @@ class Uppy {
     delete currentUploads[uploadID]
 
     this.setState({
-      currentUploads: currentUploads
+      currentUploads,
     })
   }
 
@@ -1529,7 +1513,7 @@ class Uppy {
     const steps = [
       ...this.preProcessors,
       ...this.uploaders,
-      ...this.postProcessors
+      ...this.postProcessors,
     ]
     let lastStep = Promise.resolve()
     steps.forEach((fn, step) => {
@@ -1547,14 +1531,14 @@ class Uppy {
 
         const updatedUpload = {
           ...currentUpload,
-          step
+          step,
         }
 
         this.setState({
           currentUploads: {
             ...currentUploads,
-            [uploadID]: updatedUpload
-          }
+            [uploadID]: updatedUpload,
+          },
         })
 
         // TODO give this the `updatedUpload` object as its only parameter maybe?
@@ -1648,7 +1632,7 @@ class Uppy {
       // Updating files in state, because uploader plugins receive file IDs,
       // and then fetch the actual file object from state
       this.setState({
-        files: files
+        files,
       })
     }
 
@@ -1676,7 +1660,7 @@ class Uppy {
       })
       .catch((err) => {
         this._showOrLogErrorAndThrow(err, {
-          showInformer: false
+          showInformer: false,
         })
       })
   }

packages/@uppy/core/src/loggers.js

@@ -5,7 +5,7 @@ const getTimeStamp = require('@uppy/utils/lib/getTimeStamp')
 const justErrorsLogger = {
   debug: (...args) => {},
   warn: (...args) => {},
-  error: (...args) => console.error(`[Uppy] [${getTimeStamp()}]`, ...args)
+  error: (...args) => console.error(`[Uppy] [${getTimeStamp()}]`, ...args),
 }
 
 // Print logs to console with namespace + timestamp,
@@ -17,10 +17,10 @@ const debugLogger = {
     debug.call(console, `[Uppy] [${getTimeStamp()}]`, ...args)
   },
   warn: (...args) => console.warn(`[Uppy] [${getTimeStamp()}]`, ...args),
-  error: (...args) => console.error(`[Uppy] [${getTimeStamp()}]`, ...args)
+  error: (...args) => console.error(`[Uppy] [${getTimeStamp()}]`, ...args),
 }
 
 module.exports = {
   justErrorsLogger,
-  debugLogger
+  debugLogger,
 }

packages/@uppy/dashboard/src/components/AddFiles.js

@@ -24,26 +24,26 @@ class AddFiles extends Component {
   renderPoweredByUppy () {
     const uppyBranding = (
       <span>
-        <svg aria-hidden="true" focusable="false" class="uppy-c-icon uppy-Dashboard-poweredByIcon" width="11" height="11" viewBox="0 0 11 11">
-          <path d="M7.365 10.5l-.01-4.045h2.612L5.5.806l-4.467 5.65h2.604l.01 4.044h3.718z" fill-rule="evenodd" />
+        <svg aria-hidden="true" focusable="false" className="uppy-c-icon uppy-Dashboard-poweredByIcon" width="11" height="11" viewBox="0 0 11 11">
+          <path d="M7.365 10.5l-.01-4.045h2.612L5.5.806l-4.467 5.65h2.604l.01 4.044h3.718z" fillRule="evenodd" />
         </svg>
-        <span class="uppy-Dashboard-poweredByUppy">Uppy</span>
+        <span className="uppy-Dashboard-poweredByUppy">Uppy</span>
       </span>
     )
 
     // Support both the old word-order-insensitive string `poweredBy` and the new word-order-sensitive string `poweredBy2`
     const linkText = this.props.i18nArray('poweredBy2', {
       backwardsCompat: this.props.i18n('poweredBy'),
-      uppy: uppyBranding
+      uppy: uppyBranding,
     })
 
     return (
       <a
-        tabindex="-1"
+        tabIndex="-1"
         href="https://uppy.io"
         rel="noreferrer noopener"
         target="_blank"
-        class="uppy-Dashboard-poweredBy"
+        className="uppy-Dashboard-poweredBy"
       >
         {linkText}
       </a>
@@ -53,15 +53,15 @@ class AddFiles extends Component {
   renderHiddenInput = (isFolder, refCallback) => {
     return (
       <input
-        class="uppy-Dashboard-input"
+        className="uppy-Dashboard-input"
         hidden
         aria-hidden="true"
-        tabindex={-1}
+        tabIndex={-1}
         webkitdirectory={isFolder}
         type="file"
         name="files[]"
         multiple={this.props.maxNumberOfFiles !== 1}
-        onchange={this.onFileInputChange}
+        onChange={this.onFileInputChange}
         accept={this.props.allowedFileTypes}
         ref={refCallback}
       />
@@ -71,25 +71,25 @@ class AddFiles extends Component {
   renderMyDeviceAcquirer = () => {
     return (
       <div
-        class="uppy-DashboardTab"
+        className="uppy-DashboardTab"
         role="presentation"
         data-uppy-acquirer-id="MyDevice"
       >
         <button
           type="button"
-          class="uppy-DashboardTab-btn"
+          className="uppy-DashboardTab-btn"
           role="tab"
-          tabindex={0}
+          tabIndex={0}
           data-uppy-super-focusable
-          onclick={this.triggerFileInputClick}
+          onClick={this.triggerFileInputClick}
         >
           <svg aria-hidden="true" focusable="false" width="32" height="32" viewBox="0 0 32 32">
-            <g fill="none" fill-rule="evenodd">
-              <rect class="uppy-ProviderIconBg" width="32" height="32" rx="16" fill="#2275D7" />
+            <g fill="none" fillRule="evenodd">
+              <rect className="uppy-ProviderIconBg" width="32" height="32" rx="16" fill="#2275D7" />
               <path d="M21.973 21.152H9.863l-1.108-5.087h14.464l-1.246 5.087zM9.935 11.37h3.958l.886 1.444a.673.673 0 0 0 .585.316h6.506v1.37H9.935v-3.13zm14.898 3.44a.793.793 0 0 0-.616-.31h-.978v-2.126c0-.379-.275-.613-.653-.613H15.75l-.886-1.445a.673.673 0 0 0-.585-.316H9.232c-.378 0-.667.209-.667.587V14.5h-.782a.793.793 0 0 0-.61.303.795.795 0 0 0-.155.663l1.45 6.633c.078.36.396.618.764.618h13.354c.36 0 .674-.246.76-.595l1.631-6.636a.795.795 0 0 0-.144-.675z" fill="#FFF" />
             </g>
           </svg>
-          <div class="uppy-DashboardTab-name">{this.props.i18n('myDevice')}</div>
+          <div className="uppy-DashboardTab-name">{this.props.i18n('myDevice')}</div>
         </button>
       </div>
     )
@@ -100,8 +100,8 @@ class AddFiles extends Component {
     return (
       <button
         type="button"
-        class="uppy-u-reset uppy-Dashboard-browse"
-        onclick={onClickFn}
+        className="uppy-u-reset uppy-Dashboard-browse"
+        onClick={onClickFn}
         data-uppy-super-focusable={numberOfAcquirers === 0}
       >
         {text}
@@ -166,7 +166,7 @@ class AddFiles extends Component {
     }
 
     return (
-      <div class="uppy-Dashboard-AddFiles-title">
+      <div className="uppy-Dashboard-AddFiles-title">
         {titleText}
       </div>
     )
@@ -175,22 +175,22 @@ class AddFiles extends Component {
   renderAcquirer = (acquirer) => {
     return (
       <div
-        class="uppy-DashboardTab"
+        className="uppy-DashboardTab"
         role="presentation"
         data-uppy-acquirer-id={acquirer.id}
       >
         <button
           type="button"
-          class="uppy-DashboardTab-btn"
+          className="uppy-DashboardTab-btn"
           role="tab"
-          tabindex={0}
+          tabIndex={0}
           aria-controls={`uppy-DashboardContent-panel--${acquirer.id}`}
           aria-selected={this.props.activePickerPanel.id === acquirer.id}
           data-uppy-super-focusable
-          onclick={() => this.props.showPanel(acquirer.id)}
+          onClick={() => this.props.showPanel(acquirer.id)}
         >
           {acquirer.icon()}
-          <div class="uppy-DashboardTab-name">{acquirer.name}</div>
+          <div className="uppy-DashboardTab-name">{acquirer.name}</div>
         </button>
       </div>
     )
@@ -203,7 +203,7 @@ class AddFiles extends Component {
     const lastTwoAcquirers = acquirersWithoutLastTwo.splice(acquirers.length - 2, acquirers.length)
 
     return (
-      <div class="uppy-Dashboard-AddFiles-list" role="tablist">
+      <div className="uppy-Dashboard-AddFiles-list" role="tablist">
         {this.renderMyDeviceAcquirer()}
         {acquirersWithoutLastTwo.map((acquirer) => this.renderAcquirer(acquirer))}
         <span role="presentation" style="white-space: nowrap;">
@@ -215,13 +215,13 @@ class AddFiles extends Component {
 
   render () {
     return (
-      <div class="uppy-Dashboard-AddFiles">
+      <div className="uppy-Dashboard-AddFiles">
         {this.renderHiddenInput(false, (ref) => { this.fileInput = ref })}
         {this.renderHiddenInput(true, (ref) => { this.folderInput = ref })}
         {this.renderDropPasteBrowseTagline()}
         {this.props.acquirers.length > 0 && this.renderAcquirers(this.props.acquirers)}
-        <div class="uppy-Dashboard-AddFiles-info">
-          {this.props.note && <div class="uppy-Dashboard-note">{this.props.note}</div>}
+        <div className="uppy-Dashboard-AddFiles-info">
+          {this.props.note && <div className="uppy-Dashboard-note">{this.props.note}</div>}
           {this.props.proudlyDisplayPoweredByUppy && this.renderPoweredByUppy(this.props)}
         </div>
       </div>

packages/@uppy/dashboard/src/components/AddFilesPanel.js

@@ -5,19 +5,20 @@ const AddFiles = require('./AddFiles')
 const AddFilesPanel = (props) => {
   return (
     <div
-      class={classNames('uppy-Dashboard-AddFilesPanel', props.className)}
+      className={classNames('uppy-Dashboard-AddFilesPanel', props.className)}
       data-uppy-panelType="AddFiles"
       aria-hidden={props.showAddFilesPanel}
     >
-      <div class="uppy-DashboardContent-bar">
-        <div class="uppy-DashboardContent-title" role="heading" aria-level="1">
+      <div className="uppy-DashboardContent-bar">
+        <div className="uppy-DashboardContent-title" role="heading" aria-level="1">
           {props.i18n('addingMoreFiles')}
         </div>
         <button
-          class="uppy-DashboardContent-back"
+          className="uppy-DashboardContent-back"
           type="button"
-          onclick={(ev) => props.toggleAddFilesPanel(false)}
-        >{props.i18n('back')}
+          onClick={(ev) => props.toggleAddFilesPanel(false)}
+        >
+          {props.i18n('back')}
         </button>
       </div>
       <AddFiles {...props} />

packages/@uppy/dashboard/src/components/Dashboard.js

@@ -23,7 +23,7 @@ module.exports = function Dashboard (props) {
   const isSizeMD = props.containerWidth > WIDTH_MD
 
   const wrapperClassName = classNames({
-    'uppy-Root': props.isTargetDOMEl
+    'uppy-Root': props.isTargetDOMEl,
   })
 
   const dashboardClassName = classNames({
@@ -38,7 +38,7 @@ module.exports = function Dashboard (props) {
     'uppy-size--xl': props.containerWidth > WIDTH_XL,
     'uppy-size--height-md': props.containerHeight > HEIGHT_MD,
     'uppy-Dashboard--isAddFilesPanelVisible': props.showAddFilesPanel,
-    'uppy-Dashboard--isInnerWrapVisible': props.areInsidesReadyToBeVisible
+    'uppy-Dashboard--isInnerWrapVisible': props.areInsidesReadyToBeVisible,
   })
 
   // Important: keep these in sync with the percent width values in `src/components/FileItem/index.scss`.
@@ -55,48 +55,48 @@ module.exports = function Dashboard (props) {
 
   const dashboard = (
     <div
-      class={dashboardClassName}
+      className={dashboardClassName}
       data-uppy-theme={props.theme}
       data-uppy-num-acquirers={props.acquirers.length}
       data-uppy-drag-drop-supported={isDragDropSupported()}
       aria-hidden={props.inline ? 'false' : props.isHidden}
       aria-disabled={props.disabled}
       aria-label={!props.inline ? props.i18n('dashboardWindowTitle') : props.i18n('dashboardTitle')}
-      onpaste={props.handlePaste}
+      onPaste={props.handlePaste}
       onDragOver={props.handleDragOver}
       onDragLeave={props.handleDragLeave}
       onDrop={props.handleDrop}
     >
       <div
-        class="uppy-Dashboard-overlay"
-        tabindex={-1}
-        onclick={props.handleClickOutside}
+        className="uppy-Dashboard-overlay"
+        tabIndex={-1}
+        onClick={props.handleClickOutside}
       />
 
       <div
-        class="uppy-Dashboard-inner"
+        className="uppy-Dashboard-inner"
         aria-modal={!props.inline && 'true'}
         role={!props.inline && 'dialog'}
         style={{
           width: props.inline && props.width ? props.width : '',
-          height: props.inline && props.height ? props.height : ''
+          height: props.inline && props.height ? props.height : '',
         }}
       >
 
         {!props.inline ? (
           <button
-            class="uppy-u-reset uppy-Dashboard-close"
+            className="uppy-u-reset uppy-Dashboard-close"
             type="button"
             aria-label={props.i18n('closeModal')}
             title={props.i18n('closeModal')}
-            onclick={props.closeModal}
+            onClick={props.closeModal}
           >
             <span aria-hidden="true">&times;</span>
           </button>
         ) : null}
 
-        <div class="uppy-Dashboard-innerWrap">
-          <div class="uppy-Dashboard-dropFilesHereHint">
+        <div className="uppy-Dashboard-innerWrap">
+          <div className="uppy-Dashboard-dropFilesHereHint">
             {props.i18n('dropHint')}
           </div>
 
@@ -127,7 +127,7 @@ module.exports = function Dashboard (props) {
             {props.showFileEditor ? <EditorPanel key="Editor" {...props} /> : null}
           </Slide>
 
-          <div class="uppy-Dashboard-progressindicators">
+          <div className="uppy-Dashboard-progressindicators">
             {props.progressindicators.map((target) => {
               return props.getPlugin(target.id).render(props.state)
             })}
@@ -139,7 +139,7 @@ module.exports = function Dashboard (props) {
 
   return (
     // Wrap it for RTL language support
-    <div class={wrapperClassName} dir={props.direction}>
+    <div className={wrapperClassName} dir={props.direction}>
       {dashboard}
     </div>
   )

packages/@uppy/dashboard/src/components/EditorPanel.js

@@ -6,26 +6,26 @@ function EditorPanel (props) {
 
   return (
     <div
-      class={classNames('uppy-DashboardContent-panel', props.className)}
+      className={classNames('uppy-DashboardContent-panel', props.className)}
       role="tabpanel"
       data-uppy-panelType="FileEditor"
       id="uppy-DashboardContent-panel--editor"
     >
-      <div class="uppy-DashboardContent-bar">
-        <div class="uppy-DashboardContent-title" role="heading" aria-level="1">
+      <div className="uppy-DashboardContent-bar">
+        <div className="uppy-DashboardContent-title" role="heading" aria-level="1">
           {props.i18nArray('editing', {
-            file: <span class="uppy-DashboardContent-titleFile">{file.meta ? file.meta.name : file.name}</span>
+            file: <span className="uppy-DashboardContent-titleFile">{file.meta ? file.meta.name : file.name}</span>,
           })}
         </div>
         <button
-          class="uppy-DashboardContent-back"
+          className="uppy-DashboardContent-back"
           type="button"
-          onclick={props.hideAllPanels}
+          onClick={props.hideAllPanels}
         >
           {props.i18n('done')}
         </button>
       </div>
-      <div class="uppy-DashboardContent-panelBody">
+      <div className="uppy-DashboardContent-panelBody">
         {props.editors.map((target) => {
           return props.getPlugin(target.id).render(props.state)
         })}

packages/@uppy/dashboard/src/components/FileCard/index.js

@@ -17,7 +17,7 @@ class FileCard extends Component {
     })
 
     this.state = {
-      formState: storedMetaData
+      formState: storedMetaData,
     }
   }
 
@@ -34,8 +34,8 @@ class FileCard extends Component {
     this.setState({
       formState: {
         ...this.state.formState,
-        [name]: newVal
-      }
+        [name]: newVal,
+      },
     })
   }
 
@@ -51,31 +51,31 @@ class FileCard extends Component {
   renderMetaFields = () => {
     const metaFields = this.props.metaFields || []
     const fieldCSSClasses = {
-      text: 'uppy-u-reset uppy-c-textInput uppy-Dashboard-FileCard-input'
+      text: 'uppy-u-reset uppy-c-textInput uppy-Dashboard-FileCard-input',
     }
 
     return metaFields.map((field) => {
       const id = `uppy-Dashboard-FileCard-input-${field.id}`
       return (
-        <fieldset key={field.id} class="uppy-Dashboard-FileCard-fieldset">
-          <label class="uppy-Dashboard-FileCard-label" for={id}>{field.name}</label>
+        <fieldset key={field.id} className="uppy-Dashboard-FileCard-fieldset">
+          <label className="uppy-Dashboard-FileCard-label" htmlFor={id}>{field.name}</label>
           {field.render !== undefined
             ? field.render({
               value: this.state.formState[field.id],
               onChange: (newVal) => this.updateMeta(newVal, field.id),
-              fieldCSSClasses: fieldCSSClasses
+              fieldCSSClasses,
             }, h)
             : (
               <input
-                class={fieldCSSClasses.text}
+                className={fieldCSSClasses.text}
                 id={id}
                 type={field.type || 'text'}
                 value={this.state.formState[field.id]}
                 placeholder={field.placeholder}
-                onkeyup={this.saveOnEnter}
-                onkeydown={this.saveOnEnter}
-                onkeypress={this.saveOnEnter}
-                oninput={ev => this.updateMeta(ev.target.value, field.id)}
+                onKeyUp={this.saveOnEnter}
+                onKeyDown={this.saveOnEnter}
+                onKeyPress={this.saveOnEnter}
+                onInput={ev => this.updateMeta(ev.target.value, field.id)}
                 data-uppy-super-focusable
               />
             )}
@@ -90,56 +90,60 @@ class FileCard extends Component {
 
     return (
       <div
-        class={classNames('uppy-Dashboard-FileCard', this.props.className)}
+        className={classNames('uppy-Dashboard-FileCard', this.props.className)}
         data-uppy-panelType="FileCard"
         onDragOver={ignoreEvent}
         onDragLeave={ignoreEvent}
         onDrop={ignoreEvent}
         onPaste={ignoreEvent}
       >
-        <div class="uppy-DashboardContent-bar">
-          <div class="uppy-DashboardContent-title" role="heading" aria-level="1">
+        <div className="uppy-DashboardContent-bar">
+          <div className="uppy-DashboardContent-title" role="heading" aria-level="1">
             {this.props.i18nArray('editing', {
-              file: <span class="uppy-DashboardContent-titleFile">{file.meta ? file.meta.name : file.name}</span>
+              file: <span className="uppy-DashboardContent-titleFile">{file.meta ? file.meta.name : file.name}</span>,
             })}
           </div>
           <button
-            class="uppy-DashboardContent-back" type="button" title={this.props.i18n('finishEditingFile')}
-            onclick={this.handleSave}
+            className="uppy-DashboardContent-back"
+            type="button"
+            title={this.props.i18n('finishEditingFile')}
+            onClick={this.handleSave}
           >
             {this.props.i18n('done')}
           </button>
         </div>
 
-        <div class="uppy-Dashboard-FileCard-inner">
-          <div class="uppy-Dashboard-FileCard-preview" style={{ backgroundColor: getFileTypeIcon(file.type).color }}>
+        <div className="uppy-Dashboard-FileCard-inner">
+          <div className="uppy-Dashboard-FileCard-preview" style={{ backgroundColor: getFileTypeIcon(file.type).color }}>
             <FilePreview file={file} />
-            {showEditButton &&
+            {showEditButton
+              && (
               <button
                 type="button"
-                class="uppy-u-reset uppy-c-btn uppy-Dashboard-FileCard-edit"
+                className="uppy-u-reset uppy-c-btn uppy-Dashboard-FileCard-edit"
                 onClick={() => this.props.openFileEditor(file)}
               >
                 {this.props.i18n('editFile')}
-              </button>}
+              </button>
+              )}
           </div>
 
-          <div class="uppy-Dashboard-FileCard-info">
+          <div className="uppy-Dashboard-FileCard-info">
             {this.renderMetaFields()}
           </div>
 
-          <div class="uppy-Dashboard-FileCard-actions">
+          <div className="uppy-Dashboard-FileCard-actions">
             <button
-              class="uppy-u-reset uppy-c-btn uppy-c-btn-primary uppy-Dashboard-FileCard-actionsBtn"
+              className="uppy-u-reset uppy-c-btn uppy-c-btn-primary uppy-Dashboard-FileCard-actionsBtn"
               type="button"
-              onclick={this.handleSave}
+              onClick={this.handleSave}
             >
               {this.props.i18n('saveChanges')}
             </button>
             <button
-              class="uppy-u-reset uppy-c-btn uppy-c-btn-link uppy-Dashboard-FileCard-actionsBtn"
+              className="uppy-u-reset uppy-c-btn uppy-c-btn-link uppy-Dashboard-FileCard-actionsBtn"
               type="button"
-              onclick={this.handleCancel}
+              onClick={this.handleCancel}
             >
               {this.props.i18n('cancel')}
             </button>

packages/@uppy/dashboard/src/components/FileItem/Buttons/index.js

@@ -7,25 +7,25 @@ function EditButton ({
   metaFields,
   canEditFile,
   i18n,
-  onClick
+  onClick,
 }) {
   if (
-    (!uploadInProgressOrComplete && metaFields && metaFields.length > 0) ||
-    (!uploadInProgressOrComplete && canEditFile(file))
+    (!uploadInProgressOrComplete && metaFields && metaFields.length > 0)
+    || (!uploadInProgressOrComplete && canEditFile(file))
   ) {
     return (
       <button
-        class="uppy-u-reset uppy-Dashboard-Item-action uppy-Dashboard-Item-action--edit"
+        className="uppy-u-reset uppy-Dashboard-Item-action uppy-Dashboard-Item-action--edit"
         type="button"
-        aria-label={i18n('editFile') + ' ' + file.meta.name}
+        aria-label={`${i18n('editFile')} ${file.meta.name}`}
         title={i18n('editFile')}
-        onclick={() => onClick()}
+        onClick={() => onClick()}
       >
-        <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="14" height="14" viewBox="0 0 14 14">
-          <g fill-rule="evenodd">
-            <path d="M1.5 10.793h2.793A1 1 0 0 0 5 10.5L11.5 4a1 1 0 0 0 0-1.414L9.707.793a1 1 0 0 0-1.414 0l-6.5 6.5A1 1 0 0 0 1.5 8v2.793zm1-1V8L9 1.5l1.793 1.793-6.5 6.5H2.5z" fill-rule="nonzero" />
+        <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="14" height="14" viewBox="0 0 14 14">
+          <g fillRule="evenodd">
+            <path d="M1.5 10.793h2.793A1 1 0 0 0 5 10.5L11.5 4a1 1 0 0 0 0-1.414L9.707.793a1 1 0 0 0-1.414 0l-6.5 6.5A1 1 0 0 0 1.5 8v2.793zm1-1V8L9 1.5l1.793 1.793-6.5 6.5H2.5z" fillRule="nonzero" />
             <rect x="1" y="12.293" width="11" height="1" rx=".5" />
-            <path fill-rule="nonzero" d="M6.793 2.5L9.5 5.207l.707-.707L7.5 1.793z" />
+            <path fillRule="nonzero" d="M6.793 2.5L9.5 5.207l.707-.707L7.5 1.793z" />
           </g>
         </svg>
       </button>
@@ -37,13 +37,13 @@ function EditButton ({
 function RemoveButton ({ i18n, onClick }) {
   return (
     <button
-      class="uppy-u-reset uppy-Dashboard-Item-action uppy-Dashboard-Item-action--remove"
+      className="uppy-u-reset uppy-Dashboard-Item-action uppy-Dashboard-Item-action--remove"
       type="button"
       aria-label={i18n('removeFile')}
       title={i18n('removeFile')}
-      onclick={() => onClick()}
+      onClick={() => onClick()}
     >
-      <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="18" height="18" viewBox="0 0 18 18">
+      <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="18" height="18" viewBox="0 0 18 18">
         <path d="M9 0C4.034 0 0 4.034 0 9s4.034 9 9 9 9-4.034 9-9-4.034-9-9-9z" />
         <path fill="#FFF" d="M13 12.222l-.778.778L9 9.778 5.778 13 5 12.222 8.222 9 5 5.778 5.778 5 9 8.222 12.222 5l.778.778L9.778 9z" />
       </svg>
@@ -65,13 +65,13 @@ const copyLinkToClipboard = (event, props) => {
 function CopyLinkButton (props) {
   return (
     <button
-      class="uppy-u-reset uppy-Dashboard-Item-action uppy-Dashboard-Item-action--copyLink"
+      className="uppy-u-reset uppy-Dashboard-Item-action uppy-Dashboard-Item-action--copyLink"
       type="button"
       aria-label={props.i18n('copyLink')}
       title={props.i18n('copyLink')}
-      onclick={(event) => copyLinkToClipboard(event, props)}
+      onClick={(event) => copyLinkToClipboard(event, props)}
     >
-      <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="14" height="14" viewBox="0 0 14 12">
+      <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="14" height="14" viewBox="0 0 14 12">
         <path d="M7.94 7.703a2.613 2.613 0 0 1-.626 2.681l-.852.851a2.597 2.597 0 0 1-1.849.766A2.616 2.616 0 0 1 2.764 7.54l.852-.852a2.596 2.596 0 0 1 2.69-.625L5.267 7.099a1.44 1.44 0 0 0-.833.407l-.852.851a1.458 1.458 0 0 0 1.03 2.486c.39 0 .755-.152 1.03-.426l.852-.852c.231-.231.363-.522.406-.824l1.04-1.038zm4.295-5.937A2.596 2.596 0 0 0 10.387 1c-.698 0-1.355.272-1.849.766l-.852.851a2.614 2.614 0 0 0-.624 2.688l1.036-1.036c.041-.304.173-.6.407-.833l.852-.852c.275-.275.64-.426 1.03-.426a1.458 1.458 0 0 1 1.03 2.486l-.852.851a1.442 1.442 0 0 1-.824.406l-1.04 1.04a2.596 2.596 0 0 0 2.683-.628l.851-.85a2.616 2.616 0 0 0 0-3.697zm-6.88 6.883a.577.577 0 0 0 .82 0l3.474-3.474a.579.579 0 1 0-.819-.82L5.355 7.83a.579.579 0 0 0 0 .819z" />
       </svg>
     </button>
@@ -91,7 +91,7 @@ module.exports = function Buttons (props) {
     toggleFileCard,
     openFileEditor,
     log,
-    info
+    info,
   } = props
 
   const editAction = () => {

packages/@uppy/dashboard/src/components/FileItem/FileInfo/index.js

@@ -2,21 +2,24 @@ const { h } = require('preact')
 const prettierBytes = require('@transloadit/prettier-bytes')
 const truncateString = require('@uppy/utils/lib/truncateString')
 
-const renderAcquirerIcon = (acquirer, props) =>
+const renderAcquirerIcon = (acquirer, props) => (
   <span title={props.i18n('fileSource', { name: acquirer.name })}>
     {acquirer.icon()}
   </span>
+)
 
 const renderFileSource = (props) => (
-  props.file.source &&
-  props.file.source !== props.id &&
-    <div class="uppy-Dashboard-Item-sourceIcon">
+  props.file.source
+  && props.file.source !== props.id
+    && (
+    <div className="uppy-Dashboard-Item-sourceIcon">
       {props.acquirers.map(acquirer => {
         if (acquirer.id === props.file.source) {
           return renderAcquirerIcon(acquirer, props)
         }
       })}
     </div>
+    )
 )
 
 const renderFileName = (props) => {
@@ -34,29 +37,31 @@ const renderFileName = (props) => {
   }
 
   return (
-    <div class="uppy-Dashboard-Item-name" title={props.file.meta.name}>
+    <div className="uppy-Dashboard-Item-name" title={props.file.meta.name}>
       {truncateString(props.file.meta.name, maxNameLength)}
     </div>
   )
 }
 
 const renderFileSize = (props) => (
-  props.file.data.size &&
-    <div class="uppy-Dashboard-Item-statusSize">
+  props.file.data.size
+    && (
+    <div className="uppy-Dashboard-Item-statusSize">
       {prettierBytes(props.file.data.size)}
     </div>
+    )
 )
 
 const ErrorButton = ({ file, onClick }) => {
   if (file.error) {
     return (
       <span
-        class="uppy-Dashboard-Item-errorDetails"
+        className="uppy-Dashboard-Item-errorDetails"
         aria-label={file.error}
         data-microtip-position="bottom"
         data-microtip-size="medium"
         role="tooltip"
-        onclick={onClick}
+        onClick={onClick}
       >
         ?
       </span>
@@ -67,9 +72,9 @@ const ErrorButton = ({ file, onClick }) => {
 
 module.exports = function FileInfo (props) {
   return (
-    <div class="uppy-Dashboard-Item-fileInfo" data-uppy-file-source={props.file.source}>
+    <div className="uppy-Dashboard-Item-fileInfo" data-uppy-file-source={props.file.source}>
       {renderFileName(props)}
-      <div class="uppy-Dashboard-Item-status">
+      <div className="uppy-Dashboard-Item-status">
         {renderFileSize(props)}
         {renderFileSource(props)}
         <ErrorButton

packages/@uppy/dashboard/src/components/FileItem/FilePreviewAndLink/index.js

@@ -5,19 +5,21 @@ const getFileTypeIcon = require('../../../utils/getFileTypeIcon')
 module.exports = function FilePreviewAndLink (props) {
   return (
     <div
-      class="uppy-Dashboard-Item-previewInnerWrap"
+      className="uppy-Dashboard-Item-previewInnerWrap"
       style={{ backgroundColor: getFileTypeIcon(props.file.type).color }}
     >
       {
-        props.showLinkToFileUploadResult &&
-        props.file.uploadURL &&
+        props.showLinkToFileUploadResult
+        && props.file.uploadURL
+          && (
           <a
-            class="uppy-Dashboard-Item-previewLink"
+            className="uppy-Dashboard-Item-previewLink"
             href={props.file.uploadURL}
             rel="noreferrer noopener"
             target="_blank"
             aria-label={props.file.meta.name}
           />
+          )
       }
       <FilePreview file={props.file} />
     </div>

packages/@uppy/dashboard/src/components/FileItem/FileProgress/index.js

@@ -29,7 +29,7 @@ function progressIndicatorTitle (props) {
       return props.i18n('resumeUpload')
     }
     return props.i18n('pauseUpload')
-  } else if (props.individualCancellation) {
+  } if (props.individualCancellation) {
     return props.i18n('cancelUpload')
   }
 
@@ -38,13 +38,13 @@ function progressIndicatorTitle (props) {
 
 function ProgressIndicatorButton (props) {
   return (
-    <div class="uppy-Dashboard-Item-progress">
+    <div className="uppy-Dashboard-Item-progress">
       <button
-        class="uppy-u-reset uppy-Dashboard-Item-progressIndicator"
+        className="uppy-u-reset uppy-Dashboard-Item-progressIndicator"
         type="button"
         aria-label={progressIndicatorTitle(props)}
         title={progressIndicatorTitle(props)}
-        onclick={() => onPauseResumeCancelRetry(props)}
+        onClick={() => onPauseResumeCancelRetry(props)}
       >
         {props.children}
       </button>
@@ -60,7 +60,7 @@ function ProgressCircleContainer ({ children }) {
       width="70"
       height="70"
       viewBox="0 0 36 36"
-      class="uppy-c-icon uppy-Dashboard-Item-progressIcon--circle"
+      className="uppy-c-icon uppy-Dashboard-Item-progressIcon--circle"
     >
       {children}
     </svg>
@@ -73,11 +73,17 @@ function ProgressCircle ({ progress }) {
 
   return (
     <g>
-      <circle class="uppy-Dashboard-Item-progressIcon--bg" r="15" cx="18" cy="18" stroke-width="2" fill="none" />
+      <circle className="uppy-Dashboard-Item-progressIcon--bg" r="15" cx="18" cy="18" strokeWidth="2" fill="none" />
       <circle
-        class="uppy-Dashboard-Item-progressIcon--progress" r="15" cx="18" cy="18" transform="rotate(-90, 18, 18)" stroke-width="2" fill="none"
-        stroke-dasharray={circleLength}
-        stroke-dashoffset={circleLength - (circleLength / 100 * progress)}
+        className="uppy-Dashboard-Item-progressIcon--progress"
+        r="15"
+        cx="18"
+        cy="18"
+        transform="rotate(-90, 18, 18)"
+        strokeWidth="2"
+        fill="none"
+        strokeDasharray={circleLength}
+        strokeDashoffset={circleLength - (circleLength / 100 * progress)}
       />
     </g>
   )
@@ -92,11 +98,11 @@ module.exports = function FileProgress (props) {
   // Green checkmark when complete
   if (props.isUploaded) {
     return (
-      <div class="uppy-Dashboard-Item-progress">
-        <div class="uppy-Dashboard-Item-progressIndicator">
+      <div className="uppy-Dashboard-Item-progress">
+        <div className="uppy-Dashboard-Item-progressIndicator">
           <ProgressCircleContainer>
             <circle r="15" cx="18" cy="18" fill="#1bb240" />
-            <polygon class="uppy-Dashboard-Item-progressIcon--check" transform="translate(2, 3)" points="14 22.5 7 15.2457065 8.99985857 13.1732815 14 18.3547104 22.9729883 9 25 11.1005634" />
+            <polygon className="uppy-Dashboard-Item-progressIcon--check" transform="translate(2, 3)" points="14 22.5 7 15.2457065 8.99985857 13.1732815 14 18.3547104 22.9729883 9 25 11.1005634" />
           </ProgressCircleContainer>
         </div>
       </div>
@@ -107,7 +113,7 @@ module.exports = function FileProgress (props) {
   if (props.error && !props.hideRetryButton) {
     return (
       <ProgressIndicatorButton {...props}>
-        <svg aria-hidden="true" focusable="false" class="uppy-c-icon uppy-Dashboard-Item-progressIcon--retry" width="28" height="31" viewBox="0 0 16 19">
+        <svg aria-hidden="true" focusable="false" className="uppy-c-icon uppy-Dashboard-Item-progressIcon--retry" width="28" height="31" viewBox="0 0 16 19">
           <path d="M16 11a8 8 0 1 1-8-8v2a6 6 0 1 0 6 6h2z" />
           <path d="M7.9 3H10v2H7.9z" />
           <path d="M8.536.5l3.535 3.536-1.414 1.414L7.12 1.914z" />
@@ -125,9 +131,9 @@ module.exports = function FileProgress (props) {
           <ProgressCircle progress={props.file.progress.percentage} />
           {
             props.file.isPaused
-              ? <polygon class="uppy-Dashboard-Item-progressIcon--play" transform="translate(3, 3)" points="12 20 12 10 20 15" />
+              ? <polygon className="uppy-Dashboard-Item-progressIcon--play" transform="translate(3, 3)" points="12 20 12 10 20 15" />
               : (
-                <g class="uppy-Dashboard-Item-progressIcon--pause" transform="translate(14.5, 13)">
+                <g className="uppy-Dashboard-Item-progressIcon--pause" transform="translate(14.5, 13)">
                   <rect x="0" y="0" width="2" height="10" rx="0" />
                   <rect x="5" y="0" width="2" height="10" rx="0" />
                 </g>
@@ -144,7 +150,7 @@ module.exports = function FileProgress (props) {
       <ProgressIndicatorButton {...props}>
         <ProgressCircleContainer>
           <ProgressCircle progress={props.file.progress.percentage} />
-          <polygon class="cancel" transform="translate(2, 2)" points="19.8856516 11.0625 16 14.9481516 12.1019737 11.0625 11.0625 12.1143484 14.9481516 16 11.0625 19.8980263 12.1019737 20.9375 16 17.0518484 19.8856516 20.9375 20.9375 19.8980263 17.0518484 16 20.9375 12" />
+          <polygon className="cancel" transform="translate(2, 2)" points="19.8856516 11.0625 16 14.9481516 12.1019737 11.0625 11.0625 12.1143484 14.9481516 16 11.0625 19.8980263 12.1019737 20.9375 16 17.0518484 19.8856516 20.9375 20.9375 19.8980263 17.0518484 16 20.9375 12" />
         </ProgressCircleContainer>
       </ProgressIndicatorButton>
     )
@@ -152,8 +158,8 @@ module.exports = function FileProgress (props) {
 
   // Just progress when buttons are disabled
   return (
-    <div class="uppy-Dashboard-Item-progress">
-      <div class="uppy-Dashboard-Item-progressIndicator">
+    <div className="uppy-Dashboard-Item-progress">
+      <div className="uppy-Dashboard-Item-progressIndicator">
         <ProgressCircleContainer>
           <ProgressCircle progress={props.file.progress.percentage} />
         </ProgressCircleContainer>

packages/@uppy/dashboard/src/components/FileItem/index.js

@@ -49,16 +49,16 @@ module.exports = class FileItem extends Component {
       'is-complete': isUploaded,
       'is-error': !!error,
       'is-resumable': this.props.resumableUploads,
-      'is-noIndividualCancellation': !this.props.individualCancellation
+      'is-noIndividualCancellation': !this.props.individualCancellation,
     })
 
     return (
       <div
-        class={dashboardItemClass}
+        className={dashboardItemClass}
         id={`uppy_${file.id}`}
         role={this.props.role}
       >
-        <div class="uppy-Dashboard-Item-preview">
+        <div className="uppy-Dashboard-Item-preview">
           <FilePreviewAndLink
             file={file}
             showLinkToFileUploadResult={this.props.showLinkToFileUploadResult}
@@ -84,7 +84,7 @@ module.exports = class FileItem extends Component {
           />
         </div>
 
-        <div class="uppy-Dashboard-Item-fileInfoAndButtons">
+        <div className="uppy-Dashboard-Item-fileInfoAndButtons">
           <FileInfo
             file={file}
             id={this.props.id}

packages/@uppy/dashboard/src/components/FileList.js

@@ -60,7 +60,7 @@ module.exports = (props) => {
     toggleFileCard: props.toggleFileCard,
     removeFile: props.removeFile,
     handleRequestThumbnail: props.handleRequestThumbnail,
-    handleCancelThumbnail: props.handleCancelThumbnail
+    handleCancelThumbnail: props.handleCancelThumbnail,
   }
 
   const rows = chunks(Object.keys(props.files), props.itemsPerRow)

packages/@uppy/dashboard/src/components/FilePreview.js

@@ -7,7 +7,7 @@ module.exports = function FilePreview (props) {
   if (file.preview) {
     return (
       <img
-        class="uppy-Dashboard-Item-previewImg"
+        className="uppy-Dashboard-Item-previewImg"
         alt={file.name}
         src={file.preview}
       />
@@ -17,10 +17,10 @@ module.exports = function FilePreview (props) {
   const { color, icon } = getFileTypeIcon(file.type)
 
   return (
-    <div class="uppy-Dashboard-Item-previewIconWrap">
-      <span class="uppy-Dashboard-Item-previewIcon" style={{ color: color }}>{icon}</span>
-      <svg aria-hidden="true" focusable="false" class="uppy-Dashboard-Item-previewIconBg" width="58" height="76" viewBox="0 0 58 76">
-        <rect fill="#FFF" width="58" height="76" rx="3" fill-rule="evenodd" />
+    <div className="uppy-Dashboard-Item-previewIconWrap">
+      <span className="uppy-Dashboard-Item-previewIcon" style={{ color }}>{icon}</span>
+      <svg aria-hidden="true" focusable="false" className="uppy-Dashboard-Item-previewIconBg" width="58" height="76" viewBox="0 0 58 76">
+        <rect fill="#FFF" width="58" height="76" rx="3" fillRule="evenodd" />
       </svg>
     </div>
   )

packages/@uppy/dashboard/src/components/PickerPanelContent.js

@@ -5,7 +5,7 @@ const ignoreEvent = require('../utils/ignoreEvent.js')
 function PickerPanelContent (props) {
   return (
     <div
-      class={classNames('uppy-DashboardContent-panel', props.className)}
+      className={classNames('uppy-DashboardContent-panel', props.className)}
       role="tabpanel"
       data-uppy-panelType="PickerPanel"
       id={`uppy-DashboardContent-panel--${props.activePickerPanel.id}`}
@@ -14,18 +14,19 @@ function PickerPanelContent (props) {
       onDrop={ignoreEvent}
       onPaste={ignoreEvent}
     >
-      <div class="uppy-DashboardContent-bar">
-        <div class="uppy-DashboardContent-title" role="heading" aria-level="1">
+      <div className="uppy-DashboardContent-bar">
+        <div className="uppy-DashboardContent-title" role="heading" aria-level="1">
           {props.i18n('importFrom', { name: props.activePickerPanel.name })}
         </div>
         <button
-          class="uppy-DashboardContent-back"
+          className="uppy-DashboardContent-back"
           type="button"
-          onclick={props.hideAllPanels}
-        >{props.i18n('done')}
+          onClick={props.hideAllPanels}
+        >
+          {props.i18n('done')}
         </button>
       </div>
-      <div class="uppy-DashboardContent-panelBody">
+      <div className="uppy-DashboardContent-panelBody">
         {props.getPlugin(props.activePickerPanel.id).render(props.state)}
       </div>
     </div>

packages/@uppy/dashboard/src/components/PickerPanelTopBar.js

@@ -7,7 +7,7 @@ const uploadStates = {
   STATE_UPLOADING: 'uploading',
   STATE_POSTPROCESSING: 'postprocessing',
   STATE_COMPLETE: 'complete',
-  STATE_PAUSED: 'paused'
+  STATE_PAUSED: 'paused',
 }
 
 function getUploadingState (isAllErrored, isAllComplete, isAllPaused, files = {}) {
@@ -76,12 +76,12 @@ function PanelTopBar (props) {
   }
 
   return (
-    <div class="uppy-DashboardContent-bar">
+    <div className="uppy-DashboardContent-bar">
       {!props.isAllComplete && !props.hideCancelButton ? (
         <button
-          class="uppy-DashboardContent-back"
+          className="uppy-DashboardContent-back"
           type="button"
-          onclick={props.cancelAll}
+          onClick={props.cancelAll}
         >
           {props.i18n('cancel')}
         </button>
@@ -89,22 +89,22 @@ function PanelTopBar (props) {
         <div />
       )}
 
-      <div class="uppy-DashboardContent-title" role="heading" aria-level="1">
+      <div className="uppy-DashboardContent-title" role="heading" aria-level="1">
         <UploadStatus {...props} />
       </div>
 
       {allowNewUpload ? (
         <button
-          class="uppy-DashboardContent-addMore"
+          className="uppy-DashboardContent-addMore"
           type="button"
           aria-label={props.i18n('addMoreFiles')}
           title={props.i18n('addMoreFiles')}
-          onclick={() => props.toggleAddFilesPanel(true)}
+          onClick={() => props.toggleAddFilesPanel(true)}
         >
-          <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="15" height="15" viewBox="0 0 15 15">
+          <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="15" height="15" viewBox="0 0 15 15">
             <path d="M8 6.5h6a.5.5 0 0 1 .5.5v.5a.5.5 0 0 1-.5.5H8v6a.5.5 0 0 1-.5.5H7a.5.5 0 0 1-.5-.5V8h-6a.5.5 0 0 1-.5-.5V7a.5.5 0 0 1 .5-.5h6v-6A.5.5 0 0 1 7 0h.5a.5.5 0 0 1 .5.5v6z" />
           </svg>
-          <span class="uppy-DashboardContent-addMoreCaption">{props.i18n('addMore')}</span>
+          <span className="uppy-DashboardContent-addMoreCaption">{props.i18n('addMore')}</span>
         </button>
       ) : (
         <div />

packages/@uppy/dashboard/src/components/Slide.js

@@ -19,7 +19,7 @@ class Slide extends Component {
 
     this.state = {
       cachedChildren: null,
-      className: ''
+      className: '',
     }
   }
 
@@ -30,7 +30,7 @@ class Slide extends Component {
     if (cachedChildren === child) return
 
     const patch = {
-      cachedChildren: child
+      cachedChildren: child,
     }
 
     // Enter transition
@@ -46,7 +46,7 @@ class Slide extends Component {
         this.base.getBoundingClientRect()
 
         this.setState({
-          className: `${transitionName}-enter ${transitionName}-enter-active`
+          className: `${transitionName}-enter ${transitionName}-enter-active`,
         })
 
         this.enterTimeout = setTimeout(() => {
@@ -65,13 +65,13 @@ class Slide extends Component {
       this.enterTimeout = undefined
       this.animationFrame = requestAnimationFrame(() => {
         this.setState({
-          className: `${transitionName}-leave ${transitionName}-leave-active`
+          className: `${transitionName}-leave ${transitionName}-leave-active`,
         })
 
         this.leaveTimeout = setTimeout(() => {
           this.setState({
             cachedChildren: null,
-            className: ''
+            className: '',
           })
         }, duration)
       })
@@ -88,7 +88,7 @@ class Slide extends Component {
     }
 
     return cloneElement(cachedChildren, {
-      className: classNames(className, cachedChildren.attributes.className)
+      className: classNames(className, cachedChildren.attributes.className),
     })
   }
 }

packages/@uppy/dashboard/src/components/VirtualList.js

@@ -35,7 +35,7 @@ const STYLE_INNER = {
   //
   // overflow: 'hidden',
   width: '100%',
-  minHeight: '100%'
+  minHeight: '100%',
 }
 
 const STYLE_CONTENT = {
@@ -48,7 +48,7 @@ const STYLE_CONTENT = {
   //
   // height: '100%',
   width: '100%',
-  overflow: 'visible'
+  overflow: 'visible',
 }
 
 class VirtualList extends Component {
@@ -61,14 +61,14 @@ class VirtualList extends Component {
 
     this.state = {
       offset: 0,
-      height: 0
+      height: 0,
     }
   }
 
   resize () {
     if (this.state.height !== this.base.offsetHeight) {
       this.setState({
-        height: this.base.offsetHeight
+        height: this.base.offsetHeight,
       })
     }
   }
@@ -79,7 +79,7 @@ class VirtualList extends Component {
 
   handleScroll = () => {
     this.setState({
-      offset: this.base.scrollTop
+      offset: this.base.scrollTop,
     })
     if (this.props.sync) {
       this.forceUpdate()
@@ -94,8 +94,8 @@ class VirtualList extends Component {
 
   componentDidUpdate () {
     // Maintain focus when rows are added and removed.
-    if (this.focusElement && this.focusElement.parentNode &&
-        document.activeElement !== this.focusElement) {
+    if (this.focusElement && this.focusElement.parentNode
+        && document.activeElement !== this.focusElement) {
       this.focusElement.focus()
     }
     this.focusElement = null

packages/@uppy/dashboard/src/index.js

@@ -88,15 +88,15 @@ module.exports = class Dashboard extends Plugin {
         cancelUpload: 'Cancel upload',
         xFilesSelected: {
           0: '%{smart_count} file selected',
-          1: '%{smart_count} files selected'
+          1: '%{smart_count} files selected',
         },
         uploadingXFiles: {
           0: 'Uploading %{smart_count} file',
-          1: 'Uploading %{smart_count} files'
+          1: 'Uploading %{smart_count} files',
         },
         processingXFiles: {
           0: 'Processing %{smart_count} file',
-          1: 'Processing %{smart_count} files'
+          1: 'Processing %{smart_count} files',
         },
         // The default `poweredBy2` string only combines the `poweredBy` string (%{backwardsCompat}) with the size.
         // Locales can override `poweredBy2` to specify a different word order. This is for backwards compat with
@@ -104,8 +104,8 @@ module.exports = class Dashboard extends Plugin {
         // substitution.
         // TODO: In 2.0 `poweredBy2` should be removed in and `poweredBy` updated to use substitution.
         poweredBy2: '%{backwardsCompat} %{uppy}',
-        poweredBy: 'Powered by'
-      }
+        poweredBy: 'Powered by',
+      },
     }
 
     // set default options
@@ -147,7 +147,7 @@ module.exports = class Dashboard extends Plugin {
       browserBackButtonClose: false,
       theme: 'light',
       autoOpenFileEditor: false,
-      disabled: false
+      disabled: false,
     }
 
     // merge default options with the ones set by user
@@ -181,7 +181,7 @@ module.exports = class Dashboard extends Plugin {
     const newTargets = pluginState.targets.filter(target => target.id !== plugin.id)
 
     this.setPluginState({
-      targets: newTargets
+      targets: newTargets,
     })
   }
 
@@ -190,9 +190,9 @@ module.exports = class Dashboard extends Plugin {
     const callerPluginName = plugin.title || callerPluginId
     const callerPluginType = plugin.type
 
-    if (callerPluginType !== 'acquirer' &&
-        callerPluginType !== 'progressindicator' &&
-        callerPluginType !== 'editor') {
+    if (callerPluginType !== 'acquirer'
+        && callerPluginType !== 'progressindicator'
+        && callerPluginType !== 'editor') {
       const msg = 'Dashboard: can only be targeted by plugins of types: acquirer, progressindicator, editor'
       this.uppy.log(msg, 'error')
       return
@@ -201,7 +201,7 @@ module.exports = class Dashboard extends Plugin {
     const target = {
       id: callerPluginId,
       name: callerPluginName,
-      type: callerPluginType
+      type: callerPluginType,
     }
 
     const state = this.getPluginState()
@@ -209,7 +209,7 @@ module.exports = class Dashboard extends Plugin {
     newTargets.push(target)
 
     this.setPluginState({
-      targets: newTargets
+      targets: newTargets,
     })
 
     return this.el
@@ -221,14 +221,14 @@ module.exports = class Dashboard extends Plugin {
       showAddFilesPanel: false,
       activeOverlayType: null,
       fileCardFor: null,
-      showFileEditor: false
+      showFileEditor: false,
     }
 
     const current = this.getPluginState()
-    if (current.activePickerPanel === update.activePickerPanel &&
-        current.showAddFilesPanel === update.showAddFilesPanel &&
-        current.showFileEditor === update.showFileEditor &&
-        current.activeOverlayType === update.activeOverlayType) {
+    if (current.activePickerPanel === update.activePickerPanel
+        && current.showAddFilesPanel === update.showAddFilesPanel
+        && current.showFileEditor === update.showFileEditor
+        && current.activeOverlayType === update.activeOverlayType) {
       // avoid doing a state update if nothing changed
       return
     }
@@ -244,8 +244,8 @@ module.exports = class Dashboard extends Plugin {
     })[0]
 
     this.setPluginState({
-      activePickerPanel: activePickerPanel,
-      activeOverlayType: 'PickerPanel'
+      activePickerPanel,
+      activeOverlayType: 'PickerPanel',
     })
   }
 
@@ -265,7 +265,7 @@ module.exports = class Dashboard extends Plugin {
     this.setPluginState({
       showFileEditor: true,
       fileCardFor: file.id || null,
-      activeOverlayType: 'FileEditor'
+      activeOverlayType: 'FileEditor',
     })
 
     editors.forEach((editor) => {
@@ -287,7 +287,7 @@ module.exports = class Dashboard extends Plugin {
     if (this.opts.animateOpenClose && this.getPluginState().isClosing) {
       const handler = () => {
         this.setPluginState({
-          isHidden: false
+          isHidden: false,
         })
         this.el.removeEventListener('animationend', handler, false)
         resolve()
@@ -295,7 +295,7 @@ module.exports = class Dashboard extends Plugin {
       this.el.addEventListener('animationend', handler, false)
     } else {
       this.setPluginState({
-        isHidden: false
+        isHidden: false,
       })
       resolve()
     }
@@ -314,7 +314,7 @@ module.exports = class Dashboard extends Plugin {
 
   closeModal = (opts = {}) => {
     const {
-      manualClose = true // Whether the modal is being closed by the user (`true`) or by other means (e.g. browser back button)
+      manualClose = true, // Whether the modal is being closed by the user (`true`) or by other means (e.g. browser back button)
     } = opts
 
     const { isHidden, isClosing } = this.getPluginState()
@@ -331,12 +331,12 @@ module.exports = class Dashboard extends Plugin {
 
     if (this.opts.animateOpenClose) {
       this.setPluginState({
-        isClosing: true
+        isClosing: true,
       })
       const handler = () => {
         this.setPluginState({
           isHidden: true,
-          isClosing: false
+          isClosing: false,
         })
 
         this.superFocus.cancel()
@@ -348,7 +348,7 @@ module.exports = class Dashboard extends Plugin {
       this.el.addEventListener('animationend', handler, false)
     } else {
       this.setPluginState({
-        isHidden: true
+        isHidden: true,
       })
 
       this.superFocus.cancel()
@@ -391,8 +391,8 @@ module.exports = class Dashboard extends Plugin {
     this.uppy.setState({
       capabilities: {
         ...capabilities,
-        darkMode: isDarkModeOn
-      }
+        darkMode: isDarkModeOn,
+      },
     })
   }
 
@@ -412,14 +412,14 @@ module.exports = class Dashboard extends Plugin {
 
     this.setPluginState({
       fileCardFor: show ? fileID : null,
-      activeOverlayType: show ? 'FileCard' : null
+      activeOverlayType: show ? 'FileCard' : null,
     })
   }
 
   toggleAddFilesPanel = (show) => {
     this.setPluginState({
       showAddFilesPanel: show,
-      activeOverlayType: show ? 'AddFiles' : null
+      activeOverlayType: show ? 'AddFiles' : null,
     })
   }
 
@@ -432,8 +432,8 @@ module.exports = class Dashboard extends Plugin {
       meta: {
         // path of the file relative to the ancestor directory the user selected.
         // e.g. 'docs/Old Prague/airbnb.pdf'
-        relativePath: file.relativePath || null
-      }
+        relativePath: file.relativePath || null,
+      },
     }))
 
     try {
@@ -461,7 +461,7 @@ module.exports = class Dashboard extends Plugin {
       this.setPluginState({
         containerWidth: width,
         containerHeight: height,
-        areInsidesReadyToBeVisible: true
+        areInsidesReadyToBeVisible: true,
       })
     })
     this.resizeObserver.observe(this.el.querySelector('.uppy-Dashboard-inner'))
@@ -472,14 +472,14 @@ module.exports = class Dashboard extends Plugin {
       const isModalAndClosed = !this.opts.inline && pluginState.isHidden
       if (
         // if ResizeObserver hasn't yet fired,
-        !pluginState.areInsidesReadyToBeVisible &&
+        !pluginState.areInsidesReadyToBeVisible
         // and it's not due to the modal being closed
-        !isModalAndClosed
+        && !isModalAndClosed
       ) {
         this.uppy.log("[Dashboard] resize event didn't fire on time: defaulted to mobile layout", 'debug')
 
         this.setPluginState({
-          areInsidesReadyToBeVisible: true
+          areInsidesReadyToBeVisible: true,
         })
       }
     }, 1000)
@@ -533,7 +533,7 @@ module.exports = class Dashboard extends Plugin {
       // Push to history so that the page is not lost on browser back button press
       history.pushState({
         ...history.state,
-        [this.modalName]: true
+        [this.modalName]: true,
       }, '')
     }
 
@@ -776,17 +776,17 @@ module.exports = class Dashboard extends Plugin {
 
     if (
       // If update is connected to showing the Informer - let the screen reader calmly read it.
-      isInformerHidden &&
-      (
+      isInformerHidden
+      && (
         // If we are in a modal - always superfocus without concern for other elements on the page (user is unlikely to want to interact with the rest of the page)
-        isModal ||
+        isModal
         // If we are already inside of Uppy, or
-        isFocusInUppy ||
+        || isFocusInUppy
         // If we are not focused on anything BUT we have already, at least once, focused on uppy
         //   1. We focus when isFocusNowhere, because when the element we were focused on disappears (e.g. an overlay), - focus gets lost. If user is typing something somewhere else on the page, - focus won't be 'nowhere'.
         //   2. We only focus when focus is nowhere AND this.ifFocusedOnUppyRecently, to avoid focus jumps if we do something else on the page.
         //   [Practical check] Without '&& this.ifFocusedOnUppyRecently', in Safari, in inline mode, when file is uploading, - navigate via tab to the checkbox, try to press space multiple times. Focus will jump to Uppy.
-        (isFocusNowhere && this.ifFocusedOnUppyRecently)
+        || (isFocusNowhere && this.ifFocusedOnUppyRecently)
       )
     ) {
       this.superFocus(this.el, this.getPluginState().activeOverlayType)
@@ -822,7 +822,7 @@ module.exports = class Dashboard extends Plugin {
     return {
       ...target,
       icon: plugin.icon || this.opts.defaultPickerIcon,
-      render: plugin.render
+      render: plugin.render,
     }
   }
 
@@ -880,8 +880,8 @@ module.exports = class Dashboard extends Plugin {
     })
 
     const inProgressFiles = Object.keys(files).filter((file) => {
-      return !files[file].progress.uploadComplete &&
-             files[file].progress.uploadStarted
+      return !files[file].progress.uploadComplete
+             && files[file].progress.uploadStarted
     })
 
     const inProgressNotPausedFiles = inProgressFiles.filter((file) => {
@@ -894,15 +894,15 @@ module.exports = class Dashboard extends Plugin {
 
     const isUploadStarted = uploadStartedFiles.length > 0
 
-    const isAllComplete = state.totalProgress === 100 &&
-      completeFiles.length === Object.keys(files).length &&
-      processingFiles.length === 0
+    const isAllComplete = state.totalProgress === 100
+      && completeFiles.length === Object.keys(files).length
+      && processingFiles.length === 0
 
-    const isAllErrored = isUploadStarted &&
-      erroredFiles.length === uploadStartedFiles.length
+    const isAllErrored = isUploadStarted
+      && erroredFiles.length === uploadStartedFiles.length
 
-    const isAllPaused = inProgressFiles.length !== 0 &&
-      pausedFiles.length === inProgressFiles.length
+    const isAllPaused = inProgressFiles.length !== 0
+      && pausedFiles.length === inProgressFiles.length
 
     const acquirers = this._getAcquirers(pluginState.targets)
     const progressindicators = this._getProgressIndicators(pluginState.targets)
@@ -948,8 +948,8 @@ module.exports = class Dashboard extends Plugin {
       animateOpenClose: this.opts.animateOpenClose,
       isClosing: pluginState.isClosing,
       getPlugin: this.uppy.getPlugin,
-      progressindicators: progressindicators,
-      editors: editors,
+      progressindicators,
+      editors,
       autoProceed: this.uppy.opts.autoProceed,
       id: this.id,
       closeModal: this.requestCloseModal,
@@ -1004,7 +1004,7 @@ module.exports = class Dashboard extends Plugin {
       isDraggingOver: pluginState.isDraggingOver,
       handleDragOver: this.handleDragOver,
       handleDragLeave: this.handleDragLeave,
-      handleDrop: this.handleDrop
+      handleDrop: this.handleDrop,
     })
   }
 
@@ -1038,7 +1038,7 @@ module.exports = class Dashboard extends Plugin {
       targets: [],
       // We'll make them visible once .containerWidth is determined
       areInsidesReadyToBeVisible: false,
-      isDraggingOver: false
+      isDraggingOver: false,
     })
 
     const { inline, closeAfterFinish } = this.opts
@@ -1075,14 +1075,14 @@ module.exports = class Dashboard extends Plugin {
         showProgressDetails: this.opts.showProgressDetails,
         hideAfterFinish: this.opts.hideProgressAfterFinish,
         locale: this.opts.locale,
-        doneButtonHandler: this.opts.doneButtonHandler
+        doneButtonHandler: this.opts.doneButtonHandler,
       })
     }
 
     if (!this.opts.disableInformer) {
       this.uppy.use(Informer, {
         id: `${this.id}:Informer`,
-        target: this
+        target: this,
       })
     }
 
@@ -1093,7 +1093,7 @@ module.exports = class Dashboard extends Plugin {
         thumbnailType: this.opts.thumbnailType,
         waitForThumbnailsBeforeUpload: this.opts.waitForThumbnailsBeforeUpload,
         // If we don't block on thumbnails, we can lazily generate them
-        lazy: !this.opts.waitForThumbnailsBeforeUpload
+        lazy: !this.opts.waitForThumbnailsBeforeUpload,
       })
     }
 

packages/@uppy/dashboard/src/index.test.js

@@ -21,7 +21,7 @@ describe('Dashboard', () => {
     expect(() => {
       core.use(DashboardPlugin, {
         inline: true,
-        target: 'body'
+        target: 'body',
       })
     }).not.toThrow()
 
@@ -33,7 +33,7 @@ describe('Dashboard', () => {
     expect(() => {
       core.use(DashboardPlugin, {
         inline: true,
-        target: 'body'
+        target: 'body',
       })
       core.use(GoogleDrivePlugin, { target: DashboardPlugin, companionUrl: 'https://fake.uppy.io/' })
     }).not.toThrow()
@@ -49,7 +49,7 @@ describe('Dashboard', () => {
       core.use(DashboardPlugin, {
         inline: true,
         target: 'body',
-        plugins: ['GoogleDrive']
+        plugins: ['GoogleDrive'],
       })
     }).not.toThrow()
 
@@ -60,11 +60,11 @@ describe('Dashboard', () => {
     const core = new Core()
     core.use(DashboardPlugin, {
       inline: true,
-      target: 'body'
+      target: 'body',
     })
 
     core.getPlugin('Dashboard').setOptions({
-      width: 300
+      width: 300,
     })
 
     expect(
@@ -76,15 +76,15 @@ describe('Dashboard', () => {
     const core = new Core()
     core.use(DashboardPlugin, {
       inline: true,
-      target: 'body'
+      target: 'body',
     })
 
     core.setOptions({
       locale: {
         strings: {
-          myDevice: 'Май дивайс'
-        }
-      }
+          myDevice: 'Май дивайс',
+        },
+      },
     })
 
     expect(

packages/@uppy/dashboard/src/utils/copyToClipboard.js

@@ -23,7 +23,7 @@ module.exports = function copyToClipboard (textToCopy, fallbackString) {
       border: 'none',
       outline: 'none',
       boxShadow: 'none',
-      background: 'transparent'
+      background: 'transparent',
     })
 
     textArea.value = textToCopy

packages/@uppy/dashboard/src/utils/getFileTypeIcon.js

@@ -3,9 +3,9 @@ const { h } = require('preact')
 function iconImage () {
   return (
     <svg aria-hidden="true" focusable="false" width="25" height="25" viewBox="0 0 25 25">
-      <g fill="#686DE0" fill-rule="evenodd">
-        <path d="M5 7v10h15V7H5zm0-1h15a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1z" fill-rule="nonzero" />
-        <path d="M6.35 17.172l4.994-5.026a.5.5 0 0 1 .707 0l2.16 2.16 3.505-3.505a.5.5 0 0 1 .707 0l2.336 2.31-.707.72-1.983-1.97-3.505 3.505a.5.5 0 0 1-.707 0l-2.16-2.159-3.938 3.939-1.409.026z" fill-rule="nonzero" />
+      <g fill="#686DE0" fillRule="evenodd">
+        <path d="M5 7v10h15V7H5zm0-1h15a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1z" fillRule="nonzero" />
+        <path d="M6.35 17.172l4.994-5.026a.5.5 0 0 1 .707 0l2.16 2.16 3.505-3.505a.5.5 0 0 1 .707 0l2.336 2.31-.707.72-1.983-1.97-3.505 3.505a.5.5 0 0 1-.707 0l-2.16-2.159-3.938 3.939-1.409.026z" fillRule="nonzero" />
         <circle cx="7.5" cy="9.5" r="1.5" />
       </g>
     </svg>
@@ -14,24 +14,24 @@ function iconImage () {
 
 function iconAudio () {
   return (
-    <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
-      <path d="M9.5 18.64c0 1.14-1.145 2-2.5 2s-2.5-.86-2.5-2c0-1.14 1.145-2 2.5-2 .557 0 1.079.145 1.5.396V7.25a.5.5 0 0 1 .379-.485l9-2.25A.5.5 0 0 1 18.5 5v11.64c0 1.14-1.145 2-2.5 2s-2.5-.86-2.5-2c0-1.14 1.145-2 2.5-2 .557 0 1.079.145 1.5.396V8.67l-8 2v7.97zm8-11v-2l-8 2v2l8-2zM7 19.64c.855 0 1.5-.484 1.5-1s-.645-1-1.5-1-1.5.484-1.5 1 .645 1 1.5 1zm9-2c.855 0 1.5-.484 1.5-1s-.645-1-1.5-1-1.5.484-1.5 1 .645 1 1.5 1z" fill="#049BCF" fill-rule="nonzero" />
+    <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
+      <path d="M9.5 18.64c0 1.14-1.145 2-2.5 2s-2.5-.86-2.5-2c0-1.14 1.145-2 2.5-2 .557 0 1.079.145 1.5.396V7.25a.5.5 0 0 1 .379-.485l9-2.25A.5.5 0 0 1 18.5 5v11.64c0 1.14-1.145 2-2.5 2s-2.5-.86-2.5-2c0-1.14 1.145-2 2.5-2 .557 0 1.079.145 1.5.396V8.67l-8 2v7.97zm8-11v-2l-8 2v2l8-2zM7 19.64c.855 0 1.5-.484 1.5-1s-.645-1-1.5-1-1.5.484-1.5 1 .645 1 1.5 1zm9-2c.855 0 1.5-.484 1.5-1s-.645-1-1.5-1-1.5.484-1.5 1 .645 1 1.5 1z" fill="#049BCF" fillRule="nonzero" />
     </svg>
   )
 }
 
 function iconVideo () {
   return (
-    <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
-      <path d="M16 11.834l4.486-2.691A1 1 0 0 1 22 10v6a1 1 0 0 1-1.514.857L16 14.167V17a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v2.834zM15 9H5v8h10V9zm1 4l5 3v-6l-5 3z" fill="#19AF67" fill-rule="nonzero" />
+    <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
+      <path d="M16 11.834l4.486-2.691A1 1 0 0 1 22 10v6a1 1 0 0 1-1.514.857L16 14.167V17a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v2.834zM15 9H5v8h10V9zm1 4l5 3v-6l-5 3z" fill="#19AF67" fillRule="nonzero" />
     </svg>
   )
 }
 
 function iconPDF () {
   return (
-    <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
-      <path d="M9.766 8.295c-.691-1.843-.539-3.401.747-3.726 1.643-.414 2.505.938 2.39 3.299-.039.79-.194 1.662-.537 3.148.324.49.66.967 1.055 1.51.17.231.382.488.629.757 1.866-.128 3.653.114 4.918.655 1.487.635 2.192 1.685 1.614 2.84-.566 1.133-1.839 1.084-3.416.249-1.141-.604-2.457-1.634-3.51-2.707a13.467 13.467 0 0 0-2.238.426c-1.392 4.051-4.534 6.453-5.707 4.572-.986-1.58 1.38-4.206 4.914-5.375.097-.322.185-.656.264-1.001.08-.353.306-1.31.407-1.737-.678-1.059-1.2-2.031-1.53-2.91zm2.098 4.87c-.033.144-.068.287-.104.427l.033-.01-.012.038a14.065 14.065 0 0 1 1.02-.197l-.032-.033.052-.004a7.902 7.902 0 0 1-.208-.271c-.197-.27-.38-.526-.555-.775l-.006.028-.002-.003c-.076.323-.148.632-.186.8zm5.77 2.978c1.143.605 1.832.632 2.054.187.26-.519-.087-1.034-1.113-1.473-.911-.39-2.175-.608-3.55-.608.845.766 1.787 1.459 2.609 1.894zM6.559 18.789c.14.223.693.16 1.425-.413.827-.648 1.61-1.747 2.208-3.206-2.563 1.064-4.102 2.867-3.633 3.62zm5.345-10.97c.088-1.793-.351-2.48-1.146-2.28-.473.119-.564 1.05-.056 2.405.213.566.52 1.188.908 1.859.18-.858.268-1.453.294-1.984z" fill="#E2514A" fill-rule="nonzero" />
+    <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
+      <path d="M9.766 8.295c-.691-1.843-.539-3.401.747-3.726 1.643-.414 2.505.938 2.39 3.299-.039.79-.194 1.662-.537 3.148.324.49.66.967 1.055 1.51.17.231.382.488.629.757 1.866-.128 3.653.114 4.918.655 1.487.635 2.192 1.685 1.614 2.84-.566 1.133-1.839 1.084-3.416.249-1.141-.604-2.457-1.634-3.51-2.707a13.467 13.467 0 0 0-2.238.426c-1.392 4.051-4.534 6.453-5.707 4.572-.986-1.58 1.38-4.206 4.914-5.375.097-.322.185-.656.264-1.001.08-.353.306-1.31.407-1.737-.678-1.059-1.2-2.031-1.53-2.91zm2.098 4.87c-.033.144-.068.287-.104.427l.033-.01-.012.038a14.065 14.065 0 0 1 1.02-.197l-.032-.033.052-.004a7.902 7.902 0 0 1-.208-.271c-.197-.27-.38-.526-.555-.775l-.006.028-.002-.003c-.076.323-.148.632-.186.8zm5.77 2.978c1.143.605 1.832.632 2.054.187.26-.519-.087-1.034-1.113-1.473-.911-.39-2.175-.608-3.55-.608.845.766 1.787 1.459 2.609 1.894zM6.559 18.789c.14.223.693.16 1.425-.413.827-.648 1.61-1.747 2.208-3.206-2.563 1.064-4.102 2.867-3.633 3.62zm5.345-10.97c.088-1.793-.351-2.48-1.146-2.28-.473.119-.564 1.05-.056 2.405.213.566.52 1.188.908 1.859.18-.858.268-1.453.294-1.984z" fill="#E2514A" fillRule="nonzero" />
     </svg>
   )
 }
@@ -39,15 +39,15 @@ function iconPDF () {
 function iconArchive () {
   return (
     <svg aria-hidden="true" focusable="false" width="25" height="25" viewBox="0 0 25 25">
-      <path d="M10.45 2.05h1.05a.5.5 0 0 1 .5.5v.024a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5V2.55a.5.5 0 0 1 .5-.5zm2.05 1.024h1.05a.5.5 0 0 1 .5.5V3.6a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5v-.001zM10.45 0h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5V.5a.5.5 0 0 1 .5-.5zm2.05 1.025h1.05a.5.5 0 0 1 .5.5v.024a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.024a.5.5 0 0 1 .5-.5zm-2.05 3.074h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5zm2.05 1.025h1.05a.5.5 0 0 1 .5.5v.024a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.024a.5.5 0 0 1 .5-.5zm-2.05 1.024h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5zm2.05 1.025h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5zm-2.05 1.025h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5zm2.05 1.025h1.05a.5.5 0 0 1 .5.5v.024a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.024a.5.5 0 0 1 .5-.5zm-1.656 3.074l-.82 5.946c.52.302 1.174.458 1.976.458.803 0 1.455-.156 1.975-.458l-.82-5.946h-2.311zm0-1.025h2.312c.512 0 .946.378 1.015.885l.82 5.946c.056.412-.142.817-.501 1.026-.686.398-1.515.597-2.49.597-.974 0-1.804-.199-2.49-.597a1.025 1.025 0 0 1-.5-1.026l.819-5.946c.07-.507.503-.885 1.015-.885zm.545 6.6a.5.5 0 0 1-.397-.561l.143-.999a.5.5 0 0 1 .495-.429h.74a.5.5 0 0 1 .495.43l.143.998a.5.5 0 0 1-.397.561c-.404.08-.819.08-1.222 0z" fill="#00C469" fill-rule="nonzero" />
+      <path d="M10.45 2.05h1.05a.5.5 0 0 1 .5.5v.024a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5V2.55a.5.5 0 0 1 .5-.5zm2.05 1.024h1.05a.5.5 0 0 1 .5.5V3.6a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5v-.001zM10.45 0h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5V.5a.5.5 0 0 1 .5-.5zm2.05 1.025h1.05a.5.5 0 0 1 .5.5v.024a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.024a.5.5 0 0 1 .5-.5zm-2.05 3.074h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5zm2.05 1.025h1.05a.5.5 0 0 1 .5.5v.024a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.024a.5.5 0 0 1 .5-.5zm-2.05 1.024h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5zm2.05 1.025h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5zm-2.05 1.025h1.05a.5.5 0 0 1 .5.5v.025a.5.5 0 0 1-.5.5h-1.05a.5.5 0 0 1-.5-.5v-.025a.5.5 0 0 1 .5-.5zm2.05 1.025h1.05a.5.5 0 0 1 .5.5v.024a.5.5 0 0 1-.5.5H12.5a.5.5 0 0 1-.5-.5v-.024a.5.5 0 0 1 .5-.5zm-1.656 3.074l-.82 5.946c.52.302 1.174.458 1.976.458.803 0 1.455-.156 1.975-.458l-.82-5.946h-2.311zm0-1.025h2.312c.512 0 .946.378 1.015.885l.82 5.946c.056.412-.142.817-.501 1.026-.686.398-1.515.597-2.49.597-.974 0-1.804-.199-2.49-.597a1.025 1.025 0 0 1-.5-1.026l.819-5.946c.07-.507.503-.885 1.015-.885zm.545 6.6a.5.5 0 0 1-.397-.561l.143-.999a.5.5 0 0 1 .495-.429h.74a.5.5 0 0 1 .495.43l.143.998a.5.5 0 0 1-.397.561c-.404.08-.819.08-1.222 0z" fill="#00C469" fillRule="nonzero" />
     </svg>
   )
 }
 
 function iconFile () {
   return (
-    <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
-      <g fill="#A7AFB7" fill-rule="nonzero">
+    <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
+      <g fill="#A7AFB7" fillRule="nonzero">
         <path d="M5.5 22a.5.5 0 0 1-.5-.5v-18a.5.5 0 0 1 .5-.5h10.719a.5.5 0 0 1 .367.16l3.281 3.556a.5.5 0 0 1 .133.339V21.5a.5.5 0 0 1-.5.5h-14zm.5-1h13V7.25L16 4H6v17z" />
         <path d="M15 4v3a1 1 0 0 0 1 1h3V7h-3V4h-1z" />
       </g>
@@ -57,8 +57,8 @@ function iconFile () {
 
 function iconText () {
   return (
-    <svg aria-hidden="true" focusable="false" class="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
-      <path d="M4.5 7h13a.5.5 0 1 1 0 1h-13a.5.5 0 0 1 0-1zm0 3h15a.5.5 0 1 1 0 1h-15a.5.5 0 1 1 0-1zm0 3h15a.5.5 0 1 1 0 1h-15a.5.5 0 1 1 0-1zm0 3h10a.5.5 0 1 1 0 1h-10a.5.5 0 1 1 0-1z" fill="#5A5E69" fill-rule="nonzero" />
+    <svg aria-hidden="true" focusable="false" className="uppy-c-icon" width="25" height="25" viewBox="0 0 25 25">
+      <path d="M4.5 7h13a.5.5 0 1 1 0 1h-13a.5.5 0 0 1 0-1zm0 3h15a.5.5 0 1 1 0 1h-15a.5.5 0 1 1 0-1zm0 3h15a.5.5 0 1 1 0 1h-15a.5.5 0 1 1 0-1zm0 3h10a.5.5 0 1 1 0 1h-10a.5.5 0 1 1 0-1z" fill="#5A5E69" fillRule="nonzero" />
     </svg>
   )
 }
@@ -66,7 +66,7 @@ function iconText () {
 module.exports = function getIconByMime (fileType) {
   const defaultChoice = {
     color: '#838999',
-    icon: iconFile()
+    icon: iconFile(),
   }
 
   if (!fileType) return defaultChoice
@@ -78,7 +78,7 @@ module.exports = function getIconByMime (fileType) {
   if (fileTypeGeneral === 'text') {
     return {
       color: '#5a5e69',
-      icon: iconText()
+      icon: iconText(),
     }
   }
 
@@ -86,7 +86,7 @@ module.exports = function getIconByMime (fileType) {
   if (fileTypeGeneral === 'image') {
     return {
       color: '#686de0',
-      icon: iconImage()
+      icon: iconImage(),
     }
   }
 
@@ -94,7 +94,7 @@ module.exports = function getIconByMime (fileType) {
   if (fileTypeGeneral === 'audio') {
     return {
       color: '#068dbb',
-      icon: iconAudio()
+      icon: iconAudio(),
     }
   }
 
@@ -102,7 +102,7 @@ module.exports = function getIconByMime (fileType) {
   if (fileTypeGeneral === 'video') {
     return {
       color: '#19af67',
-      icon: iconVideo()
+      icon: iconVideo(),
     }
   }
 
@@ -110,7 +110,7 @@ module.exports = function getIconByMime (fileType) {
   if (fileTypeGeneral === 'application' && fileTypeSpecific === 'pdf') {
     return {
       color: '#e25149',
-      icon: iconPDF()
+      icon: iconPDF(),
     }
   }
 
@@ -119,7 +119,7 @@ module.exports = function getIconByMime (fileType) {
   if (fileTypeGeneral === 'application' && archiveTypes.indexOf(fileTypeSpecific) !== -1) {
     return {
       color: '#00C469',
-      icon: iconArchive()
+      icon: iconArchive(),
     }
   }
 

packages/@uppy/dashboard/src/utils/ignoreEvent.js

@@ -5,8 +5,8 @@
 
 function ignoreEvent (ev) {
   const tagName = ev.target.tagName
-  if (tagName === 'INPUT' ||
-      tagName === 'TEXTAREA') {
+  if (tagName === 'INPUT'
+      || tagName === 'TEXTAREA') {
     ev.stopPropagation()
     return
   }

packages/@uppy/dashboard/src/utils/trapFocus.js

@@ -61,5 +61,5 @@ module.exports = {
       // User can close the overlay (click 'Done') if they want to travel away from Uppy.
       trapFocus(event, activeOverlayType, dashboardEl)
     }
-  }
+  },
 }

packages/@uppy/drag-drop/src/index.js

@@ -21,8 +21,8 @@ module.exports = class DragDrop extends Plugin {
     this.defaultLocale = {
       strings: {
         dropHereOr: 'Drop files here or %{browse}',
-        browse: 'browse'
-      }
+        browse: 'browse',
+      },
     }
 
     // Default options
@@ -31,7 +31,7 @@ module.exports = class DragDrop extends Plugin {
       inputName: 'files[]',
       width: '100%',
       height: '100%',
-      note: null
+      note: null,
     }
 
     // Merge default options with the ones set by user
@@ -73,8 +73,8 @@ module.exports = class DragDrop extends Plugin {
       meta: {
         // path of the file relative to the ancestor directory the user selected.
         // e.g. 'docs/Old Prague/airbnb.pdf'
-        relativePath: file.relativePath || null
-      }
+        relativePath: file.relativePath || null,
+      },
     }))
 
     try {
@@ -142,31 +142,31 @@ module.exports = class DragDrop extends Plugin {
     const restrictions = this.uppy.opts.restrictions
     return (
       <input
-        class="uppy-DragDrop-input"
+        className="uppy-DragDrop-input"
         type="file"
         hidden
         ref={(ref) => { this.fileInputRef = ref }}
         name={this.opts.inputName}
         multiple={restrictions.maxNumberOfFiles !== 1}
         accept={restrictions.allowedFileTypes}
-        onchange={this.onInputChange}
+        onChange={this.onInputChange}
       />
     )
   }
 
   renderArrowSvg () {
     return (
-      <svg aria-hidden="true" focusable="false" class="uppy-c-icon uppy-DragDrop-arrow" width="16" height="16" viewBox="0 0 16 16">
-        <path d="M11 10V0H5v10H2l6 6 6-6h-3zm0 0" fill-rule="evenodd" />
+      <svg aria-hidden="true" focusable="false" className="uppy-c-icon uppy-DragDrop-arrow" width="16" height="16" viewBox="0 0 16 16">
+        <path d="M11 10V0H5v10H2l6 6 6-6h-3zm0 0" fillRule="evenodd" />
       </svg>
     )
   }
 
   renderLabel () {
     return (
-      <div class="uppy-DragDrop-label">
+      <div className="uppy-DragDrop-label">
         {this.i18nArray('dropHereOr', {
-          browse: <span class="uppy-DragDrop-browse">{this.i18n('browse')}</span>
+          browse: <span className="uppy-DragDrop-browse">{this.i18n('browse')}</span>,
         })}
       </div>
     )
@@ -174,7 +174,7 @@ module.exports = class DragDrop extends Plugin {
 
   renderNote () {
     return (
-      <span class="uppy-DragDrop-note">{this.opts.note}</span>
+      <span className="uppy-DragDrop-note">{this.opts.note}</span>
     )
   }
 
@@ -188,13 +188,13 @@ module.exports = class DragDrop extends Plugin {
 
     const dragDropStyle = {
       width: this.opts.width,
-      height: this.opts.height
+      height: this.opts.height,
     }
 
     return (
       <button
         type="button"
-        class={dragDropClass}
+        className={dragDropClass}
         style={dragDropStyle}
         onClick={() => this.fileInputRef.click()}
         onDragOver={this.handleDragOver}
@@ -202,7 +202,7 @@ module.exports = class DragDrop extends Plugin {
         onDrop={this.handleDrop}
       >
         {this.renderHiddenFileInput()}
-        <div class="uppy-DragDrop-inner">
+        <div className="uppy-DragDrop-inner">
           {this.renderArrowSvg()}
           {this.renderLabel()}
           {this.renderNote()}
@@ -213,7 +213,7 @@ module.exports = class DragDrop extends Plugin {
 
   install () {
     this.setPluginState({
-      isDraggingOver: false
+      isDraggingOver: false,
     })
     const target = this.opts.target
     if (target) {

packages/@uppy/dropbox/src/index.js

@@ -13,9 +13,9 @@ module.exports = class Dropbox extends Plugin {
     this.title = this.opts.title || 'Dropbox'
     this.icon = () => (
       <svg aria-hidden="true" focusable="false" width="32" height="32" viewBox="0 0 32 32">
-        <g fill="none" fill-rule="evenodd">
-          <rect class="uppy-ProviderIconBg" fill="#0D2481" width="32" height="32" rx="16" />
-          <path d="M11 8l5 3.185-5 3.186-5-3.186L11 8zm10 0l5 3.185-5 3.186-5-3.186L21 8zM6 17.556l5-3.185 5 3.185-5 3.186-5-3.186zm15-3.185l5 3.185-5 3.186-5-3.186 5-3.185zm-10 7.432l5-3.185 5 3.185-5 3.186-5-3.186z" fill="#FFF" fill-rule="nonzero" />
+        <g fill="none" fillRule="evenodd">
+          <rect className="uppy-ProviderIconBg" fill="#0D2481" width="32" height="32" rx="16" />
+          <path d="M11 8l5 3.185-5 3.186-5-3.186L11 8zm10 0l5 3.185-5 3.186-5-3.186L21 8zM6 17.556l5-3.185 5 3.185-5 3.186-5-3.186zm15-3.185l5 3.185-5 3.186-5-3.186 5-3.185zm-10 7.432l5-3.185 5 3.185-5 3.186-5-3.186z" fill="#FFF" fillRule="nonzero" />
         </g>
       </svg>
     )
@@ -26,7 +26,7 @@ module.exports = class Dropbox extends Plugin {
       companionKeysParams: this.opts.companionKeysParams,
       companionCookiesRule: this.opts.companionCookiesRule,
       provider: 'dropbox',
-      pluginId: this.id
+      pluginId: this.id,
     })
 
     this.onFirstRender = this.onFirstRender.bind(this)
@@ -35,7 +35,7 @@ module.exports = class Dropbox extends Plugin {
 
   install () {
     this.view = new ProviderViews(this, {
-      provider: this.provider
+      provider: this.provider,
     })
 
     const target = this.opts.target
@@ -52,7 +52,7 @@ module.exports = class Dropbox extends Plugin {
   onFirstRender () {
     return Promise.all([
       this.provider.fetchPreAuthToken(),
-      this.view.getFolder()
+      this.view.getFolder(),
     ])
   }
 

packages/@uppy/facebook/src/index.js

@@ -13,9 +13,9 @@ module.exports = class Facebook extends Plugin {
     this.title = this.opts.title || 'Facebook'
     this.icon = () => (
       <svg aria-hidden="true" focusable="false" width="32" height="32" viewBox="0 0 32 32">
-        <g fill="none" fill-rule="evenodd">
-          <rect class="uppy-ProviderIconBg" width="32" height="32" rx="16" fill="#3C5A99" />
-          <path d="M17.842 26v-8.667h2.653l.398-3.377h-3.051v-2.157c0-.978.248-1.644 1.527-1.644H21V7.132A19.914 19.914 0 0 0 18.623 7c-2.352 0-3.963 1.574-3.963 4.465v2.49H12v3.378h2.66V26h3.182z" fill="#FFF" fill-rule="nonzero" />
+        <g fill="none" fillRule="evenodd">
+          <rect className="uppy-ProviderIconBg" width="32" height="32" rx="16" fill="#3C5A99" />
+          <path d="M17.842 26v-8.667h2.653l.398-3.377h-3.051v-2.157c0-.978.248-1.644 1.527-1.644H21V7.132A19.914 19.914 0 0 0 18.623 7c-2.352 0-3.963 1.574-3.963 4.465v2.49H12v3.378h2.66V26h3.182z" fill="#FFF" fillRule="nonzero" />
         </g>
       </svg>
     )
@@ -26,7 +26,7 @@ module.exports = class Facebook extends Plugin {
       companionKeysParams: this.opts.companionKeysParams,
       companionCookiesRule: this.opts.companionCookiesRule,
       provider: 'facebook',
-      pluginId: this.id
+      pluginId: this.id,
     })
 
     this.onFirstRender = this.onFirstRender.bind(this)
@@ -35,7 +35,7 @@ module.exports = class Facebook extends Plugin {
 
   install () {
     this.view = new ProviderViews(this, {
-      provider: this.provider
+      provider: this.provider,
     })
 
     const target = this.opts.target
@@ -52,7 +52,7 @@ module.exports = class Facebook extends Plugin {
   onFirstRender () {
     return Promise.all([
       this.provider.fetchPreAuthToken(),
-      this.view.getFolder()
+      this.view.getFolder(),
     ])
   }
 

packages/@uppy/file-input/src/index.js

@@ -17,15 +17,15 @@ module.exports = class FileInput extends Plugin {
         // The same key is used for the same purpose by @uppy/robodog's `form()` API, but our
         // locale pack scripts can't access it in Robodog. If it is updated here, it should
         // also be updated there!
-        chooseFiles: 'Choose files'
-      }
+        chooseFiles: 'Choose files',
+      },
     }
 
     // Default options
     const defaultOptions = {
       target: null,
       pretty: true,
-      inputName: 'files[]'
+      inputName: 'files[]',
     }
 
     // Merge default options with the ones set by user
@@ -55,7 +55,7 @@ module.exports = class FileInput extends Plugin {
       source: this.id,
       name: file.name,
       type: file.type,
-      data: file
+      data: file,
     }))
 
     try {
@@ -91,32 +91,34 @@ module.exports = class FileInput extends Plugin {
       opacity: 0,
       overflow: 'hidden',
       position: 'absolute',
-      zIndex: -1
+      zIndex: -1,
     }
 
     const restrictions = this.uppy.opts.restrictions
     const accept = restrictions.allowedFileTypes ? restrictions.allowedFileTypes.join(',') : null
 
     return (
-      <div class="uppy-Root uppy-FileInput-container">
+      <div className="uppy-Root uppy-FileInput-container">
         <input
-          class="uppy-FileInput-input"
+          className="uppy-FileInput-input"
           style={this.opts.pretty && hiddenInputStyle}
           type="file"
           name={this.opts.inputName}
-          onchange={this.handleInputChange}
+          onChange={this.handleInputChange}
           multiple={restrictions.maxNumberOfFiles !== 1}
           accept={accept}
           ref={(input) => { this.input = input }}
         />
-        {this.opts.pretty &&
+        {this.opts.pretty
+          && (
           <button
-            class="uppy-FileInput-btn"
+            className="uppy-FileInput-btn"
             type="button"
-            onclick={this.handleClick}
+            onClick={this.handleClick}
           >
             {this.i18n('chooseFiles')}
-          </button>}
+          </button>
+          )}
       </div>
     )
   }

packages/@uppy/form/src/index.js

@@ -25,7 +25,7 @@ module.exports = class Form extends Plugin {
       addResultToForm: true,
       multipleResults: false,
       submitOnSuccess: false,
-      triggerUploadOnSubmit: false
+      triggerUploadOnSubmit: false,
     }
 
     // merge default options with the ones set by user

packages/@uppy/golden-retriever/src/IndexedDBStore.js

@@ -1,6 +1,7 @@
 const prettierBytes = require('@transloadit/prettier-bytes')
-const indexedDB = typeof window !== 'undefined' &&
-  (window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.OIndexedDB || window.msIndexedDB)
+
+const indexedDB = typeof window !== 'undefined'
+  && (window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.OIndexedDB || window.msIndexedDB)
 
 const isSupported = !!indexedDB
 
@@ -67,13 +68,14 @@ function waitForRequest (request) {
 let cleanedUp = false
 class IndexedDBStore {
   constructor (opts) {
-    this.opts = Object.assign({
+    this.opts = {
       dbName: DB_NAME,
       storeName: 'default',
       expires: DEFAULT_EXPIRY, // 24 hours
       maxFileSize: 10 * 1024 * 1024, // 10 MB
-      maxTotalSize: 300 * 1024 * 1024 // 300 MB
-    }, opts)
+      maxTotalSize: 300 * 1024 * 1024, // 300 MB
+      ...opts,
+    }
 
     this.name = this.opts.storeName
 
@@ -124,7 +126,7 @@ class IndexedDBStore {
       return waitForRequest(request)
     }).then((result) => ({
       id: result.data.fileID,
-      data: result.data.data
+      data: result.data.data,
     }))
   }
 
@@ -176,7 +178,7 @@ class IndexedDBStore {
         fileID: file.id,
         store: this.name,
         expires: Date.now() + this.opts.expires,
-        data: file.data
+        data: file.data,
       })
       return waitForRequest(request)
     })
@@ -212,7 +214,8 @@ class IndexedDBStore {
             console.log(
               '[IndexedDBStore] Deleting record', entry.fileID,
               'of size', prettierBytes(entry.data.size),
-              '- expired on', new Date(entry.expires))
+              '- expired on', new Date(entry.expires)
+            )
             cursor.delete() // Ignoring return value … it's not terrible if this goes wrong.
             cursor.continue()
           } else {

packages/@uppy/golden-retriever/src/MetaDataStore.js

@@ -26,9 +26,10 @@ function maybeParse (str) {
 let cleanedUp = false
 module.exports = class MetaDataStore {
   constructor (opts) {
-    this.opts = Object.assign({
-      expires: 24 * 60 * 60 * 1000 // 24 hours
-    }, opts)
+    this.opts = {
+      expires: 24 * 60 * 60 * 1000, // 24 hours
+      ...opts,
+    }
     this.name = `uppyState:${opts.storeName}`
 
     if (!cleanedUp) {
@@ -60,7 +61,7 @@ module.exports = class MetaDataStore {
     const expires = Date.now() + this.opts.expires
     const state = JSON.stringify({
       metadata,
-      expires
+      expires,
     })
     localStorage.setItem(this.name, state)
   }