contentoh-components-library 21.6.55 → 21.6.56

package/dist/global-files/digital-assets/uploadAssets.js

@@ -0,0 +1,179 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.uploadToS3 = exports.requestPresign = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+
+var _axios = _interopRequireDefault(require("axios"));
+
+var _assets = require("./assets.adapter");
+
+/**
+ * Subida de activos digitales a S3.
+ *
+ * El archivo NO pasa por ningún Lambda ni se convierte a base64. El backend
+ * firma la subida y el navegador manda el archivo directo al bucket. Es lo que
+ * permite subir un .psd de 300 MB: el camino que usan hoy las imágenes
+ * —`FileReader.readAsDataURL` y `putObject` con las llaves de AWS en el
+ * bundle— carga el archivo entero en memoria y lo infla un tercio.
+ *
+ * Es un POST multipart y no un PUT porque el backend firma con
+ * `createPresignedPost`, la única forma de que S3 aplique de verdad el tope de
+ * tamaño y el Content-Type. Con un PUT firmado, quien tenga la URL sube lo que
+ * quiera del tamaño que quiera.
+ */
+
+/**
+ * Pide al backend que firme la subida de varios archivos a la vez.
+ *
+ * En una sola llamada y no una por archivo: soltar diez archivos son diez
+ * viajes de ida y vuelta que no hacen falta.
+ *
+ * Devuelve `uploads` (los que se firmaron) y `rejected` (los que el servidor no
+ * aceptó, con su motivo). El servidor valida por su cuenta aunque el front ya
+ * lo haya hecho: el front se puede saltar, y quien firma decide qué entra al
+ * bucket.
+ */
+var requestPresign = /*#__PURE__*/function () {
+  var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(_ref) {
+    var _data$body, _body$uploads, _body$rejected;
+
+    var articleId, assets, token, _yield$axios$post, data, body;
+
+    return _regenerator.default.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            articleId = _ref.articleId, assets = _ref.assets, token = _ref.token;
+            _context.next = 3;
+            return _axios.default.post(process.env.REACT_APP_ASSETS_PRESIGN_ENDPOINT, {
+              articleId: articleId,
+              files: assets.map(function (asset) {
+                return (0, _objectSpread2.default)({
+                  // El `ref` vuelve tal cual en la respuesta. Emparejar por nombre sería
+                  // frágil: dos archivos que se llamen igual acabarían con la clave del
+                  // otro.
+                  ref: asset.tempId
+                }, (0, _assets.toPayload)(asset));
+              })
+            }, {
+              headers: {
+                Authorization: token
+              }
+            });
+
+          case 3:
+            _yield$axios$post = _context.sent;
+            data = _yield$axios$post.data;
+            // `integration: lambda` de API Gateway devuelve el objeto del handler tal
+            // cual, con el cuerpo como cadena, en vez de traducirlo a una respuesta HTTP.
+            body = typeof (data === null || data === void 0 ? void 0 : data.body) === "string" ? JSON.parse(data.body) : (_data$body = data === null || data === void 0 ? void 0 : data.body) !== null && _data$body !== void 0 ? _data$body : data;
+
+            if (!(data !== null && data !== void 0 && data.statusCode && data.statusCode >= 400)) {
+              _context.next = 8;
+              break;
+            }
+
+            throw new Error((body === null || body === void 0 ? void 0 : body.message) || "No se pudo preparar la subida");
+
+          case 8:
+            return _context.abrupt("return", {
+              uploads: (_body$uploads = body === null || body === void 0 ? void 0 : body.uploads) !== null && _body$uploads !== void 0 ? _body$uploads : [],
+              rejected: (_body$rejected = body === null || body === void 0 ? void 0 : body.rejected) !== null && _body$rejected !== void 0 ? _body$rejected : []
+            });
+
+          case 9:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  }));
+
+  return function requestPresign(_x) {
+    return _ref2.apply(this, arguments);
+  };
+}();
+/**
+ * Sube un archivo con los campos que firmó el backend.
+ *
+ * Se usa XMLHttpRequest y no fetch porque fetch todavía no sabe informar del
+ * progreso de subida. En un .psd de 300 MB la barra no es un adorno: sin ella
+ * la pantalla parece colgada durante minutos.
+ *
+ * El orden del FormData importa: S3 exige que el archivo vaya AL FINAL, después
+ * de todos los campos de la política. Si va antes, rechaza la petición.
+ */
+
+
+exports.requestPresign = requestPresign;
+
+var uploadToS3 = function uploadToS3(_ref3) {
+  var upload = _ref3.upload,
+      file = _ref3.file,
+      onProgress = _ref3.onProgress;
+  return new Promise(function (resolve, reject) {
+    var form = new FormData();
+    Object.entries(upload.fields).forEach(function (_ref4) {
+      var _ref5 = (0, _slicedToArray2.default)(_ref4, 2),
+          name = _ref5[0],
+          value = _ref5[1];
+
+      return form.append(name, value);
+    });
+    form.append("file", file);
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", upload.url, true);
+
+    xhr.upload.onprogress = function (event) {
+      if (!event.lengthComputable) return;
+      onProgress === null || onProgress === void 0 ? void 0 : onProgress(Math.round(event.loaded / event.total * 100));
+    };
+
+    xhr.onload = function () {
+      var _$exec;
+
+      // S3 responde 204 sin cuerpo cuando acepta el archivo.
+      if (xhr.status >= 200 && xhr.status < 300) {
+        resolve(upload.key);
+        return;
+      }
+      /*
+        Los errores de S3 vienen en XML, no en JSON. Los dos que importan:
+        EntityTooLarge = el archivo se pasó del tope que firmamos, y AccessDenied
+        = al rol del Lambda le falta s3:PutObject sobre el prefijo, o sea que se
+        desplegó solo la función y no el servicio completo.
+      */
+
+
+      var code = (_$exec = /<Code>(.*?)<\/Code>/.exec(xhr.responseText)) === null || _$exec === void 0 ? void 0 : _$exec[1];
+      reject(new Error(code === "EntityTooLarge" ? "El archivo supera el tamaño permitido." : "S3 rechaz\xF3 la subida (".concat(code || xhr.status, ").")));
+    };
+
+    xhr.onerror = function () {
+      return reject(new Error( // Un fallo de red sin estatus casi siempre es CORS: el bucket tiene que
+      // permitir POST desde el origen de la aplicación. El navegador corta la
+      // petición antes de mandarla y no deja rastro en ningún log del servidor.
+      "No se pudo conectar con el almacenamiento. Revisa la configuración CORS del bucket."));
+    };
+
+    xhr.onabort = function () {
+      return reject(new Error("Subida cancelada."));
+    };
+
+    xhr.send(form);
+  });
+};
+
+exports.uploadToS3 = uploadToS3;

