contentoh-components-library 21.6.44 → 21.6.46

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

@@ -69,6 +69,8 @@ var _LinkVariantsModal = require("../../organisms/LinkVariantsModal");
 
 var _UnlinkVariantModal = require("../../organisms/UnlinkVariantModal");
 
+var _VariantGroupModal = require("../../organisms/VariantGroupModal");
+
 var _PropagateChangesModal = require("../../organisms/PropagateChangesModal");
 
 var _api = require("../../organisms/LinkVariantsModal/api");
@@ -92,7 +94,7 @@ var _AiProductEdition = require("../../../contexts/AiProductEdition");
 var _jsxRuntime = require("react/jsx-runtime");
 
 var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
-  var _location$state4, _state$product2, _state$product3, _state$product4, _state$product5, _state$product6, _state$product7, _family$variants2, _state$product16, _state$product17, _state$product18, _state$active_retaile4, _location$state5, _location$state6, _state$active_retaile5, _state$active_retaile6, _state$images_values$2, _state$images_values10, _state$images_values11, _state$active_retaile7, _state$product19, _state$product20, _state$product21, _state$product22, _family$variants3, _family$variants4, _family$variants5, _state$active_percent, _state$active_percent2, _state$active_retaile8, _state$active_retaile9, _state$active_retaile10, _state$product28, _state$descriptions_i, _state$services2, _state$services2$data, _state$product29, _state$product30, _state$datasheets_inp, _state$datasheets_inp2, _state$datasheets_inp3, _state$product31, _state$images_values12;
+  var _location$state4, _state$product2, _state$product3, _state$product4, _state$product5, _state$product6, _state$product7, _state$product15, _family$variants2, _state$product20, _state$product21, _state$product22, _state$active_retaile4, _state$product23, _state$product24, _state$product25, _variantGroup$group, _location$state5, _location$state6, _state$active_retaile5, _state$active_retaile6, _state$images_values$2, _state$images_values10, _state$images_values11, _state$active_retaile7, _state$product26, _state$product27, _state$product28, _state$product29, _family$variants3, _family$variants4, _family$variants5, _variantGroup$members, _variantGroup$members2, _state$active_percent, _state$active_percent2, _state$active_retaile8, _state$active_retaile9, _state$active_retaile10, _state$product35, _state$descriptions_i, _state$services2, _state$services2$data, _state$product36, _state$product37, _state$datasheets_inp, _state$datasheets_inp2, _state$datasheets_inp3, _state$product38, _state$images_values12;
 
   var tabsSections = _ref.tabsSections,
       _ref$productSelected = _ref.productSelected,
@@ -151,55 +153,76 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
       _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
       loadingVariant = _useState12[0],
       setLoadingVariant = _useState12[1];
+  /*
+    Agrupación de variantes. Vive aparte del padre/hijo de arriba a propósito:
+    son mecanismos independientes y un producto puede tener los dos. Padre/hijo
+    es herencia; esto es solo una agrupación por un código compartido.
+  */
+
 
   var _useState13 = (0, _react.useState)(null),
       _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
-      pendingPropagation = _useState14[0],
-      setPendingPropagation = _useState14[1];
+      variantGroup = _useState14[0],
+      setVariantGroup = _useState14[1];
 
   var _useState15 = (0, _react.useState)(false),
       _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
-      preparandoPropagacion = _useState16[0],
-      setPreparandoPropagacion = _useState16[1];
+      showGroup = _useState16[0],
+      setShowGroup = _useState16[1];
 
   var _useState17 = (0, _react.useState)(false),
       _useState18 = (0, _slicedToArray2.default)(_useState17, 2),
-      preparandoEdicionMultiple = _useState18[0],
-      setPreparandoEdicionMultiple = _useState18[1];
+      showGroupModal = _useState18[0],
+      setShowGroupModal = _useState18[1];
 
-  var _useState19 = (0, _react.useState)(false),
+  var _useState19 = (0, _react.useState)(null),
       _useState20 = (0, _slicedToArray2.default)(_useState19, 2),
-      showRejectModal = _useState20[0],
-      setShowRejectModal = _useState20[1];
+      pendingPropagation = _useState20[0],
+      setPendingPropagation = _useState20[1];
 
-  var _useState21 = (0, _react.useState)(0),
+  var _useState21 = (0, _react.useState)(false),
       _useState22 = (0, _slicedToArray2.default)(_useState21, 2),
-      headerTop = _useState22[0],
-      setHeaderTop = _useState22[1];
+      preparandoPropagacion = _useState22[0],
+      setPreparandoPropagacion = _useState22[1];
 
-  var _useState23 = (0, _react.useState)({}),
+  var _useState23 = (0, _react.useState)(false),
       _useState24 = (0, _slicedToArray2.default)(_useState23, 2),
-      assig = _useState24[0],
-      setAssig = _useState24[1];
+      preparandoEdicionMultiple = _useState24[0],
+      setPreparandoEdicionMultiple = _useState24[1];
 
   var _useState25 = (0, _react.useState)(false),
       _useState26 = (0, _slicedToArray2.default)(_useState25, 2),
-      imageLayout = _useState26[0],
-      setImageLayout = _useState26[1];
+      showRejectModal = _useState26[0],
+      setShowRejectModal = _useState26[1];
 
-  var _useState27 = (0, _react.useState)(false),
+  var _useState27 = (0, _react.useState)(0),
       _useState28 = (0, _slicedToArray2.default)(_useState27, 2),
