cozy-ui-plus 1.1.0

package/dist/UploadQueue/Item.js

@@ -0,0 +1,132 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _file = require("cozy-client/dist/models/file");
+
+var _Icon = _interopRequireDefault(require("cozy-ui/transpiled/react/Icon"));
+
+var _ListItem = _interopRequireDefault(require("cozy-ui/transpiled/react/ListItem"));
+
+var _ListItemIcon = _interopRequireDefault(require("cozy-ui/transpiled/react/ListItemIcon"));
+
+var _ListItemText = _interopRequireDefault(require("cozy-ui/transpiled/react/ListItemText"));
+
+var _Typography = _interopRequireDefault(require("cozy-ui/transpiled/react/Typography"));
+
+var _Media = require("cozy-ui/transpiled/react/deprecated/Media");
+
+var _I18n = require("cozy-ui/transpiled/react/providers/I18n");
+
+var _FileUploadProgress = _interopRequireDefault(require("./FileUploadProgress"));
+
+var _Pending = _interopRequireDefault(require("./Pending"));
+
+var _index = require("./index");
+
+var _useStatusIcon = require("./useStatusIcon");
+
+var styles = {
+  "upload-queue": "styles__upload-queue___3EfQa",
+  "upload-queue__threshold-bar": "styles__upload-queue__threshold-bar___e-fnL",
+  "upload-queue__progress-caption": "styles__upload-queue__progress-caption___37X7k",
+  "upload-queue__upload-progress": "styles__upload-queue__upload-progress___2Z9qx",
+  "upload-queue--popover": "styles__upload-queue--popover___2Oj-U",
+  "upload-queue--visible": "styles__upload-queue--visible___3FkzH",
+  "upload-queue-header": "styles__upload-queue-header___1nUv9",
+  "upload-queue-header-inner": "styles__upload-queue-header-inner___-pA9p",
+  "upload-queue-progress": "styles__upload-queue-progress___3ijZA",
+  "upload-queue-content": "styles__upload-queue-content___29pyu",
+  "upload-queue--collapsed": "styles__upload-queue--collapsed___3Er09",
+  "upload-queue-list": "styles__upload-queue-list___30_J-",
+  "upload-queue-item--error": "styles__upload-queue-item--error___1ChsD",
+  "upload-queue-item--done": "styles__upload-queue-item--done___1eJjw",
+  "item-file": "styles__item-file___AdWET",
+  "item-status": "styles__item-status___2xjeD",
+  "spin": "styles__spin___1u3cT",
+  "shake": "styles__shake___pfzot"
+};
+
+var Item = function Item(_ref) {
+  var _cx;
+
+  var file = _ref.file,
+      status = _ref.status,
+      isDirectory = _ref.isDirectory,
+      progress = _ref.progress,
+      getMimeTypeIcon = _ref.getMimeTypeIcon;
+  var CANCEL = _index.uploadStatus.CANCEL,
+      LOADING = _index.uploadStatus.LOADING,
+      DONE_STATUSES = _index.uploadStatus.DONE_STATUSES,
+      ERROR_STATUSES = _index.uploadStatus.ERROR_STATUSES,
+      PENDING = _index.uploadStatus.PENDING;
+
+  var _splitFilename = (0, _file.splitFilename)(file),
+      filename = _splitFilename.filename,
+      extension = _splitFilename.extension;
+
+  var done = false;
+  var error = false;
+  /**
+   * Status came from the Upload Queue, but sometimes we're using
+   * manual upload without using the Upload Queue system but we're still
+   * using the UI component. When this is the case, the file handles on
+   * his own its status.
+   */
+
+  var statusToUse = file.status ? file.status : status;
+
+  if (statusToUse !== LOADING && statusToUse !== CANCEL) {
+    if (ERROR_STATUSES.includes(statusToUse)) {
+      error = true;
+    } else if (DONE_STATUSES.includes(statusToUse)) {
+      done = true;
+    }
+  }
+
+  var statusIcon = (0, _useStatusIcon.useStatusIcon)(statusToUse, progress);
+  var isPending = statusToUse !== LOADING && statusToUse !== CANCEL && !ERROR_STATUSES.includes(statusToUse) && !DONE_STATUSES.includes(statusToUse) && statusToUse === PENDING;
+  return /*#__PURE__*/_react.default.createElement(_ListItem.default, {
+    divider: true,
+    "data-testid": "upload-queue-item",
+    className: (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, styles['upload-queue-item--done'], done), (0, _defineProperty2.default)(_cx, styles['upload-queue-item--error'], error), _cx))
+  }, getMimeTypeIcon ? /*#__PURE__*/_react.default.createElement(_ListItemIcon.default, {
+    className: "u-ta-center"
+  }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
+    icon: getMimeTypeIcon(isDirectory, file.name, file.type),
+    size: 32,
+    className: "u-mr-1"
+  })) : null, /*#__PURE__*/_react.default.createElement(_ListItemText.default, {
+    disableTypography: true,
+    primary: /*#__PURE__*/_react.default.createElement("div", {
+      "data-testid": "upload-queue-item-name",
+      className: "u-ellipsis"
+    }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+      variant: "body1",
+      className: "u-ellipsis"
+    }, filename, extension && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+      component: "span",
+      variant: "body1",
+      color: "textSecondary",
+      className: "u-dib"
+    }, extension))),
+    secondary: progress ? /*#__PURE__*/_react.default.createElement(_FileUploadProgress.default, {
+      progress: progress
+    }) : null
+  }), statusIcon && /*#__PURE__*/_react.default.createElement(_ListItemIcon.default, null, /*#__PURE__*/_react.default.createElement(_Media.Img, null, statusIcon)), isPending && /*#__PURE__*/_react.default.createElement(_Pending.default, null));
+};
+
+var _default = (0, _I18n.translate)()(Item);
+
+exports.default = _default;