package/dist/global-files/digital-assets/useDigitalAssets.js

@@ -0,0 +1,522 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDigitalAssets = exports.readVideoDuration = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _react = require("react");
+
+var _assets = require("./assets.actions");
+
+var _uploadAssets = require("./uploadAssets");
+
+var _assetTypes = require("./assetTypes");
+
+var _assets2 = require("./assets.adapter");
+
+/**
+ * Duración de un video sin leerlo a base64.
+ *
+ * `URL.createObjectURL` le da al navegador una referencia al archivo del disco;
+ * `preload="metadata"` hace que solo baje la cabecera. La alternativa que usa
+ * hoy la ficha —`FileReader.readAsDataURL`— carga el archivo entero en memoria
+ * y lo infla un tercio, que es justo lo que impide subir videos largos.
+ */
+var readVideoDuration = function readVideoDuration(objectUrl) {
+  return new Promise(function (resolve) {
+    var video = document.createElement("video");
+    video.preload = "metadata";
+
+    video.onloadedmetadata = function () {
+      return resolve(video.duration);
+    };
+
+    video.onerror = function () {
+      return resolve(null);
+    };
+
+    video.src = objectUrl;
+  });
+};
+/**
+ * La bandeja de activos digitales, sobre el reducer de la ficha.
+ *
+ * El hook NO guarda la lista: la fuente de verdad es `state.assets_values`, para
+ * que el guardado del contexto pueda leerla igual que lee `images_values`. Aquí
+ * vive lo que un reducer no puede tener: la validación, la lectura asíncrona de
+ * la duración, y la liberación de los object URL (efectos, no estado).
+ *
+ * La subida arranca sola al soltar los archivos, no al guardar. Un .psd de 300
+ * MB tarda; hacerlo al guardar dejaría al usuario mirando un botón bloqueado
+ * durante minutos, mientras que así sube en segundo plano con su barra de
+ * progreso y guardar es instantáneo. El precio es que un archivo que se sube y
+ * luego se quita deja un objeto huérfano en S3, que recoge una regla de ciclo
+ * de vida.
+ *
+ * Sin `articleId` o sin `token` no se sube nada: es lo que permite usar la
+ * bandeja en Storybook, donde no hay sesión ni producto.
+ *
+ * `onUploaded` recibe los activos que terminaron de subir, para registrarlos en
+ * la base sin esperar al botón de guardar. Al ver la barra llegar al final
+ * cualquiera da por hecho que el activo ya quedó ligado al producto; si no lo
+ * estuviera y cerrara la ficha, el archivo se quedaría en S3 sin fila.
+ *
+ * `notices` es lo único que sí vive aquí: mensajes efímeros sobre los archivos
+ * que se acaban de soltar —uno rechazado, otro aceptado pero que el navegador no
+ * podrá reproducir—. No son parte del producto y no tienen por qué ensuciar el
+ * estado de la ficha. Cada uno lleva su `level` para que la bandeja distinga lo
+ * que no entró de lo que entró con advertencia.
+ */
+
+
+exports.readVideoDuration = readVideoDuration;
+
+var useDigitalAssets = function useDigitalAssets() {
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref$assets = _ref.assets,
+      assets = _ref$assets === void 0 ? [] : _ref$assets,
+      dispatch = _ref.dispatch,
+      _ref$notices = _ref.notices,
+      notices = _ref$notices === void 0 ? [] : _ref$notices,
+      _ref$setNotices = _ref.setNotices,
+      setNotices = _ref$setNotices === void 0 ? function () {} : _ref$setNotices,
+      _ref$articleId = _ref.articleId,
+      articleId = _ref$articleId === void 0 ? null : _ref$articleId,
+      _ref$token = _ref.token,
+      token = _ref$token === void 0 ? null : _ref$token,
+      _ref$onUploaded = _ref.onUploaded,
+      onUploaded = _ref$onUploaded === void 0 ? null : _ref$onUploaded;
+
+  /*
+    Copia sincrónica de la lista, solo para contar el cupo.
+     `assets` viene del render y `addFiles` es asíncrono: si el usuario suelta una
+    segunda tanda mientras la primera todavía está midiendo la duración de un
+    video, esa segunda llamada vería el conteo viejo y dejaría pasar de más.
+    Escribir la ref al despachar la mantiene exacta.
+  */
+  var countRef = (0, _react.useRef)(assets.length);
+  (0, _react.useEffect)(function () {
+    countRef.current = assets.length;
+  }, [assets.length]);
+  var assetsRef = (0, _react.useRef)(assets);
+  (0, _react.useEffect)(function () {
+    assetsRef.current = assets;
+  }, [assets]); // Los object URL se liberan al desmontar. Sin esto, cada archivo que el
+  // usuario mira se queda en memoria hasta que recargue la pestaña.
+
+  (0, _react.useEffect)(function () {
+    return function () {
+      return assetsRef.current.forEach(_assets2.revokeAssetUrl);
+    };
+  }, []);
+  var replaceAll = (0, _react.useCallback)(function (rows) {
+    var list = (0, _assets2.fromBackendList)(rows);
+    countRef.current = list.length;
+    dispatch({
+      type: _assets.ASSET_ACTIONS.SET_ASSETS_VALUES,
+      payload: list
+    });
+    setNotices([]);
+  }, [dispatch, setNotices]);
+  /*
+    Ciclo de vida de una subida. Va antes de `uploadAssets` y de `addFiles`
+    porque los dos lo usan: leer el archivo de arriba abajo cuenta la historia
+    en orden —qué puede pasarle a un activo, quién lo provoca— en vez de
+    obligar a saltar al final para entender la mitad de arriba.
+  */
+
+  var patch = (0, _react.useCallback)(function (key, changes) {
+    return dispatch({
+      type: _assets.ASSET_ACTIONS.PATCH_ASSET,
+      payload: {
+        key: key,
+        changes: changes
+      }
+    });
+  }, [dispatch]);
+  var startUpload = (0, _react.useCallback)(function (key) {
+    return patch(key, {
+      status: _assets2.ASSET_STATUS.UPLOADING,
+      progress: 0,
+      error: null
+    });
+  }, [patch]);
+  var setProgress = (0, _react.useCallback)(function (key, progress) {
+    return patch(key, {
+      progress: progress
+    });
+  }, [patch]);
+  var completeUpload = (0, _react.useCallback)(function (key) {
+    var changes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    return patch(key, (0, _objectSpread2.default)({
+      status: _assets2.ASSET_STATUS.SAVED,
+      progress: 100,
+      error: null
+    }, changes));
+  }, [patch]);
+  var failUpload = (0, _react.useCallback)(function (key, message) {
+    return patch(key, {
+      status: _assets2.ASSET_STATUS.ERROR,
+      error: message
+    });
+  }, [patch]);
+  /**
+   * Firma y sube los archivos recién aceptados, en segundo plano.
+   *
+   * Las subidas van en paralelo a propósito: son transferencias a S3, no
+   * consultas a una base, y el cuello de botella es el ancho de banda del
+   * usuario. Ponerlas en fila haría que el último archivo de diez empezara
+   * cuando los otros nueve ya terminaron.
+   *
+   * Un fallo se marca en SU activo y no tumba a los demás: si un archivo se
+   * corta, los otros nueve siguen y el usuario reintenta solo ese.
+   */
+
+  var uploadAssets = (0, _react.useCallback)( /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(pendingAssets) {
+      var presigned, sinEmparejar, emparejar, subidos, completados;
+      return _regenerator.default.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              if (!(!articleId || !token || pendingAssets.length === 0)) {
+                _context2.next = 2;
+                break;
+              }
+
+              return _context2.abrupt("return");
+
+            case 2:
+              _context2.prev = 2;
+              _context2.next = 5;
+              return (0, _uploadAssets.requestPresign)({
+                articleId: articleId,
+                assets: pendingAssets,
+                token: token
+              });
+
+            case 5:
+              presigned = _context2.sent;
+              _context2.next = 12;
+              break;
+
+            case 8:
+              _context2.prev = 8;
+              _context2.t0 = _context2["catch"](2);
+              // Si la firma falla, ninguno se puede subir: se marcan todos, porque
+              // dejarlos en "pendiente" haría creer que siguen en camino.
+              pendingAssets.forEach(function (asset) {
+                return failUpload((0, _assets2.assetKey)(asset), _context2.t0.message);
+              });
+              return _context2.abrupt("return");
+
+            case 12:
+              /*
+                Emparejar cada resultado con su activo.
+                 Por `ref` cuando el servidor lo devuelve, que es lo fiable. Mientras no
+                se despliegue esa versión, `ref` llega vacío y se cae al nombre —con la
+                lista de candidatos menguando, para que dos archivos que se llamen igual
+                no acaben los dos apuntando al mismo—.
+              */
+              sinEmparejar = (0, _toConsumableArray2.default)(pendingAssets);
+
+              emparejar = function emparejar(item) {
+                var index = sinEmparejar.findIndex(function (asset) {
+                  return item.ref ? asset.tempId === item.ref : asset.name === item.name;
+                });
+                if (index === -1) return null;
+                return sinEmparejar.splice(index, 1)[0];
+              }; // El servidor valida por su cuenta: lo que rechace se marca con su motivo.
+
+
+              presigned.rejected.forEach(function (item) {
+                var target = emparejar(item);
+                if (target) failUpload((0, _assets2.assetKey)(target), item.reason);
+              });
+              _context2.next = 17;
+              return Promise.all(presigned.uploads.map( /*#__PURE__*/function () {
+                var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(upload) {
+                  var asset, key;
+                  return _regenerator.default.wrap(function _callee$(_context) {
+                    while (1) {
+                      switch (_context.prev = _context.next) {
+                        case 0:
+                          asset = emparejar(upload);
+
+                          if (asset !== null && asset !== void 0 && asset.file) {
+                            _context.next = 3;
+                            break;
+                          }
+
+                          return _context.abrupt("return", null);
+
+                        case 3:
+                          key = (0, _assets2.assetKey)(asset);
+                          startUpload(key);
+                          _context.prev = 5;
+                          _context.next = 8;
+                          return (0, _uploadAssets.uploadToS3)({
+                            upload: upload,
+                            file: asset.file,
+                            onProgress: function onProgress(percent) {
+                              return setProgress(key, percent);
+                            }
+                          });
+
+                        case 8:
+                          // `src` es lo que convierte un activo local en guardable: el
+                          // guardado se niega a registrar un activo sin clave en S3.
+                          completeUpload(key, {
+                            src: upload.key
+                          });
+                          return _context.abrupt("return", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, asset), {}, {
+                            src: upload.key
+                          }));
+
+                        case 12:
+                          _context.prev = 12;
+                          _context.t0 = _context["catch"](5);
+                          failUpload(key, _context.t0.message);
+                          return _context.abrupt("return", null);
+
+                        case 16:
+                        case "end":
+                          return _context.stop();
+                      }
+                    }
+                  }, _callee, null, [[5, 12]]);
+                }));
+
+                return function (_x2) {
+                  return _ref3.apply(this, arguments);
+                };
+              }()));
+
+            case 17:
+              subidos = _context2.sent;
+
+              /*
+                Se avisa una sola vez, con todo lo que llegó completo, en lugar de una
+                llamada por archivo: soltar diez archivos haría diez escrituras a la
+                base para el mismo producto.
+                 Solo lo que subió bien. Registrar un activo cuyo archivo no llegó a S3
+                crearía una fila apuntando a nada.
+              */
+              completados = subidos.filter(Boolean);
+
+              if (!(completados.length > 0)) {
+                _context2.next = 22;
+                break;
+              }
+
+              _context2.next = 22;
+              return onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded(completados);
+
+            case 22:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2, null, [[2, 8]]);
+    }));
+
+    return function (_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }(), [articleId, token, onUploaded, startUpload, setProgress, completeUpload, failUpload]);
+  /**
+   * Valida y agrega archivos. Devuelve lo aceptado y lo rechazado para que quien
+   * llama decida cómo avisar.
+   *
+   * El cupo se cuenta contra lo que ya hay MÁS lo aceptado en esta misma tanda:
+   * si no, soltar quince archivos de golpe los dejaría pasar todos, porque cada
+   * uno vería el mismo conteo inicial.
+   */
+
+  var addFiles = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
+    var files,
+        accepted,
+        avisos,
+        count,
+        _i,
+        _Array$from,
+        file,
+        check,
+        objectUrl,
+        asset,
+        duration,
+        durationCheck,
+        _args3 = arguments;
+
+    return _regenerator.default.wrap(function _callee3$(_context3) {
+      while (1) {
+        switch (_context3.prev = _context3.next) {
+          case 0:
+            files = _args3.length > 0 && _args3[0] !== undefined ? _args3[0] : [];
+            accepted = [];
+            avisos = [];
+            count = countRef.current;
+            _i = 0, _Array$from = Array.from(files);
+
+          case 5:
+            if (!(_i < _Array$from.length)) {
+              _context3.next = 29;
+              break;
+            }
+
+            file = _Array$from[_i];
+            check = (0, _assetTypes.validateAssetFile)(file, {
+              currentCount: count
+            });
+
+            if (check.valid) {
+              _context3.next = 11;
+              break;
+            }
+
+            avisos.push({
+              level: "error",
+              name: file.name,
+              code: check.code,
+              message: check.message
+            });
+            return _context3.abrupt("continue", 26);
+
+          case 11:
+            // Se acepta, pero hay algo que decirle al usuario sobre este archivo.
+            if (check.warning) {
+              avisos.push({
+                level: "warning",
+                name: file.name,
+                message: check.warning
+              });
+            }
+
+            objectUrl = URL.createObjectURL(file);
+            asset = (0, _assets2.fromFile)(file, {
+              assetType: check.assetType,
+              objectUrl: objectUrl
+            }); // La duración solo se mide en lo que la valida, y después del peso: no
+            // tiene sentido abrir un archivo que ya se rechazó.
+
+            if (!(check.assetType === "video" || check.assetType === "360")) {
+              _context3.next = 24;
+              break;
+            }
+
+            _context3.next = 17;
+            return readVideoDuration(objectUrl);
+
+          case 17:
+            duration = _context3.sent;
+            durationCheck = (0, _assetTypes.validateAssetDuration)(duration, check.assetType);
+
+            if (durationCheck.valid) {
+              _context3.next = 23;
+              break;
+            }
+
+            URL.revokeObjectURL(objectUrl);
+            avisos.push({
+              level: "error",
+              name: file.name,
+              code: durationCheck.code,
+              message: durationCheck.message
+            });
+            return _context3.abrupt("continue", 26);
+
+          case 23:
+            asset.duration = duration;
+
+          case 24:
+            accepted.push(asset);
+            count += 1;
+
+          case 26:
+            _i++;
+            _context3.next = 5;
+            break;
+
+          case 29:
+            if (accepted.length) {
+              countRef.current = count;
+              dispatch({
+                type: _assets.ASSET_ACTIONS.ADD_ASSETS,
+                payload: accepted
+              }); // Sin `await`: la subida corre en segundo plano y la bandeja ya muestra
+              // los archivos con su barra de progreso.
+
+              uploadAssets(accepted);
+            }
+
+            setNotices(avisos);
+            return _context3.abrupt("return", {
+              accepted: accepted,
+              notices: avisos
+            });
+
+          case 32:
+          case "end":
+            return _context3.stop();
+        }
+      }
+    }, _callee3);
+  })), [dispatch, setNotices, uploadAssets]);
+  var removeAsset = (0, _react.useCallback)(function (asset) {
+    // El reducer es puro, así que el object URL se libera aquí.
+    (0, _assets2.revokeAssetUrl)(asset);
+    countRef.current = Math.max(0, countRef.current - 1);
+    dispatch({
+      type: _assets.ASSET_ACTIONS.REMOVE_ASSET,
+      payload: {
+        key: (0, _assets2.assetKey)(asset)
+      }
+    });
+  }, [dispatch]);
+  var changeAssetType = (0, _react.useCallback)(function (index, assetType) {
+    var target = assetsRef.current[index];
+    if (!target) return;
+    dispatch({
+      type: _assets.ASSET_ACTIONS.UPDATE_ASSET,
+      payload: {
+        key: (0, _assets2.assetKey)(target),
+        changes: {
+          assetType: assetType
+        }
+      }
+    });
+  }, [dispatch]);
+  var clearNotices = (0, _react.useCallback)(function () {
+    return setNotices([]);
+  }, [setNotices]);
+  return {
+    assets: assets,
+    notices: notices,
+    remaining: Math.max(0, _assetTypes.MAX_ASSETS_PER_PRODUCT - assets.length),
+    pending: assets.filter(function (asset) {
+      return asset.status === _assets2.ASSET_STATUS.PENDING;
+    }),
+    addFiles: addFiles,
+    removeAsset: removeAsset,
+    changeAssetType: changeAssetType,
+    replaceAll: replaceAll,
+    startUpload: startUpload,
+    setProgress: setProgress,
+    completeUpload: completeUpload,
+    failUpload: failUpload,
+    clearNotices: clearNotices
+  };
+};
+
+exports.useDigitalAssets = useDigitalAssets;