contentoh-components-library 21.6.50 → 21.6.51

package/src/global-files/digital-assets/assets.mock.js

@@ -1,122 +0,0 @@
-/**
- * Activos de ejemplo con la forma EXACTA que devolvería el backend, para
- * Storybook y pruebas.
- *
- * Están crudos a propósito, sin pasar por `fromBackend`: así, si el contrato
- * cambia, estos objetos se editan y el adaptador se prueba de verdad en vez de
- * comparar el modelo de interfaz contra sí mismo.
- */
-
-export const backendAssetsMock = [
-  {
-    id: 91,
-    asset_type: "360",
-    name: "giro_producto.mp4",
-    ext: "mp4",
-    mime: "video/mp4",
-    size_bytes: 8412160,
-    duration: 12,
-    width: 1080,
-    height: 1080,
-    src: "id-136038/assets/91-6d0f9a1e-0f0c-4a2b-9f1d-2a7c1b3e5d90.mp4",
-    poster: "id-136038/assets/91-6d0f9a1e-0f0c-4a2b-9f1d-2a7c1b3e5d90.jpg",
-    id_retailer: null,
-    created_at: "2026-09-10T16:22:04.000Z",
-  },
-  {
-    id: 92,
-    asset_type: "360",
-    name: "giro_empaque.gif",
-    ext: "gif",
-    mime: "image/gif",
-    size_bytes: 3145728,
-    duration: null,
-    width: 800,
-    height: 800,
-    src: "id-136038/assets/92-b1c2d3e4-1111-2222-3333-444455556666.gif",
-    poster: null,
-    id_retailer: null,
-    created_at: "2026-09-10T16:24:41.000Z",
-  },
-  {
-    id: 93,
-    asset_type: "video",
-    name: "demostracion_uso.mp4",
-    ext: "mp4",
-    mime: "video/mp4",
-    size_bytes: 54525952,
-    duration: 96,
-    width: 1920,
-    height: 1080,
-    src: "id-136038/assets/93-77aa88bb-99cc-4dd0-8ee1-ff0011223344.mp4",
-    poster: "id-136038/assets/93-77aa88bb-99cc-4dd0-8ee1-ff0011223344.jpg",
-    // Activo de una sola cadena: sirve para probar `filterByRetailer`.
-    id_retailer: 1017,
-    created_at: "2026-09-11T09:02:17.000Z",
-  },
-  {
-    id: 94,
-    asset_type: "documento",
-    name: "manual_de_usuario.pdf",
-    ext: "pdf",
-    mime: "application/pdf",
-    size_bytes: 2418192,
-    duration: null,
-    width: null,
-    height: null,
-    src: "id-136038/assets/94-cc55dd66-7788-99aa-bbcc-ddeeff001122.pdf",
-    poster: null,
-    id_retailer: null,
-    created_at: "2026-09-12T11:48:00.000Z",
-  },
-  {
-    id: 96,
-    asset_type: "editable",
-    name: "arte_empaque.psd",
-    ext: "psd",
-    // El navegador no le asigna mime a un .psd: llega vacío. Es el caso que
-    // obliga a resolver el tipo por extensión.
-    mime: "",
-    size_bytes: 268435456,
-    duration: null,
-    width: null,
-    height: null,
-    src: "id-136038/assets/96-11223344-5566-7788-99aa-bbccddeeff00.psd",
-    poster: null,
-    id_retailer: null,
-    created_at: "2026-09-15T10:12:33.000Z",
-  },
-  {
-    id: 97,
-    asset_type: "hoja_calculo",
-    name: "tabla_de_medidas.xlsx",
-    ext: "xlsx",
-    mime: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
-    size_bytes: 48128,
-    duration: null,
-    width: null,
-    height: null,
-    src: "id-136038/assets/97-99887766-5544-3322-1100-ffeeddccbbaa.xlsx",
-    poster: null,
-    id_retailer: null,
-    created_at: "2026-09-15T10:14:02.000Z",
-  },
-];
-
-/**
- * Caso incompleto a propósito: sin `mime`, sin `ext` y sin `url`. El backend
- * todavía no existe y es muy probable que las primeras respuestas lleguen así;
- * el adaptador tiene que poder deducirlos del nombre y de la clave de S3.
- */
-export const partialBackendAssetMock = {
-  id: 95,
-  name: "ficha_tecnica.pdf",
-  src: "id-136038/assets/95-aa11bb22-cc33-dd44-ee55-ff6677889900.pdf",
-};
-
-/** `File` falso para probar validaciones sin tocar disco ni red. */
-export const makeFileMock = ({
-  name = "giro_producto.mp4",
-  type = "video/mp4",
-  size = 8412160,
-} = {}) => ({ name, type, size });