package/dist/UploadQueue/Pending.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Typography = _interopRequireDefault(require("cozy-ui/transpiled/react/Typography"));
+
+var _I18n = require("cozy-ui/transpiled/react/providers/I18n");
+
+var Pending = (0, _I18n.translate)()(function (props) {
+  return /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    variant: "subtitle1",
+    color: "primary"
+  }, props.t('item.pending'));
+});
+var _default = Pending;
+exports.default = _default;

package/dist/UploadQueue/RemainingTime.js

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Typography = _interopRequireDefault(require("cozy-ui/transpiled/react/Typography"));
+
+var _I18n = require("cozy-ui/transpiled/react/providers/I18n");
+
+var _helpers = require("./helpers");
+
+var _index = require("./index");
+
+var styles = {
+  "upload-queue": "styles__upload-queue___3EfQa",
+  "upload-queue__threshold-bar": "styles__upload-queue__threshold-bar___e-fnL",
+  "upload-queue__progress-caption": "styles__upload-queue__progress-caption___37X7k",
+  "upload-queue__upload-progress": "styles__upload-queue__upload-progress___2Z9qx",
+  "upload-queue--popover": "styles__upload-queue--popover___2Oj-U",
+  "upload-queue--visible": "styles__upload-queue--visible___3FkzH",
+  "upload-queue-header": "styles__upload-queue-header___1nUv9",
+  "upload-queue-header-inner": "styles__upload-queue-header-inner___-pA9p",
+  "upload-queue-progress": "styles__upload-queue-progress___3ijZA",
+  "upload-queue-content": "styles__upload-queue-content___29pyu",
+  "upload-queue--collapsed": "styles__upload-queue--collapsed___3Er09",
+  "upload-queue-list": "styles__upload-queue-list___30_J-",
+  "upload-queue-item--error": "styles__upload-queue-item--error___1ChsD",
+  "upload-queue-item--done": "styles__upload-queue-item--done___1eJjw",
+  "item-file": "styles__item-file___AdWET",
+  "item-status": "styles__item-status___2xjeD",
+  "spin": "styles__spin___1u3cT",
+  "shake": "styles__shake___pfzot"
+};
+
+var RemainingTime = function RemainingTime(_ref) {
+  var durationInSec = _ref.durationInSec;
+
+  var _useI18n = (0, _I18n.useI18n)(),
+      t = _useI18n.t;
+
+  return /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    variant: "caption",
+    className: (0, _classnames.default)(styles['upload-queue__progress-caption'], 'u-ellipsis')
+  }, t('item.remainingTime', {
+    time: (0, _index.formatRemainingTime)(durationInSec),
+    smart_count: (0, _helpers.numberOfReferencesForPluralForm)(durationInSec)
+  }));
+};
+
+var _default = RemainingTime;
+exports.default = _default;