-      rejectAll = _useState28[0],
-      setRejectAll = _useState28[1];
+      headerTop = _useState28[0],
+      setHeaderTop = _useState28[1];
+
+  var _useState29 = (0, _react.useState)({}),
+      _useState30 = (0, _slicedToArray2.default)(_useState29, 2),
+      assig = _useState30[0],
+      setAssig = _useState30[1];
 
-  var _useState29 = (0, _react.useState)({
+  var _useState31 = (0, _react.useState)(false),
+      _useState32 = (0, _slicedToArray2.default)(_useState31, 2),
+      imageLayout = _useState32[0],
+      setImageLayout = _useState32[1];
+
+  var _useState33 = (0, _react.useState)(false),
+      _useState34 = (0, _slicedToArray2.default)(_useState33, 2),
+      rejectAll = _useState34[0],
+      setRejectAll = _useState34[1];
+
+  var _useState35 = (0, _react.useState)({
     "Ficha técnica": null,
     Descripción: null,
     Imágenes: null
   }),
-      _useState30 = (0, _slicedToArray2.default)(_useState29, 2),
-      origin = _useState30[0],
-      setOrigin = _useState30[1];
+      _useState36 = (0, _slicedToArray2.default)(_useState35, 2),
+      origin = _useState36[0],
+      setOrigin = _useState36[1];
 
   var _useCloseModal = (0, _customHooks.useCloseModal)("version-selector"),
       _useCloseModal2 = (0, _slicedToArray2.default)(_useCloseModal, 2),
@@ -326,10 +349,10 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
     de antes hasta que alguien cierra y reabre el producto.
   */
 
-  var _useState31 = (0, _react.useState)(0),
-      _useState32 = (0, _slicedToArray2.default)(_useState31, 2),
-      linkNonce = _useState32[0],
-      setLinkNonce = _useState32[1]; // Setter de los servicios y porcentages del producto
+  var _useState37 = (0, _react.useState)(0),
+      _useState38 = (0, _slicedToArray2.default)(_useState37, 2),
+      linkNonce = _useState38[0],
+      setLinkNonce = _useState38[1]; // Setter de los servicios y porcentages del producto
 
 
   (0, _react.useEffect)(function () {
@@ -1117,10 +1140,10 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
   */
 
 
-  var _useState33 = (0, _react.useState)(null),
-      _useState34 = (0, _slicedToArray2.default)(_useState33, 2),
-      porDesvincular = _useState34[0],
-      setPorDesvincular = _useState34[1];
+  var _useState39 = (0, _react.useState)(null),
+      _useState40 = (0, _slicedToArray2.default)(_useState39, 2),
+      porDesvincular = _useState40[0],
+      setPorDesvincular = _useState40[1];
   /*
     Después de desvincular, esta ficha cambia de forma.
      Si el producto se soltó de su padre, deja de ser hijo y vuelve a poder ligar
@@ -1176,18 +1199,161 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
       return n + 1;
     });
   };
+  /*
+    Trae el grupo de variantes del producto y sus miembros.
+     Se pide al montar y no al abrir el desplegable —al contrario que la familia
+    padre/hijo— porque aquí el conteo no viene en el producto: `variant_group`
+    no lo devuelven los endpoints del listado, así que sin esta llamada la ficha
+    no sabría ni si el producto está agrupado.
+  */
 
-  var openVariant = /*#__PURE__*/function () {
-    var _ref9 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5(articleId) {
-      var res, _readPayload2, data, encontrado;
+
+  var loadVariantGroup = /*#__PURE__*/function () {
+    var _ref9 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5() {
+      var forzar,
+          _state$product13,
+          res,
+          data,
+          _args5 = arguments;
 
       return _regenerator.default.wrap(function _callee5$(_context5) {
         while (1) {
           switch (_context5.prev = _context5.next) {
+            case 0:
+              forzar = _args5.length > 0 && _args5[0] !== undefined ? _args5[0] : false;
+
+              if (!(variantGroup && !forzar)) {
+                _context5.next = 3;
+                break;
+              }
+
+              return _context5.abrupt("return", variantGroup);
+
+            case 3:
+              _context5.prev = 3;
+              _context5.next = 6;
+              return _axios.default.post("".concat(process.env.REACT_APP_VARIANTS_ENDPOINT, "/group"), {
+                articleId: (_state$product13 = state.product) === null || _state$product13 === void 0 ? void 0 : _state$product13.id_article
+              }, {
+                headers: {
+                  Authorization: token
+                }
+              });
+
+            case 6:
+              res = _context5.sent;
+              data = (0, _api.readPayload)(res);
+              setVariantGroup(data);
+              return _context5.abrupt("return", data);
+
+            case 12:
+              _context5.prev = 12;
+              _context5.t0 = _context5["catch"](3);
+              console.error("loadVariantGroup: ", _context5.t0);
+              setVariantGroup({
+                group: null,
+                members: [],
+                error: true
+              });
+              return _context5.abrupt("return", null);
+
+            case 17:
+            case "end":
+              return _context5.stop();
+          }
+        }
+      }, _callee5, null, [[3, 12]]);
+    }));
+
+    return function loadVariantGroup() {
+      return _ref9.apply(this, arguments);
+    };
+  }();
+
+  (0, _react.useEffect)(function () {
+    var _state$product14;
+
+    if (!((_state$product14 = state.product) !== null && _state$product14 !== void 0 && _state$product14.id_article)) return;
+    loadVariantGroup(true); // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [(_state$product15 = state.product) === null || _state$product15 === void 0 ? void 0 : _state$product15.id_article]); // Saca el producto del grupo. Los demás miembros siguen agrupados entre ellos;
+  // si era el último, el grupo deja de existir, porque no vive en ninguna tabla.
+
+  var handleOnLeaveGroup = /*#__PURE__*/function () {
+    var _ref10 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6() {
+      var _state$product16, res;
+
+      return _regenerator.default.wrap(function _callee6$(_context6) {
+        while (1) {
+          switch (_context6.prev = _context6.next) {
+            case 0:
+              _context6.prev = 0;
+              _context6.next = 3;
+              return _axios.default.post("".concat(process.env.REACT_APP_VARIANTS_ENDPOINT, "/leave"), {
+                articleId: (_state$product16 = state.product) === null || _state$product16 === void 0 ? void 0 : _state$product16.id_article
+              }, {
+                headers: {
+                  Authorization: token
+                }
+              });
+
+            case 3:
+              res = _context6.sent;
+              setVariantGroup((0, _api.readPayload)(res));
+              setShowGroup(false);
+              _context6.next = 12;
+              break;
+
+            case 8:
+              _context6.prev = 8;
+              _context6.t0 = _context6["catch"](0);
+              console.error("leaveVariantGroup: ", _context6.t0);
+              dispatch({
+                type: "SET_MODAL",
+                payload: {
+                  show: true,
+                  title: "Variantes",
+                  message: "No se pudo quitar el producto del grupo. Intenta de nuevo.",
+                  image: _genericModalWarning.default,
+                  // Con `buttons` vacío el modal se queda sin forma de cerrarse.
+                  buttons: [{
+                    text: "Entendido",
+                    buttonType: "general-white-button",
+                    action: function action() {
+                      return dispatch({
+                        type: "SET_MODAL",
+                        payload: {
+                          show: false
+                        }
+                      });
+                    }
+                  }]
+                }
+              });
+
+            case 12:
+            case "end":
+              return _context6.stop();
+          }
+        }
+      }, _callee6, null, [[0, 8]]);
+    }));
+
+    return function handleOnLeaveGroup() {
+      return _ref10.apply(this, arguments);
+    };
+  }();
+
+  var openVariant = /*#__PURE__*/function () {
+    var _ref11 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee7(articleId) {
+      var res, _readPayload2, data, encontrado;
+
+      return _regenerator.default.wrap(function _callee7$(_context7) {
+        while (1) {
+          switch (_context7.prev = _context7.next) {
             case 0:
               setLoadingVariant(articleId);
-              _context5.prev = 1;
-              _context5.next = 4;
+              _context7.prev = 1;
+              _context7.next = 4;
               return _axios.default.get("".concat(process.env.REACT_APP_NEW_ARTICLES_ENDPOINT), {
                 params: {
                   listType: "general",
@@ -1199,7 +1365,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               });
 
             case 4:
-              res = _context5.sent;
+              res = _context7.sent;
               // read-articles-v2 responde { count, data: [...] }.
               _readPayload2 = (0, _api.readPayload)(res), data = _readPayload2.data;
               encontrado = (data !== null && data !== void 0 ? data : []).find(function (item) {
@@ -1219,33 +1385,33 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 }));
               }
 
-              _context5.next = 13;
+              _context7.next = 13;
               break;
 
             case 10:
-              _context5.prev = 10;
-              _context5.t0 = _context5["catch"](1);
+              _context7.prev = 10;
+              _context7.t0 = _context7["catch"](1);
               // Si la consulta falla se navega igual: la pantalla mostrará el producto
               // que hubiera en sessionStorage, que es el comportamiento de siempre.
               // Peor sería dejar el clic sin efecto y que pareciera que no responde.
-              console.error("openVariant: ", _context5.t0);
+              console.error("openVariant: ", _context7.t0);
 
             case 13:
-              _context5.prev = 13;
+              _context7.prev = 13;
               setLoadingVariant(null);
               window.location.assign("/products/".concat(articleId, "/datasheet"));
-              return _context5.finish(13);
+              return _context7.finish(13);
 
             case 17:
             case "end":
-              return _context5.stop();
+              return _context7.stop();
           }
         }
-      }, _callee5, null, [[1, 10, 13, 17]]);
+      }, _callee7, null, [[1, 10, 13, 17]]);
     }));
 
     return function openVariant(_x2) {
-      return _ref9.apply(this, arguments);
+      return _ref11.apply(this, arguments);
     };
   }();
   /*
@@ -1261,11 +1427,11 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
 
 
   var handleOnLinkedVariants = function handleOnLinkedVariants(result) {
-    var _state$product$varian2, _state$product13, _result$linked, _result$parentArticle;
+    var _state$product$varian2, _state$product17, _result$linked, _result$parentArticle;
 
     if (!result) return;
     var updatedProduct = result.mode === "children" ? (0, _objectSpread4.default)((0, _objectSpread4.default)({}, state.product), {}, {
-      variantsCount: ((_state$product$varian2 = (_state$product13 = state.product) === null || _state$product13 === void 0 ? void 0 : _state$product13.variantsCount) !== null && _state$product$varian2 !== void 0 ? _state$product$varian2 : 0) + ((_result$linked = result.linked) !== null && _result$linked !== void 0 ? _result$linked : []).length
+      variantsCount: ((_state$product$varian2 = (_state$product17 = state.product) === null || _state$product17 === void 0 ? void 0 : _state$product17.variantsCount) !== null && _state$product$varian2 !== void 0 ? _state$product$varian2 : 0) + ((_result$linked = result.linked) !== null && _result$linked !== void 0 ? _result$linked : []).length
     }) : (0, _objectSpread4.default)((0, _objectSpread4.default)({}, state.product), {}, {
       parentArticleId: (_result$parentArticle = result.parentArticleId) !== null && _result$parentArticle !== void 0 ? _result$parentArticle : null,
       variantsCount: 0
@@ -1323,31 +1489,31 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
 
 
   var handleOnRestoreInheritance = /*#__PURE__*/function () {
-    var _ref10 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6(attributeId) {
-      var _state$product14;
+    var _ref12 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee8(attributeId) {
+      var _state$product18;
 
       var kind,
           esDescripcion,
           res,
           data,
-          _args6 = arguments;
-      return _regenerator.default.wrap(function _callee6$(_context6) {
+          _args8 = arguments;
+      return _regenerator.default.wrap(function _callee8$(_context8) {
         while (1) {
-          switch (_context6.prev = _context6.next) {
+          switch (_context8.prev = _context8.next) {
             case 0:
-              kind = _args6.length > 1 && _args6[1] !== undefined ? _args6[1] : "attribute";
+              kind = _args8.length > 1 && _args8[1] !== undefined ? _args8[1] : "attribute";
 
-              if (!(!attributeId || !((_state$product14 = state.product) !== null && _state$product14 !== void 0 && _state$product14.id_article))) {
-                _context6.next = 3;
+              if (!(!attributeId || !((_state$product18 = state.product) !== null && _state$product18 !== void 0 && _state$product18.id_article))) {
+                _context8.next = 3;
                 break;
               }
 
-              return _context6.abrupt("return");
+              return _context8.abrupt("return");
 
             case 3:
               esDescripcion = kind === "description";
-              _context6.prev = 4;
-              _context6.next = 7;
+              _context8.prev = 4;
+              _context8.next = 7;
               return _axios.default.post("".concat(process.env.REACT_APP_VARIANTS_ENDPOINT, "/restore"), (0, _objectSpread4.default)({
                 articleId: state.product.id_article
               }, esDescripcion ? {
@@ -1361,13 +1527,13 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               });
 
             case 7:
-              res = _context6.sent;
+              res = _context8.sent;
               // El API responde 200 aunque la lambda haya devuelto 400: el resultado
               // real viaja en el cuerpo y readPayload lo convierte en excepción.
               data = (0, _api.readPayload)(res);
 
               if (!esDescripcion) {
-                _context6.next = 12;
+                _context8.next = 12;
                 break;
               }
 
@@ -1381,7 +1547,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   };
                 })
               });
-              return _context6.abrupt("return");
+              return _context8.abrupt("return");
 
             case 12:
               dispatch({
@@ -1394,24 +1560,24 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   };
                 })
               });
-              _context6.next = 18;
+              _context8.next = 18;
               break;
 
             case 15:
-              _context6.prev = 15;
-              _context6.t0 = _context6["catch"](4);
-              console.error("restoreInheritance: ", _context6.t0);
+              _context8.prev = 15;
+              _context8.t0 = _context8["catch"](4);
+              console.error("restoreInheritance: ", _context8.t0);
 
             case 18:
             case "end":
-              return _context6.stop();
+              return _context8.stop();
           }
         }
-      }, _callee6, null, [[4, 15]]);
+      }, _callee8, null, [[4, 15]]);
     }));
 
     return function handleOnRestoreInheritance(_x3) {
-      return _ref10.apply(this, arguments);
+      return _ref12.apply(this, arguments);
     };
   }();
 
