contentoh-components-library 21.6.50 → 21.6.52

package/src/components/pages/ProviderProductEdition/index.js

@@ -96,6 +96,17 @@ const ProviderProductEditionView = ({
   const [variantGroup, setVariantGroup] = useState(null);
   const [showGroup, setShowGroup] = useState(false);
   const [showGroupModal, setShowGroupModal] = useState(false);
+
+  /*
+    Un hijo no se agrupa como variante (decisión de producto, 2026-09-25).
+
+    Agrupar declara «estos son el mismo producto en otra presentación», y un
+    hijo ya declaró de dónde deriva; tener las dos cosas lo dejaba con dos
+    respuestas distintas a la misma pregunta. El servidor lo rechaza con
+    VARIANT_GROUP_NOT_FOR_CHILD, así que ofrecer el botón aquí sería ofrecer
+    algo que siempre falla.
+  */
+  const puedeAgruparse = !state.product?.parentArticleId;
   const [pendingPropagation, setPendingPropagation] = useState(null);
   const [preparandoPropagacion, setPreparandoPropagacion] = useState(false);
   const [preparandoEdicionMultiple, setPreparandoEdicionMultiple] =
@@ -731,14 +742,64 @@ const ProviderProductEditionView = ({
     return soloPropagables(cambios);
   };
 
+  /*
+    Lo que se acaba de editar en la pestaña de descripciones.
+
+    Va aparte de `cambiosDeFichaTecnica` porque son tablas distintas y el
+    endpoint recibe una lista o la otra. Aquí NO se filtran UPC ni SKU: esos son
+    atributos de ficha técnica y no aparecen en esta pestaña.
+  */
+  const cambiosDeDescripciones = () => {
+    const retailerId = state.active_retailer?.id_retailer;
+    const inputs = state.services?.descriptions?.inputs ?? {};
+
+    return (state.updated_descriptions_inputs ?? []).map((item) => {
+      const input = inputs[`${item.attributeId}_${retailerId}`];
+      return {
+        id: Number(item.attributeId),
+        name: input?.name ?? `Descripción ${item.attributeId}`,
+        value: item.value,
+      };
+    });
+  };
+
+  /*
+    Destinos posibles para lo que se guarde en este producto: sus hijos y sus
+    compañeras de grupo. Un hijo no propaga a nadie.
+  */
+  const destinosPosibles = () => {
+    if (state.product?.parentArticleId) return 0;
+    const companeras = (variantGroup?.members ?? []).filter((m) => !m.isCurrent);
+    return (state.product?.variantsCount ?? 0) + companeras.length;
+  };
+
   const handleOnClickSave = () => {
     // `preparandoPropagacion` cubre la ventana entre el clic y la apertura del
     // diálogo: sin esto, dos clics seguidos lanzan dos consultas de familia.
     if (state.saving || preparandoPropagacion) return;
     switch (state.active_tab) {
-      case "Descripción":
+      case "Descripción": {
+        /*
+          Guardar una descripción en un padre también abre la decisión de
+          propagar. Sin esto, el hijo heredaba la descripción al ligarse y se
+          quedaba con la versión vieja en cuanto el padre la corregía, sin que
+          nadie lo notara.
+        */
+        const cambiosDesc = cambiosDeDescripciones();
+
+        if (destinosPosibles() > 0 && cambiosDesc.length > 0) {
+          setPreparandoPropagacion(true);
+          loadFamily()
+            .then(() =>
+              setPendingPropagation({ cambios: cambiosDesc, kind: "description" })
+            )
+            .finally(() => setPreparandoPropagacion(false));
+          return;
+        }
+
         saveDescriptions(token);
         break;
+      }
       case "Ficha técnica": {
         // Guardar un padre con hijos abre la decisión de propagar. Sin este
         // paso el cambio se queda solo en el padre y los hijos se van
@@ -751,8 +812,24 @@ const ProviderProductEditionView = ({
         const companeras = (variantGroup?.members ?? []).filter(
           (m) => !m.isCurrent
         );
+        /*
+          Un HIJO no propaga a nadie, y hay que decirlo explícitamente.
+
+          Sin este corte el diálogo se abría desde la ficha de un hijo y le
+          ofrecía a sus HERMANOS como si fueran sus hijos: `family.variants`
+          mira la familia desde el padre —eso es lo correcto para navegar entre
+          hermanos— pero aquí se estaba leyendo como «los destinos de este
+          producto». El servidor resolvía los destinos por su cuenta y no
+          escribía nada, así que el usuario elegía hermanos, guardaba, y no
+          pasaba nada: un no-operativo silencioso.
+
+          Un hijo tampoco puede estar agrupado desde 2026-09-25, así que para
+          él no queda ningún destino posible.
+        */
+        const esHijo = !!state.product?.parentArticleId;
         const hayDestinos =
-          state.product?.variantsCount > 0 || companeras.length > 0;
+          !esHijo &&
+          (state.product?.variantsCount > 0 || companeras.length > 0);
         const cambios = cambiosDeFichaTecnica();
 
         if (hayDestinos && cambios.length > 0) {
@@ -761,7 +838,7 @@ const ProviderProductEditionView = ({
           // justo lo contrario de lo que va a preguntar.
           setPreparandoPropagacion(true);
           loadFamily()
-            .then(() => setPendingPropagation({ cambios }))
+            .then(() => setPendingPropagation({ cambios, kind: "datasheet" }))
             .finally(() => setPreparandoPropagacion(false));
           return;
         }
@@ -1659,7 +1736,12 @@ const ProviderProductEditionView = ({
         {pendingPropagation && (
           <PropagateChangesModal
             changedAttributes={pendingPropagation.cambios}
-            variants={(family?.variants ?? []).filter((v) => !v.isCurrent)}
+            kind={pendingPropagation.kind ?? "datasheet"}
+            variants={
+              state.product?.parentArticleId
+                ? []
+                : (family?.variants ?? []).filter((v) => !v.isCurrent)
+            }
             groupMembers={(variantGroup?.members ?? []).filter(
               (m) => !m.isCurrent
             )}
@@ -1667,8 +1749,29 @@ const ProviderProductEditionView = ({
             saving={state.saving}
             onCancel={() => setPendingPropagation(null)}
             onConfirm={(propagation) => {
+              const esDescripcion = pendingPropagation.kind === "description";
               setPendingPropagation(null);
-              saveDatasheets(token, propagation ?? undefined);
+
+              if (!propagation) {
+                // Guardar sin propagar: el producto se guarda solo.
+                if (esDescripcion) saveDescriptions(token);
+                else saveDatasheets(token);
+                return;
+              }
+
+              /*
+                El diálogo habla de «atributos» porque es el mismo componente
+                para las dos pestañas. Al guardar hay que ponerlo en la lista
+                que corresponde: el servidor recibe `attributes` o
+                `descriptions`, nunca una por la otra.
+              */
+              const { attributes, ...destinos } = propagation;
+
+              if (esDescripcion) {
+                saveDescriptions(token, { ...destinos, descriptions: attributes });
+              } else {
+                saveDatasheets(token, propagation);
+              }
             }}
           />
         )}
@@ -2067,6 +2170,7 @@ const ProviderProductEditionView = ({
                   código compartido que dice "estos son el mismo producto en
                   otra presentación". Mezclarlos en una sola caja haría creer
                   que agrupar hereda algo, que es justo lo que no pasa. */}
+              {puedeAgruparse && (
               <div className="variants-actions">
                 <button
                   type="button"
@@ -2088,8 +2192,9 @@ const ProviderProductEditionView = ({
                   </button>
                 )}
               </div>
+              )}
 
-              {showGroup && variantGroup?.group && (
+              {puedeAgruparse && showGroup && variantGroup?.group && (
                 <div className="variants-family">
                   {/* Los hermanos de grupo NO se listan como padre/hijo: aquí
                       nadie hereda de nadie, así que no hay rol que mostrar,

package/src/components/pages/RetailerProductEdition/context/provider-product-edition.context.jsx

@@ -13,13 +13,6 @@ import successIcon from "../../../../assets/images/genericModal/genericModalChec
 import errorIcon from "../../../../assets/images/genericModal/errorModal.svg";
 import warningIcon from "../../../../assets/images/genericModal/genericModalWarning.svg";
 import { getConceptByTab } from "../utils";
-import {
-  assetKey,
-  buildSavePayload,
-  isPersisted,
-  toPayload,
-} from "../../../../global-files/digital-assets/assets.adapter";
-import { selectAssetsToSave } from "../../../../global-files/digital-assets/assets.reducer";
 
 const S3_BUCKET = process.env.REACT_APP_IMAGES_BUCKET;
 const REGION = "us-east-1";
@@ -41,7 +34,7 @@ const ProductEditionContext = createContext();
 export const ProviderProductEditionProvider = ({ children }) => {
   const [state, dispatch] = useReducer(productEditionReducer, initialState);
 
-  const saveDescriptions = async (token) => {
+  const saveDescriptions = async (token, propagation) => {
     if (state.updated_descriptions_inputs.length === 0) return;
 
     dispatch({ type: "SET_SAVING", payload: true });
@@ -49,6 +42,7 @@ export const ProviderProductEditionProvider = ({ children }) => {
     const dataObject = {
       articleId: state.product?.id_article,
       articleData: state.updated_descriptions_inputs,
+      ...(propagation ? { propagation } : {}),
     };
 
     // console.log({dataObject});
@@ -561,198 +555,6 @@ export const ProviderProductEditionProvider = ({ children }) => {
     dispatch({ type: "SET_SAVING", payload: false });
   };
 
-  /*
-    Registra en la base los activos que ACABAN de subirse, sin esperar a que el
-    usuario guarde.
-
-    Es una corrección de expectativa, no una comodidad: al ver la barra de
-    progreso llegar al final, cualquiera da por hecho que el activo ya quedó
-    ligado al producto. Si entonces cierra la ficha, el archivo se queda en S3
-    sin fila en la base —invisible y sin forma de recuperarlo desde la
-    pantalla—.
-
-    Manda SOLO las altas recién subidas, con `updateAssets` y `deleteAssets`
-    vacíos. Un reetiquetado o un borrado que el usuario todavía no confirmó no
-    se aplica por haber soltado otro archivo: el botón de guardar sigue siendo
-    quien decide sobre esos.
-  */
-  const registerUploadedAssets = async (token, uploaded = []) => {
-    const listos = uploaded.filter((asset) => asset.src && !isPersisted(asset));
-    if (listos.length === 0) return;
-
-    const data = {
-      articleId: state.product?.id_article,
-      newAssets: listos.map(toPayload),
-      updateAssets: [],
-      deleteAssets: [],
-    };
-
-    if (state.product?.orderId || state.product?.id_order) {
-      data.orderId = state.product?.orderId || state.product?.id_order;
-    }
-
-    try {
-      const res = await axios.put(
-        process.env.REACT_APP_ARTICLE_DATA_ENDPOINT,
-        data,
-        { params: { asset: true }, headers: { Authorization: token } },
-      );
-
-      if (res.data.statusCode !== 200) throw new Error("Respuesta inesperada");
-
-      const body = JSON.parse(res.data.body);
-      const guardados = body.assets ?? [];
-
-      /*
-        Se le pone a cada activo el id que le tocó, emparejando por la clave de
-        S3, que es única.
-
-        A propósito NO se reemplaza la lista entera con lo que devolvió el
-        backend: eso borraría el rastro de lo que el usuario cambió o borró y
-        todavía no ha guardado. Aquí solo se completa lo que faltaba.
-      */
-      listos.forEach((asset) => {
-        const fila = guardados.find((row) => row.src === asset.src);
-        if (!fila) return;
-        dispatch({
-          type: "PATCH_ASSET",
-          payload: { key: assetKey(asset), changes: { id: fila.id, url: fila.url } },
-        });
-      });
-    } catch (error) {
-      console.log("Error registering assets:", error);
-      /*
-        El archivo SÍ está en S3; lo que falló es la fila. Se marca en el activo
-        y no en un modal porque el usuario puede estar soltando más archivos:
-        interrumpirlo con un diálogo por cada fallo sería peor que dejarlo
-        señalado en su renglón, donde además se ve cuál falló.
-      */
-      listos.forEach((asset) => dispatch({
-        type: "PATCH_ASSET",
-        payload: {
-          key: assetKey(asset),
-          changes: {
-            status: "error",
-            error: "Se subió el archivo pero no se pudo guardar. Usa el botón de guardar.",
-          },
-        },
-      }));
-    }
-  };
-
-  /*
-    Guarda los activos digitales: registra los nuevos, manda los cambios y pide
-    las bajas.
-
-    Va aparte de `updateImages` y no dentro, aunque las dos bandejas vivan en la
-    misma pestaña. Un activo no pasa por ninguna de las reglas de una imagen —ni
-    tipo de toma, ni obligatoriedad, ni cupo por cadena— y el backend los escribe
-    en otra tabla. Mezclarlos obligaría a partir en dos cada validación de
-    `updateImages`, que ya es la función más delicada de este archivo.
-
-    Igual que con las imágenes, aquí NO viaja ningún binario: el archivo ya está
-    en S3 y esto solo registra metadatos. Mandar el archivo en el cuerpo devuelve
-    413.
-  */
-  const saveAssets = async (token) => {
-    const payload = buildSavePayload(selectAssetsToSave(state));
-    const { newAssets, updateAssets, deleteAssets } = payload;
-
-    if (!newAssets.length && !updateAssets.length && !deleteAssets.length) {
-      return false;
-    }
-
-    /*
-      Un activo nuevo sin `key` es un archivo que todavía no llegó a S3.
-      Registrarlo crearía una fila apuntando a un objeto que no existe: la
-      bandeja lo mostraría y al descargarlo daría 404, sin forma de saber por qué.
-      Mejor no guardar nada y decirlo.
-    */
-    const sinSubir = newAssets.filter((asset) => !asset.key);
-    if (sinSubir.length > 0) {
-      dispatch({
-        type: "SET_MODAL",
-        payload: {
-          show: true,
-          title: "Faltan archivos por subir",
-          message: `${sinSubir.length} activo(s) todavía no se han subido. Espera a que termine la carga e intenta de nuevo.`,
-          image: warningIcon,
-        },
-      });
-      return false;
-    }
-
-    dispatch({ type: "SET_SAVING", payload: true });
-
-    // Sin `version`: un activo general es el mismo para todas las versiones del
-    // producto, así que ni la fila ni la clave de S3 la llevan.
-    const data = {
-      articleId: state.product?.id_article,
-      newAssets,
-      updateAssets,
-      deleteAssets,
-    };
-
-    if (state.product?.orderId || state.product?.id_order) {
-      data.orderId = state.product?.orderId || state.product?.id_order;
-    }
-
-    try {
-      const res = await axios.put(
-        process.env.REACT_APP_ARTICLE_DATA_ENDPOINT,
-        data,
-        {
-          params: { asset: true },
-          headers: { Authorization: token },
-        },
-      );
-
-      if (res.data.statusCode === 200) {
-        // Se olvida qué cambió y qué se borró: lo que hay en pantalla ya es lo
-        // que hay en la base. Sin esto, el siguiente guardado reenviaría todo.
-        dispatch({ type: "CLEAR_ASSETS_TRACKING" });
-        dispatch({
-          type: "SET_MODAL",
-          payload: {
-            show: true,
-            title: "",
-            message: "Activos digitales guardados con éxito",
-            image: successIcon,
-          },
-        });
-        /*
-          Devuelve `true` para que quien llama recargue.
-
-          Es imprescindible, no cortesía: los activos recién creados siguen en
-          memoria con su id temporal y sin el id de la base. Sin recargar, el
-          siguiente guardado los volvería a mandar como nuevos y se duplicarían.
-          Es exactamente el problema que ya tuvieron las imágenes.
-        */
-        return true;
-      }
-
-      return false;
-    } catch (error) {
-      console.log("Error saving assets:", error);
-      dispatch({
-        type: "SET_ERRORS",
-        payload: [...state.errors, error],
-      });
-      dispatch({
-        type: "SET_MODAL",
-        payload: {
-          show: true,
-          title: "Error",
-          message: "Hubo un error al guardar los activos digitales",
-          image: errorIcon,
-        },
-      });
-      return false;
-    } finally {
-      dispatch({ type: "SET_SAVING", payload: false });
-    }
-  };
-
   const createComment = async (body, token) => {
     const concept = getConceptByTab(state.active_tab);
     const data = {
@@ -781,8 +583,6 @@ export const ProviderProductEditionProvider = ({ children }) => {
     updateImages,
     saveImageAttrs,
     deleteImages,
-    saveAssets,
-    registerUploadedAssets,
     handleOnDownloadImages,
     createComment,
   };

package/src/components/pages/RetailerProductEdition/context/provider-product-edition.reducer.js

@@ -18,11 +18,6 @@ import {
   activeStateInitialState,
   activeStateReducer,
 } from "./reducers/active-state";
-import { ASSET_ACTIONS } from "../../../../global-files/digital-assets/assets.actions";
-import {
-  assetsInitialState,
-  assetsReducer,
-} from "../../../../global-files/digital-assets/assets.reducer";
 
 // Initial state
 export const initialState = {
@@ -30,7 +25,6 @@ export const initialState = {
   ...productInitialState,
   ...inputsInitialState,
   ...activeStateInitialState,
-  ...assetsInitialState,
 };
 
 // Action types
@@ -39,7 +33,6 @@ export const ACTIONS = {
   ...PRODUCT_ACTIONS,
   ...INPUTS_ACTIONS,
   ...ACTIVE_STATE_ACTIONS,
-  ...ASSET_ACTIONS,
 };
 
 // Reducer function
@@ -65,10 +58,5 @@ export const productEditionReducer = (state, action) => {
     return activeStateResult;
   }
 
-  const assetsResult = assetsReducer(state, action);
-  if (assetsResult !== null) {
-    return assetsResult;
-  }
-
   return state;
 };