package/dist/UploadQueue/helpers.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.numberOfReferencesForPluralForm = void 0;
+
+// https://date-fns.org/v2.28.0/docs/formatDistanceToNow
+var numberOfReferencesForPluralForm = function numberOfReferencesForPluralForm(durationInSec) {
+  return durationInSec < 90 || durationInSec > 2670 && durationInSec < 5370 ? 1 : 2;
+};
+
+exports.numberOfReferencesForPluralForm = numberOfReferencesForPluralForm;

package/dist/UploadQueue/index.js

@@ -0,0 +1,277 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.uploadStatus = exports.formatRemainingTime = exports.default = exports.UploadQueue = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _LinearProgress = _interopRequireDefault(require("cozy-ui/transpiled/react/LinearProgress"));
+
+var _List = _interopRequireDefault(require("cozy-ui/transpiled/react/List"));
+
+var _Typography = _interopRequireDefault(require("cozy-ui/transpiled/react/Typography"));
+
+var _Button = _interopRequireDefault(require("cozy-ui/transpiled/react/deprecated/Button"));
+
+var _format = require("cozy-ui/transpiled/react/providers/I18n/format");
+
+var _withLocales = _interopRequireDefault(require("cozy-ui/transpiled/react/providers/I18n/withLocales"));
+
+var _styles = require("cozy-ui/transpiled/react/styles");
+
+var _Item = _interopRequireDefault(require("./Item"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var localeEn = {
+  header: "Uploading %{smart_count} photo to %{app} |||| Uploading %{smart_count} photos to %{app}",
+  header_mobile: "Uploading %{done} of %{smart_count}",
+  header_done: "Uploaded %{done} out of %{smart_count} successfully",
+  close: "close",
+  item: {
+    pending: "Pending",
+    remainingTime: "%{time} remaining"
+  }
+};
+var localeEs = {
+  header: "Subiendo %{smart_count} foto a %{app} |||| Subiendo %{smart_count} fotos a %{app}",
+  header_mobile: "Subiendo %{done} de %{smart_count}",
+  header_done: "Subidos %{done} de %{smart_count} con \xE9xito",
+  close: "cerrar",
+  item: {
+    pending: "Pendiente",
+    remainingTime: "%{time} restante |||| %{time} restantes"
+  }
+};
+var localeFr = {
+  header: "Import de %{smart_count} fichier dans votre %{app} |||| Import de %{smart_count} fichiers dans votre %{app}",
+  header_mobile: "Import de %{done} sur %{smart_count}",
+  header_done: "%{done} sur %{smart_count} \xE9l\xE9ment import\xE9 |||| %{done} sur %{smart_count} \xE9l\xE9ments import\xE9s",
+  close: "Fermer",
+  item: {
+    pending: "En attente",
+    remainingTime: "%{time} restante |||| %{time} restantes"
+  }
+};
+var localeRu = {
+  header: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 %{smart_count} \u0444\u043E\u0442\u043E \u0432 %{app} |||| \u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 %{smart_count} \u0444\u043E\u0442\u043E \u0432 %{app}",
+  header_mobile: "\u0417\u0430\u0433\u0440\u0443\u0436\u0435\u043D\u043E %{done} \u0438\u0437 %{smart_count}",
+  header_done: "\u0423\u0441\u043F\u0435\u0448\u043D\u043E \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043D\u043E %{done} \u0438\u0437 %{smart_count}",
+  close: "\u0437\u0430\u043A\u0440\u044B\u0442\u044C",
+  item: {
+    pending: "\u0412 \u043E\u0436\u0438\u0434\u0430\u043D\u0438\u0438",
+    remainingTime: "\u041E\u0441\u0442\u0430\u043B\u043E\u0441\u044C %{time}"
+  }
+};
+var localeVi = {
+  header: "\u0110ang t\u1EA3i l\xEAn %{smart_count} \u1EA3nh v\xE0o %{app} |||| \u0110ang t\u1EA3i l\xEAn %{smart_count} \u1EA3nh v\xE0o %{app}",
+  header_mobile: "\u0110\xE3 t\u1EA3i l\xEAn %{done} trong s\u1ED1 %{smart_count}",
+  header_done: "\u0110\xE3 t\u1EA3i l\xEAn th\xE0nh c\xF4ng %{done} trong s\u1ED1 %{smart_count}",
+  close: "\u0111\xF3ng",
+  item: {
+    pending: "\u0110ang ch\u1EDD",
+    remainingTime: "C\xF2n l\u1EA1i %{time}"
+  }
+};
+var styles = {
+  "upload-queue": "styles__upload-queue___3EfQa",
+  "upload-queue__threshold-bar": "styles__upload-queue__threshold-bar___e-fnL",
+  "upload-queue__progress-caption": "styles__upload-queue__progress-caption___37X7k",
+  "upload-queue__upload-progress": "styles__upload-queue__upload-progress___2Z9qx",
+  "upload-queue--popover": "styles__upload-queue--popover___2Oj-U",
+  "upload-queue--visible": "styles__upload-queue--visible___3FkzH",
+  "upload-queue-header": "styles__upload-queue-header___1nUv9",
+  "upload-queue-header-inner": "styles__upload-queue-header-inner___-pA9p",
+  "upload-queue-progress": "styles__upload-queue-progress___3ijZA",
+  "upload-queue-content": "styles__upload-queue-content___29pyu",
+  "upload-queue--collapsed": "styles__upload-queue--collapsed___3Er09",
+  "upload-queue-list": "styles__upload-queue-list___30_J-",
+  "upload-queue-item--error": "styles__upload-queue-item--error___1ChsD",
+  "upload-queue-item--done": "styles__upload-queue-item--done___1eJjw",
+  "item-file": "styles__item-file___AdWET",
+  "item-status": "styles__item-status___2xjeD",
+  "spin": "styles__spin___1u3cT",
+  "shake": "styles__shake___pfzot"
+};
+var locales = {
+  en: localeEn,
+  es: localeEs,
+  fr: localeFr,
+  ru: localeRu,
+  vi: localeVi
+};
+var CANCEL = 'cancel';
+var PENDING = 'pending';
+var LOADING = 'loading';
+var CREATED = 'created';
+var UPDATED = 'updated';
+var FAILED = 'failed';
+var CONFLICT = 'conflict';
+var QUOTA = 'quota';
+var NETWORK = 'network';
+var DONE_STATUSES = [CREATED, UPDATED];
+var ERROR_STATUSES = [CONFLICT, NETWORK, QUOTA, FAILED];
+var uploadStatus = {
+  CANCEL: CANCEL,
+  PENDING: PENDING,
+  LOADING: LOADING,
+  CREATED: CREATED,
+  UPDATED: UPDATED,
+  FAILED: FAILED,
+  CONFLICT: CONFLICT,
+  QUOTA: QUOTA,
+  NETWORK: NETWORK,
+  DONE_STATUSES: DONE_STATUSES,
+  ERROR_STATUSES: ERROR_STATUSES
+};
+exports.uploadStatus = uploadStatus;
+
+var formatRemainingTime = function formatRemainingTime(durationInSec) {
+  var later = Date.now() + durationInSec * 1000;
+  return (0, _format.formatLocallyDistanceToNow)(later);
+};
+
+exports.formatRemainingTime = formatRemainingTime;
+var QueueLinearProgress = (0, _styles.withStyles)({
+  root: {
+    height: '2px'
+  }
+})(_LinearProgress.default);
+
+var UploadQueue = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(UploadQueue, _Component);
+
+  var _super = _createSuper(UploadQueue);
+
+  function UploadQueue() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, UploadQueue);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+      collapsed: false
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "toggleCollapsed", function () {
+      _this.setState(function (state) {
+        return {
+          collapsed: !state.collapsed
+        };
+      });
+    });
+    return _this;
+  }
+
+  (0, _createClass2.default)(UploadQueue, [{
+    key: "render",
+    value: function render() {
+      var _cx;
+
+      var _this$props = this.props,
+          t = _this$props.t,
+          queue = _this$props.queue,
+          doneCount = _this$props.doneCount,
+          successCount = _this$props.successCount,
+          purgeQueue = _this$props.purgeQueue,
+          popover = _this$props.popover,
+          getMimeTypeIcon = _this$props.getMimeTypeIcon,
+          app = _this$props.app;
+      var collapsed = this.state.collapsed;
+      return /*#__PURE__*/_react.default.createElement("div", {
+        "data-testid": "upload-queue",
+        className: (0, _classnames.default)(styles['upload-queue'], (_cx = {}, (0, _defineProperty2.default)(_cx, styles['upload-queue--visible'], queue.length !== 0), (0, _defineProperty2.default)(_cx, styles['upload-queue--collapsed'], collapsed), (0, _defineProperty2.default)(_cx, styles['upload-queue--popover'], popover), _cx))
+      }, /*#__PURE__*/_react.default.createElement("h4", {
+        className: styles['upload-queue-header'],
+        onDoubleClick: this.toggleCollapsed
+      }, doneCount < queue.length && /*#__PURE__*/_react.default.createElement("div", {
+        className: styles['upload-queue-header-inner']
+      }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+        variant: "h6",
+        className: "u-hide--mob"
+      }, t('header', {
+        smart_count: queue.length,
+        app: app
+      })), /*#__PURE__*/_react.default.createElement(_Typography.default, {
+        color: "primary",
+        variant: "h6",
+        className: "u-hide--tablet"
+      }, t('header_mobile', {
+        done: doneCount,
+        smart_count: queue.length
+      }))), doneCount >= queue.length && /*#__PURE__*/_react.default.createElement("div", {
+        "data-testid": "upload-queue-success",
+        className: styles['upload-queue-header-inner']
+      }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+        variant: "h6"
+      }, t('header_done', {
+        done: successCount,
+        smart_count: queue.length
+      })), /*#__PURE__*/_react.default.createElement(_Button.default, {
+        subtle: true,
+        className: "u-mv-0",
+        label: t('close'),
+        onClick: purgeQueue
+      }))), /*#__PURE__*/_react.default.createElement(QueueLinearProgress, {
+        variant: "determinate",
+        value: doneCount / queue.length * 100
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        className: styles['upload-queue-content']
+      }, /*#__PURE__*/_react.default.createElement(_List.default, {
+        className: "u-pv-0"
+      }, queue.map(function (item, index) {
+        return /*#__PURE__*/_react.default.createElement(_Item.default, (0, _extends2.default)({
+          key: index
+        }, item, {
+          getMimeTypeIcon: getMimeTypeIcon
+        }));
+      }))));
+    }
+  }]);
+  return UploadQueue;
+}(_react.Component);
+
+exports.UploadQueue = UploadQueue;
+UploadQueue.defaultProps = {
+  /**
+   * @type {Boolean}
+   * Displays the queue in a popover at the bottom right of the screen
+   * Use false to disable
+   */
+  popover: true
+};
+
+var _default = (0, _withLocales.default)(locales)(UploadQueue);
+
+exports.default = _default;

