contentoh-components-library 21.5.98 → 21.5.99

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

@@ -77,12 +77,10 @@ var _genericModalWarning = _interopRequireDefault(require("../../../assets/image
 
 var _styles = require("./styles");
 
-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, _location$state5, _location$state6, _state$active_retaile3, _state$active_retaile4, _state$images_values$2, _state$images_values10, _state$images_values11, _state$active_retaile5, _state$product11, _state$active_retaile6, _state$active_retaile7, _state$active_retaile8, _state$product12, _state$product13, _state$product14, _state$datasheets_inp, _state$datasheets_inp2, _state$product15, _state$images_values12;
+  var _location$state4, _location$state5, _location$state6, _state$active_retaile3, _state$active_retaile4, _state$images_values$2, _state$images_values10, _state$images_values11, _state$active_retaile5, _state$product5, _state$active_retaile6, _state$active_retaile7, _state$active_retaile8, _state$product6, _state$product7, _state$product8, _state$datasheets_inp, _state$product9, _state$images_values12;
 
   var tabsSections = _ref.tabsSections,
       _ref$productSelected = _ref.productSelected,
@@ -112,44 +110,49 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
 
   var isRetailer = user === null || user === void 0 ? void 0 : user.is_retailer;
 
-  var _useState = (0, _react.useState)(false),
+  var _useState = (0, _react.useState)(null),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      showModal = _useState2[0],
-      setShowModal = _useState2[1];
+      boxData = _useState2[0],
+      setBoxData = _useState2[1];
 
   var _useState3 = (0, _react.useState)(false),
       _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      showRejectModal = _useState4[0],
-      setShowRejectModal = _useState4[1];
+      showModal = _useState4[0],
+      setShowModal = _useState4[1];
 
-  var _useState5 = (0, _react.useState)(0),
+  var _useState5 = (0, _react.useState)(false),
       _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      headerTop = _useState6[0],
-      setHeaderTop = _useState6[1];
+      showRejectModal = _useState6[0],
+      setShowRejectModal = _useState6[1];
 
-  var _useState7 = (0, _react.useState)({}),
+  var _useState7 = (0, _react.useState)(0),
       _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      assig = _useState8[0],
-      setAssig = _useState8[1];
+      headerTop = _useState8[0],
+      setHeaderTop = _useState8[1];
 
-  var _useState9 = (0, _react.useState)(false),
+  var _useState9 = (0, _react.useState)({}),
       _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      imageLayout = _useState10[0],
-      setImageLayout = _useState10[1];
+      assig = _useState10[0],
+      setAssig = _useState10[1];
 
   var _useState11 = (0, _react.useState)(false),
       _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
-      rejectAll = _useState12[0],
-      setRejectAll = _useState12[1];
+      imageLayout = _useState12[0],
+      setImageLayout = _useState12[1];
+
+  var _useState13 = (0, _react.useState)(false),
+      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
+      rejectAll = _useState14[0],
+      setRejectAll = _useState14[1];
 
-  var _useState13 = (0, _react.useState)({
+  var _useState15 = (0, _react.useState)({
     "Ficha técnica": null,
     Descripción: null,
     Imágenes: null
   }),
-      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
-      origin = _useState14[0],
-      setOrigin = _useState14[1];
+      _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
+      origin = _useState16[0],
+      setOrigin = _useState16[1];
 
   var _useCloseModal = (0, _customHooks.useCloseModal)("version-selector"),
       _useCloseModal2 = (0, _slicedToArray2.default)(_useCloseModal, 2),
@@ -237,8 +240,11 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
   (0, _react.useEffect)(function () {
     var setProductData = function setProductData() {
       try {
-        var product = productSelected ? productSelected : JSON.parse(sessionStorage.getItem("productSelected"));
+        var product = JSON.parse(sessionStorage.getItem("productSelected")) ? JSON.parse(sessionStorage.getItem("productSelected")) : productSelected;
         var productNormalized = (0, _utils.normalizeProduct)(product);
+        console.log({
+          productNormalized: productNormalized
+        });
         dispatch({
           type: "SET_PRODUCT",
           payload: productNormalized
@@ -283,7 +289,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
 
     var fetchData = /*#__PURE__*/function () {
       var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
-        var _JSON$parse$0$relatio, _JSON$parse, _JSON$parse$, _percentageRes$, _services$2$inputsByR, _services$2$values, data, headers, _yield$Promise$all, _yield$Promise$all2, services, percentageRes, servicesDataRes, percentages, orderMap, orderedValues, updatedStatusByRetailer;
+        var _JSON$parse$0$relatio, _JSON$parse, _JSON$parse$, _percentageRes$, _services$2$inputsByR, _services$2$values, data, headers, _yield$Promise$all, _yield$Promise$all2, services, percentageRes, servicesDataRes, percentages, orderMap, orderedValues;
 
         return _regenerator.default.wrap(function _callee2$(_context2) {
           while (1) {
@@ -333,21 +339,6 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   var orderA = (_orderMap$a$image_id = orderMap[a.image_id]) !== null && _orderMap$a$image_id !== void 0 ? _orderMap$a$image_id : Number.MAX_SAFE_INTEGER;
                   var orderB = (_orderMap$b$image_id = orderMap[b.image_id]) !== null && _orderMap$b$image_id !== void 0 ? _orderMap$b$image_id : Number.MAX_SAFE_INTEGER;
                   return orderA - orderB;
-                }); //Cuando carguemos la información de los servicios, las actualizamos en el estado del producto
-
-                updatedStatusByRetailer = servicesDataRes.reduce(function (acc, current, idx) {
-                  var id_retailer = current.id_retailer,
-                      service = current.service,
-                      status = current.status;
-                  if (!acc[id_retailer]) acc[id_retailer] = {};
-                  acc[id_retailer][service] = status;
-                  return acc;
-                }, {});
-                dispatch({
-                  type: "SET_PRODUCT",
-                  payload: (0, _objectSpread4.default)((0, _objectSpread4.default)({}, state.product), {}, {
-                    statusByRetailer: updatedStatusByRetailer
-                  })
                 });
                 dispatch({
                   type: "SET_SERVICES",
@@ -374,11 +365,11 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                     return rId === id_retailer;
                   })
                 });
-                _context2.next = 26;
+                _context2.next = 24;
                 break;
 
-              case 22:
-                _context2.prev = 22;
+              case 20:
+                _context2.prev = 20;
                 _context2.t0 = _context2["catch"](1);
                 console.error("Error fetching data:", _context2.t0);
                 dispatch({
@@ -386,20 +377,20 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                   payload: _context2.t0
                 });
 
-              case 26:
-                _context2.prev = 26;
+              case 24:
+                _context2.prev = 24;
                 dispatch({
                   type: "SET_LOADING",
                   payload: false
                 });
-                return _context2.finish(26);
+                return _context2.finish(24);
 
-              case 29:
+              case 27:
               case "end":
                 return _context2.stop();
             }
           }
-        }, _callee2, null, [[1, 22, 26, 29]]);
+        }, _callee2, null, [[1, 20, 24, 27]]);
       }));
 
       return function fetchData() {
@@ -408,7 +399,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
     }();
 
     fetchData();
-  }, [(_state$product2 = state.product) === null || _state$product2 === void 0 ? void 0 : _state$product2.datasheet_status, (_state$product3 = state.product) === null || _state$product3 === void 0 ? void 0 : _state$product3.description_status, (_state$product4 = state.product) === null || _state$product4 === void 0 ? void 0 : _state$product4.images_status, (_state$product5 = state.product) === null || _state$product5 === void 0 ? void 0 : _state$product5.status, (_state$product6 = state.product) === null || _state$product6 === void 0 ? void 0 : _state$product6.percentages, (_state$product7 = state.product) === null || _state$product7 === void 0 ? void 0 : _state$product7.version, state.active_retailer, token]); // Actualizador de campos del ui para que coincidan con el retailer activo
+  }, [state.product, state.active_retailer, token]); // Actualizador de campos del ui para que coincidan con el retailer activo
 
   (0, _react.useEffect)(function () {
     if (!state.active_retailer) return;
@@ -459,38 +450,25 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
   }, [state.services]); // Helper functions
 
   var canShowValidationButtons = function canShowValidationButtons() {
-    var _state$product8;
-
-    if (!((_state$product8 = state.product) !== null && _state$product8 !== void 0 && _state$product8.statusByRetailer)) return false;
+    var _state$product2;
 
-    try {
-      var currentService = (0, _utils.getConceptByTab)(state.active_tab); // const currentStatus = state.product[`${currentService}_status`];
-
-      var currentRetailer = state.active_retailer.id_retailer; //Información del servicio de la cadena seleccionada
-
-      var _state$services_data$ = state.services_data.find(function (service) {
-        return service.service === currentService && service.id_retailer === currentRetailer;
-      }),
-          currentStatus = _state$services_data$.status;
-
-      var originTab = origin[state.active_tab];
-      var isRetailerUser = (user === null || user === void 0 ? void 0 : user.is_retailer) === 1;
-      var validStatuses = ["AA", "AP", "R", "CA", "RCA"];
-      if (!validStatuses.includes(currentStatus)) return false;
-      var validOrigins = ["RequestWithContentoh", "RequestWithoutContentoh", "Contentoh"];
-      if (!validOrigins.includes(originTab)) return false; // Retailer: solo AP
+    if (!((_state$product2 = state.product) !== null && _state$product2 !== void 0 && _state$product2.statusByRetailer)) return false;
+    var currentService = (0, _utils.getConceptByTab)(state.active_tab);
+    var currentStatus = state.product["".concat(currentService, "_status")];
+    var originTab = origin[state.active_tab];
+    var isRetailerUser = (user === null || user === void 0 ? void 0 : user.is_retailer) === 1;
+    var validStatuses = ["AA", "AP", "R", "CA", "RCA"];
+    if (!validStatuses.includes(currentStatus)) return false;
+    var validOrigins = ["RequestWithContentoh", "RequestWithoutContentoh", "Contentoh"];
+    if (!validOrigins.includes(originTab)) return false; // Retailer: solo AP
 
-      if (isRetailerUser) {
-        return currentStatus === "AP";
-      } // No retailer
+    if (isRetailerUser) {
+      return currentStatus === "AP";
+    } // No retailer
 
 
-      var hasNoOrder = !state.product.id_order && !state.product.orderId;
-      var condition = originTab === "RequestWithoutContentoh" && (["R", "CA"].includes(currentStatus) || currentStatus === "RCA" && hasNoOrder) || ["RequestWithContentoh", "Contentoh"].includes(originTab) && currentStatus === "AA";
-      return condition;
-    } catch (error) {
-      return false;
-    }
+    var hasNoOrder = !state.product.id_order && !state.product.orderId;
+    return originTab === "RequestWithoutContentoh" && (["R", "CA"].includes(currentStatus) || currentStatus === "RCA" && hasNoOrder) || ["RequestWithContentoh", "Contentoh"].includes(originTab) && currentStatus === "AA";
   };
 
   var canShowSaveButton = function canShowSaveButton(version_status) {
@@ -508,10 +486,10 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
 
   var getStatusByCurrentServiceAndRetailer = function getStatusByCurrentServiceAndRetailer() {
     var statusByRetailer = state.product.statusByRetailer;
-    if (!statusByRetailer || Object.keys(statusByRetailer).length === 0) return "-";
+    if (!statusByRetailer) return "-";
     var currentService = (0, _utils.getConceptByTab)(state.active_tab);
     var currentRetailer = state.active_retailer.id_retailer;
-    var currentStatus = statusByRetailer[currentRetailer][currentService] || "N/S";
+    var currentStatus = statusByRetailer[currentRetailer][currentService] || "ERR";
     return currentStatus;
   };
 
@@ -582,9 +560,9 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
   };
 
   var handleOnClickSaveImages = function handleOnClickSaveImages() {
-    var _state$product9, _state$product9$servi;
+    var _state$product3, _state$product3$servi;
 
-    if (((_state$product9 = state.product) === null || _state$product9 === void 0 ? void 0 : (_state$product9$servi = _state$product9.services) === null || _state$product9$servi === void 0 ? void 0 : _state$product9$servi.images) === 1) {
+    if (((_state$product3 = state.product) === null || _state$product3 === void 0 ? void 0 : (_state$product3$servi = _state$product3.services) === null || _state$product3$servi === void 0 ? void 0 : _state$product3$servi.images) === 1) {
       updateImages();
     }
   };
@@ -805,10 +783,9 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
 
   var sendEvaluation = /*#__PURE__*/function () {
     var _ref5 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(result) {
-      var _state$product$id_ord, _state$product10, _state$active_retaile2;
-
-      var concept, articleId, orderId, sectionStatusKey, evalStatus, data, retailerId, _newStatuses$newStatu, _state$services_data, res, newStatuses, serviceStatus, updatedProduct, updatedServicesData;
+      var _state$product$id_ord, _state$product4, _state$active_retaile2;
 
+      var concept, articleId, orderId, sectionStatusKey, evalStatus, data, retailerId, res, newStatuses, serviceStatus, updatedProduct;
       return _regenerator.default.wrap(function _callee3$(_context3) {
         while (1) {
           switch (_context3.prev = _context3.next) {
@@ -821,7 +798,7 @@ 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;
               sectionStatusKey = "".concat(concept, "_status");
-              evalStatus = state.product[sectionStatusKey] || ((_state$product10 = state.product) === null || _state$product10 === void 0 ? void 0 : _state$product10.version_status);
+              evalStatus = state.product[sectionStatusKey] || ((_state$product4 = state.product) === null || _state$product4 === void 0 ? void 0 : _state$product4.version_status);
               data = {
                 articleId: articleId,
                 orderId: orderId,
@@ -832,7 +809,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               _context3.prev = 8;
 
               if (!result) {
-                _context3.next = 22;
+                _context3.next = 21;
                 break;
               }
 
@@ -851,20 +828,11 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
               serviceStatus = newStatuses.newServiceStatus[articleId]["".concat(concept, "Status")]; // Actualizar el producto con los nuevos estados
 
               updatedProduct = (0, _objectSpread4.default)((0, _objectSpread4.default)({}, state.product), {}, {
-                statusByRetailer: (0, _objectSpread4.default)((0, _objectSpread4.default)({}, state.product.statusByRetailer), {}, (0, _defineProperty2.default)({}, retailerId, (0, _objectSpread4.default)((0, _objectSpread4.default)({}, state.product.statusByRetailer[retailerId]), {}, (0, _defineProperty2.default)({}, concept, (_newStatuses$newStatu = newStatuses === null || newStatuses === void 0 ? void 0 : newStatuses.newStatus) !== null && _newStatuses$newStatu !== void 0 ? _newStatuses$newStatu : serviceStatus))))
+                statusByRetailer: (0, _objectSpread4.default)((0, _objectSpread4.default)({}, state.product.statusByRetailer), {}, (0, _defineProperty2.default)({}, retailerId, (0, _objectSpread4.default)((0, _objectSpread4.default)({}, state.product.statusByRetailer[retailerId]), {}, (0, _defineProperty2.default)({}, concept, serviceStatus))))
               });
-              updatedServicesData = (_state$services_data = state.services_data) === null || _state$services_data === void 0 ? void 0 : _state$services_data.map(function (service) {
-                var _newStatuses$newStatu2;
-
-                return (0, _objectSpread4.default)((0, _objectSpread4.default)({}, service), {}, {
-                  status: (service === null || service === void 0 ? void 0 : service.id_retailer) === retailerId && (service === null || service === void 0 ? void 0 : service.service) === concept ? (_newStatuses$newStatu2 = newStatuses === null || newStatuses === void 0 ? void 0 : newStatuses.newStatus) !== null && _newStatuses$newStatu2 !== void 0 ? _newStatuses$newStatu2 : serviceStatus : service === null || service === void 0 ? void 0 : service.status
-                });
+              console.log({
+                updatedProduct: updatedProduct
               });
-              dispatch({
-                type: "SET_SERVICES_DATA",
-                payload: updatedServicesData
-              }); // console.log({ updatedProduct });
-
               dispatch({
                 type: "SET_PRODUCT",
                 payload: updatedProduct
@@ -880,12 +848,12 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 }
               });
 
-            case 22:
-              _context3.next = 28;
+            case 21:
+              _context3.next = 27;
               break;
 
-            case 24:
-              _context3.prev = 24;
+            case 23:
+              _context3.prev = 23;
               _context3.t0 = _context3["catch"](8);
               console.error("Error sending evaluation:", _context3.t0);
               dispatch({
@@ -898,20 +866,20 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 }
               });
 
-            case 28:
-              _context3.prev = 28;
+            case 27:
+              _context3.prev = 27;
               dispatch({
                 type: "SET_SAVING",
                 payload: false
               });
-              return _context3.finish(28);
+              return _context3.finish(27);
 
-            case 31:
+            case 30:
             case "end":
               return _context3.stop();
           }
         }
-      }, _callee3, null, [[8, 24, 28, 31]]);
+      }, _callee3, null, [[8, 23, 27, 30]]);
     }));
 
     return function sendEvaluation(_x2) {
@@ -1133,7 +1101,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
 
   var handleOnEvaluateAll = /*#__PURE__*/function () {
     var _ref7 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5(result) {
-      var _state$product$id_ord2, _state$services_data2, evaluationArray, conceptArray, dataGeneral, userType, status, updatedStatusByRetailer, updatedProduct;
+      var _state$product$id_ord2, _state$services_data, evaluationArray, conceptArray, dataGeneral, userType, status, updatedStatusByRetailer, updatedProduct;
 
       return _regenerator.default.wrap(function _callee5$(_context5) {
         while (1) {
@@ -1153,7 +1121,7 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
                 isAproved: result === "A"
               }; // Crear todas las evaluaciones para cada servicio y retailer
 
-              (_state$services_data2 = state.services_data) === null || _state$services_data2 === void 0 ? void 0 : _state$services_data2.forEach(function (ret) {
+              (_state$services_data = state.services_data) === null || _state$services_data === void 0 ? void 0 : _state$services_data.forEach(function (ret) {
                 var service = ret.service,
                     id_retailer = ret.id_retailer;
                 var data = {};
@@ -1283,334 +1251,330 @@ var ProviderProductEditionView = function ProviderProductEditionView(_ref) {
   };
 
   if (state.loading || !state.services || !state.product) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.Loading, {});
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_AiProductEdition.AiProductEditionProvider, {
-    isCreatorsEdition: false,
-    state: state,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
-      headerTop: headerTop,
-      children: [showVersionSelector && /*#__PURE__*/(0, _jsxRuntime.jsx)(_VersionSelector.VersionSelector, {
-        modalId: "version-selector",
-        articleId: state.product.id_article,
-        setVersion: handleOnChangeProductVersion,
-        companyName: company.company_name,
-        currentVersion: state.product.version,
-        setShowVersionSelector: setShowVersionSelector,
-        jwt: token
-      }), showModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductImageModal.ProductImageModal, {
-        images: state.images_values,
-        setShowModal: setShowModal,
-        approveRejectButtons: canShowValidationButtons(),
-        sendToFacilitator: handleOnSendEvaluation
-      }), state.modal.show && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GenericModal.GenericModal, {
-        componentsArray: [state.modal.image && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-          src: state.modal.image,
-          alt: "modal icon"
-        }, "1"), state.modal.title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-          headerType: "retailer-name-header",
-          text: state.modal.title,
-          color: "white"
-        }, "2"), state.modal.message && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-          headerType: "retailer-name-header",
-          text: state.modal.message,
-          color: "white"
-        }, "3"), state.modal.buttons && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          style: {
-            marginTop: "16px"
-          },
-          children: state.modal.buttons.map(function (button, index) {
-            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
-              buttonType: button.buttonType,
-              label: button.text,
-              onClick: button.action
-            }, index);
-          })
-        }, "4")].filter(Boolean),
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    headerTop: headerTop,
+    children: [showVersionSelector && /*#__PURE__*/(0, _jsxRuntime.jsx)(_VersionSelector.VersionSelector, {
+      modalId: "version-selector",
+      articleId: state.product.id_article,
+      setVersion: handleOnChangeProductVersion,
+      companyName: company.company_name,
+      currentVersion: state.product.version,
+      setShowVersionSelector: setShowVersionSelector,
+      jwt: token
+    }), showModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductImageModal.ProductImageModal, {
+      images: state.images_values,
+      setShowModal: setShowModal,
+      approveRejectButtons: canShowValidationButtons(),
+      sendToFacilitator: handleOnSendEvaluation
+    }), state.modal.show && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GenericModal.GenericModal, {
+      componentsArray: [state.modal.image && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+        src: state.modal.image,
+        alt: "modal icon"
+      }, "1"), state.modal.title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+        headerType: "retailer-name-header",
+        text: state.modal.title,
+        color: "white"
+      }, "2"), state.modal.message && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+        headerType: "retailer-name-header",
+        text: state.modal.message,
+        color: "white"
+      }, "3"), state.modal.buttons && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        style: {
+          marginTop: "16px"
+        },
+        children: state.modal.buttons.map(function (button, index) {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+            buttonType: button.buttonType,
+            label: button.text,
+            onClick: button.action
+          }, index);
+        })
+      }, "4")].filter(Boolean),
+      onClick: function onClick() {
+        return dispatch({
+          type: "SET_MODAL",
+          payload: {
+            show: false,
+            title: "",
+            message: "",
+            image: null
+          }
+        });
+      }
+    }), showRejectModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
+      title: rejectAll ? "Agregar mensaje para rechazar todo" : "Agregar mensaje de rechazo",
+      show: showRejectModal,
+      customComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
+        inputType: "textarea",
+        inputId: "modal-message-box",
+        index: 0,
+        color: "white"
+      }),
+      buttons: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
+        type: "white",
+        label: "Cancelar",
+        size: 12,
         onClick: function onClick() {
-          return dispatch({
-            type: "SET_MODAL",
-            payload: {
-              show: false,
-              title: "",
-              message: "",
-              image: null
-            }
-          });
+          setShowRejectModal(false);
         }