@@ -1446,14 +1612,14 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
   };
 
   var sendEvaluation = /*#__PURE__*/function () {
-    var _ref11 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee7(result) {
-      var _state$product$id_ord, _state$active_retaile3, _state$product$status, _state$product$status2, _state$product15;
+    var _ref13 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee9(result) {
+      var _state$product$id_ord, _state$active_retaile3, _state$product$status, _state$product$status2, _state$product19;
 
       var concept, articleId, orderId, retailerId, evalStatus, data, _newStatuses$newStatu, _state$services_data, res, newStatuses, serviceStatus, updatedStatusByRetailer, updatedProduct, updatedServicesData;
 
-      return _regenerator.default.wrap(function _callee7$(_context7) {
+      return _regenerator.default.wrap(function _callee9$(_context9) {
         while (1) {
-          switch (_context7.prev = _context7.next) {
+          switch (_context9.prev = _context9.next) {
             case 0:
               dispatch({
                 type: "SET_SAVING",
@@ -1463,23 +1629,23 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               articleId = state.product.id_article;
               orderId = (_state$product$id_ord = state.product.id_order) !== null && _state$product$id_ord !== void 0 ? _state$product$id_ord : state.product.orderId;
               retailerId = (_state$active_retaile3 = state.active_retailer) === null || _state$active_retaile3 === void 0 ? void 0 : _state$active_retaile3.id_retailer;
-              evalStatus = ((_state$product$status = state.product.statusByRetailer) === null || _state$product$status === void 0 ? void 0 : (_state$product$status2 = _state$product$status[retailerId]) === null || _state$product$status2 === void 0 ? void 0 : _state$product$status2[concept]) || state.product["".concat(concept, "_status")] || ((_state$product15 = state.product) === null || _state$product15 === void 0 ? void 0 : _state$product15.version_status);
+              evalStatus = ((_state$product$status = state.product.statusByRetailer) === null || _state$product$status === void 0 ? void 0 : (_state$product$status2 = _state$product$status[retailerId]) === null || _state$product$status2 === void 0 ? void 0 : _state$product$status2[concept]) || state.product["".concat(concept, "_status")] || ((_state$product19 = state.product) === null || _state$product19 === void 0 ? void 0 : _state$product19.version_status);
               data = {
                 articleId: articleId,
                 orderId: orderId,
                 concept: concept,
                 evalStatus: evalStatus
               };
-              _context7.prev = 7;
+              _context9.prev = 7;
 
               if (!result) {
-                _context7.next = 22;
+                _context9.next = 22;
                 break;
               }
 
               data.result = result;
               data.retailerId = retailerId;
-              _context7.next = 13;
+              _context9.next = 13;
               return _axios.default.put("".concat(process.env.REACT_APP_EVALUATION_ENDPOINT), data, {
                 headers: {
                   Authorization: token
@@ -1487,7 +1653,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               });
 
             case 13:
-              res = _context7.sent;
+              res = _context9.sent;
               newStatuses = JSON.parse(res.data.body);
               serviceStatus = newStatuses.newServiceStatus[articleId]["".concat(concept, "Status")]; // Actualizar el producto con los nuevos estados
 
@@ -1524,13 +1690,13 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               });
 
             case 22:
-              _context7.next = 28;
+              _context9.next = 28;
               break;
 
             case 24:
-              _context7.prev = 24;
-              _context7.t0 = _context7["catch"](7);
-              console.error("Error sending evaluation:", _context7.t0);
+              _context9.prev = 24;
+              _context9.t0 = _context9["catch"](7);
+              console.error("Error sending evaluation:", _context9.t0);
               dispatch({
                 type: "SET_MODAL",
                 payload: {
@@ -1542,32 +1708,32 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               });
 
             case 28:
-              _context7.prev = 28;
+              _context9.prev = 28;
               dispatch({
                 type: "SET_SAVING",
                 payload: false
               });
-              return _context7.finish(28);
+              return _context9.finish(28);
 
             case 31:
             case "end":
-              return _context7.stop();
+              return _context9.stop();
           }
         }
-      }, _callee7, null, [[7, 24, 28, 31]]);
+      }, _callee9, null, [[7, 24, 28, 31]]);
     }));
 
     return function sendEvaluation(_x4) {
-      return _ref11.apply(this, arguments);
+      return _ref13.apply(this, arguments);
     };
   }();
 
   var evaluationToRetailer = /*#__PURE__*/function () {
-    var _ref12 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee8(result) {
+    var _ref14 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee10(result) {
       var data, statusComplete, updatedProduct;
-      return _regenerator.default.wrap(function _callee8$(_context8) {
+      return _regenerator.default.wrap(function _callee10$(_context10) {
         while (1) {
-          switch (_context8.prev = _context8.next) {
+          switch (_context10.prev = _context10.next) {
             case 0:
               dispatch({
                 type: "SET_SAVING",
@@ -1579,8 +1745,8 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 versionId: state.product.version,
                 status: result
               };
-              _context8.prev = 2;
-              _context8.next = 5;
+              _context10.prev = 2;
+              _context10.next = 5;
               return _axios.default.put("".concat(process.env.REACT_APP_RETAILER_REQUEST), data, {
                 headers: {
                   Authorization: token
@@ -1610,13 +1776,13 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   image: _genericModalCheck.default
                 }
               });
-              _context8.next = 15;
+              _context10.next = 15;
               break;
 
             case 11:
-              _context8.prev = 11;
-              _context8.t0 = _context8["catch"](2);
-              console.error("Error evaluating to retailer:", _context8.t0);
+              _context10.prev = 11;
+              _context10.t0 = _context10["catch"](2);
+              console.error("Error evaluating to retailer:", _context10.t0);
               dispatch({
                 type: "SET_MODAL",
                 payload: {
@@ -1628,23 +1794,23 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               });
 
             case 15:
-              _context8.prev = 15;
+              _context10.prev = 15;
               dispatch({
                 type: "SET_SAVING",
                 payload: false
               });
-              return _context8.finish(15);
+              return _context10.finish(15);
 
             case 18:
             case "end":
-              return _context8.stop();
+              return _context10.stop();
           }
         }
-      }, _callee8, null, [[2, 11, 15, 18]]);
+      }, _callee10, null, [[2, 11, 15, 18]]);
     }));
 
     return function evaluationToRetailer(_x5) {
-      return _ref12.apply(this, arguments);
+      return _ref14.apply(this, arguments);
     };
   }();
 
@@ -1775,18 +1941,18 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
   };
 
   var handleOnEvaluateAll = /*#__PURE__*/function () {
-    var _ref13 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee9(result) {
+    var _ref15 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee11(result) {
       var _state$product$id_ord2, _state$services_data2, evaluationArray, conceptArray, dataGeneral, isProvider, userType, status, updatedStatusByRetailer, updatedProduct;
 
-      return _regenerator.default.wrap(function _callee9$(_context9) {
+      return _regenerator.default.wrap(function _callee11$(_context11) {
         while (1) {
-          switch (_context9.prev = _context9.next) {
+          switch (_context11.prev = _context11.next) {
             case 0:
               dispatch({
                 type: "SET_SAVING",
                 payload: true
               });
-              _context9.prev = 1;
+              _context11.prev = 1;
               evaluationArray = [];
               conceptArray = ["description", "datasheet", "images"];
               dataGeneral = {
@@ -1817,7 +1983,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 }));
               }); // Ejecutar todas las evaluaciones
 
-              _context9.next = 9;
+              _context11.next = 9;
               return Promise.all(evaluationArray);
 
             case 9:
@@ -1862,13 +2028,13 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   image: _genericModalCheck.default
                 }
               });
-              _context9.next = 24;
+              _context11.next = 24;
               break;
 
             case 20:
-              _context9.prev = 20;
-              _context9.t0 = _context9["catch"](1);
-              console.error("Error evaluating all:", _context9.t0);
+              _context11.prev = 20;
+              _context11.t0 = _context11["catch"](1);
+              console.error("Error evaluating all:", _context11.t0);
               dispatch({
                 type: "SET_MODAL",
                 payload: {
@@ -1880,24 +2046,24 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               });
 
             case 24:
-              _context9.prev = 24;
+              _context11.prev = 24;
               dispatch({
                 type: "SET_SAVING",
                 payload: false
               });
               setRejectAll(false);
-              return _context9.finish(24);
+              return _context11.finish(24);
 
             case 28:
             case "end":
-              return _context9.stop();
+              return _context11.stop();
           }
         }
-      }, _callee9, null, [[1, 20, 24, 28]]);
+      }, _callee11, null, [[1, 20, 24, 28]]);
     }));
 
     return function handleOnEvaluateAll(_x6) {
-      return _ref13.apply(this, arguments);
+      return _ref15.apply(this, arguments);
     };
   }();
 