package/dist/UploadQueue/useStatusIcon.js

@@ -0,0 +1,60 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useStatusIcon = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Icon = _interopRequireDefault(require("cozy-ui/transpiled/react/Icon"));
+
+var _CheckCircle = _interopRequireDefault(require("cozy-ui/transpiled/react/Icons/CheckCircle"));
+
+var _CrossCircle = _interopRequireDefault(require("cozy-ui/transpiled/react/Icons/CrossCircle"));
+
+var _Warning = _interopRequireDefault(require("cozy-ui/transpiled/react/Icons/Warning"));
+
+var _Spinner = _interopRequireDefault(require("cozy-ui/transpiled/react/Spinner"));
+
+var _index = require("./index");
+
+var useStatusIcon = function useStatusIcon(statusToUse, progress) {
+  var CANCEL = _index.uploadStatus.CANCEL,
+      LOADING = _index.uploadStatus.LOADING,
+      DONE_STATUSES = _index.uploadStatus.DONE_STATUSES,
+      ERROR_STATUSES = _index.uploadStatus.ERROR_STATUSES,
+      PENDING = _index.uploadStatus.PENDING;
+  var SuccessIcon = _CheckCircle.default;
+  var ErrorIcon = _CrossCircle.default;
+  var statusIcon;
+
+  if (statusToUse === LOADING) {
+    statusIcon = !progress ? /*#__PURE__*/_react.default.createElement(_Spinner.default, {
+      color: "var(--primaryColor)"
+    }) : null;
+  } else if (statusToUse === CANCEL) {
+    statusIcon = /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      icon: ErrorIcon,
+      color: "var(--errorColor)"
+    });
+  } else if (ERROR_STATUSES.includes(statusToUse)) {
+    statusIcon = /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      icon: _Warning.default,
+      color: "var(--errorColor)"
+    });
+  } else if (DONE_STATUSES.includes(statusToUse)) {
+    statusIcon = /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      icon: SuccessIcon,
+      color: "var(--successColor)"
+    });
+  } else if (statusToUse === PENDING) {
+    statusIcon = null;
+  }
+
+  return statusIcon;
+};
+
+exports.useStatusIcon = useStatusIcon;