package/src/global-files/digital-assets/assets.reducer.js

@@ -1,197 +0,0 @@
-import { ASSET_ACTIONS, assetsInitialState } from "./assets.actions";
-import { assetKey, isPersisted } from "./assets.adapter";
-
-export { assetsInitialState };
-
-/*
-  Estado de los activos digitales de la ficha.
-
-  Separado de `active-state` a propósito: ese reducer ya lleva 344 líneas y toda
-  la lógica de imágenes, que no comparte nada con esto —los activos no tienen
-  tipo de toma, ni obligatoriedad, ni cupo por cadena—.
-
-  Vive aquí y no en `context/reducers/` —donde están los otros cuatro— porque no
-  depende de la pantalla: es una función pura sobre activos, igual que el
-  adaptador y el catálogo. Así el hook y las historias de Storybook lo usan sin
-  arrastrar la ficha completa, y `provider-product-edition.reducer.js` solo lo
-  enchufa con una línea, igual que a los demás.
-
-  El reducer es puro. Liberar los object URL de los archivos locales es un efecto
-  y se hace en el hook antes de despachar; meterlo aquí rompería poder probar
-  este archivo sin navegador.
-*/
-export const assetsReducer = (state, action) => {
-  switch (action.type) {
-    case ASSET_ACTIONS.SET_ASSETS_VALUES: {
-      return {
-        ...state,
-        assets_values: Array.isArray(action.payload) ? action.payload : [],
-        // Lo que venga del backend es, por definición, lo ya guardado: no hay
-        // nada pendiente de enviar.
-        updated_assets: [],
-        deleted_assets: [],
-        selected_assets: [],
-        all_assets_checked: false,
-      };
-    }
-
-    case ASSET_ACTIONS.ADD_ASSETS: {
-      const incoming = Array.isArray(action.payload)
-        ? action.payload
-        : [action.payload];
-
-      return {
-        ...state,
-        assets_values: [...state.assets_values, ...incoming],
-      };
-    }
-
-    case ASSET_ACTIONS.UPDATE_ASSET: {
-      const { key, changes } = action.payload;
-      let touched = null;
-
-      const assets_values = state.assets_values.map((asset) => {
-        if (assetKey(asset) !== key) return asset;
-        touched = asset;
-        return { ...asset, ...changes };
-      });
-
-      // Un activo que todavía no existe en el backend no se "actualiza": se
-      // creará con los valores finales, así que no hay nada que rastrear.
-      const shouldTrack = touched
-        && isPersisted(touched)
-        && !state.updated_assets.includes(key);
-
-      return {
-        ...state,
-        assets_values,
-        updated_assets: shouldTrack
-          ? [...state.updated_assets, key]
-          : state.updated_assets,
-      };
-    }
-
-    case ASSET_ACTIONS.PATCH_ASSET: {
-      const { key, changes } = action.payload;
-
-      return {
-        ...state,
-        assets_values: state.assets_values.map((asset) => (
-          assetKey(asset) === key ? { ...asset, ...changes } : asset
-        )),
-      };
-    }
-
-    case ASSET_ACTIONS.REMOVE_ASSET: {
-      const { key } = action.payload;
-      const target = state.assets_values.find((asset) => assetKey(asset) === key);
-
-      if (!target) return state;
-
-      const assets_values = state.assets_values.filter(
-        (asset) => assetKey(asset) !== key,
-      );
-      const selected_assets = state.selected_assets.filter(
-        (asset) => assetKey(asset) !== key,
-      );
-
-      return {
-        ...state,
-        assets_values,
-        // Solo se le pide al backend que borre lo que el backend tiene. Un
-        // activo local que nunca se subió simplemente desaparece.
-        deleted_assets: isPersisted(target)
-          ? [...state.deleted_assets, target.id]
-          : state.deleted_assets,
-        // Sin esto, un activo borrado seguiría contando como seleccionado y como
-        // modificado: el guardado intentaría enviar un activo que ya no existe.
-        updated_assets: state.updated_assets.filter((item) => item !== key),
-        selected_assets,
-        // Se recalcula en vez de apagarse: si estaban todos marcados y se borra
-        // uno, los que quedan siguen marcados y la casilla de "seleccionar todo"
-        // debe seguir reflejándolo.
-        all_assets_checked:
-          assets_values.length > 0
-          && selected_assets.length === assets_values.length,
-      };
-    }
-
-    case ASSET_ACTIONS.SET_SELECTED_ASSETS: {
-      const selected = Array.isArray(action.payload) ? action.payload : [];
-
-      return {
-        ...state,
-        selected_assets: selected,
-        all_assets_checked:
-          state.assets_values.length > 0
-          && selected.length === state.assets_values.length,
-      };
-    }
-
-    case ASSET_ACTIONS.TOGGLE_CHECK_ALL_ASSETS: {
-      // Con la lista vacía no hay nada que marcar: dejarlo en `true` pintaría la
-      // casilla de "seleccionar todo" activa sobre una bandeja sin activos.
-      const isChecked = Boolean(action.payload) && state.assets_values.length > 0;
-
-      return {
-        ...state,
-        all_assets_checked: isChecked,
-        selected_assets: isChecked ? [...state.assets_values] : [],
-      };
-    }
-
-    case ASSET_ACTIONS.CLEAR_ASSETS_TRACKING: {
-      return {
-        ...state,
-        updated_assets: [],
-        deleted_assets: [],
-      };
-    }
-
-    default: {
-      return null;
-    }
-  }
-};
-
-/**
- * Los tres grupos que espera el backend, listos para `buildSavePayload`.
- *
- * Se deriva de `assets_values` en el momento de guardar, no se acumula: las
- * claves rastreadas dicen QUÉ cambió y el objeto vigente dice CÓMO quedó. Es lo
- * que evita enviar el valor anterior cuando el usuario edita dos veces el mismo
- * activo antes de guardar.
- */
-export const selectAssetsToSave = (state) => ({
-  assets: state.assets_values,
-  updated: state.assets_values.filter((asset) => state.updated_assets.includes(assetKey(asset))),
-  deleted: state.deleted_assets,
-});
-
-/** ¿Hay algo sin guardar? Sirve para avisar antes de salir y para habilitar el botón. */
-/**
- * Desglose de lo que falta por guardar.
- *
- * Se cuenta por separado —altas, cambios, bajas— y no como un número suelto
- * porque "3 cambios sin guardar" no le dice al usuario qué perdería si se va:
- * no es lo mismo dejar sin guardar un borrado que un archivo recién subido.
- *
- * Un activo nuevo solo cuenta si ya está en S3. Uno que todavía se está
- * subiendo, o que falló, no es un cambio pendiente de guardar: es un archivo que
- * aún no existe, y anunciarlo como tal haría que el contador subiera y bajara
- * solo mientras la barra de progreso avanza.
- */
-export const countUnsavedAssets = (state) => {
-  const nuevos = state.assets_values.filter(
-    (asset) => !isPersisted(asset) && Boolean(asset.src),
-  ).length;
-
-  return {
-    nuevos,
-    modificados: state.updated_assets.length,
-    borrados: state.deleted_assets.length,
-    total: nuevos + state.updated_assets.length + state.deleted_assets.length,
-  };
-};
-
-export const hasUnsavedAssets = (state) => countUnsavedAssets(state).total > 0;

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

