@uppy/provider-views - npm Package Compare versions

Comparing version 1.12.3 to 2.0.0-alpha.0

lib/Breadcrumbs.js

@@ -1,14 +0,28 @@
-var _require = require('preact'),
-    h = _require.h; // TODO use Fragment when upgrading to preact X
+"use strict";
 
+const {
+  h,
+  Fragment
+} = require('preact');
 
-var Breadcrumb = function Breadcrumb(props) {
-  return h("span", null, h("button", {
+const Breadcrumb = props => {
+  const {
+    getFolder,
+    title,
+    isLast
+  } = props;
+  return h(Fragment, null, h("button", {
     type: "button",
     className: "uppy-u-reset",
-    onClick: props.getFolder
-  }, props.title), !props.isLast ? ' / ' : '');
+    onClick: getFolder
+  }, title), !isLast ? ' / ' : '');
 };
 
-module.exports = function (props) {
+module.exports = props => {
+  const {
+    getFolder,
+    title,
+    breadcrumbsIcon,
+    directories
+  } = props;
   return h("div", {
@@ -18,12 +32,8 @@ className: "uppy-Provider-breadcrumbs"
     className: "uppy-Provider-breadcrumbsIcon"
-  }, props.breadcrumbsIcon), props.directories.map(function (directory, i) {
-    return h(Breadcrumb, {
-      key: directory.id,
-      getFolder: function getFolder() {
-        return props.getFolder(directory.id);
-      },
-      title: i === 0 ? props.title : directory.title,
-      isLast: i + 1 === props.directories.length
-    });
-  }));
+  }, breadcrumbsIcon), directories.map((directory, i) => h(Breadcrumb, {
+    key: directory.id,
+    getFolder: () => getFolder(directory.id),
+    title: i === 0 ? title : directory.title,
+    isLast: i + 1 === directories.length
+  })));
 };

lib/Browser.js

@@ -0,23 +1,28 @@
+"use strict";
+
 function _extends() { _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; }; return _extends.apply(this, arguments); }
 
-var classNames = require('classnames');
+const classNames = require('classnames');
 
-var Filter = require('./Filter');
+const {
+  h
+} = require('preact');
 
-var ItemList = require('./ItemList');
+const Filter = require('./Filter');
 
-var FooterActions = require('./FooterActions');
+const ItemList = require('./ItemList');
 
-var _require = require('preact'),
-    h = _require.h;
+const FooterActions = require('./FooterActions');
 