@@ -1959,15 +2125,28 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
           saveDatasheets(token, propagation !== null && propagation !== void 0 ? propagation : undefined);
         }
       }), showLinkVariants && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkVariantsModal.LinkVariantsModal, {
-        articleId: (_state$product16 = state.product) === null || _state$product16 === void 0 ? void 0 : _state$product16.id_article,
-        articleName: (_state$product17 = state.product) === null || _state$product17 === void 0 ? void 0 : _state$product17.name,
-        articleUpc: (_state$product18 = state.product) === null || _state$product18 === void 0 ? void 0 : _state$product18.upc,
+        articleId: (_state$product20 = state.product) === null || _state$product20 === void 0 ? void 0 : _state$product20.id_article,
+        articleName: (_state$product21 = state.product) === null || _state$product21 === void 0 ? void 0 : _state$product21.name,
+        articleUpc: (_state$product22 = state.product) === null || _state$product22 === void 0 ? void 0 : _state$product22.upc,
         activeRetailerId: (_state$active_retaile4 = state.active_retailer) === null || _state$active_retaile4 === void 0 ? void 0 : _state$active_retaile4.id_retailer,
         token: token,
         onClose: function onClose() {
           return setShowLinkVariants(false);
         },
         onLinked: handleOnLinkedVariants
+      }), showGroupModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_VariantGroupModal.VariantGroupModal, {
+        articleId: (_state$product23 = state.product) === null || _state$product23 === void 0 ? void 0 : _state$product23.id_article,
+        articleName: (_state$product24 = state.product) === null || _state$product24 === void 0 ? void 0 : _state$product24.name,
+        articleUpc: (_state$product25 = state.product) === null || _state$product25 === void 0 ? void 0 : _state$product25.upc,
+        currentGroup: (_variantGroup$group = variantGroup === null || variantGroup === void 0 ? void 0 : variantGroup.group) !== null && _variantGroup$group !== void 0 ? _variantGroup$group : null,
+        token: token,
+        onClose: function onClose() {
+          return setShowGroupModal(false);
+        },
+        onSaved: function onSaved(result) {
+          setVariantGroup(result);
+          setShowGroup(true);
+        }
       }), porDesvincular && /*#__PURE__*/(0, _jsxRuntime.jsx)(_UnlinkVariantModal.UnlinkVariantModal, (0, _objectSpread4.default)((0, _objectSpread4.default)({}, porDesvincular), {}, {
         token: token,
         onClose: function onClose() {
@@ -2034,21 +2213,21 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
           type: "pink",
           label: "Aceptar",
           size: 12,
-          onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee10() {
+          onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee12() {
             var elements, isMessageEmpty, container, existingAlert, alert, fullMessage;
-            return _regenerator.default.wrap(function _callee10$(_context10) {
+            return _regenerator.default.wrap(function _callee12$(_context12) {
               while (1) {
-                switch (_context10.prev = _context10.next) {
+                switch (_context12.prev = _context12.next) {
                   case 0:
                     elements = document.querySelectorAll("#modal-message-box .ql-container .ql-editor > p");
 
                     if (!(!elements || elements.length === 0)) {
-                      _context10.next = 4;
+                      _context12.next = 4;
                       break;
                     }
 
                     console.error("Elemento no encontrado");
-                    return _context10.abrupt("return");
+                    return _context12.abrupt("return");
 
                   case 4:
                     isMessageEmpty = Array.from(elements).every(function (el) {
@@ -2057,7 +2236,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                     });
 
                     if (!isMessageEmpty) {
-                      _context10.next = 10;
+                      _context12.next = 10;
                       break;
                     }
 
@@ -2072,13 +2251,13 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                       container.appendChild(alert);
                     }
 
-                    return _context10.abrupt("return");
+                    return _context12.abrupt("return");
 
                   case 10:
                     fullMessage = Array.from(elements).map(function (element) {
                       return element.innerHTML;
                     }).join("").replace(/<br\s*\/?>/gi, "\n");
-                    _context10.next = 13;
+                    _context12.next = 13;
                     return createComment(fullMessage, token);
 
                   case 13:
@@ -2087,10 +2266,10 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
 
                   case 15:
                   case "end":
-                    return _context10.stop();
+                    return _context12.stop();
                 }
               }
-            }, _callee10);
+            }, _callee12);
           }))
         }, "btn-Aceptar")]
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTop.HeaderTop, {
@@ -2117,7 +2296,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
             activeImage: (_state$images_values10 = state.images_values) !== null && _state$images_values10 !== void 0 && _state$images_values10.values ? (_state$images_values11 = state.images_values) === null || _state$images_values11 === void 0 ? void 0 : _state$images_values11.values[state.current_image] : {},
             assignationsImages: assig,
             retailerSelected: (_state$active_retaile7 = state.active_retailer) === null || _state$active_retaile7 === void 0 ? void 0 : _state$active_retaile7.id_retailer,
-            imagesStatus: ((_state$product19 = state.product) === null || _state$product19 === void 0 ? void 0 : _state$product19.images_status) || "-",
+            imagesStatus: ((_state$product26 = state.product) === null || _state$product26 === void 0 ? void 0 : _state$product26.images_status) || "-",
             isRetailer: isRetailer,
             setShowVersionSelector: setShowVersionSelector,
             version: state.product.version,
@@ -2130,7 +2309,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
           className: "product-information",
           children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
             className: "product-information",
-            children: [!((_state$product20 = state.product) !== null && _state$product20 !== void 0 && _state$product20.parentArticleId) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            children: [!((_state$product27 = state.product) !== null && _state$product27 !== void 0 && _state$product27.parentArticleId) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               className: "variants-actions",
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
                 type: "button",
@@ -2139,7 +2318,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   return setShowLinkVariants(true);
                 },
                 children: "Ligar productos"
-              }), ((_state$product21 = state.product) === null || _state$product21 === void 0 ? void 0 : _state$product21.variantsCount) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
+              }), ((_state$product28 = state.product) === null || _state$product28 === void 0 ? void 0 : _state$product28.variantsCount) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
                 type: "button",
                 className: "variants-count",
                 "aria-expanded": showFamily,