@@ -1,109 +0,0 @@
-/**
- * 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.
- */
-
-import axios from "axios";
-
-import { toPayload } from "./assets.adapter";
-
-/**
- * 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.
- */
-export const requestPresign = async ({ articleId, assets, token }) => {
-  const { data } = await axios.post(
-    process.env.REACT_APP_ASSETS_PRESIGN_ENDPOINT,
-    {
-      articleId,
-      files: assets.map((asset) => ({
-        // 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,
-        ...toPayload(asset),
-      })),
-    },
-    { headers: { Authorization: token } },
-  );
-
-  // `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.
-  const body = typeof data?.body === "string" ? JSON.parse(data.body) : data?.body ?? data;
-
-  if (data?.statusCode && data.statusCode >= 400) {
-    throw new Error(body?.message || "No se pudo preparar la subida");
-  }
-
-  return { uploads: body?.uploads ?? [], rejected: body?.rejected ?? [] };
-};
-
-/**
- * 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.
- */
-export const uploadToS3 = ({ upload, file, onProgress }) => new Promise((resolve, reject) => {
-  const form = new FormData();
-  Object.entries(upload.fields).forEach(([name, value]) => form.append(name, value));
-  form.append("file", file);
-
-  const xhr = new XMLHttpRequest();
-  xhr.open("POST", upload.url, true);
-
-  xhr.upload.onprogress = (event) => {
-    if (!event.lengthComputable) return;
-    onProgress?.(Math.round((event.loaded / event.total) * 100));
-  };
-
-  xhr.onload = () => {
-    // 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.
-    */
-    const code = /<Code>(.*?)<\/Code>/.exec(xhr.responseText)?.[1];
-    reject(new Error(code === "EntityTooLarge"
-      ? "El archivo supera el tamaño permitido."
-      : `S3 rechazó la subida (${code || xhr.status}).`));
-  };
-
-  xhr.onerror = () => 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 = () => reject(new Error("Subida cancelada."));
-
-  xhr.send(form);
-});