-var Browser = function Browser(props) {
-  var currentSelection = props.currentSelection,
-      folders = props.folders,
-      files = props.files,
-      uppyFiles = props.uppyFiles,
-      filterItems = props.filterItems,
-      filterInput = props.filterInput;
-  var filteredFolders = folders;
-  var filteredFiles = files;
+const Browser = props => {
+  const {
+    currentSelection,
+    folders,
+    files,
+    uppyFiles,
+    filterItems,
+    filterInput
+  } = props;
+  let filteredFolders = folders;
+  let filteredFiles = files;
 
@@ -29,5 +34,5 @@ if (filterInput !== '') {
 
-  var selected = currentSelection.length;
+  const selected = currentSelection.length;
   return h("div", {
-    className: classNames('uppy-ProviderBrowser', "uppy-ProviderBrowser-viewType--" + props.viewType)
+    className: classNames('uppy-ProviderBrowser', `uppy-ProviderBrowser-viewType--${props.viewType}`)
   }, h("div", {
@@ -34,0 +39,0 @@ className: "uppy-ProviderBrowser-header"

lib/CloseWrapper.js

@@ -1,26 +0,23 @@
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+"use strict";
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+const {
+  Component,
+  toChildArray
+} = require('preact');
 
-var _require = require('preact'),
-    Component = _require.Component;
+module.exports = class CloseWrapper extends Component {
+  componentWillUnmount() {
+    const {
+      onUnmount
+    } = this.props;
+    onUnmount();
+  }
 
-module.exports = /*#__PURE__*/function (_Component) {
-  _inheritsLoose(CloseWrapper, _Component);
-
-  function CloseWrapper() {
-    return _Component.apply(this, arguments) || this;
+  render() {
+    const {
+      children
+    } = this.props;
+    return toChildArray(children)[0];
   }
 
-  var _proto = CloseWrapper.prototype;
-
-  _proto.componentWillUnmount = function componentWillUnmount() {
-    this.props.onUnmount();
-  };
-
-  _proto.render = function render() {
-    return this.props.children[0];
-  };
-
-  return CloseWrapper;
-}(Component);
+};

lib/Filter.js

@@ -1,25 +0,15 @@
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+"use strict";
 
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+const {
+  h,
+  Component
+} = require('preact');
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-var _require = require('preact'),
-    h = _require.h,
-    Component = _require.Component;
-
-module.exports = /*#__PURE__*/function (_Component) {
-  _inheritsLoose(Filter, _Component);
-
-  function Filter(props) {
-    var _this;
-
-    _this = _Component.call(this, props) || this;
-    _this.preventEnterPress = _this.preventEnterPress.bind(_assertThisInitialized(_this));
-    return _this;
+module.exports = class Filter extends Component {
+  constructor(props) {
+    super(props);
+    this.preventEnterPress = this.preventEnterPress.bind(this);
   }
 
-  var _proto = Filter.prototype;
-
-  _proto.preventEnterPress = function preventEnterPress(ev) {
+  preventEnterPress(ev) {
     if (ev.keyCode === 13) {
@@ -29,7 +19,5 @@ ev.stopPropagation();
     }
-  };
+  }
 
-  _proto.render = function render() {
-    var _this2 = this;
-
+  render() {
     return h("div", {
@@ -45,5 +33,3 @@ className: "uppy-ProviderBrowser-search"
       onKeyPress: this.preventEnterPress,
-      onInput: function onInput(e) {
-        return _this2.props.filterQuery(e);
-      },
+      onInput: e => this.props.filterQuery(e),
       value: this.props.filterInput
@@ -73,5 +59,4 @@ }), h("svg", {
     }))));
-  };
+  }
 
-  return Filter;
-}(Component);
+};

lib/FooterActions.js

@@ -1,5 +0,8 @@
-var _require = require('preact'),
-    h = _require.h;
+"use strict";
 
-module.exports = function (props) {
+const {
+  h
+} = require('preact');
+
+module.exports = props => {
   return h("div", {
@@ -6,0 +9,0 @@ className: "uppy-ProviderBrowser-footer"

lib/index.js

@@ -1,8 +0,10 @@
-var ProviderViews = require('./ProviderView');
+"use strict";
 
-var SearchProviderViews = require('./SearchProviderView');
+const ProviderViews = require('./ProviderView');
 
+const SearchProviderViews = require('./SearchProviderView');
+
 module.exports = {
-  ProviderViews: ProviderViews,
-  SearchProviderViews: SearchProviderViews
+  ProviderViews,
+  SearchProviderViews
 };

lib/Item/components/GridLi.js

@@ -1,27 +0,38 @@
-var _require = require('preact'),
-    h = _require.h; // it could be a <li><button class="fake-checkbox"/> <button/></li>
+"use strict";
 
+const {
+  h
+} = require('preact');
 
-module.exports = function (props) {
+function GridListItem(props) {
+  const {
+    className,
+    isDisabled,
+    restrictionReason,
+    isChecked,
+    title,
+    itemIconEl,
+    showTitles,
+    toggleCheckbox,
+    id
+  } = props;
   return h("li", {
-    className: props.className,
-    title: props.isDisabled ? props.restrictionReason : null
-  }, h("div", {
-    "aria-hidden": true,
-    className: "uppy-ProviderBrowserItem-fakeCheckbox " + (props.isChecked ? 'uppy-ProviderBrowserItem-fakeCheckbox--is-checked' : '')
-  }), h("button", {
-    type: "button",
-    className: "uppy-u-reset uppy-ProviderBrowserItem-inner",
-    onClick: props.toggleCheckbox,
-    role: "option",
-    "aria-label": props.isChecked ? props.i18n('unselectFileNamed', {
-      name: props.title
-    }) : props.i18n('selectFileNamed', {
-      name: props.title
-    }),
-    "aria-selected": props.isChecked,
-    "aria-disabled": props.isDisabled,
-    disabled: props.isDisabled,
+    className: className,
+    title: isDisabled ? restrictionReason : null
+  }, h("input", {
+    type: "checkbox",
+    className: `uppy-u-reset uppy-ProviderBrowserItem-checkbox ${isChecked ? 'uppy-ProviderBrowserItem-checkbox--is-checked' : ''} uppy-ProviderBrowserItem-checkbox--grid`,
+    onChange: toggleCheckbox,
+    name: "listitem",
+    id: id,
+    checked: isChecked,
+    disabled: isDisabled,
     "data-uppy-super-focusable": true
-  }, props.itemIconEl, props.showTitles && props.title));
-};
+  }), h("label", {
+    htmlFor: id,
+    "aria-label": title,
+    className: "uppy-u-reset uppy-ProviderBrowserItem-inner"
+  }, itemIconEl, showTitles && title));
+}
+
+module.exports = GridListItem;

lib/Item/components/ItemIcon.js

@@ -1,4 +0,7 @@
-var _require = require('preact'),
-    h = _require.h;
+"use strict";
 
+const {
+  h
+} = require('preact');
+
 function FileIcon() {
@@ -48,3 +51,3 @@ return h("svg", {
 
-module.exports = function (props) {
+module.exports = props => {
   if (props.itemIconString === null) return;
@@ -51,0 +54,0 @@

lib/Item/components/ListLi.js

@@ -1,27 +0,6 @@
-var _require = require('preact'),
-    h = _require.h;
+"use strict";
 
-var getAriaLabelOfCheckbox = function getAriaLabelOfCheckbox(props) {
-  if (props.type === 'folder') {
-    if (props.isChecked) {
-      return props.i18n('unselectAllFilesFromFolderNamed', {
-        name: props.title
-      });
-    }
-
-    return props.i18n('selectAllFilesFromFolderNamed', {
-      name: props.title
-    });
-  }
-
-  if (props.isChecked) {
-    return props.i18n('unselectFileNamed', {
-      name: props.title
-    });
-  }
-
-  return props.i18n('selectFileNamed', {
-    name: props.title
-  });
-}; // if folder:
+const {
+  h
+} = require('preact'); // if folder:
 //   + checkbox (selects all files from folder)
@@ -34,35 +13,53 @@ //   + folder name (opens folder)
 
-module.exports = function (props) {
+function ListItem(props) {
+  const {
+    className,
+    isDisabled,
+    restrictionReason,
+    isCheckboxDisabled,
+    isChecked,
+    toggleCheckbox,
+    type,
+    id,
+    itemIconEl,
+    title,
+    handleFolderClick,
+    showTitles,
+    i18n
+  } = props;
   return h("li", {
-    className: props.className,
-    title: props.isDisabled ? props.restrictionReason : null
-  }, !props.isCheckboxDisabled ? h("button", {
-    type: "button",
-    className: "uppy-u-reset uppy-ProviderBrowserItem-fakeCheckbox " + (props.isChecked ? 'uppy-ProviderBrowserItem-fakeCheckbox--is-checked' : ''),
-    onClick: props.toggleCheckbox // for the <label/>
+    className: className,
+    title: isDisabled ? restrictionReason : null
+  }, !isCheckboxDisabled ? h("input", {
+    type: "checkbox",
+    className: `uppy-u-reset uppy-ProviderBrowserItem-checkbox ${isChecked ? 'uppy-ProviderBrowserItem-checkbox--is-checked' : ''}`,
+    onChange: toggleCheckbox // for the <label/>
     ,
-    id: props.id,
-    role: "option",
-    "aria-label": getAriaLabelOfCheckbox(props),
-    "aria-selected": props.isChecked,
-    "aria-disabled": props.isDisabled,
-    disabled: props.isDisabled,
+    name: "listitem",
+    id: id,
+    checked: isChecked,
+    "aria-label": type === 'file' ? null : i18n('allFilesFromFolderNamed', {
+      name: title
+    }),
+    disabled: isDisabled,
     "data-uppy-super-focusable": true
-  }) : null, props.type === 'file' ? // label for a checkbox
+  }) : null, type === 'file' ? // label for a checkbox
   h("label", {
-    htmlFor: props.id,
+    htmlFor: id,
     className: "uppy-u-reset uppy-ProviderBrowserItem-inner"
   }, h("div", {
     className: "uppy-ProviderBrowserItem-iconWrap"
-  }, props.itemIconEl), props.showTitles && props.title) : // button to open a folder
+  }, itemIconEl), showTitles && title) : // button to open a folder
   h("button", {
     type: "button",
     className: "uppy-u-reset uppy-ProviderBrowserItem-inner",
-    onClick: props.handleFolderClick,
-    "aria-label": props.i18n('openFolderNamed', {
-      name: props.title
+    onClick: handleFolderClick,
+    "aria-label": i18n('openFolderNamed', {
+      name: title
     })
   }, h("div", {
     className: "uppy-ProviderBrowserItem-iconWrap"
-  }, props.itemIconEl), props.showTitles && h("span", null, props.title)));
-};
+  }, itemIconEl), showTitles && h("span", null, title)));
+}
+
+module.exports = ListItem;

lib/Item/index.js

@@ -0,17 +1,20 @@
+"use strict";
+
 function _extends() { _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; }; return _extends.apply(this, arguments); }
 
-var _require = require('preact'),
-    h = _require.h;
+const {
+  h
+} = require('preact');
 
-var classNames = require('classnames');
+const classNames = require('classnames');
 
-var ItemIcon = require('./components/ItemIcon');
+const ItemIcon = require('./components/ItemIcon');
 
-var GridLi = require('./components/GridLi');
+const GridLi = require('./components/GridLi');
 
-var ListLi = require('./components/ListLi');
+const ListLi = require('./components/ListLi');
 
-module.exports = function (props) {
-  var itemIconString = props.getItemIcon();
-  var className = classNames('uppy-ProviderBrowserItem', {
+module.exports = props => {
+  const itemIconString = props.getItemIcon();
+  const className = classNames('uppy-ProviderBrowserItem', {
     'uppy-ProviderBrowserItem--selected': props.isChecked
@@ -23,3 +26,3 @@ }, {
   });
-  var itemIconEl = h(ItemIcon, {
+  const itemIconEl = h(ItemIcon, {
     itemIconString: itemIconString
@@ -42,4 +45,4 @@ });
     default:
-      throw new Error("There is no such type " + props.viewType);
+      throw new Error(`There is no such type ${props.viewType}`);
   }
 };

lib/ItemList.js

@@ -1,36 +0,33 @@
-function _extends() { _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; }; return _extends.apply(this, arguments); }
+"use strict";
 
-var _require = require('preact'),
-    h = _require.h;
+const {
+  h
+} = require('preact');
 
-var remoteFileObjToLocal = require('@uppy/utils/lib/remoteFileObjToLocal');
+const remoteFileObjToLocal = require('@uppy/utils/lib/remoteFileObjToLocal');
 
-var Item = require('./Item/index'); // Hopefully this name will not be used by Google
+const Item = require('./Item/index'); // Hopefully this name will not be used by Google
 
 
-var VIRTUAL_SHARED_DIR = 'shared-with-me';
+const VIRTUAL_SHARED_DIR = 'shared-with-me';
 
-var getSharedProps = function getSharedProps(fileOrFolder, props) {
-  return {
-    id: fileOrFolder.id,
-    title: fileOrFolder.name,
-    getItemIcon: function getItemIcon() {
-      return fileOrFolder.icon;
-    },
-    isChecked: props.isChecked(fileOrFolder),
-    toggleCheckbox: function toggleCheckbox(e) {
-      return props.toggleCheckbox(e, fileOrFolder);
-    },
-    columns: props.columns,
-    showTitles: props.showTitles,
-    viewType: props.viewType,
-    i18n: props.i18n
-  };
-};
+const getSharedProps = (fileOrFolder, props) => ({
+  id: fileOrFolder.id,
+  title: fileOrFolder.name,
+  getItemIcon: () => fileOrFolder.icon,
+  isChecked: props.isChecked(fileOrFolder),
+  toggleCheckbox: e => props.toggleCheckbox(e, fileOrFolder),
+  columns: props.columns,
+  showTitles: props.showTitles,
+  viewType: props.viewType,
+  i18n: props.i18n
+});
 
-module.exports = function (props) {
-  var folders = props.folders,
-      files = props.files,
-      handleScroll = props.handleScroll,
-      isChecked = props.isChecked;
+module.exports = props => {
+  const {
+    folders,
+    files,
+    handleScroll,
+    isChecked
+  } = props;
 
@@ -51,21 +48,19 @@ if (!folders.length && !files.length) {
     tabIndex: "-1"
-  }, folders.map(function (folder) {
-    return Item(_extends({}, getSharedProps(folder, props), {
+  }, folders.map(folder => {
+    return Item({ ...getSharedProps(folder, props),
       type: 'folder',
       isDisabled: isChecked(folder) ? isChecked(folder).loading : false,
       isCheckboxDisabled: folder.id === VIRTUAL_SHARED_DIR,
-      handleFolderClick: function handleFolderClick() {
-        return props.handleFolderClick(folder);
-      }
-    }));
-  }), files.map(function (file) {
-    var validateRestrictions = props.validateRestrictions(remoteFileObjToLocal(file), [].concat(props.uppyFiles, props.currentSelection));
-    var sharedProps = getSharedProps(file, props);
-    var restrictionReason = validateRestrictions.reason;
-    return Item(_extends({}, sharedProps, {
+      handleFolderClick: () => props.handleFolderClick(folder)
+    });
+  }), files.map(file => {
+    const validateRestrictions = props.validateRestrictions(remoteFileObjToLocal(file), [...props.uppyFiles, ...props.currentSelection]);
+    const sharedProps = getSharedProps(file, props);
+    const restrictionReason = validateRestrictions.reason;
+    return Item({ ...sharedProps,
       type: 'file',
       isDisabled: !validateRestrictions.result && !sharedProps.isChecked,
-      restrictionReason: restrictionReason
-    }));
+      restrictionReason
+    });
   })));
 };

lib/Loader.js

@@ -1,5 +0,8 @@
-var _require = require('preact'),
-    h = _require.h;
+"use strict";
 
-module.exports = function (props) {
+const {
+  h
+} = require('preact');
+
+module.exports = props => {
   return h("div", {
@@ -6,0 +9,0 @@ className: "uppy-Provider-loading"

lib/ProviderView/AuthView.js

@@ -1,20 +0,11 @@
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+"use strict";
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+const {
+  h,
+  Component
+} = require('preact');
 
-var _require = require('preact'),
-    h = _require.h,
-    Component = _require.Component;
-
-var AuthView = /*#__PURE__*/function (_Component) {
-  _inheritsLoose(AuthView, _Component);
-
-  function AuthView() {
-    return _Component.apply(this, arguments) || this;
-  }
-
-  var _proto = AuthView.prototype;
-
-  _proto.render = function render() {
-    var pluginNameComponent = h("span", {
+class AuthView extends Component {
+  render() {
+    const pluginNameComponent = h("span", {
       className: "uppy-Provider-authTitleName"
@@ -38,7 +29,6 @@ }, this.props.pluginName, h("br", null));
     })));
-  };
+  }
 
-  return AuthView;
-}(Component);
+}
 
 module.exports = AuthView;

lib/ProviderView/Header.js

@@ -1,8 +0,10 @@
-var User = require('./User');
+"use strict";
 
-var Breadcrumbs = require('../Breadcrumbs');
+const User = require('./User');
 
-module.exports = function (props) {
-  var components = [];
+const Breadcrumbs = require('../Breadcrumbs');
 
+module.exports = props => {
+  const components = [];
+
   if (props.showBreadcrumbs) {
@@ -9,0 +11,0 @@ components.push(Breadcrumbs({

lib/ProviderView/index.js

@@ -0,1 +1,3 @@
+"use strict";
+
 module.exports = require('./ProviderView');

lib/ProviderView/ProviderView.js

@@ -0,35 +1,31 @@
+"use strict";
+
 var _class, _temp;
 
-function _extends() { _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; }; return _extends.apply(this, arguments); }
+const {
+  h
+} = require('preact');
 
-var _require = require('preact'),
-    h = _require.h;
+const generateFileID = require('@uppy/utils/lib/generateFileID');
 
-var AuthView = require('./AuthView');
+const getFileType = require('@uppy/utils/lib/getFileType');
 
-var Header = require('./Header');
+const findIndex = require('@uppy/utils/lib/findIndex');
 
-var Browser = require('../Browser');
+const isPreviewSupported = require('@uppy/utils/lib/isPreviewSupported');
 
-var LoaderView = require('../Loader');
+const AuthView = require('./AuthView');
 
-var generateFileID = require('@uppy/utils/lib/generateFileID');
+const Header = require('./Header');
 
-var getFileType = require('@uppy/utils/lib/getFileType');
+const Browser = require('../Browser');
 
-var findIndex = require('@uppy/utils/lib/findIndex');
+const LoaderView = require('../Loader');
 
-var isPreviewSupported = require('@uppy/utils/lib/isPreviewSupported');
+const SharedHandler = require('../SharedHandler');
 
-var SharedHandler = require('../SharedHandler');
+const CloseWrapper = require('../CloseWrapper');
 
-var CloseWrapper = require('../CloseWrapper'); // location.origin does not exist in IE
-
-
 function getOrigin() {
-  if ('origin' in location) {
-    return location.origin; // eslint-disable-line compat/compat
-  }
-
-  return location.protocol + "//" + location.hostname + (location.port ? ":" + location.port : '');
+  return location.origin;
 }
@@ -41,3 +37,3 @@ /**
 
-module.exports = (_temp = _class = /*#__PURE__*/function () {
+module.exports = (_temp = _class = class ProviderView {
   /**
@@ -47,3 +43,3 @@ * @param {object} plugin instance of the plugin
    */
-  function ProviderView(plugin, opts) {
+  constructor(plugin, opts) {
     this.plugin = plugin;
@@ -53,3 +49,3 @@ this.provider = opts.provider;
 
-    var defaultOptions = {
+    const defaultOptions = {
       viewType: 'list',
@@ -61,3 +57,5 @@ showTitles: true,
 
-    this.opts = _extends({}, defaultOptions, opts); // Logic
+    this.opts = { ...defaultOptions,
+      ...opts
+    }; // Logic
 
@@ -93,10 +91,8 @@ this.addFile = this.addFile.bind(this);
 
-  var _proto = ProviderView.prototype;
+  tearDown() {// Nothing.
+  }
 
-  _proto.tearDown = function tearDown() {// Nothing.
-  };
-
-  _proto._updateFilesAndFolders = function _updateFilesAndFolders(res, files, folders) {
+  _updateFilesAndFolders(res, files, folders) {
     this.nextPagePath = res.nextPagePath;
-    res.items.forEach(function (item) {
+    res.items.forEach(item => {
       if (item.isFolder) {
@@ -109,4 +105,4 @@ folders.push(item);
     this.plugin.setPluginState({
-      folders: folders,
-      files: files
+      folders,
+      files
     });
@@ -118,5 +114,5 @@ }
    */
-  ;
 
-  _proto.preFirstRender = function preFirstRender() {
+
+  preFirstRender() {
     this.plugin.setPluginState({
@@ -133,18 +129,12 @@ didFirstRender: true
    */
-  ;
 
-  _proto.getFolder = function getFolder(id, name) {
-    var _this = this;
 
-    return this._sharedHandler.loaderWrapper(this.provider.list(id), function (res) {
-      var folders = [];
-      var files = [];
-      var updatedDirectories;
+  getFolder(id, name) {
+    return this._sharedHandler.loaderWrapper(this.provider.list(id), res => {
+      const folders = [];
+      const files = [];
+      let updatedDirectories;
+      const state = this.plugin.getPluginState();
+      const index = findIndex(state.directories, dir => id === dir.id);
 
-      var state = _this.plugin.getPluginState();
-
-      var index = findIndex(state.directories, function (dir) {
-        return id === dir.id;
-      });
-
       if (index !== -1) {
@@ -154,3 +144,3 @@ updatedDirectories = state.directories.slice(0, index + 1);
         updatedDirectories = state.directories.concat([{
-          id: id,
+          id,
           title: name
@@ -160,7 +150,7 @@ }]);
 
-      _this.username = res.username || _this.username;
+      this.username = res.username || this.username;
 
-      _this._updateFilesAndFolders(res, files, folders);
+      this._updateFilesAndFolders(res, files, folders);
 
-      _this.plugin.setPluginState({
+      this.plugin.setPluginState({
         directories: updatedDirectories
@@ -175,11 +165,11 @@ });
    */
-  ;
 
-  _proto.getNextFolder = function getNextFolder(folder) {
+
+  getNextFolder(folder) {
     this.getFolder(folder.requestPath, folder.name);
     this.lastCheckbox = undefined;
-  };
+  }
 
-  _proto.addFile = function addFile(file) {
-    var tagFile = {
+  addFile(file) {
+    const tagFile = {
       id: this.providerFileToId(file),
@@ -196,3 +186,3 @@ source: this.plugin.id,
         companionUrl: this.plugin.opts.companionUrl,
-        url: "" + this.provider.fileUrl(file.requestPath),
+        url: `${this.provider.fileUrl(file.requestPath)}`,
         body: {
@@ -204,3 +194,3 @@ fileId: file.id
     };
-    var fileType = getFileType(tagFile); // TODO Should we just always use the thumbnail URL if it exists?
+    const fileType = getFileType(tagFile); // TODO Should we just always use the thumbnail URL if it exists?
 
@@ -227,19 +217,16 @@ if (fileType && isPreviewSupported(fileType)) {
    */
-  ;
 
-  _proto.logout = function logout() {
-    var _this2 = this;
 
-    this.provider.logout().then(function (res) {
+  logout() {
+    this.provider.logout().then(res => {
       if (res.ok) {
         if (!res.revoked) {
-          var message = _this2.plugin.uppy.i18n('companionUnauthorizeHint', {
-            provider: _this2.plugin.title,
+          const message = this.plugin.uppy.i18n('companionUnauthorizeHint', {
+            provider: this.plugin.title,
             url: res.manual_revoke_url
           });
-
-          _this2.plugin.uppy.info(message, 'info', 7000);
+          this.plugin.uppy.info(message, 'info', 7000);
         }
 
-        var newState = {
+        const newState = {
           authenticated: false,
@@ -250,22 +237,23 @@ files: [],
         };
-
-        _this2.plugin.setPluginState(newState);
+        this.plugin.setPluginState(newState);
       }
     }).catch(this.handleError);
-  };
+  }
 
-  _proto.filterQuery = function filterQuery(e) {
-    var state = this.plugin.getPluginState();
-    this.plugin.setPluginState(_extends({}, state, {
+  filterQuery(e) {
+    const state = this.plugin.getPluginState();
+    this.plugin.setPluginState({ ...state,
       filterInput: e ? e.target.value : ''
-    }));
-  };
+    });
+  }
 
-  _proto.sortByTitle = function sortByTitle() {
-    var state = _extends({}, this.plugin.getPluginState());
-
-    var files = state.files,
-        folders = state.folders,
-        sorting = state.sorting;
-    var sortedFiles = files.sort(function (fileA, fileB) {
+  sortByTitle() {
+    const state = { ...this.plugin.getPluginState()
+    };
+    const {
+      files,
+      folders,
+      sorting
+    } = state;
+    const sortedFiles = files.sort((fileA, fileB) => {
       if (sorting === 'titleDescending') {
@@ -277,3 +265,3 @@ return fileB.name.localeCompare(fileA.name);
     });
-    var sortedFolders = folders.sort(function (folderA, folderB) {
+    const sortedFolders = folders.sort((folderA, folderB) => {
       if (sorting === 'titleDescending') {
@@ -285,19 +273,21 @@ return folderB.name.localeCompare(folderA.name);
     });
-    this.plugin.setPluginState(_extends({}, state, {
+    this.plugin.setPluginState({ ...state,
       files: sortedFiles,
       folders: sortedFolders,
       sorting: sorting === 'titleDescending' ? 'titleAscending' : 'titleDescending'
-    }));
-  };
+    });
+  }
 
-  _proto.sortByDate = function sortByDate() {
-    var state = _extends({}, this.plugin.getPluginState());
+  sortByDate() {
+    const state = { ...this.plugin.getPluginState()
+    };
+    const {
+      files,
+      folders,
+      sorting
+    } = state;
+    const sortedFiles = files.sort((fileA, fileB) => {
+      const a = new Date(fileA.modifiedDate);
+      const b = new Date(fileB.modifiedDate);
 
-    var files = state.files,
-        folders = state.folders,
-        sorting = state.sorting;
-    var sortedFiles = files.sort(function (fileA, fileB) {
-      var a = new Date(fileA.modifiedDate);
-      var b = new Date(fileB.modifiedDate);
-
       if (sorting === 'dateDescending') {
@@ -309,5 +299,5 @@ return a > b ? -1 : a < b ? 1 : 0;
     });
-    var sortedFolders = folders.sort(function (folderA, folderB) {
-      var a = new Date(folderA.modifiedDate);
-      var b = new Date(folderB.modifiedDate);
+    const sortedFolders = folders.sort((folderA, folderB) => {
+      const a = new Date(folderA.modifiedDate);
+      const b = new Date(folderB.modifiedDate);
 
@@ -320,15 +310,17 @@ if (sorting === 'dateDescending') {
     });
-    this.plugin.setPluginState(_extends({}, state, {
+    this.plugin.setPluginState({ ...state,
       files: sortedFiles,
       folders: sortedFolders,
       sorting: sorting === 'dateDescending' ? 'dateAscending' : 'dateDescending'
-    }));
-  };
+    });
+  }
 
-  _proto.sortBySize = function sortBySize() {
-    var state = _extends({}, this.plugin.getPluginState());
+  sortBySize() {
+    const state = { ...this.plugin.getPluginState()
+    };
+    const {
+      files,
+      sorting
+    } = state; // check that plugin supports file sizes
 
-    var files = state.files,
-        sorting = state.sorting; // check that plugin supports file sizes
-
     if (!files.length || !this.plugin.getItemData(files[0]).size) {
@@ -338,5 +330,5 @@ return;
 
-    var sortedFiles = files.sort(function (fileA, fileB) {
-      var a = fileA.size;
-      var b = fileB.size;
+    const sortedFiles = files.sort((fileA, fileB) => {
+      const a = fileA.size;
+      const b = fileB.size;
 
@@ -349,6 +341,6 @@ if (sorting === 'sizeDescending') {
     });
-    this.plugin.setPluginState(_extends({}, state, {
+    this.plugin.setPluginState({ ...state,
       files: sortedFiles,
       sorting: sorting === 'sizeDescending' ? 'sizeAscending' : 'sizeDescending'
-    }));
+    });
   }
@@ -361,12 +353,10 @@ /**
    */
-  ;
 
-  _proto.addFolder = function addFolder(folder) {
-    var _this3 = this;
 
-    var folderId = this.providerFileToId(folder);
-    var state = this.plugin.getPluginState();
+  addFolder(folder) {
+    const folderId = this.providerFileToId(folder);
+    const state = this.plugin.getPluginState();
+    const folders = { ...state.selectedFolders
+    };
 
-    var folders = _extends({}, state.selectedFolders);
-
     if (folderId in folders && folders[folderId].loading) {
@@ -381,12 +371,25 @@ return;
     this.plugin.setPluginState({
-      selectedFolders: _extends({}, folders)
-    });
-    return this.listAllFiles(folder.requestPath).then(function (files) {
-      var count = 0;
-      files.forEach(function (file) {
-        var success = _this3.addFile(file);
+      selectedFolders: { ...folders
+      }
+    }); // eslint-disable-next-line consistent-return
 
-        if (success) count++;
+    return this.listAllFiles(folder.requestPath).then(files => {
+      let count = 0; // If the same folder is added again, we don't want to send
+      // X amount of duplicate file notifications, we want to say
+      // the folder was already added. This checks if all files are duplicate,
+      // if that's the case, we don't add the files.
+
+      files.forEach(file => {
+        const id = this.providerFileToId(file);
+
+        if (!this.plugin.uppy.checkIfFileAlreadyExists(id)) {
+          count++;
+        }
       });
-      var ids = files.map(_this3.providerFileToId);
+
+      if (count > 0) {
+        files.forEach(file => this.addFile(file));
+      }
+
+      const ids = files.map(this.providerFileToId);
       folders[folderId] = {
@@ -396,11 +399,13 @@ loading: false,
       };
-
-      _this3.plugin.setPluginState({
+      this.plugin.setPluginState({
         selectedFolders: folders
       });
+      let message;
 
-      var message;
-
-      if (files.length) {
-        message = _this3.plugin.uppy.i18n('folderAdded', {
+      if (count === 0) {
+        message = this.plugin.uppy.i18n('folderAlreadyAdded', {
+          folder: folder.name
+        });
+      } else if (files.length) {
+        message = this.plugin.uppy.i18n('folderAdded', {
           smart_count: count,
@@ -410,22 +415,19 @@ folder: folder.name
       } else {
-        message = _this3.plugin.uppy.i18n('emptyFolderAdded');
+        message = this.plugin.uppy.i18n('emptyFolderAdded');
       }
 
-      _this3.plugin.uppy.info(message);
-    }).catch(function (e) {
-      var state = _this3.plugin.getPluginState();
-
-      var selectedFolders = _extends({}, state.selectedFolders);
-
+      this.plugin.uppy.info(message);
+    }).catch(e => {
+      const state = this.plugin.getPluginState();
+      const selectedFolders = { ...state.selectedFolders
+      };
       delete selectedFolders[folderId];
-
-      _this3.plugin.setPluginState({
-        selectedFolders: selectedFolders
+      this.plugin.setPluginState({
+        selectedFolders
       });
-
-      _this3.handleError(e);
+      this.handleError(e);
     });
-  };
+  }
 
-  _proto.providerFileToId = function providerFileToId(file) {
+  providerFileToId(file) {
     return generateFileID({
@@ -436,21 +438,18 @@ data: file,
     });
-  };
+  }
 
-  _proto.handleAuth = function handleAuth() {
-    var _this4 = this;
-
-    var authState = btoa(JSON.stringify({
+  handleAuth() {
+    const authState = btoa(JSON.stringify({
       origin: getOrigin()
     }));
-    var clientVersion = "@uppy/provider-views=" + ProviderView.VERSION;
-    var link = this.provider.authUrl({
+    const clientVersion = `@uppy/provider-views=${ProviderView.VERSION}`;
+    const link = this.provider.authUrl({
       state: authState,
       uppyVersions: clientVersion
     });
-    var authWindow = window.open(link, '_blank');
+    const authWindow = window.open(link, '_blank');
 
-    var handleToken = function handleToken(e) {
-      if (!_this4._isOriginAllowed(e.origin, _this4.plugin.opts.companionAllowedHosts) || e.source !== authWindow) {
-        _this4.plugin.uppy.log("rejecting event from " + e.origin + " vs allowed pattern " + _this4.plugin.opts.companionAllowedHosts);
-
+    const handleToken = e => {
+      if (!this._isOriginAllowed(e.origin, this.plugin.opts.companionAllowedHosts) || e.source !== authWindow) {
+        this.plugin.uppy.log(`rejecting event from ${e.origin} vs allowed pattern ${this.plugin.opts.companionAllowedHosts}`);
         return;
@@ -461,7 +460,6 @@ } // Check if it's a string before doing the JSON.parse to maintain support
 
-      var data = typeof e.data === 'string' ? JSON.parse(e.data) : e.data;
+      const data = typeof e.data === 'string' ? JSON.parse(e.data) : e.data;
 
       if (!data.token) {
-        _this4.plugin.uppy.log('did not receive token from auth window');
-
+        this.plugin.uppy.log('did not receive token from auth window');
         return;
@@ -472,15 +470,13 @@ }
       window.removeEventListener('message', handleToken);
-
-      _this4.provider.setAuthToken(data.token);
-
-      _this4.preFirstRender();
+      this.provider.setAuthToken(data.token);
+      this.preFirstRender();
     };
 
     window.addEventListener('message', handleToken);
-  };
+  }
 
-  _proto._isOriginAllowed = function _isOriginAllowed(origin, allowedOrigin) {
-    var getRegex = function getRegex(value) {
+  _isOriginAllowed(origin, allowedOrigin) {
+    const getRegex = value => {
       if (typeof value === 'string') {
-        return new RegExp("^" + value + "$");
+        return new RegExp(`^${value}$`);
       }
@@ -493,13 +489,11 @@
 
-    var patterns = Array.isArray(allowedOrigin) ? allowedOrigin.map(getRegex) : [getRegex(allowedOrigin)];
-    return patterns.filter(function (pattern) {
-      return pattern != null;
-    }) // loose comparison to catch undefined
-    .some(function (pattern) {
-      return pattern.test(origin) || pattern.test(origin + "/");
-    }); // allowing for trailing '/'
-  };
+    const patterns = Array.isArray(allowedOrigin) ? allowedOrigin.map(getRegex) : [getRegex(allowedOrigin)];
+    return patterns.filter(pattern => pattern != null) // loose comparison to catch undefined
+    .some(pattern => pattern.test(origin) || pattern.test(`${origin}/`)); // allowing for trailing '/'
+  }
 
-  _proto.handleError = function handleError(error) {
-    var uppy = this.plugin.uppy;
+  handleError(error) {
+    const {
+      uppy
+    } = this.plugin;
     uppy.log(error.toString());
@@ -511,24 +505,23 @@
 
-    var message = uppy.i18n('companionError');
+    const message = uppy.i18n('companionError');
     uppy.info({
-      message: message,
+      message,
       details: error.toString()
     }, 'error', 5000);
-  };
+  }
 
-  _proto.handleScroll = function handleScroll(e) {
-    var _this5 = this;
+  handleScroll(e) {
+    const scrollPos = e.target.scrollHeight - (e.target.scrollTop + e.target.offsetHeight);
+    const path = this.nextPagePath || null;
 
-    var scrollPos = e.target.scrollHeight - (e.target.scrollTop + e.target.offsetHeight);
-    var path = this.nextPagePath || null;
-
     if (scrollPos < 50 && path && !this._isHandlingScroll) {
-      this.provider.list(path).then(function (res) {
-        var _this5$plugin$getPlug = _this5.plugin.getPluginState(),
-            files = _this5$plugin$getPlug.files,
-            folders = _this5$plugin$getPlug.folders;
+      this.provider.list(path).then(res => {
+        const {
+          files,
+          folders
+        } = this.plugin.getPluginState();
 
-        _this5._updateFilesAndFolders(res, files, folders);
-      }).catch(this.handleError).then(function () {
-        _this5._isHandlingScroll = false;
+        this._updateFilesAndFolders(res, files, folders);
+      }).catch(this.handleError).then(() => {
+        this._isHandlingScroll = false;
       }); // always called
@@ -538,78 +531,61 @@
     }
-  };
+  }
 
-  _proto.listAllFiles = function listAllFiles(path, files) {
-    var _this6 = this;
-
-    if (files === void 0) {
-      files = null;
-    }
-
+  listAllFiles(path, files = null) {
     files = files || [];
-    return new Promise(function (resolve, reject) {
-      _this6.provider.list(path).then(function (res) {
-        res.items.forEach(function (item) {
+    return new Promise((resolve, reject) => {
+      this.provider.list(path).then(res => {
+        res.items.forEach(item => {
           if (!item.isFolder) {
             files.push(item);
           } else {
-            _this6.addFolder(item);
+            this.addFolder(item);
           }
         });
-        var moreFiles = res.nextPagePath || null;
+        const moreFiles = res.nextPagePath || null;
 
         if (moreFiles) {
-          return _this6.listAllFiles(moreFiles, files).then(function (files) {
-            return resolve(files);
-          }).catch(function (e) {
-            return reject(e);
-          });
+          return this.listAllFiles(moreFiles, files).then(files => resolve(files)).catch(e => reject(e));
         }
 
         return resolve(files);
-      }).catch(function (e) {
-        return reject(e);
-      });
+      }).catch(e => reject(e));
     });
-  };
+  }
 
-  _proto.donePicking = function donePicking() {
-    var _this7 = this;
-
-    var _this$plugin$getPlugi = this.plugin.getPluginState(),
-        currentSelection = _this$plugin$getPlugi.currentSelection;
-
-    var promises = currentSelection.map(function (file) {
+  donePicking() {
+    const {
+      currentSelection
+    } = this.plugin.getPluginState();
+    const promises = currentSelection.map(file => {
       if (file.isFolder) {
-        return _this7.addFolder(file);
+        return this.addFolder(file);
       }
 
-      return _this7.addFile(file);
+      return this.addFile(file);
     });
 
-    this._sharedHandler.loaderWrapper(Promise.all(promises), function () {
-      _this7.clearSelection();
-    }, function () {});
-  };
+    this._sharedHandler.loaderWrapper(Promise.all(promises), () => {
+      this.clearSelection();
+    }, () => {});
+  }
 
-  _proto.cancelPicking = function cancelPicking() {
+  cancelPicking() {
     this.clearSelection();
-    var dashboard = this.plugin.uppy.getPlugin('Dashboard');
+    const dashboard = this.plugin.uppy.getPlugin('Dashboard');
     if (dashboard) dashboard.hideAllPanels();
-  };
+  }
 
-  _proto.clearSelection = function clearSelection() {
+  clearSelection() {
     this.plugin.setPluginState({
       currentSelection: []
     });
-  };
+  }
 
-  _proto.render = function render(state, viewOptions) {
-    if (viewOptions === void 0) {
-      viewOptions = {};
-    }
+  render(state, viewOptions = {}) {
+    const {
+      authenticated,
+      didFirstRender
+    } = this.plugin.getPluginState();
 
-    var _this$plugin$getPlugi2 = this.plugin.getPluginState(),
-        authenticated = _this$plugin$getPlugi2.authenticated,
-        didFirstRender = _this$plugin$getPlugi2.didFirstRender;
-
     if (!didFirstRender) {
@@ -641,5 +617,6 @@ this.preFirstRender();
 
-    var targetViewOptions = _extends({}, this.opts, viewOptions);
-
-    var headerProps = {
+    const targetViewOptions = { ...this.opts,
+      ...viewOptions
+    };
+    const headerProps = {
       showBreadcrumbs: targetViewOptions.showBreadcrumbs,
@@ -654,4 +631,3 @@ getFolder: this.getFolder,
     };
-
-    var browserProps = _extends({}, this.plugin.getPluginState(), {
+    const browserProps = { ...this.plugin.getPluginState(),
       username: this.username,
@@ -680,11 +656,9 @@ getNextFolder: this.getNextFolder,
       uppyFiles: this.plugin.uppy.getFiles(),
-      validateRestrictions: this.plugin.uppy.validateRestrictions
-    });
-
+      validateRestrictions: (...args) => this.plugin.uppy.validateRestrictions(...args)
+    };
     return h(CloseWrapper, {
       onUnmount: this.clearSelection
     }, h(Browser, browserProps));
-  };
+  }
 
-  return ProviderView;
-}(), _class.VERSION = "1.12.3", _temp);
+}, _class.VERSION = "2.0.0-alpha.0", _temp);

lib/ProviderView/User.js

@@ -1,5 +0,8 @@
-var _require = require('preact'),
-    h = _require.h;
+"use strict";
 
-module.exports = function (props) {
+const {
+  h
+} = require('preact');
+
+module.exports = props => {
   return [h("span", {
@@ -6,0 +9,0 @@ className: "uppy-ProviderBrowser-user",

lib/SearchProviderView/Header.js

@@ -1,5 +0,8 @@
-var _require = require('preact'),
-    h = _require.h;
+"use strict";
 
-module.exports = function (props) {
+const {
+  h
+} = require('preact');
+
+module.exports = props => {
   return h("button", {
@@ -6,0 +9,0 @@ type: "button",

lib/SearchProviderView/index.js

@@ -0,1 +1,3 @@
+"use strict";
+
 module.exports = require('./SearchProviderView');

lib/SearchProviderView/InputView.js

@@ -1,8 +0,11 @@
-var _require = require('preact'),
-    h = _require.h;
+"use strict";
 
-module.exports = function (props) {
-  var input;
+const {
+  h
+} = require('preact');
 
-  var handleKeyPress = function handleKeyPress(ev) {
+module.exports = props => {
+  let input;
+
+  const handleKeyPress = ev => {
     if (ev.keyCode === 13) {
@@ -13,3 +16,3 @@ validateAndSearch();
 
-  var validateAndSearch = function validateAndSearch() {
+  const validateAndSearch = () => {
     if (input.value) {
@@ -28,3 +31,3 @@ props.search(input.value);
     onKeyUp: handleKeyPress,
-    ref: function ref(input_) {
+    ref: input_ => {
       input = input_;
@@ -31,0 +34,0 @@ },

lib/SearchProviderView/SearchProviderView.js

@@ -0,25 +1,26 @@
+"use strict";
+
 var _class, _temp;
 
-function _extends() { _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; }; return _extends.apply(this, arguments); }
+const {
+  h
+} = require('preact');
 
-var _require = require('preact'),
-    h = _require.h;
+const generateFileID = require('@uppy/utils/lib/generateFileID');
 
-var SearchInput = require('./InputView');
+const getFileType = require('@uppy/utils/lib/getFileType');
 
-var Browser = require('../Browser');
+const isPreviewSupported = require('@uppy/utils/lib/isPreviewSupported');
 
-var LoaderView = require('../Loader');
+const SearchInput = require('./InputView');
 
-var generateFileID = require('@uppy/utils/lib/generateFileID');
+const Browser = require('../Browser');
 
-var getFileType = require('@uppy/utils/lib/getFileType');
+const LoaderView = require('../Loader');
 
-var isPreviewSupported = require('@uppy/utils/lib/isPreviewSupported');
+const Header = require('./Header');
 
-var Header = require('./Header');
+const SharedHandler = require('../SharedHandler');
 
-var SharedHandler = require('../SharedHandler');
-
-var CloseWrapper = require('../CloseWrapper');
+const CloseWrapper = require('../CloseWrapper');
 /**
@@ -30,3 +31,3 @@ * Class to easily generate generic views for Provider plugins
 
-module.exports = (_temp = _class = /*#__PURE__*/function () {
+module.exports = (_temp = _class = class ProviderView {
   /**
@@ -36,3 +37,3 @@ * @param {object} plugin instance of the plugin
    */
-  function ProviderView(plugin, opts) {
+  constructor(plugin, opts) {
     this.plugin = plugin;
@@ -42,3 +43,3 @@ this.provider = opts.provider;
 
-    var defaultOptions = {
+    const defaultOptions = {
       viewType: 'grid',
@@ -50,3 +51,5 @@ showTitles: false,
 
-    this.opts = _extends({}, defaultOptions, opts); // Logic
+    this.opts = { ...defaultOptions,
+      ...opts
+    }; // Logic
 
@@ -76,11 +79,9 @@ this.search = this.search.bind(this);
 
-  var _proto = ProviderView.prototype;
+  tearDown() {// Nothing.
+  }
 
-  _proto.tearDown = function tearDown() {// Nothing.
-  };
-
-  _proto._updateFilesAndInputMode = function _updateFilesAndInputMode(res, files) {
+  _updateFilesAndInputMode(res, files) {
     this.nextPageQuery = res.nextPageQuery;
     this._searchTerm = res.searchedFor;
-    res.items.forEach(function (item) {
+    res.items.forEach(item => {
       files.push(item);
@@ -90,3 +91,3 @@ });
       isInputMode: false,
-      files: files
+      files
     });
@@ -98,5 +99,5 @@ }
    */
-  ;
 
-  _proto.preFirstRender = function preFirstRender() {
+
+  preFirstRender() {
     this.plugin.setPluginState({
@@ -106,7 +107,5 @@ didFirstRender: true
     this.plugin.onFirstRender();
-  };
+  }
 
-  _proto.search = function search(query) {
-    var _this = this;
-
+  search(query) {
     if (query && query === this._searchTerm) {
@@ -120,8 +119,8 @@ // no need to search again as this is the same as the previous search
 
-    return this._sharedHandler.loaderWrapper(this.provider.search(query), function (res) {
-      _this._updateFilesAndInputMode(res, []);
+    return this._sharedHandler.loaderWrapper(this.provider.search(query), res => {
+      this._updateFilesAndInputMode(res, []);
     }, this.handleError);
-  };
+  }
 
-  _proto.triggerSearchInput = function triggerSearchInput() {
+  triggerSearchInput() {
     this.plugin.setPluginState({
@@ -132,6 +131,6 @@ isInputMode: true
   // maybe we should consider creating a base ProviderPlugin class that has this method
-  ;
 
-  _proto.addFile = function addFile(file) {
-    var tagFile = {
+
+  addFile(file) {
+    const tagFile = {
       id: this.providerFileToId(file),
@@ -148,12 +147,12 @@ source: this.plugin.id,
         companionUrl: this.plugin.opts.companionUrl,
-        url: "" + this.provider.fileUrl(file.requestPath),
+        url: `${this.provider.fileUrl(file.requestPath)}`,
         body: {
           fileId: file.id
         },
-        providerOptions: _extends({}, this.provider.opts, {
+        providerOptions: { ...this.provider.opts,
           provider: null
-        })
+        }
       }
     };
-    var fileType = getFileType(tagFile); // TODO Should we just always use the thumbnail URL if it exists?
+    const fileType = getFileType(tagFile); // TODO Should we just always use the thumbnail URL if it exists?
 
@@ -173,5 +172,5 @@ if (fileType && isPreviewSupported(fileType)) {
     }
-  };
+  }
 
-  _proto.providerFileToId = function providerFileToId(file) {
+  providerFileToId(file) {
     return generateFileID({
@@ -182,28 +181,29 @@ data: file,
     });
-  };
+  }
 
-  _proto.handleError = function handleError(error) {
-    var uppy = this.plugin.uppy;
+  handleError(error) {
+    const {
+      uppy
+    } = this.plugin;
     uppy.log(error.toString());
-    var message = uppy.i18n('companionError');
+    const message = uppy.i18n('companionError');
     uppy.info({
-      message: message,
+      message,
       details: error.toString()
     }, 'error', 5000);
-  };
+  }
 
-  _proto.handleScroll = function handleScroll(e) {
-    var _this2 = this;
+  handleScroll(e) {
+    const scrollPos = e.target.scrollHeight - (e.target.scrollTop + e.target.offsetHeight);
+    const query = this.nextPageQuery || null;
 
-    var scrollPos = e.target.scrollHeight - (e.target.scrollTop + e.target.offsetHeight);
-    var query = this.nextPageQuery || null;
-
     if (scrollPos < 50 && query && !this._isHandlingScroll) {
-      this.provider.search(this._searchTerm, query).then(function (res) {
-        var _this2$plugin$getPlug = _this2.plugin.getPluginState(),
-            files = _this2$plugin$getPlug.files;
+      this.provider.search(this._searchTerm, query).then(res => {
+        const {
+          files
+        } = this.plugin.getPluginState();
 
-        _this2._updateFilesAndInputMode(res, files);
-      }).catch(this.handleError).then(function () {
-        _this2._isHandlingScroll = false;
+        this._updateFilesAndInputMode(res, files);
+      }).catch(this.handleError).then(() => {
+        this._isHandlingScroll = false;
       }); // always called
@@ -213,40 +213,33 @@
     }
-  };
+  }
 
-  _proto.donePicking = function donePicking() {
-    var _this3 = this;
+  donePicking() {
+    const {
+      currentSelection
+    } = this.plugin.getPluginState();
+    const promises = currentSelection.map(file => this.addFile(file));
 
-    var _this$plugin$getPlugi = this.plugin.getPluginState(),
-        currentSelection = _this$plugin$getPlugi.currentSelection;
+    this._sharedHandler.loaderWrapper(Promise.all(promises), () => {
+      this.clearSelection();
+    }, () => {});
+  }
 
-    var promises = currentSelection.map(function (file) {
-      return _this3.addFile(file);
-    });
-
-    this._sharedHandler.loaderWrapper(Promise.all(promises), function () {
-      _this3.clearSelection();
-    }, function () {});
-  };
-
-  _proto.cancelPicking = function cancelPicking() {
+  cancelPicking() {
     this.clearSelection();
-    var dashboard = this.plugin.uppy.getPlugin('Dashboard');
+    const dashboard = this.plugin.uppy.getPlugin('Dashboard');
     if (dashboard) dashboard.hideAllPanels();
-  };
+  }
 
-  _proto.clearSelection = function clearSelection() {
+  clearSelection() {
     this.plugin.setPluginState({
       currentSelection: []
     });
-  };
+  }
 
-  _proto.render = function render(state, viewOptions) {
-    if (viewOptions === void 0) {
-      viewOptions = {};
-    }
+  render(state, viewOptions = {}) {
+    const {
+      didFirstRender,
+      isInputMode
+    } = this.plugin.getPluginState();
 
-    var _this$plugin$getPlugi2 = this.plugin.getPluginState(),
-        didFirstRender = _this$plugin$getPlugi2.didFirstRender,
-        isInputMode = _this$plugin$getPlugi2.isInputMode;
-
     if (!didFirstRender) {
@@ -275,5 +268,6 @@ this.preFirstRender();
 
-    var targetViewOptions = _extends({}, this.opts, viewOptions);
-
-    var browserProps = _extends({}, this.plugin.getPluginState(), {
+    const targetViewOptions = { ...this.opts,
+      ...viewOptions
+    };
+    const browserProps = { ...this.plugin.getPluginState(),
       isChecked: this._sharedHandler.isChecked,
@@ -297,10 +291,8 @@ toggleCheckbox: this._sharedHandler.toggleCheckbox,
       validateRestrictions: this.plugin.uppy.validateRestrictions
-    });
-
+    };
     return h(CloseWrapper, {
       onUnmount: this.clearSelection
     }, h(Browser, browserProps));
-  };
+  }
 
-  return ProviderView;
-}(), _class.VERSION = "1.12.3", _temp);
+}, _class.VERSION = "2.0.0-alpha.0", _temp);

lib/SharedHandler.js

@@ -1,5 +0,7 @@
-var remoteFileObjToLocal = require('@uppy/utils/lib/remoteFileObjToLocal');
+"use strict";
 
-module.exports = /*#__PURE__*/function () {
-  function SharedHandler(plugin) {
+const remoteFileObjToLocal = require('@uppy/utils/lib/remoteFileObjToLocal');
+
+module.exports = class SharedHandler {
+  constructor(plugin) {
     this.plugin = plugin;
@@ -12,7 +14,5 @@ this.filterItems = this.filterItems.bind(this);
 
-  var _proto = SharedHandler.prototype;
+  filterItems(items) {
+    const state = this.plugin.getPluginState();
 
-  _proto.filterItems = function filterItems(items) {
-    var state = this.plugin.getPluginState();
-
     if (!state.filterInput || state.filterInput === '') {
@@ -22,3 +22,3 @@ return items;
 
-    return items.filter(function (folder) {
+    return items.filter(folder => {
       return folder.name.toLowerCase().indexOf(state.filterInput.toLowerCase()) !== -1;
@@ -34,47 +34,39 @@ });
    */
-  ;
 
-  _proto.toggleCheckbox = function toggleCheckbox(e, file) {
-    var _this = this;
 
+  toggleCheckbox(e, file) {
     e.stopPropagation();
     e.preventDefault();
     e.currentTarget.focus();
-
-    var _this$plugin$getPlugi = this.plugin.getPluginState(),
-        folders = _this$plugin$getPlugi.folders,
-        files = _this$plugin$getPlugi.files;
-
-    var items = this.filterItems(folders.concat(files)); // Shift-clicking selects a single consecutive list of items
+    const {
+      folders,
+      files
+    } = this.plugin.getPluginState();
+    const items = this.filterItems(folders.concat(files)); // Shift-clicking selects a single consecutive list of items
     // starting at the previous click and deselects everything else.
 
     if (this.lastCheckbox && e.shiftKey) {
-      var _currentSelection;
-
-      var prevIndex = items.indexOf(this.lastCheckbox);
-      var currentIndex = items.indexOf(file);
-
-      if (prevIndex < currentIndex) {
-        _currentSelection = items.slice(prevIndex, currentIndex + 1);
-      } else {
-        _currentSelection = items.slice(currentIndex, prevIndex + 1);
-      } // Check restrictions on each file in currentSelection,
+      const prevIndex = items.indexOf(this.lastCheckbox);
+      const currentIndex = items.indexOf(file);
+      const currentSelection = prevIndex < currentIndex ? items.slice(prevIndex, currentIndex + 1) : items.slice(currentIndex, prevIndex + 1);
+      const reducedCurrentSelection = []; // Check restrictions on each file in currentSelection,
       // reduce it to only contain files that pass restrictions
 
+      for (const item of currentSelection) {
+        const {
+          uppy
+        } = this.plugin;
+        const validatedRestrictions = uppy.validateRestrictions(remoteFileObjToLocal(item), [...uppy.getFiles(), ...reducedCurrentSelection]);
 
-      _currentSelection = _currentSelection.reduce(function (reducedCurrentSelection, item) {
-        var uppy = _this.plugin.uppy;
-        var validatedRestrictions = uppy.validateRestrictions(remoteFileObjToLocal(item), [].concat(uppy.getFiles(), reducedCurrentSelection));
-
-        if (!validatedRestrictions.result) {
+        if (validatedRestrictions.result) {
+          reducedCurrentSelection.push(item);
+        } else {
           uppy.info({
             message: validatedRestrictions.reason
           }, 'error', uppy.opts.infoTimeout);
-          return reducedCurrentSelection;
         }
+      }
 
-        return [].concat(reducedCurrentSelection, [item]);
-      });
       this.plugin.setPluginState({
-        currentSelection: _currentSelection
+        currentSelection: reducedCurrentSelection
       });
@@ -85,11 +77,9 @@ return;
     this.lastCheckbox = file;
+    const {
+      currentSelection
+    } = this.plugin.getPluginState();
 
-    var _this$plugin$getPlugi2 = this.plugin.getPluginState(),
-        currentSelection = _this$plugin$getPlugi2.currentSelection;
-
     if (this.isChecked(file)) {
       this.plugin.setPluginState({
-        currentSelection: currentSelection.filter(function (item) {
-          return item.id !== file.id;
-        })
+        currentSelection: currentSelection.filter(item => item.id !== file.id)
       });
@@ -101,29 +91,23 @@ } else {
     }
-  };
+  }
 
-  _proto.isChecked = function isChecked(file) {
-    var _this$plugin$getPlugi3 = this.plugin.getPluginState(),
-        currentSelection = _this$plugin$getPlugi3.currentSelection; // comparing id instead of the file object, because the reference to the object
+  isChecked(file) {
+    const {
+      currentSelection
+    } = this.plugin.getPluginState(); // comparing id instead of the file object, because the reference to the object
     // changes when we switch folders, and the file list is updated
 
+    return currentSelection.some(item => item.id === file.id);
+  }
 
-    return currentSelection.some(function (item) {
-      return item.id === file.id;
-    });
-  };
-
-  _proto.loaderWrapper = function loaderWrapper(promise, then, catch_) {
-    var _this2 = this;
-
-    promise.then(function (result) {
-      _this2.plugin.setPluginState({
+  loaderWrapper(promise, then, catch_) {
+    promise.then(result => {
+      this.plugin.setPluginState({
         loading: false
       });
-
       then(result);
-    }).catch(function (err) {
-      _this2.plugin.setPluginState({
+    }).catch(err => {
+      this.plugin.setPluginState({
         loading: false
       });
-
       catch_(err);
@@ -134,5 +118,4 @@ });
     });
-  };
+  }
 
-  return SharedHandler;
-}();
+};

package.json

 {
   "name": "@uppy/provider-views",
   "description": "View library for Uppy remote provider plugins.",
-  "version": "1.12.3",
+  "version": "2.0.0-alpha.0",
   "license": "MIT",
@@ -22,5 +22,5 @@ "main": "lib/index.js",
   "dependencies": {
-    "@uppy/utils": "^3.6.2",
+    "@uppy/utils": "^4.0.0-alpha.0",
     "classnames": "^2.2.6",
-    "preact": "8.2.9"
+    "preact": "^10.5.13"
   },
@@ -30,3 +30,3 @@ "peerDependencies": {
   },
-  "gitHead": "4b782ffbbb443672843d7b4096956bed3b11d612"
+  "gitHead": "113b627dd0ef5aa5d198dc309dda05da2117dfe5"
 }

README.md

@@ -15,7 +15,6 @@ # @uppy/provider-views
 ```js
-const Plugin = require('@uppy/core/lib/plugin')
-const { ProviderViews } = require('@uppy/provider-views')
+import Plugin from '@uppy/core/lib/plugin'
+import { ProviderViews } from '@uppy/provider-views'
 
-class GoogleDrive extends Plugin {
-  constructor () { /* snip */ }
+class GoogleDrive extends UIPlugin {
   install () {
@@ -29,3 +28,3 @@ this.view = new ProviderViews(this)
       this.provider.fetchPreAuthToken(),
-      this.view.getFolder('root', '/')
+      this.view.getFolder('root', '/'),
     ])
@@ -32,0 +31,0 @@ }

src/Breadcrumbs.js

@@ -1,16 +0,17 @@
-const { h } = require('preact')
+const { h, Fragment } = require('preact')
 
-// TODO use Fragment when upgrading to preact X
 const Breadcrumb = (props) => {
+  const { getFolder, title, isLast } = props
+
   return (
-    <span>
+    <Fragment>
       <button
         type="button"
         className="uppy-u-reset"
-        onClick={props.getFolder}
+        onClick={getFolder}
       >
-        {props.title}
+        {title}
       </button>
-      {!props.isLast ? ' / ' : ''}
-    </span>
+      {!isLast ? ' / ' : ''}
+    </Fragment>
   )
@@ -20,12 +21,14 @@ }
 module.exports = (props) => {
+  const { getFolder, title, breadcrumbsIcon, directories } = props
+
   return (
     <div className="uppy-Provider-breadcrumbs">
-      <div className="uppy-Provider-breadcrumbsIcon">{props.breadcrumbsIcon}</div>
+      <div className="uppy-Provider-breadcrumbsIcon">{breadcrumbsIcon}</div>
       {
-        props.directories.map((directory, i) => (
+        directories.map((directory, i) => (
           <Breadcrumb
             key={directory.id}
-            getFolder={() => props.getFolder(directory.id)}
-            title={i === 0 ? props.title : directory.title}
-            isLast={i + 1 === props.directories.length}
+            getFolder={() => getFolder(directory.id)}
+            title={i === 0 ? title : directory.title}
+            isLast={i + 1 === directories.length}
           />
@@ -32,0 +35,0 @@ ))

src/Browser.js

 const classNames = require('classnames')
+const { h } = require('preact')
 const Filter = require('./Filter')
 const ItemList = require('./ItemList')
 const FooterActions = require('./FooterActions')
-const { h } = require('preact')
 
@@ -7,0 +7,0 @@ const Browser = (props) => {

src/CloseWrapper.js

@@ -1,11 +0,13 @@
-const { Component } = require('preact')
+const { Component, toChildArray } = require('preact')
 
 module.exports = class CloseWrapper extends Component {
   componentWillUnmount () {
-    this.props.onUnmount()
+    const { onUnmount } = this.props
+    onUnmount()
   }
 
   render () {
-    return this.props.children[0]
+    const { children } = this.props
+    return toChildArray(children)[0]
   }
 }

src/Item/components/GridLi.js

 const { h } = require('preact')
 
-// it could be a <li><button class="fake-checkbox"/> <button/></li>
-module.exports = (props) => {
+function GridListItem (props) {
+  const {
+    className,
+    isDisabled,
+    restrictionReason,
+    isChecked,
+    title,
+    itemIconEl,
+    showTitles,
+    toggleCheckbox,
+    id,
+  } = props
+
   return (
-    <li className={props.className} title={props.isDisabled ? props.restrictionReason : null}>
-      <div aria-hidden className={`uppy-ProviderBrowserItem-fakeCheckbox ${props.isChecked ? 'uppy-ProviderBrowserItem-fakeCheckbox--is-checked' : ''}`} />
-      <button
-        type="button"
+    <li
+      className={className}
+      title={isDisabled ? restrictionReason : null}
+    >
+      <input
+        type="checkbox"
+        className={`uppy-u-reset uppy-ProviderBrowserItem-checkbox ${
+          isChecked ? 'uppy-ProviderBrowserItem-checkbox--is-checked' : ''
+        } uppy-ProviderBrowserItem-checkbox--grid`}
+        onChange={toggleCheckbox}
+        name="listitem"
+        id={id}
+        checked={isChecked}
+        disabled={isDisabled}
+        data-uppy-super-focusable
+      />
+      <label
+        htmlFor={id}
+        aria-label={title}
         className="uppy-u-reset uppy-ProviderBrowserItem-inner"
-        onClick={props.toggleCheckbox}
-        role="option"
-        aria-label={props.isChecked ? props.i18n('unselectFileNamed', { name: props.title }) : props.i18n('selectFileNamed', { name: props.title })}
-        aria-selected={props.isChecked}
-        aria-disabled={props.isDisabled}
-        disabled={props.isDisabled}
-        data-uppy-super-focusable
       >
-        {props.itemIconEl}
-        {props.showTitles && props.title}
-      </button>
+        {itemIconEl}
+        {showTitles && title}
+      </label>
     </li>
   )
 }
+
+module.exports = GridListItem

src/Item/components/ListLi.js

 const { h } = require('preact')
 
-const getAriaLabelOfCheckbox = (props) => {
-  if (props.type === 'folder') {
-    if (props.isChecked) {
-      return props.i18n('unselectAllFilesFromFolderNamed', { name: props.title })
-    }
-    return props.i18n('selectAllFilesFromFolderNamed', { name: props.title })
-  }
-  if (props.isChecked) {
-    return props.i18n('unselectFileNamed', { name: props.title })
-  }
-  return props.i18n('selectFileNamed', { name: props.title })
-}
-
 // if folder:
@@ -22,17 +9,36 @@ //   + checkbox (selects all files from folder)
 //   + file name (selects file)
-module.exports = (props) => {
+
+function ListItem (props) {
+  const {
+    className,
+    isDisabled,
+    restrictionReason,
+    isCheckboxDisabled,
+    isChecked,
+    toggleCheckbox,
+    type,
+    id,
+    itemIconEl,
+    title,
+    handleFolderClick,
+    showTitles,
+    i18n,
+  } = props
+
   return (
-    <li className={props.className} title={props.isDisabled ? props.restrictionReason : null}>
-      {!props.isCheckboxDisabled ? (
-        <button
-          type="button"
-          className={`uppy-u-reset uppy-ProviderBrowserItem-fakeCheckbox ${props.isChecked ? 'uppy-ProviderBrowserItem-fakeCheckbox--is-checked' : ''}`}
-          onClick={props.toggleCheckbox}
+    <li
+      className={className}
+      title={isDisabled ? restrictionReason : null}
+    >
+      {!isCheckboxDisabled ? (
+        <input
+          type="checkbox"
+          className={`uppy-u-reset uppy-ProviderBrowserItem-checkbox ${isChecked ? 'uppy-ProviderBrowserItem-checkbox--is-checked' : ''}`}
+          onChange={toggleCheckbox}
           // for the <label/>
-          id={props.id}
-          role="option"
-          aria-label={getAriaLabelOfCheckbox(props)}
-          aria-selected={props.isChecked}
-          aria-disabled={props.isDisabled}
-          disabled={props.isDisabled}
+          name="listitem"
+          id={id}
+          checked={isChecked}
+          aria-label={type === 'file' ? null : i18n('allFilesFromFolderNamed', { name: title })}
+          disabled={isDisabled}
           data-uppy-super-focusable
@@ -42,9 +48,12 @@ />
 
-      {props.type === 'file' ? (
+      {type === 'file' ? (
         // label for a checkbox
-        <label htmlFor={props.id} className="uppy-u-reset uppy-ProviderBrowserItem-inner">
+        <label
+          htmlFor={id}
+          className="uppy-u-reset uppy-ProviderBrowserItem-inner"
+        >
           <div className="uppy-ProviderBrowserItem-iconWrap">
-            {props.itemIconEl}
+            {itemIconEl}
           </div>
-          {props.showTitles && props.title}
+          {showTitles && title}
         </label>
@@ -56,9 +65,9 @@ ) : (
           className="uppy-u-reset uppy-ProviderBrowserItem-inner"
-          onClick={props.handleFolderClick}
-          aria-label={props.i18n('openFolderNamed', { name: props.title })}
+          onClick={handleFolderClick}
+          aria-label={i18n('openFolderNamed', { name: title })}
         >
           <div className="uppy-ProviderBrowserItem-iconWrap">
-            {props.itemIconEl}
+            {itemIconEl}
           </div>
-          {props.showTitles && <span>{props.title}</span>}
+          {showTitles && <span>{title}</span>}
         </button>
@@ -69,1 +78,3 @@ )}
 }
+
+module.exports = ListItem

src/ProviderView/ProviderView.js

 const { h } = require('preact')
+const generateFileID = require('@uppy/utils/lib/generateFileID')
+const getFileType = require('@uppy/utils/lib/getFileType')
+const findIndex = require('@uppy/utils/lib/findIndex')
+const isPreviewSupported = require('@uppy/utils/lib/isPreviewSupported')
 const AuthView = require('./AuthView')
@@ -6,15 +10,7 @@ const Header = require('./Header')
 const LoaderView = require('../Loader')
-const generateFileID = require('@uppy/utils/lib/generateFileID')
-const getFileType = require('@uppy/utils/lib/getFileType')
-const findIndex = require('@uppy/utils/lib/findIndex')
-const isPreviewSupported = require('@uppy/utils/lib/isPreviewSupported')
 const SharedHandler = require('../SharedHandler')
 const CloseWrapper = require('../CloseWrapper')
 
-// location.origin does not exist in IE
 function getOrigin () {
-  if ('origin' in location) {
-    return location.origin // eslint-disable-line compat/compat
-  }
-  return `${location.protocol}//${location.hostname}${location.port ? `:${location.port}` : ''}`
+  return location.origin
 }
@@ -312,14 +308,32 @@
     const folders = { ...state.selectedFolders }
+
     if (folderId in folders && folders[folderId].loading) {
       return
     }
+
     folders[folderId] = { loading: true, files: [] }
+
     this.plugin.setPluginState({ selectedFolders: { ...folders } })
+
+    // eslint-disable-next-line consistent-return
     return this.listAllFiles(folder.requestPath).then((files) => {
       let count = 0
-      files.forEach((file) => {
-        const success = this.addFile(file)
-        if (success) count++
+
+      // If the same folder is added again, we don't want to send
+      // X amount of duplicate file notifications, we want to say
+      // the folder was already added. This checks if all files are duplicate,
+      // if that's the case, we don't add the files.
+      files.forEach(file => {
+        const id = this.providerFileToId(file)
+        if (!this.plugin.uppy.checkIfFileAlreadyExists(id)) {
+          count++
+        }
       })
+
+      if (count > 0) {
+        files.forEach((file) => this.addFile(file))
+      }
+
       const ids = files.map(this.providerFileToId)
+
       folders[folderId] = {
@@ -332,3 +346,8 @@ loading: false,
       let message
-      if (files.length) {
+
+      if (count === 0) {
+        message = this.plugin.uppy.i18n('folderAlreadyAdded', {
+          folder: folder.name,
+        })
+      } else if (files.length) {
         message = this.plugin.uppy.i18n('folderAdded', {
@@ -340,2 +359,3 @@ smart_count: count, folder: folder.name,
       }
+
       this.plugin.uppy.info(message)
@@ -404,3 +424,3 @@ }).catch((e) => {
   handleError (error) {
-    const uppy = this.plugin.uppy
+    const { uppy } = this.plugin
     uppy.log(error.toString())
@@ -544,3 +564,3 @@ if (error.isAuthError) {
       uppyFiles: this.plugin.uppy.getFiles(),
-      validateRestrictions: this.plugin.uppy.validateRestrictions,
+      validateRestrictions: (...args) => this.plugin.uppy.validateRestrictions(...args),
     }
@@ -547,0 +567,0 @@

src/SearchProviderView/SearchProviderView.js

 const { h } = require('preact')
+const generateFileID = require('@uppy/utils/lib/generateFileID')
+const getFileType = require('@uppy/utils/lib/getFileType')
+const isPreviewSupported = require('@uppy/utils/lib/isPreviewSupported')
 const SearchInput = require('./InputView')
 const Browser = require('../Browser')
 const LoaderView = require('../Loader')
-const generateFileID = require('@uppy/utils/lib/generateFileID')
-const getFileType = require('@uppy/utils/lib/getFileType')
-const isPreviewSupported = require('@uppy/utils/lib/isPreviewSupported')
 const Header = require('./Header')
@@ -152,3 +152,3 @@ const SharedHandler = require('../SharedHandler')
   handleError (error) {
-    const uppy = this.plugin.uppy
+    const { uppy } = this.plugin
     uppy.log(error.toString())
@@ -155,0 +155,0 @@ const message = uppy.i18n('companionError')

src/SharedHandler.js

@@ -39,14 +39,13 @@ const remoteFileObjToLocal = require('@uppy/utils/lib/remoteFileObjToLocal')
     if (this.lastCheckbox && e.shiftKey) {
-      let currentSelection
       const prevIndex = items.indexOf(this.lastCheckbox)
       const currentIndex = items.indexOf(file)
-      if (prevIndex < currentIndex) {
-        currentSelection = items.slice(prevIndex, currentIndex + 1)
-      } else {
-        currentSelection = items.slice(currentIndex, prevIndex + 1)
-      }
+      const currentSelection = (prevIndex < currentIndex)
+        ? items.slice(prevIndex, currentIndex + 1)
+        : items.slice(currentIndex, prevIndex + 1)
+      const reducedCurrentSelection = []
+
       // Check restrictions on each file in currentSelection,
       // reduce it to only contain files that pass restrictions
-      currentSelection = currentSelection.reduce((reducedCurrentSelection, item) => {
-        const uppy = this.plugin.uppy
+      for (const item of currentSelection) {
+        const { uppy } = this.plugin
         const validatedRestrictions = uppy.validateRestrictions(
@@ -56,9 +55,9 @@ remoteFileObjToLocal(item),
         )
-        if (!validatedRestrictions.result) {
+        if (validatedRestrictions.result) {
+          reducedCurrentSelection.push(item)
+        } else {
           uppy.info({ message: validatedRestrictions.reason }, 'error', uppy.opts.infoTimeout)
-          return reducedCurrentSelection
         }
-        return [...reducedCurrentSelection, item]
-      })
-      this.plugin.setPluginState({ currentSelection })
+      }
+      this.plugin.setPluginState({ currentSelection: reducedCurrentSelection })
       return
@@ -65,0 +64,0 @@ }

types/index.d.ts

@@ -1,6 +0,6 @@
-import CompanionClient = require('@uppy/companion-client')
-import Uppy = require('@uppy/core')
+import type { UIPlugin } from '@uppy/core'
+import type { Provider } from '@uppy/companion-client'
 
 interface ProviderViewOptions {
-    provider: CompanionClient.Provider
+    provider: Provider
     viewType?: 'list' | 'grid'
@@ -16,8 +16,7 @@ showTitles?: boolean
 
-
 declare class ProviderView {
-    constructor (plugin: Uppy.Plugin & OnFirstRenderer, opts: ProviderViewOptions)
-    // @todo add other provider view methods
+  constructor (plugin: UIPlugin & OnFirstRenderer, opts: ProviderViewOptions)
+  // @todo add other provider view methods
 }
 
-export = ProviderView
+export default ProviderView

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

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

Lines of code

3333

increased by0.42%

Worsened metrics

Total package byte prevSize

234676

decreased by-4.01%

Number of low quality alerts

1

increased byInfinity%

Number of lines in readme file

54

decreased by-1.82%

Dependency changes

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

• + Addedpreact@10.24.3(transitive)

• Updated@uppy/utils@^4.0.0-alpha.0

• Updatedpreact@^10.5.13