-      }), showRejectModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
-        title: rejectAll ? "Agregar mensaje para rechazar todo" : "Agregar mensaje de rechazo",
-        show: showRejectModal,
-        customComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
-          inputType: "textarea",
-          inputId: "modal-message-box",
-          index: 0,
-          color: "white"
-        }),
-        buttons: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
-          type: "white",
-          label: "Cancelar",
-          size: 12,
-          onClick: function onClick() {
-            setShowRejectModal(false);
-          }
-        }, "btn-Cancelar"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
-          type: "pink",
-          label: "Aceptar",
-          size: 12,
-          onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6() {
-            var elements, isMessageEmpty, container, existingAlert, alert, fullMessage;
-            return _regenerator.default.wrap(function _callee6$(_context6) {
-              while (1) {
-                switch (_context6.prev = _context6.next) {
-                  case 0:
-                    elements = document.querySelectorAll("#modal-message-box .ql-container .ql-editor > p");
-
-                    if (!(!elements || elements.length === 0)) {
-                      _context6.next = 4;
-                      break;
-                    }
+      }, "btn-Cancelar"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
+        type: "pink",
+        label: "Aceptar",
+        size: 12,
+        onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6() {
+          var elements, isMessageEmpty, container, existingAlert, alert, fullMessage;
+          return _regenerator.default.wrap(function _callee6$(_context6) {
+            while (1) {
+              switch (_context6.prev = _context6.next) {
+                case 0:
+                  elements = document.querySelectorAll("#modal-message-box .ql-container .ql-editor > p");
+
+                  if (!(!elements || elements.length === 0)) {
+                    _context6.next = 4;
+                    break;
+                  }
 
-                    console.error("Elemento no encontrado");
-                    return _context6.abrupt("return");
+                  console.error("Elemento no encontrado");
+                  return _context6.abrupt("return");
 
-                  case 4:
-                    isMessageEmpty = Array.from(elements).every(function (el) {
-                      var body = el.innerHTML;
-                      return !body || body.replace(/<.*?\/?>/gm, "").trim() === "";
-                    });
+                case 4:
+                  isMessageEmpty = Array.from(elements).every(function (el) {
+                    var body = el.innerHTML;
+                    return !body || body.replace(/<.*?\/?>/gm, "").trim() === "";
+                  });
 
-                    if (!isMessageEmpty) {
-                      _context6.next = 10;
-                      break;
-                    }
+                  if (!isMessageEmpty) {
+                    _context6.next = 10;
+                    break;
+                  }
 
-                    container = document.querySelector(".container-customComponent");
-                    existingAlert = container.querySelector(".alert-error");
+                  container = document.querySelector(".container-customComponent");
+                  existingAlert = container.querySelector(".alert-error");
 
-                    if (!existingAlert) {
-                      alert = document.createElement("div");
-                      alert.className = "alert-error";
-                      alert.style.cssText = "\n                        color: #d32f2f;\n                        background-color: #ffebee;\n                        border: 1px solid #ef5350;\n                        border-radius: 4px;\n                        padding: 12px 16px;\n                        margin-top: 10px;\n                        font-size: 14px;\n                        display: flex;\n                        align-items: center;\n                        gap: 8px;\n                        font-family: 'Roboto', sans-serif;\n                        text-align: center;\n                      ";
-                      alert.innerHTML = "<span>El mensaje no puede estar vac\xEDo.</span>";
-                      container.appendChild(alert);
-                    }
+                  if (!existingAlert) {
+                    alert = document.createElement("div");
+                    alert.className = "alert-error";
+                    alert.style.cssText = "\n                      color: #d32f2f;\n                      background-color: #ffebee;\n                      border: 1px solid #ef5350;\n                      border-radius: 4px;\n                      padding: 12px 16px;\n                      margin-top: 10px;\n                      font-size: 14px;\n                      display: flex;\n                      align-items: center;\n                      gap: 8px;\n                      font-family: 'Roboto', sans-serif;\n                      text-align: center;\n                    ";
+                    alert.innerHTML = "<span>El mensaje no puede estar vac\xEDo.</span>";
+                    container.appendChild(alert);
+                  }
 
-                    return _context6.abrupt("return");
+                  return _context6.abrupt("return");
 
-                  case 10:
-                    fullMessage = Array.from(elements).map(function (element) {
-                      return element.innerHTML;
-                    }).join("").replace(/<br\s*\/?>/gi, "\n");
-                    _context6.next = 13;
-                    return createComment(fullMessage, token);
+                case 10:
+                  fullMessage = Array.from(elements).map(function (element) {
+                    return element.innerHTML;
+                  }).join("").replace(/<br\s*\/?>/gi, "\n");
+                  _context6.next = 13;
+                  return createComment(fullMessage);
 
-                  case 13:
-                    rejectAll ? handleOnEvaluateAll("R") : handleOnSendEvaluation("R");
-                    setShowRejectModal(false);
+                case 13:
+                  rejectAll ? handleOnEvaluateAll("R") : handleOnSendEvaluation("R");
+                  setShowRejectModal(false);
 
-                  case 15:
-                  case "end":
-                    return _context6.stop();
-                }
+                case 15:
+                case "end":
+                  return _context6.stop();
               }
-            }, _callee6);
-          }))
-        }, "btn-Aceptar")]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTop.HeaderTop, {
-        setHeaderTop: setHeaderTop,
-        withChat: location === null || location === void 0 ? void 0 : (_location$state5 = location.state) === null || _location$state5 === void 0 ? void 0 : _location$state5.withChat,
-        chatType: location === null || location === void 0 ? void 0 : (_location$state6 = location.state) === null || _location$state6 === void 0 ? void 0 : _location$state6.chatType,
-        productSelected: state.product,
-        token: token,
-        activeRetailer: {
-          id: (_state$active_retaile3 = state.active_retailer) === null || _state$active_retaile3 === void 0 ? void 0 : _state$active_retaile3.id_retailer,
-          name: (_state$active_retaile4 = state.active_retailer) === null || _state$active_retaile4 === void 0 ? void 0 : _state$active_retaile4.retailer
-        }
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "data-container",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          className: "image-data-panel",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagePreviewer.ImagePreviewer, {
-            activeImage: (_state$images_values$2 = state.images_values.values[state.current_image]) !== null && _state$images_values$2 !== void 0 ? _state$images_values$2 : {},
-            imagesArray: state.images_values || [],
-            setActiveImage: handleOnChangeCurrentImage,
-            setShowModal: handleOnShowModalGalery
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImageDataTable.ImageDataTable, {
-            lists: state.images_values || [],
-            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_retaile5 = state.active_retailer) === null || _state$active_retaile5 === void 0 ? void 0 : _state$active_retaile5.id_retailer,
-            imagesStatus: ((_state$product11 = state.product) === null || _state$product11 === void 0 ? void 0 : _state$product11.images_status) || "-",
-            isRetailer: isRetailer,
-            setShowVersionSelector: setShowVersionSelector,
-            version: state.product.version,
-            setImages: handleOnChangeCurrentImage,
-            onClickSave: handleOnClickSaveImages,
-            setAssignation: handleOnChangeAssignations // No se usa?
+            }
+          }, _callee6);
+        }))
+      }, "btn-Aceptar")]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTop.HeaderTop, {
+      setHeaderTop: setHeaderTop,
+      withChat: location === null || location === void 0 ? void 0 : (_location$state5 = location.state) === null || _location$state5 === void 0 ? void 0 : _location$state5.withChat,
+      chatType: location === null || location === void 0 ? void 0 : (_location$state6 = location.state) === null || _location$state6 === void 0 ? void 0 : _location$state6.chatType,
+      productSelected: state.product,
+      token: token,
+      activeRetailer: {
+        id: (_state$active_retaile3 = state.active_retailer) === null || _state$active_retaile3 === void 0 ? void 0 : _state$active_retaile3.id_retailer,
+        name: (_state$active_retaile4 = state.active_retailer) === null || _state$active_retaile4 === void 0 ? void 0 : _state$active_retaile4.retailer
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "data-container",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "image-data-panel",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagePreviewer.ImagePreviewer, {
+          activeImage: (_state$images_values$2 = state.images_values.values[state.current_image]) !== null && _state$images_values$2 !== void 0 ? _state$images_values$2 : {},
+          imagesArray: state.images_values || [],
+          setActiveImage: handleOnChangeCurrentImage,
+          setShowModal: handleOnShowModalGalery
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImageDataTable.ImageDataTable, {
+          lists: state.images_values || [],
+          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_retaile5 = state.active_retailer) === null || _state$active_retaile5 === void 0 ? void 0 : _state$active_retaile5.id_retailer,
+          imagesStatus: ((_state$product5 = state.product) === null || _state$product5 === void 0 ? void 0 : _state$product5.images_status) || "-",
+          isRetailer: isRetailer,
+          setShowVersionSelector: setShowVersionSelector,
+          version: state.product.version,
+          setImages: handleOnChangeCurrentImage,
+          onClickSave: handleOnClickSaveImages,
+          setAssignation: handleOnChangeAssignations // No se usa?
 
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "product-information",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "product-information",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-            className: "product-information",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FullProductNameHeader.FullProductNameHeader, {
-              headerData: state.product,
-              percent: state.active_percentage.percentagesGeneral.required,
-              activeRetailer: {
-                id: (_state$active_retaile6 = state.active_retailer) === null || _state$active_retaile6 === void 0 ? void 0 : _state$active_retaile6.id_retailer,
-                name: (_state$active_retaile7 = state.active_retailer) === null || _state$active_retaile7 === void 0 ? void 0 : _state$active_retaile7.retailer,
-                image: (_state$active_retaile8 = state.active_retailer) === null || _state$active_retaile8 === void 0 ? void 0 : _state$active_retaile8.image
-              },
-              showValidationButtons: canShowValidationButtons(),
-              showApproveRejectAll: canShowValidationButtons(),
-              servicesData: state.services_data ? state.services_data : null,
-              approveAll: handleOnApproveAll,
-              rejectAll: handleOnRejectAll,
-              approve: function approve() {
-                return handleOnSendEvaluation("A");
-              },
-              reject: handleOnReject,
-              setActiveRetailer: handleOnChangeActiveRetailer
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullTabsMenu.FullTabsMenu, {
-              tabsSections: tabsSections,
-              status: getStatusByCurrentServiceAndRetailer(),
-              activeTab: state.active_tab,
-              user: user,
-              isRetailer: isRetailer,
-              assig: assig,
-              version: state.product.version,
-              updatedDescriptions: state.updated_descriptions_inputs,
-              updatedDatasheets: state.updated_datasheets_inputs,
-              updatedImages: state.updated_images_values,
-              images: state.services.images // actions
-              ,
-              downloadImages: handleOnDownloadImages,
-              askToDeleteImages: handleOnAskToDeleteImages,
-              showSaveButton: canShowSaveButton(state.product.version_status),
-              onClickSave: handleOnClickSave // setters
-              ,
-              setActiveTab: handleOnChangeActiveTab,
-              setImageLayout: handleOnSetImageLayout,
-              setUpdatedDescriptions: handleOnSetUpdatedDescriptions,
-              setUpdatedDatasheets: handleOnSetUpdatedDatasheets,
-              setAssignation: handleOnSetAssignation // No se usa?
-              ,
-              setImages: handleOnSetImages // No se usa?
-              // setSelectedImages={handleOnSetSelectedImages} // Se pasa hasta TabsMenu, pero no se usa
-              ,
-              setShowVersionSelector: setShowVersionSelector
-            }), /*#__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$product12 = state.product) === null || _state$product12 === void 0 ? void 0 : _state$product12.description_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
-                  activeSection: state.active_tab,
-                  inputGroup: state.descriptions_inputs[0],
-                  updatedDescriptions: state.updated_descriptions_inputs,
-                  articleId: (_state$product13 = state.product) === null || _state$product13 === void 0 ? void 0 : _state$product13.id_article,
-                  version: state.product.version,
-                  isShowbox: false,
-                  dinamicHeight: true,
-                  setUpdatedDescriptions: handleOnSetUpdatedDescriptions,
-                  updateApprovedInputs: handleOnUpdateApprovedInputs // No se usa?
-
-                }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-                  text: "No cuentas con este servicio",
-                  headerType: "input-name-header"
-                })), state.active_tab === "Ficha técnica" && (((_state$product14 = state.product) === null || _state$product14 === void 0 ? void 0 : _state$product14.datasheet_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-                  children: (_state$datasheets_inp = state.datasheets_inputs[0]) === null || _state$datasheets_inp === void 0 ? void 0 : (_state$datasheets_inp2 = _state$datasheets_inp.data) === null || _state$datasheets_inp2 === void 0 ? void 0 : _state$datasheets_inp2.map(function (dataGroup, index) {
-                    var _state$datasheets_inp3;
-
-                    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
-                      index: index,
-                      articleId: state.product.id_article,
-                      version: state.version,
-                      activeSection: state.active_tab,
-                      inputGroup: dataGroup,
-                      dataInputs: (_state$datasheets_inp3 = state.datasheets_inputs[1]) !== null && _state$datasheets_inp3 !== void 0 ? _state$datasheets_inp3 : [],
-                      activeRetailer: state.services.datasheets[state.active_retailer.id_retailer],
-                      groupData: state.services.datasheets[state.active_retailer.id_retailer].data,
-                      updatedDatasheets: state.updated_datasheets_inputs,
-                      setUpdatedDatasheets: handleOnSetUpdatedDatasheets,
-                      isShowbox: true,
-                      setUpdatedBoxData: function setUpdatedBoxData(e) {
-                        setBoxData(e);
-                      },
-                      updateApprovedInputs: handleOnUpdateApprovedInputs // No se usa?
-
-                    }, index + "-" + state.active_retailer.retailer);
-                  })
-                }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-                  text: "No cuentas con este servicio",
-                  headerType: "input-name-header"
-                })), state.active_tab === "Imágenes" && (((_state$product15 = state.product) === null || _state$product15 === void 0 ? void 0 : _state$product15.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
-                    ,
-                    setCheckAll: handleOnSetCheckAll // Toggler de true o false para el checkbox "Seleccionar todo"
-                    ,
-                    setSelectedImages: handleOnSetSelectedImages
-                  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("section", {
-                    className: "container",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FullProductNameHeader.FullProductNameHeader, {
+            headerData: state.product,
+            percent: state.active_percentage.percentagesGeneral.required,
+            activeRetailer: {
+              id: (_state$active_retaile6 = state.active_retailer) === null || _state$active_retaile6 === void 0 ? void 0 : _state$active_retaile6.id_retailer,
+              name: (_state$active_retaile7 = state.active_retailer) === null || _state$active_retaile7 === void 0 ? void 0 : _state$active_retaile7.retailer,
+              image: (_state$active_retaile8 = state.active_retailer) === null || _state$active_retaile8 === void 0 ? void 0 : _state$active_retaile8.image
+            },
+            showValidationButtons: canShowValidationButtons(),
+            showApproveRejectAll: canShowValidationButtons(),
+            servicesData: state.services_data ? state.services_data : null,
+            approveAll: handleOnApproveAll,
+            rejectAll: handleOnRejectAll,
+            approve: function approve() {
+              return handleOnSendEvaluation("A");
+            },
+            reject: handleOnReject,
+            setActiveRetailer: handleOnChangeActiveRetailer
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullTabsMenu.FullTabsMenu, {
+            tabsSections: tabsSections,
+            status: getStatusByCurrentServiceAndRetailer(),
+            activeTab: state.active_tab,
+            user: user,
+            isRetailer: isRetailer,
+            assig: assig,
+            version: state.product.version,
+            updatedDescriptions: state.updated_descriptions_inputs,
+            updatedDatasheets: state.updated_datasheets_inputs,
+            updatedImages: state.updated_images_values,
+            images: state.services.images // actions
+            ,
+            downloadImages: handleOnDownloadImages,
+            askToDeleteImages: handleOnAskToDeleteImages,
+            showSaveButton: canShowSaveButton(state.product.version_status),
+            onClickSave: handleOnClickSave // setters
+            ,
+            setActiveTab: handleOnChangeActiveTab,
+            setImageLayout: handleOnSetImageLayout,
+            setUpdatedDescriptions: handleOnSetUpdatedDescriptions,
+            setUpdatedDatasheets: handleOnSetUpdatedDatasheets,
+            setAssignation: handleOnSetAssignation // No se usa?
+            ,
+            setImages: handleOnSetImages // No se usa?
+            // setSelectedImages={handleOnSetSelectedImages} // Se pasa hasta TabsMenu, pero no se usa
+            ,
+            setShowVersionSelector: setShowVersionSelector
+          }), /*#__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$product6 = state.product) === null || _state$product6 === void 0 ? void 0 : _state$product6.description_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
+                activeSection: state.active_tab,
+                inputGroup: state.descriptions_inputs[0],
+                updatedDescriptions: state.updated_descriptions_inputs,
+                articleId: (_state$product7 = state.product) === null || _state$product7 === void 0 ? void 0 : _state$product7.id_article,
+                version: state.product.version,
+                isShowbox: false,
+                dinamicHeight: true,
+                setUpdatedDescriptions: handleOnSetUpdatedDescriptions,
+                updateApprovedInputs: handleOnUpdateApprovedInputs // No se usa?
+
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+                text: "No cuentas con este servicio",
+                headerType: "input-name-header"
+              })), state.active_tab === "Ficha técnica" && (((_state$product8 = state.product) === null || _state$product8 === void 0 ? void 0 : _state$product8.datasheet_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+                children: (_state$datasheets_inp = state.datasheets_inputs[0].data) === null || _state$datasheets_inp === void 0 ? void 0 : _state$datasheets_inp.map(function (dataGroup, index) {
+                  var _state$datasheets_inp2;
+
+                  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
+                    index: index,
+                    articleId: state.product.id_article,
+                    version: state.version,
+                    activeSection: state.active_tab,
+                    inputGroup: dataGroup,
+                    dataInputs: (_state$datasheets_inp2 = state.datasheets_inputs[1]) !== null && _state$datasheets_inp2 !== void 0 ? _state$datasheets_inp2 : [],
+                    activeRetailer: state.services.datasheets[state.active_retailer.id_retailer],
+                    groupData: state.services.datasheets[state.active_retailer.id_retailer].data,
+                    updatedDatasheets: state.updated_datasheets_inputs,
+                    setUpdatedDatasheets: handleOnSetUpdatedDatasheets,
+                    isShowbox: true,
+                    setUpdatedBoxData: function setUpdatedBoxData(e) {
+                      setBoxData(e);
+                    },
+                    updateApprovedInputs: handleOnUpdateApprovedInputs // No se usa?
+
+                  }, index + "-" + state.active_retailer.retailer);
+                })
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+                text: "No cuentas con este servicio",
+                headerType: "input-name-header"
+              })), state.active_tab === "Imágenes" && (((_state$product9 = state.product) === null || _state$product9 === void 0 ? void 0 : _state$product9.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
+                  ,
+                  setCheckAll: handleOnSetCheckAll // Toggler de true o false para el checkbox "Seleccionar todo"
+                  ,
+                  setSelectedImages: handleOnSetSelectedImages
+                }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("section", {
+                  className: "container",
+                  style: {
+                    position: "relative"
+                  },
+                  children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _objectSpread4.default)((0, _objectSpread4.default)({}, getRootProps({
+                    className: "dropzone ".concat(isDragActive ? "drag-active" : "")
+                  })), {}, {
+                    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", (0, _objectSpread4.default)({}, getInputProps())), isDragActive && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+                      className: "drag-overlay",
+                      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+                        children: "Suelta las im\xE1genes aqu\xED"
+                      })
+                    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("aside", {
+                      children: thumbs()
+                    })]
+                  })), ((_state$images_values12 = state.images_values) === null || _state$images_values12 === void 0 ? void 0 : _state$images_values12.values.length) === 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
                     style: {
-                      position: "relative"
+                      position: "absolute",
+                      top: "50%",
+                      left: "50%",
+                      transform: "translate(-50%, -50%)",
+                      textAlign: "center",
+                      padding: "40px",
+                      width: "80%",
+                      maxWidth: "500px",
+                      fontFamily: "Arial, sans-serif"
                     },
-                    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _objectSpread4.default)((0, _objectSpread4.default)({}, getRootProps({
-                      className: "dropzone ".concat(isDragActive ? "drag-active" : "")
-                    })), {}, {
-                      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", (0, _objectSpread4.default)({}, getInputProps())), isDragActive && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                        className: "drag-overlay",
-                        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-                          children: "Suelta las im\xE1genes aqu\xED"
-                        })
-                      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("aside", {
-                        children: thumbs()
-                      })]
-                    })), ((_state$images_values12 = state.images_values) === null || _state$images_values12 === void 0 ? void 0 : _state$images_values12.values.length) === 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+                    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
                       style: {
-                        position: "absolute",
-                        top: "50%",
-                        left: "50%",
-                        transform: "translate(-50%, -50%)",
-                        textAlign: "center",
-                        padding: "40px",
-                        width: "80%",
-                        maxWidth: "500px",
-                        fontFamily: "Arial, sans-serif"
+                        fontSize: "18px",
+                        color: "#666",
+                        marginBottom: "16px"
                       },
-                      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-                        style: {
-                          fontSize: "18px",
-                          color: "#666",
-                          marginBottom: "16px"
-                        },
-                        children: "Este producto no tiene im\xE1genes"
-                      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
+                      children: "Este producto no tiene im\xE1genes"
+                    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
+                      style: {
+                        fontSize: "14px",
+                        color: "#999",
+                        marginBottom: "20px"
+                      },
+                      children: ["Arrastra las im\xE1genes aqu\xED o", " ", /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                        onClick: open,
                         style: {
-                          fontSize: "14px",
-                          color: "#999",
-                          marginBottom: "20px"
+                          color: "#007bff",
+                          cursor: "pointer",
+                          textDecoration: "underline"
                         },
-                        children: ["Arrastra las im\xE1genes aqu\xED o", " ", /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-                          onClick: open,
-                          style: {
-                            color: "#007bff",
-                            cursor: "pointer",
-                            textDecoration: "underline"
-                          },
-                          children: "haz clic para abrir el explorador de archivos"
-                        })]
+                        children: "haz clic para abrir el explorador de archivos"
                       })]
                     })]
                   })]
-                }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-                  text: "No cuentas con este servicio",
-                  headerType: "input-name-header"
-                }))]
-              })
-            })]
-          })
-        })]
+                })]
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+                text: "No cuentas con este servicio",
+                headerType: "input-name-header"
+              }))]
+            })
+          })]
+        })
       })]
-    })
+    })]
   });
 };