@@ -2154,7 +2333,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   children: showFamily ? " ▴" : " ▾"
                 })]
               })]
-            }), ((_state$product22 = state.product) === null || _state$product22 === void 0 ? void 0 : _state$product22.parentArticleId) && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            }), ((_state$product29 = state.product) === null || _state$product29 === void 0 ? void 0 : _state$product29.parentArticleId) && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "variants-actions",
               children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
                 type: "button",
@@ -2203,13 +2382,13 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   className: "desvincular",
                   title: "Dejar de ser hijo de este producto",
                   onClick: function onClick() {
-                    var _state$product23, _state$product24, _state$product25;
+                    var _state$product30, _state$product31, _state$product32;
 
                     return setPorDesvincular({
                       mode: "self",
-                      childArticleId: (_state$product23 = state.product) === null || _state$product23 === void 0 ? void 0 : _state$product23.id_article,
-                      childName: (_state$product24 = state.product) === null || _state$product24 === void 0 ? void 0 : _state$product24.name,
-                      childUpc: (_state$product25 = state.product) === null || _state$product25 === void 0 ? void 0 : _state$product25.upc,
+                      childArticleId: (_state$product30 = state.product) === null || _state$product30 === void 0 ? void 0 : _state$product30.id_article,
+                      childName: (_state$product31 = state.product) === null || _state$product31 === void 0 ? void 0 : _state$product31.name,
+                      childUpc: (_state$product32 = state.product) === null || _state$product32 === void 0 ? void 0 : _state$product32.upc,
                       parentName: family.parent.name,
                       parentUpc: family.parent.upc
                     });
@@ -2241,15 +2420,15 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                     className: "desvincular",
                     title: "Desvincular este hijo",
                     onClick: function onClick() {
-                      var _state$product26, _state$product27;
+                      var _state$product33, _state$product34;
 
                       return setPorDesvincular({
                         mode: "child",
                         childArticleId: variant.articleId,
                         childName: variant.name,
                         childUpc: variant.upc,
-                        parentName: (_state$product26 = state.product) === null || _state$product26 === void 0 ? void 0 : _state$product26.name,
-                        parentUpc: (_state$product27 = state.product) === null || _state$product27 === void 0 ? void 0 : _state$product27.upc
+                        parentName: (_state$product33 = state.product) === null || _state$product33 === void 0 ? void 0 : _state$product33.name,
+                        parentUpc: (_state$product34 = state.product) === null || _state$product34 === void 0 ? void 0 : _state$product34.upc
                       });
                     },
                     children: "Desvincular"
@@ -2265,6 +2444,67 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 onClick: openMultipleEdition,
                 children: preparandoEdicionMultiple ? "Abriendo…" : "Editar los ".concat(family.variants.length, " hijos juntos")
               })]
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+              className: "variants-actions",
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+                type: "button",
+                className: "link-variants",
+                onClick: function onClick() {
+                  return setShowGroupModal(true);
+                },
+                children: variantGroup !== null && variantGroup !== void 0 && variantGroup.group ? "Cambiar de grupo" : "Agrupar variantes"
+              }), (variantGroup === null || variantGroup === void 0 ? void 0 : variantGroup.group) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
+                type: "button",
+                className: "variants-count",
+                "aria-expanded": showGroup,
+                onClick: function onClick() {
+                  return setShowGroup(function (abierto) {
+                    return !abierto;
+                  });
+                },
+                children: ["Variante ", variantGroup.group, /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                  "aria-hidden": "true",
+                  children: showGroup ? " ▴" : " ▾"
+                })]
+              })]
+            }), showGroup && (variantGroup === null || variantGroup === void 0 ? void 0 : variantGroup.group) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+              className: "variants-family",
+              children: [((_variantGroup$members = variantGroup.members) !== null && _variantGroup$members !== void 0 ? _variantGroup$members : []).filter(function (miembro) {
+                return !miembro.isCurrent;
+              }).map(function (miembro) {
+                return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+                  className: "family-item",
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
+                    type: "button",
+                    className: "family-row",
+                    disabled: loadingVariant !== null,
+                    onClick: function onClick() {
+                      return openVariant(miembro.articleId);
+                    },
+                    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                      className: "role",
+                      children: loadingVariant === miembro.articleId ? "Abriendo…" : "Variante"
+                    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                      className: "name",
+                      children: miembro.name
+                    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                      className: "upc",
+                      children: miembro.upc
+                    })]
+                  })
+                }, miembro.articleId);
+              }), ((_variantGroup$members2 = variantGroup.members) !== null && _variantGroup$members2 !== void 0 ? _variantGroup$members2 : []).filter(function (m) {
+                return !m.isCurrent;
+              }).length === 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
+                className: "loading",
+                children: ["Este producto es el \xFAnico en el grupo ", variantGroup.group, "."]
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+                type: "button",
+                className: "desvincular",
+                title: "Quitar este producto del grupo",
+                onClick: handleOnLeaveGroup,
+                children: "Quitar del grupo"
+              })]
             }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullProductNameHeader.FullProductNameHeader, {
               headerData: state.product,
               percent: (_state$active_percent = state.active_percentage) === null || _state$active_percent === void 0 ? void 0 : (_state$active_percent2 = _state$active_percent.percentagesGeneral) === null || _state$active_percent2 === void 0 ? void 0 : _state$active_percent2.required,
@@ -2315,7 +2555,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
             }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "services-information-container " + (imageLayout && state.active_tab === "Imágenes" ? "image-services" : ""),
               children: state.saving ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.Loading, {}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-                children: [state.active_tab === "Descripción" && (((_state$product28 = state.product) === null || _state$product28 === void 0 ? void 0 : _state$product28.description_status) !== "NS" ? (_state$descriptions_i = state.descriptions_inputs) !== null && _state$descriptions_i !== void 0 && _state$descriptions_i[0] ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
+                children: [state.active_tab === "Descripción" && (((_state$product35 = state.product) === null || _state$product35 === void 0 ? void 0 : _state$product35.description_status) !== "NS" ? (_state$descriptions_i = state.descriptions_inputs) !== null && _state$descriptions_i !== void 0 && _state$descriptions_i[0] ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
                   activeSection: state.active_tab,
                   inputGroup: state.descriptions_inputs[0],
                   updatedDescriptions: state.updated_descriptions_inputs
@@ -2326,7 +2566,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   ,
                   variant: (_state$services2 = state.services) === null || _state$services2 === void 0 ? void 0 : (_state$services2$data = _state$services2.datasheets) === null || _state$services2$data === void 0 ? void 0 : _state$services2$data.variant,
                   onRestoreInheritance: handleOnRestoreInheritance,
-                  articleId: (_state$product29 = state.product) === null || _state$product29 === void 0 ? void 0 : _state$product29.id_article,
+                  articleId: (_state$product36 = state.product) === null || _state$product36 === void 0 ? void 0 : _state$product36.id_article,
                   version: state.product.version,
                   isShowbox: false,
                   dinamicHeight: true,
@@ -2338,7 +2578,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
                   text: "No cuentas con este servicio",
                   headerType: "input-name-header"
-                })), state.active_tab === "Ficha técnica" && (((_state$product30 = state.product) === null || _state$product30 === void 0 ? void 0 : _state$product30.datasheet_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+                })), state.active_tab === "Ficha técnica" && (((_state$product37 = state.product) === null || _state$product37 === void 0 ? void 0 : _state$product37.datasheet_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
                   children: ((_state$datasheets_inp = state.datasheets_inputs) === null || _state$datasheets_inp === void 0 ? void 0 : (_state$datasheets_inp2 = _state$datasheets_inp[0]) === null || _state$datasheets_inp2 === void 0 ? void 0 : (_state$datasheets_inp3 = _state$datasheets_inp2.data) === null || _state$datasheets_inp3 === void 0 ? void 0 : _state$datasheets_inp3.length) > 0 ? state.datasheets_inputs[0].data.map(function (dataGroup, index) {
                     var _state$datasheets_inp4, _state$services3, _state$services3$data, _state$services$datas3;
 
@@ -2368,7 +2608,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
                   text: "No cuentas con este servicio",
                   headerType: "input-name-header"
-                })), state.active_tab === "Imágenes" && (((_state$product31 = state.product) === null || _state$product31 === void 0 ? void 0 : _state$product31.images_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+                })), state.active_tab === "Imágenes" && (((_state$product38 = state.product) === null || _state$product38 === void 0 ? void 0 : _state$product38.images_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
                   children: [!imageLayout && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GalleryHeader.GalleryHeader, {
                     checkAll: state.all_image_checked // Determina si el checkbox "Seleccionar todo" está marcado
                     ,