@uppy/dashboard - npm Package Compare versions

Comparing version 0.27.5 to 0.28.0

lib/components/PanelTopBar.js

 var _require = require('preact'),
     h = _require.h;
 
-function DashboardContentTitle(props) {
-  if (props.newFiles.length) {
-    return props.i18n('xFilesSelected', { smart_count: props.newFiles.length });
+var uploadStates = {
+  'STATE_ERROR': 'error',
+  'STATE_WAITING': 'waiting',
+  'STATE_PREPROCESSING': 'preprocessing',
+  'STATE_UPLOADING': 'uploading',
+  'STATE_POSTPROCESSING': 'postprocessing',
+  'STATE_COMPLETE': 'complete',
+  'STATE_PAUSED': 'paused'
+};
+
+function getUploadingState(isAllErrored, isAllComplete, isAllPaused) {
+  var files = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
+
+  if (isAllErrored) {
+    return uploadStates.STATE_ERROR;
   }
+
+  if (isAllComplete) {
+    return uploadStates.STATE_COMPLETE;
+  }
+
+  if (isAllPaused) {
+    return uploadStates.STATE_PAUSED;
+  }
+
+  var state = uploadStates.STATE_WAITING;
+  var fileIDs = Object.keys(files);
+  for (var i = 0; i < fileIDs.length; i++) {
+    var progress = files[fileIDs[i]].progress;
+    // If ANY files are being uploaded right now, show the uploading state.
+    if (progress.uploadStarted && !progress.uploadComplete) {
+      return uploadStates.STATE_UPLOADING;
+    }
+    // If files are being preprocessed AND postprocessed at this time, we show the
+    // preprocess state. If any files are being uploaded we show uploading.
+    if (progress.preprocess && state !== uploadStates.STATE_UPLOADING) {
+      state = uploadStates.STATE_PREPROCESSING;
+    }
+    // If NO files are being preprocessed or uploaded right now, but some files are
+    // being postprocessed, show the postprocess state.
+    if (progress.postprocess && state !== uploadStates.STATE_UPLOADING && state !== uploadStates.STATE_PREPROCESSING) {
+      state = uploadStates.STATE_POSTPROCESSING;
+    }
+  }
+  return state;
 }
 
+function UploadStatus(props) {
+  var uploadingState = getUploadingState(props.isAllErrored, props.isAllComplete, props.isAllPaused, props.files);
+
+  switch (uploadingState) {
+    case 'uploading':
+      return props.i18n('uploadingXFiles', { smart_count: props.inProgressNotPausedFiles.length });
+    case 'preprocessing':
+    case 'postprocessing':
+      return props.i18n('processingXFiles', { smart_count: props.processingFiles.length });
+    case 'paused':
+      return props.i18n('uploadPaused');
+    case 'waiting':
+      return props.i18n('xFilesSelected', { smart_count: props.newFiles.length });
+    case 'complete':
+      return props.i18n('uploadComplete');
+  }
+}
+
 function PanelTopBar(props) {
-  var notOverFileLimit = props.maxNumberOfFiles ? props.totalFileCount < props.maxNumberOfFiles : true;
+  var allowNewUpload = props.allowNewUpload;
+  // TODO maybe this should be done in ../index.js, then just pass that down as `allowNewUpload`
+  if (allowNewUpload && props.maxNumberOfFiles) {
+    allowNewUpload = props.totalFileCount < props.maxNumberOfFiles;
+  }
 
@@ -17,7 +80,11 @@ return h(
     h(
-      'button',
-      { 'class': 'uppy-DashboardContent-back',
-        type: 'button',
-        onclick: props.cancelAll },
-      props.i18n('cancel')
+      'div',
+      null,
+      !props.isAllComplete ? h(
+        'button',
+        { 'class': 'uppy-DashboardContent-back',
+          type: 'button',
+          onclick: props.cancelAll },
+        props.i18n('cancel')
+      ) : null
     ),
@@ -27,5 +94,5 @@ h(
       { 'class': 'uppy-DashboardContent-title', role: 'heading', 'aria-level': 'h1' },
-      h(DashboardContentTitle, props)
+      h(UploadStatus, props)
     ),
-    notOverFileLimit && h(
+    allowNewUpload && h(
       'button',
@@ -32,0 +99,0 @@ { 'class': 'uppy-DashboardContent-addMore',

lib/index.js

@@ -20,3 +20,3 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 var toArray = require('@uppy/utils/lib/toArray');
-var prettyBytes = require('prettier-bytes');
+// const prettyBytes = require('prettier-bytes')
 var ResizeObserver = require('resize-observer-polyfill').default || require('resize-observer-polyfill');
@@ -87,2 +87,3 @@
         uploadComplete: 'Upload complete',
+        uploadPaused: 'Upload paused',
         resumeUpload: 'Resume upload',
@@ -100,2 +101,10 @@ pauseUpload: 'Pause upload',
         },
+        uploadingXFiles: {
+          0: 'Uploading %{smart_count} file',
+          1: 'Uploading %{smart_count} files'
+        },
+        processingXFiles: {
+          0: 'Processing %{smart_count} file',
+          1: 'Processing %{smart_count} files'
+        },
         uploadXNewFiles: {
@@ -129,2 +138,3 @@ 0: 'Upload +%{smart_count} file',
       closeModalOnClickOutside: false,
+      closeAfterFinish: false,
       disableStatusBar: false,
@@ -140,3 +150,3 @@ disableInformer: false,
       showSelectedFiles: true,
-      locale: defaultLocale,
+      // locale: defaultLocale,
       browserBackButtonClose: false
@@ -147,6 +157,4 @@
 
-    _this.locale = _extends({}, defaultLocale, _this.opts.locale);
-    _this.locale.strings = _extends({}, defaultLocale.strings, _this.opts.locale.strings);
-
-    _this.translator = new Translator({ locale: _this.locale });
+    // i18n
+    _this.translator = new Translator([defaultLocale, _this.uppy.locale, _this.opts.locale]);
     _this.i18n = _this.translator.translate.bind(_this.translator);
@@ -170,3 +178,5 @@ _this.i18nArray = _this.translator.translateArray.bind(_this.translator);
     _this.initEvents = _this.initEvents.bind(_this);
-    _this.onKeydown = _this.onKeydown.bind(_this);
+    _this.handleKeyDown = _this.handleKeyDown.bind(_this);
+    _this.handleFileAdded = _this.handleFileAdded.bind(_this);
+    _this.handleComplete = _this.handleComplete.bind(_this);
     _this.handleClickOutside = _this.handleClickOutside.bind(_this);
@@ -341,3 +351,3 @@ _this.toggleFileCard = _this.toggleFileCard.bind(_this);
     // handle ESC and TAB keys in modal dialog
-    document.addEventListener('keydown', this.onKeydown);
+    document.addEventListener('keydown', this.handleKeyDown);
 
@@ -379,3 +389,3 @@ // this.rerender(this.uppy.getState())
     // handle ESC and TAB keys in modal dialog
-    document.removeEventListener('keydown', this.onKeydown);
+    document.removeEventListener('keydown', this.handleKeyDown);
 
@@ -399,3 +409,3 @@ this.savedActiveElement.focus();
 
-  Dashboard.prototype.onKeydown = function onKeydown(event) {
+  Dashboard.prototype.handleKeyDown = function handleKeyDown(event) {
     // close modal on esc key press
@@ -510,8 +520,20 @@ if (event.keyCode === ESC_KEY) this.requestCloseModal(event);
     this.uppy.on('plugin-remove', this.removeTarget);
-    this.uppy.on('file-added', function (ev) {
-      _this6.toggleAddFilesPanel(false);
-      _this6.hideAllPanels();
-    });
+    this.uppy.on('file-added', this.handleFileAdded);
+    this.uppy.on('complete', this.handleComplete);
   };
 
+  Dashboard.prototype.handleFileAdded = function handleFileAdded() {
+    this.hideAllPanels();
+  };
+
+  Dashboard.prototype.handleComplete = function handleComplete(_ref2) {
+    var failed = _ref2.failed,
+        uploadID = _ref2.uploadID;
+
+    if (this.opts.closeAfterFinish && failed.length === 0) {
+      // All uploads are done
+      this.requestCloseModal();
+    }
+  };
+
   Dashboard.prototype.removeEvents = function removeEvents() {
@@ -533,5 +555,4 @@ var _this7 = this;
     this.uppy.off('plugin-remove', this.removeTarget);
-    this.uppy.off('file-added', function (ev) {
-      return _this7.toggleAddFilesPanel(false);
-    });
+    this.uppy.off('file-added', this.handleFileAdded);
+    this.uppy.off('complete', this.handleComplete);
   };
@@ -575,4 +596,7 @@
     var files = state.files,
-        capabilities = state.capabilities;
+        capabilities = state.capabilities,
+        allowNewUpload = state.allowNewUpload;
 
+    // TODO: move this to Core, to share between Status Bar and Dashboard
+    // (and any other plugin that might need it, too)
 
@@ -582,20 +606,57 @@ var newFiles = Object.keys(files).filter(function (file) {
     });
+
+    var uploadStartedFiles = Object.keys(files).filter(function (file) {
+      return files[file].progress.uploadStarted;
+    });
+
+    var pausedFiles = Object.keys(files).filter(function (file) {
+      return files[file].isPaused;
+    });
+
+    var completeFiles = Object.keys(files).filter(function (file) {
+      return files[file].progress.uploadComplete;
+    });
+
+    var erroredFiles = Object.keys(files).filter(function (file) {
+      return files[file].error;
+    });
+
     var inProgressFiles = Object.keys(files).filter(function (file) {
-      return !files[file].progress.uploadComplete && files[file].progress.uploadStarted && !files[file].isPaused;
+      return !files[file].progress.uploadComplete && files[file].progress.uploadStarted;
     });
 
-    var inProgressFilesArray = [];
-    inProgressFiles.forEach(function (file) {
-      inProgressFilesArray.push(files[file]);
+    var inProgressNotPausedFiles = inProgressFiles.filter(function (file) {
+      return !files[file].isPaused;
     });
 
-    var totalSize = 0;
-    var totalUploadedSize = 0;
-    inProgressFilesArray.forEach(function (file) {
-      totalSize = totalSize + (file.progress.bytesTotal || 0);
-      totalUploadedSize = totalUploadedSize + (file.progress.bytesUploaded || 0);
+    var processingFiles = Object.keys(files).filter(function (file) {
+      return files[file].progress.preprocess || files[file].progress.postprocess;
     });
-    totalSize = prettyBytes(totalSize);
-    totalUploadedSize = prettyBytes(totalUploadedSize);
 
+    var isUploadStarted = uploadStartedFiles.length > 0;
+
+    var isAllComplete = state.totalProgress === 100 && completeFiles.length === Object.keys(files).length && processingFiles.length === 0;
+
+    var isAllErrored = isUploadStarted && erroredFiles.length === uploadStartedFiles.length;
+
+    var isAllPaused = inProgressFiles.length !== 0 && pausedFiles.length === inProgressFiles.length;
+    // const isAllPaused = inProgressNotPausedFiles.length === 0 &&
+    //   !isAllComplete &&
+    //   !isAllErrored &&
+    //   uploadStartedFiles.length > 0
+
+    // let inProgressNotPausedFilesArray = []
+    // inProgressNotPausedFiles.forEach((file) => {
+    //   inProgressNotPausedFilesArray.push(files[file])
+    // })
+
+    // let totalSize = 0
+    // let totalUploadedSize = 0
+    // inProgressNotPausedFilesArray.forEach((file) => {
+    //   totalSize = totalSize + (file.progress.bytesTotal || 0)
+    //   totalUploadedSize = totalUploadedSize + (file.progress.bytesUploaded || 0)
+    // })
+    // totalSize = prettyBytes(totalSize)
+    // totalUploadedSize = prettyBytes(totalUploadedSize)
+
     var attachRenderFunctionToTarget = function attachRenderFunctionToTarget(target) {
@@ -634,3 +695,2 @@ var plugin = _this9.uppy.getPlugin(target.id);
     var cancelUpload = function cancelUpload(fileID) {
-      _this9.uppy.emit('upload-cancel', fileID);
       _this9.uppy.removeFile(fileID);
@@ -647,6 +707,17 @@ };
       modal: pluginState,
+      files: files,
       newFiles: newFiles,
-      files: files,
+      uploadStartedFiles: uploadStartedFiles,
+      completeFiles: completeFiles,
+      erroredFiles: erroredFiles,
+      inProgressFiles: inProgressFiles,
+      inProgressNotPausedFiles: inProgressNotPausedFiles,
+      processingFiles: processingFiles,
+      isUploadStarted: isUploadStarted,
+      isAllComplete: isAllComplete,
+      isAllErrored: isAllErrored,
+      isAllPaused: isAllPaused,
       totalFileCount: Object.keys(files).length,
       totalProgress: state.totalProgress,
+      allowNewUpload: allowNewUpload,
       acquirers: acquirers,
@@ -659,5 +730,2 @@ activePanel: pluginState.activePanel,
       autoProceed: this.uppy.opts.autoProceed,
-      hideUploadButton: this.opts.hideUploadButton,
-      hideRetryButton: this.opts.hideRetryButton,
-      hidePauseResumeCancelButtons: this.opts.hidePauseResumeCancelButtons,
       id: this.id,
@@ -728,3 +796,18 @@ closeModal: this.requestCloseModal,
 
+    var _opts = this.opts,
+        inline = _opts.inline,
+        closeAfterFinish = _opts.closeAfterFinish;
+
+    if (inline && closeAfterFinish) {
+      throw new Error('[Dashboard] `closeAfterFinish: true` cannot be used on an inline Dashboard, because an inline Dashboard cannot be closed at all. Either set `inline: false`, or disable the `closeAfterFinish` option.');
+    }
+
+    var allowMultipleUploads = this.uppy.opts.allowMultipleUploads;
+
+    if (allowMultipleUploads && closeAfterFinish) {
+      this.uppy.log('[Dashboard] When using `closeAfterFinish`, we recommended setting the `allowMultipleUploads` option to `false` in the Uppy constructor. See https://uppy.io/docs/uppy/#allowMultipleUploads-true', 'warning');
+    }
+
     var target = this.opts.target;
+
     if (target) {
@@ -748,3 +831,4 @@ this.mount(target, this);
         hideRetryButton: this.opts.hideRetryButton,
-        hidePauseResumeCancelButtons: this.opts.hidePauseResumeCancelButtons,
+        hidePauseResumeButton: this.opts.hidePauseResumeButton,
+        hideCancelButton: this.opts.hideCancelButton,
         showProgressDetails: this.opts.showProgressDetails,
@@ -751,0 +835,0 @@ hideAfterFinish: this.opts.hideProgressAfterFinish,

package.json

 {
   "name": "@uppy/dashboard",
   "description": "Universal UI plugin for Uppy.",
-  "version": "0.27.5",
+  "version": "0.28.0",
   "license": "MIT",
@@ -26,7 +26,7 @@ "main": "lib/index.js",
   "dependencies": {
-    "@uppy/informer": "0.27.4",
-    "@uppy/provider-views": "0.27.4",
-    "@uppy/status-bar": "0.27.4",
-    "@uppy/thumbnail-generator": "0.27.4",
-    "@uppy/utils": "0.27.1",
+    "@uppy/informer": "0.28.0",
+    "@uppy/provider-views": "0.28.0",
+    "@uppy/status-bar": "0.28.0",
+    "@uppy/thumbnail-generator": "0.28.0",
+    "@uppy/utils": "0.28.0",
     "classnames": "^2.2.6",
@@ -41,9 +41,9 @@ "drag-drop": "2.13.3",
   "devDependencies": {
-    "@uppy/core": "0.27.3",
-    "@uppy/google-drive": "0.27.5"
+    "@uppy/core": "0.28.0",
+    "@uppy/google-drive": "0.28.0"
   },
   "peerDependencies": {
-    "@uppy/core": "^0.27.0"
+    "@uppy/core": "^0.28.0"
   },
-  "gitHead": "113d6f09bbe248ca156af87054244cd9e6ee9d8b"
+  "gitHead": "47a68a6148a41c7b8a1e10e78b6cd6794a53f7e5"
 }

src/components/PanelTopBar.js

 const { h } = require('preact')
 
-function DashboardContentTitle (props) {
-  if (props.newFiles.length) {
-    return props.i18n('xFilesSelected', { smart_count: props.newFiles.length })
+const uploadStates = {
+  'STATE_ERROR': 'error',
+  'STATE_WAITING': 'waiting',
+  'STATE_PREPROCESSING': 'preprocessing',
+  'STATE_UPLOADING': 'uploading',
+  'STATE_POSTPROCESSING': 'postprocessing',
+  'STATE_COMPLETE': 'complete',
+  'STATE_PAUSED': 'paused'
+}
+
+function getUploadingState (isAllErrored, isAllComplete, isAllPaused, files = {}) {
+  if (isAllErrored) {
+    return uploadStates.STATE_ERROR
   }
+
+  if (isAllComplete) {
+    return uploadStates.STATE_COMPLETE
+  }
+
+  if (isAllPaused) {
+    return uploadStates.STATE_PAUSED
+  }
+
+  let state = uploadStates.STATE_WAITING
+  const fileIDs = Object.keys(files)
+  for (let i = 0; i < fileIDs.length; i++) {
+    const progress = files[fileIDs[i]].progress
+    // If ANY files are being uploaded right now, show the uploading state.
+    if (progress.uploadStarted && !progress.uploadComplete) {
+      return uploadStates.STATE_UPLOADING
+    }
+    // If files are being preprocessed AND postprocessed at this time, we show the
+    // preprocess state. If any files are being uploaded we show uploading.
+    if (progress.preprocess && state !== uploadStates.STATE_UPLOADING) {
+      state = uploadStates.STATE_PREPROCESSING
+    }
+    // If NO files are being preprocessed or uploaded right now, but some files are
+    // being postprocessed, show the postprocess state.
+    if (progress.postprocess && state !== uploadStates.STATE_UPLOADING && state !== uploadStates.STATE_PREPROCESSING) {
+      state = uploadStates.STATE_POSTPROCESSING
+    }
+  }
+  return state
 }
 
+function UploadStatus (props) {
+  const uploadingState = getUploadingState(
+    props.isAllErrored,
+    props.isAllComplete,
+    props.isAllPaused,
+    props.files
+  )
+
+  switch (uploadingState) {
+    case 'uploading':
+      return props.i18n('uploadingXFiles', { smart_count: props.inProgressNotPausedFiles.length })
+    case 'preprocessing':
+    case 'postprocessing':
+      return props.i18n('processingXFiles', { smart_count: props.processingFiles.length })
+    case 'paused':
+      return props.i18n('uploadPaused')
+    case 'waiting':
+      return props.i18n('xFilesSelected', { smart_count: props.newFiles.length })
+    case 'complete':
+      return props.i18n('uploadComplete')
+  }
+}
+
 function PanelTopBar (props) {
-  const notOverFileLimit = props.maxNumberOfFiles
-    ? props.totalFileCount < props.maxNumberOfFiles
-    : true
+  let allowNewUpload = props.allowNewUpload
+  // TODO maybe this should be done in ../index.js, then just pass that down as `allowNewUpload`
+  if (allowNewUpload && props.maxNumberOfFiles) {
+    allowNewUpload = props.totalFileCount < props.maxNumberOfFiles
+  }
 
   return (
     <div class="uppy-DashboardContent-bar">
-      <button class="uppy-DashboardContent-back"
-        type="button"
-        onclick={props.cancelAll}>{props.i18n('cancel')}</button>
+      <div>
+        {!props.isAllComplete
+        ? <button class="uppy-DashboardContent-back"
+          type="button"
+          onclick={props.cancelAll}>{props.i18n('cancel')}</button>
+          : null
+        }
+      </div>
       <div class="uppy-DashboardContent-title" role="heading" aria-level="h1">
-        <DashboardContentTitle {...props} />
+        <UploadStatus {...props} />
       </div>
-      { notOverFileLimit &&
+      { allowNewUpload &&
         <button class="uppy-DashboardContent-addMore"
@@ -33,3 +102,2 @@ type="button"
       }
-
     </div>
@@ -36,0 +104,0 @@ )

src/index.js

@@ -10,3 +10,3 @@ const { Plugin } = require('@uppy/core')
 const toArray = require('@uppy/utils/lib/toArray')
-const prettyBytes = require('prettier-bytes')
+// const prettyBytes = require('prettier-bytes')
 const ResizeObserver = require('resize-observer-polyfill').default || require('resize-observer-polyfill')
@@ -80,2 +80,3 @@ const { defaultTabIcon } = require('./components/icons')
         uploadComplete: 'Upload complete',
+        uploadPaused: 'Upload paused',
         resumeUpload: 'Resume upload',
@@ -93,2 +94,10 @@ pauseUpload: 'Pause upload',
         },
+        uploadingXFiles: {
+          0: 'Uploading %{smart_count} file',
+          1: 'Uploading %{smart_count} files'
+        },
+        processingXFiles: {
+          0: 'Processing %{smart_count} file',
+          1: 'Processing %{smart_count} files'
+        },
         uploadXNewFiles: {
@@ -123,2 +132,3 @@ 0: 'Upload +%{smart_count} file',
       closeModalOnClickOutside: false,
+      closeAfterFinish: false,
       disableStatusBar: false,
@@ -132,3 +142,3 @@ disableInformer: false,
       showSelectedFiles: true,
-      locale: defaultLocale,
+      // locale: defaultLocale,
       browserBackButtonClose: false
@@ -140,6 +150,4 @@ }
 
-    this.locale = Object.assign({}, defaultLocale, this.opts.locale)
-    this.locale.strings = Object.assign({}, defaultLocale.strings, this.opts.locale.strings)
-
-    this.translator = new Translator({locale: this.locale})
+    // i18n
+    this.translator = new Translator([ defaultLocale, this.uppy.locale, this.opts.locale ])
     this.i18n = this.translator.translate.bind(this.translator)
@@ -163,3 +171,5 @@ this.i18nArray = this.translator.translateArray.bind(this.translator)
     this.initEvents = this.initEvents.bind(this)
-    this.onKeydown = this.onKeydown.bind(this)
+    this.handleKeyDown = this.handleKeyDown.bind(this)
+    this.handleFileAdded = this.handleFileAdded.bind(this)
+    this.handleComplete = this.handleComplete.bind(this)
     this.handleClickOutside = this.handleClickOutside.bind(this)
@@ -326,3 +336,3 @@ this.toggleFileCard = this.toggleFileCard.bind(this)
     // handle ESC and TAB keys in modal dialog
-    document.addEventListener('keydown', this.onKeydown)
+    document.addEventListener('keydown', this.handleKeyDown)
 
@@ -361,3 +371,3 @@ // this.rerender(this.uppy.getState())
     // handle ESC and TAB keys in modal dialog
-    document.removeEventListener('keydown', this.onKeydown)
+    document.removeEventListener('keydown', this.handleKeyDown)
 
@@ -381,3 +391,3 @@ this.savedActiveElement.focus()
 
-  onKeydown (event) {
+  handleKeyDown (event) {
     // close modal on esc key press
@@ -469,8 +479,17 @@ if (event.keyCode === ESC_KEY) this.requestCloseModal(event)
     this.uppy.on('plugin-remove', this.removeTarget)
-    this.uppy.on('file-added', (ev) => {
-      this.toggleAddFilesPanel(false)
-      this.hideAllPanels()
-    })
+    this.uppy.on('file-added', this.handleFileAdded)
+    this.uppy.on('complete', this.handleComplete)
   }
 
+  handleFileAdded () {
+    this.hideAllPanels()
+  }
+
+  handleComplete ({ failed, uploadID }) {
+    if (this.opts.closeAfterFinish && failed.length === 0) {
+      // All uploads are done
+      this.requestCloseModal()
+    }
+  }
+
   removeEvents () {
@@ -488,3 +507,4 @@ const showModalTrigger = findAllDOMElements(this.opts.trigger)
     this.uppy.off('plugin-remove', this.removeTarget)
-    this.uppy.off('file-added', (ev) => this.toggleAddFilesPanel(false))
+    this.uppy.off('file-added', this.handleFileAdded)
+    this.uppy.off('complete', this.handleComplete)
   }
@@ -523,27 +543,69 @@
     const pluginState = this.getPluginState()
-    const { files, capabilities } = state
+    const { files, capabilities, allowNewUpload } = state
 
+    // TODO: move this to Core, to share between Status Bar and Dashboard
+    // (and any other plugin that might need it, too)
     const newFiles = Object.keys(files).filter((file) => {
       return !files[file].progress.uploadStarted
     })
+
+    const uploadStartedFiles = Object.keys(files).filter((file) => {
+      return files[file].progress.uploadStarted
+    })
+
+    const pausedFiles = Object.keys(files).filter((file) => {
+      return files[file].isPaused
+    })
+
+    const completeFiles = Object.keys(files).filter((file) => {
+      return files[file].progress.uploadComplete
+    })
+
+    const erroredFiles = Object.keys(files).filter((file) => {
+      return files[file].error
+    })
+
     const inProgressFiles = Object.keys(files).filter((file) => {
       return !files[file].progress.uploadComplete &&
-             files[file].progress.uploadStarted &&
-             !files[file].isPaused
+             files[file].progress.uploadStarted
     })
 
-    let inProgressFilesArray = []
-    inProgressFiles.forEach((file) => {
-      inProgressFilesArray.push(files[file])
+    const inProgressNotPausedFiles = inProgressFiles.filter((file) => {
+      return !files[file].isPaused
     })
 
-    let totalSize = 0
-    let totalUploadedSize = 0
-    inProgressFilesArray.forEach((file) => {
-      totalSize = totalSize + (file.progress.bytesTotal || 0)
-      totalUploadedSize = totalUploadedSize + (file.progress.bytesUploaded || 0)
+    const processingFiles = Object.keys(files).filter((file) => {
+      return files[file].progress.preprocess || files[file].progress.postprocess
     })
-    totalSize = prettyBytes(totalSize)
-    totalUploadedSize = prettyBytes(totalUploadedSize)
 
+    const isUploadStarted = uploadStartedFiles.length > 0
+
+    const isAllComplete = state.totalProgress === 100 &&
+      completeFiles.length === Object.keys(files).length &&
+      processingFiles.length === 0
+
+    const isAllErrored = isUploadStarted &&
+      erroredFiles.length === uploadStartedFiles.length
+
+    const isAllPaused = inProgressFiles.length !== 0 &&
+      pausedFiles.length === inProgressFiles.length
+    // const isAllPaused = inProgressNotPausedFiles.length === 0 &&
+    //   !isAllComplete &&
+    //   !isAllErrored &&
+    //   uploadStartedFiles.length > 0
+
+    // let inProgressNotPausedFilesArray = []
+    // inProgressNotPausedFiles.forEach((file) => {
+    //   inProgressNotPausedFilesArray.push(files[file])
+    // })
+
+    // let totalSize = 0
+    // let totalUploadedSize = 0
+    // inProgressNotPausedFilesArray.forEach((file) => {
+    //   totalSize = totalSize + (file.progress.bytesTotal || 0)
+    //   totalUploadedSize = totalUploadedSize + (file.progress.bytesUploaded || 0)
+    // })
+    // totalSize = prettyBytes(totalSize)
+    // totalUploadedSize = prettyBytes(totalUploadedSize)
+
     const attachRenderFunctionToTarget = (target) => {
@@ -582,3 +644,2 @@ const plugin = this.uppy.getPlugin(target.id)
     const cancelUpload = (fileID) => {
-      this.uppy.emit('upload-cancel', fileID)
       this.uppy.removeFile(fileID)
@@ -593,9 +654,20 @@ }
     return DashboardUI({
-      state: state,
+      state,
       modal: pluginState,
-      newFiles: newFiles,
-      files: files,
+      files,
+      newFiles,
+      uploadStartedFiles,
+      completeFiles,
+      erroredFiles,
+      inProgressFiles,
+      inProgressNotPausedFiles,
+      processingFiles,
+      isUploadStarted,
+      isAllComplete,
+      isAllErrored,
+      isAllPaused,
       totalFileCount: Object.keys(files).length,
       totalProgress: state.totalProgress,
-      acquirers: acquirers,
+      allowNewUpload,
+      acquirers,
       activePanel: pluginState.activePanel,
@@ -607,5 +679,2 @@ animateOpenClose: this.opts.animateOpenClose,
       autoProceed: this.uppy.opts.autoProceed,
-      hideUploadButton: this.opts.hideUploadButton,
-      hideRetryButton: this.opts.hideRetryButton,
-      hidePauseResumeCancelButtons: this.opts.hidePauseResumeCancelButtons,
       id: this.id,
@@ -629,6 +698,6 @@ closeModal: this.requestCloseModal,
       bundled: capabilities.bundled || false,
-      startUpload: startUpload,
+      startUpload,
       pauseUpload: this.uppy.pauseResume,
       retryUpload: this.uppy.retryUpload,
-      cancelUpload: cancelUpload,
+      cancelUpload,
       cancelAll: this.uppy.cancelAll,
@@ -639,3 +708,3 @@ fileCardFor: pluginState.fileCardFor,
       showAddFilesPanel: pluginState.showAddFilesPanel,
-      saveFileCard: saveFileCard,
+      saveFileCard,
       width: this.opts.width,
@@ -674,3 +743,13 @@ height: this.opts.height,
 
-    const target = this.opts.target
+    const { inline, closeAfterFinish } = this.opts
+    if (inline && closeAfterFinish) {
+      throw new Error('[Dashboard] `closeAfterFinish: true` cannot be used on an inline Dashboard, because an inline Dashboard cannot be closed at all. Either set `inline: false`, or disable the `closeAfterFinish` option.')
+    }
+
+    const { allowMultipleUploads } = this.uppy.opts
+    if (allowMultipleUploads && closeAfterFinish) {
+      this.uppy.log('[Dashboard] When using `closeAfterFinish`, we recommended setting the `allowMultipleUploads` option to `false` in the Uppy constructor. See https://uppy.io/docs/uppy/#allowMultipleUploads-true', 'warning')
+    }
+
+    const { target } = this.opts
     if (target) {
@@ -694,3 +773,4 @@ this.mount(target, this)
         hideRetryButton: this.opts.hideRetryButton,
-        hidePauseResumeCancelButtons: this.opts.hidePauseResumeCancelButtons,
+        hidePauseResumeButton: this.opts.hidePauseResumeButton,
+        hideCancelButton: this.opts.hideCancelButton,
         showProgressDetails: this.opts.showProgressDetails,
@@ -697,0 +777,0 @@ hideAfterFinish: this.opts.hideProgressAfterFinish,

New alerts

License Policy Violation

License

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

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

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

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

301120

increased by4.87%

Lines of code

5542

increased by5.72%

Dependency changes

• + Added@uppy/core@0.28.0(transitive)

• + Added@uppy/informer@0.28.0(transitive)

• + Added@uppy/provider-views@0.28.0(transitive)

• + Added@uppy/status-bar@0.28.0(transitive)

• + Added@uppy/thumbnail-generator@0.28.0(transitive)

• + Added@uppy/utils@0.28.0(transitive)

• - Removed@uppy/core@0.27.3(transitive)

• - Removed@uppy/informer@0.27.4(transitive)

• - Removed@uppy/provider-views@0.27.4(transitive)

• - Removed@uppy/status-bar@0.27.4(transitive)

• - Removed@uppy/thumbnail-generator@0.27.4(transitive)

• - Removed@uppy/utils@0.27.1(transitive)

• Updated@uppy/informer@0.28.0

• Updated@uppy/provider-views@0.28.0

• Updated@uppy/status-bar@0.28.0

• Updated@uppy/thumbnail-generator@0.28.0

• Updated@uppy/utils@0.28.0