contentoh-components-library 10.0.0 → 12.1.17

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

@@ -9,6 +9,8 @@ exports.RetailerProductEdition = void 0;
 
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
+
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
@@ -35,7 +37,9 @@ var _react = require("react");
 
 var _GalleryElement = require("../../molecules/GalleryElement");
 
-var _data = require("../../../global-files/data");
+var _fileSaver = require("file-saver");
+
+var _data2 = require("../../../global-files/data");
 
 var _GalleryHeader = require("../../molecules/GalleryHeader");
 
@@ -61,6 +65,18 @@ var _GeneralButton = require("../../atoms/GeneralButton");
 
 var _Commentary = require("../../atoms/Commentary");
 
+var _GenericModal = require("../../atoms/GenericModal");
+
+var _ScreenHeader = require("../../atoms/ScreenHeader");
+
+var _Loading = require("../../atoms/Loading");
+
+var _genericModalCheck = _interopRequireDefault(require("../../../assets/images/genericModal/genericModalCheck.svg"));
+
+var _errorModal = _interopRequireDefault(require("../../../assets/images/genericModal/errorModal.svg"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
 var reducerImages = function reducerImages(state, action) {
   var values = state.values,
       attrForImgs = state.attrForImgs;
@@ -82,12 +98,22 @@ var reducerImages = function reducerImages(state, action) {
       });
 
     case "changeAttrValue":
-      attrForImgs[action.retailer][action.index].value = action.value;
+      action.retailersId.forEach(function (ret) {
+        attrForImgs[ret][action.index].name === action.name && (attrForImgs[ret][action.index].value = action.value);
+      });
       return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
         attrForImgs: attrForImgs,
         values: values
       });
 
+    case "deleteImage":
+      values = values.filter(function (value) {
+        return action.selectedImages.indexOf(value) === -1;
+      });
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
+        values: values
+      });
+
     default:
       return state;
   }
@@ -109,15 +135,16 @@ var myBucket = new _awsSdk.default.S3({
 });
 
 var RetailerProductEdition = function RetailerProductEdition(_ref) {
-  var _servicesData$filter$, _servicesData$filter$2, _product$services, _datasheets$, _datasheets$$data, _product$services2, _product$services3;
+  var _product$retailers, _product$services2, _datasheets$, _datasheets$$data, _product$article13;
 
-  var productData = _ref.productData,
-      tabsSections = _ref.tabsSections,
-      articleId = _ref.articleId,
+  var tabsSections = _ref.tabsSections,
       _ref$productSelected = _ref.productSelected,
       productSelected = _ref$productSelected === void 0 ? {} : _ref$productSelected,
       _ref$user = _ref.user,
-      user = _ref$user === void 0 ? {} : _ref$user;
+      user = _ref$user === void 0 ? {} : _ref$user,
+      _ref$location = _ref.location,
+      location = _ref$location === void 0 ? {} : _ref$location,
+      token = _ref.token;
 
   var _useState = (0, _react.useState)("Descripción"),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -129,7 +156,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       activeImage = _useState4[0],
       setActiveImage = _useState4[1];
 
-  var _useState5 = (0, _react.useState)(true),
+  var _useState5 = (0, _react.useState)(false),
       _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
       imageLayout = _useState6[0],
       setImageLayout = _useState6[1];
@@ -159,12 +186,6 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       showModal = _useState14[0],
       setShowModal = _useState14[1];
 
-  var _useState15 = (0, _react.useState)(54),
-      _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
-      retailerSelected = _useState16[0],
-      setRetailerSelected = _useState16[1]; // revisar después como trabajar esto de mejor forma
-
-
   var _useDropzone = (0, _reactDropzone.useDropzone)({
     accept: "image/*",
     noKeyboard: true,
@@ -176,42 +197,26 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
         var reader = new FileReader();
         reader.fileName = file.name;
 
-        reader.onload = /*#__PURE__*/function () {
-          var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(e) {
-            var ext, img, width, height, newImg;
-            return _regenerator.default.wrap(function _callee$(_context) {
-              while (1) {
-                switch (_context.prev = _context.next) {
-                  case 0:
-                    ext = e.srcElement.fileName.split(".");
-                    img = new Image();
-                    img.src = e.target.result;
-                    width = img.width;
-                    height = img.height;
-                    newImg = {
-                      action: "addImg",
-                      img: {
-                        src: e.target.result,
-                        name: e.target.fileName,
-                        ext: ext[ext.length - 1],
-                        width: width,
-                        height: width
-                      }
-                    };
-                    setImages(newImg);
-
-                  case 7:
-                  case "end":
-                    return _context.stop();
-                }
+        reader.onload = function (e) {
+          var ext = e.srcElement.fileName.split(".");
+          var img = new Image();
+          img.src = e.target.result;
+          setTimeout(function () {
+            var width = img.width;
+            var height = img.height;
+            var newImg = {
+              action: "addImg",
+              img: {
+                src: e.target.result,
+                name: e.target.fileName,
+                ext: ext[ext.length - 1],
+                width: width,
+                height: height
               }
-            }, _callee);
-          }));
-
-          return function (_x) {
-            return _ref2.apply(this, arguments);
-          };
-        }();
+            };
+            setImages(newImg);
+          }, 500);
+        };
 
         reader.onerror = function (error) {
           console.log("dropzoneError: ", error);
@@ -225,165 +230,242 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       getRootProps = _useDropzone.getRootProps,
       getInputProps = _useDropzone.getInputProps;
 
+  var _useState15 = (0, _react.useState)([]),
+      _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
+      updatedDatasheets = _useState16[0],
+      setUpdatedDatasheets = _useState16[1];
+
   var _useState17 = (0, _react.useState)([]),
       _useState18 = (0, _slicedToArray2.default)(_useState17, 2),
-      updatedDatasheets = _useState18[0],
-      setUpdatedDatasheets = _useState18[1];
+      updatedDescriptions = _useState18[0],
+      setUpdatedDescriptions = _useState18[1];
 
-  var _useState19 = (0, _react.useState)([]),
+  var _useState19 = (0, _react.useState)(false),
       _useState20 = (0, _slicedToArray2.default)(_useState19, 2),
-      updatedDescriptions = _useState20[0],
-      setUpdatedDescriptions = _useState20[1];
+      imagesUploaded = _useState20[0],
+      setImagesUploaded = _useState20[1];
 
-  var _useState21 = (0, _react.useState)(false),
+  var _useState21 = (0, _react.useState)(),
       _useState22 = (0, _slicedToArray2.default)(_useState21, 2),
-      imagesUploaded = _useState22[0],
-      setImagesUploaded = _useState22[1];
+      dataImages = _useState22[0],
+      setDataImages = _useState22[1];
 
-  var _useState23 = (0, _react.useState)(),
-      _useState24 = (0, _slicedToArray2.default)(_useState23, 2),
-      dataImages = _useState24[0],
-      setDataImages = _useState24[1];
-
-  var _useState25 = (0, _react.useState)(new Array(productSelected.retailers.length).fill({
+  var _useState23 = (0, _react.useState)(new Array(product === null || product === void 0 ? void 0 : (_product$retailers = product.retailers) === null || _product$retailers === void 0 ? void 0 : _product$retailers.length).fill({
     percentage: 0
   })),
+      _useState24 = (0, _slicedToArray2.default)(_useState23, 2),
+      percentages = _useState24[0],
+      setPercentages = _useState24[1];
+
+  var _useState25 = (0, _react.useState)(0),
       _useState26 = (0, _slicedToArray2.default)(_useState25, 2),
-      percentages = _useState26[0],
-      setPercentages = _useState26[1];
+      activePercentage = _useState26[0],
+      setActivePercentage = _useState26[1];
 
-  var _useState27 = (0, _react.useState)(0),
+  var _useState27 = (0, _react.useState)({}),
       _useState28 = (0, _slicedToArray2.default)(_useState27, 2),
-      activePercentage = _useState28[0],
-      setActivePercentage = _useState28[1];
+      activeRetailer = _useState28[0],
+      setActiveRetailer = _useState28[1];
 
-  var _useState29 = (0, _react.useState)({}),
+  var _useState29 = (0, _react.useState)([]),
       _useState30 = (0, _slicedToArray2.default)(_useState29, 2),
-      activeRetailer = _useState30[0],
-      setActiveRetailer = _useState30[1];
+      services = _useState30[0],
+      setServices = _useState30[1];
 
   var _useState31 = (0, _react.useState)([]),
       _useState32 = (0, _slicedToArray2.default)(_useState31, 2),
-      services = _useState32[0],
-      setServices = _useState32[1];
+      servicesData = _useState32[0],
+      setServicesData = _useState32[1];
 
-  var _useState33 = (0, _react.useState)([]),
+  var _useState33 = (0, _react.useState)(""),
       _useState34 = (0, _slicedToArray2.default)(_useState33, 2),
-      servicesData = _useState34[0],
-      setServicesData = _useState34[1];
+      message = _useState34[0],
+      setMessage = _useState34[1];
 
-  var _useState35 = (0, _react.useState)(""),
+  var _useState35 = (0, _react.useState)(JSON.parse(sessionStorage.getItem("productSelected")) ? JSON.parse(sessionStorage.getItem("productSelected")) : productSelected),
       _useState36 = (0, _slicedToArray2.default)(_useState35, 2),
-      message = _useState36[0],
-      setMessage = _useState36[1];
+      product = _useState36[0],
+      setProduct = _useState36[1];
 
-  var _useState37 = (0, _react.useState)({}),
+  var _useState37 = (0, _react.useState)(null),
       _useState38 = (0, _slicedToArray2.default)(_useState37, 2),
-      product = _useState38[0],
-      setProduct = _useState38[1];
+      icon = _useState38[0],
+      setIcon = _useState38[1];
 
-  var _useState39 = (0, _react.useState)(null),
+  var _useState39 = (0, _react.useState)(product === null || product === void 0 ? void 0 : product.version),
       _useState40 = (0, _slicedToArray2.default)(_useState39, 2),
-      icon = _useState40[0],
-      setIcon = _useState40[1];
+      version = _useState40[0],
+      setVersion = _useState40[1];
 
-  var _useState41 = (0, _react.useState)(productSelected === null || productSelected === void 0 ? void 0 : productSelected.version),
+  var _useState41 = (0, _react.useState)({}),
       _useState42 = (0, _slicedToArray2.default)(_useState41, 2),
-      version = _useState42[0],
-      setVersion = _useState42[1];
+      comments = _useState42[0],
+      setComments = _useState42[1];
 
-  var _useState43 = (0, _react.useState)({}),
+  var _useState43 = (0, _react.useState)(""),
       _useState44 = (0, _slicedToArray2.default)(_useState43, 2),
-      comments = _useState44[0],
-      setComments = _useState44[1];
+      comment = _useState44[0],
+      setComment = _useState44[1];
 
-  var _useState45 = (0, _react.useState)(0),
+  var _useState45 = (0, _react.useState)({
+    "Ficha técnica": 0,
+    Descripción: 0,
+    Imágenes: 0
+  }),
       _useState46 = (0, _slicedToArray2.default)(_useState45, 2),
       requiredNull = _useState46[0],
       setRequiredNull = _useState46[1];
 
+  var _useState47 = (0, _react.useState)(false),
+      _useState48 = (0, _slicedToArray2.default)(_useState47, 2),
+      crossComment = _useState48[0],
+      setCrossComment = _useState48[1];
+
+  var _useState49 = (0, _react.useState)([]),
+      _useState50 = (0, _slicedToArray2.default)(_useState49, 2),
+      userGroups = _useState50[0],
+      setUserGroups = _useState50[1];
+
+  var _useState51 = (0, _react.useState)({}),
+      _useState52 = (0, _slicedToArray2.default)(_useState51, 2),
+      assig = _useState52[0],
+      setAssig = _useState52[1];
+
+  var _useState53 = (0, _react.useState)([]),
+      _useState54 = (0, _slicedToArray2.default)(_useState53, 2),
+      selectedImages = _useState54[0],
+      setSelectedImages = _useState54[1];
+
+  var _useState55 = (0, _react.useState)([]),
+      _useState56 = (0, _slicedToArray2.default)(_useState55, 2),
+      componentsArray = _useState56[0],
+      setComponentsArray = _useState56[1];
+
+  var _useState57 = (0, _react.useState)(false),
+      _useState58 = (0, _slicedToArray2.default)(_useState57, 2),
+      checkAll = _useState58[0],
+      setCheckAll = _useState58[1];
+
+  var isRetailer = user === null || user === void 0 ? void 0 : user.is_retailer;
+
+  var _useState59 = (0, _react.useState)(true),
+      _useState60 = (0, _slicedToArray2.default)(_useState59, 2),
+      loading = _useState60[0],
+      setLoading = _useState60[1];
+
+  var _useState61 = (0, _react.useState)("-"),
+      _useState62 = (0, _slicedToArray2.default)(_useState61, 2),
+      retailerStatus = _useState62[0],
+      setRetailerStatus = _useState62[1];
+
+  var _useState63 = (0, _react.useState)([]),
+      _useState64 = (0, _slicedToArray2.default)(_useState63, 2),
+      statusArray = _useState64[0],
+      setStatusArray = _useState64[1];
+
+  var _useState65 = (0, _react.useState)(null),
+      _useState66 = (0, _slicedToArray2.default)(_useState65, 2),
+      socketType = _useState66[0],
+      setSocketType = _useState66[1];
+
+  var _useState67 = (0, _react.useState)([]),
+      _useState68 = (0, _slicedToArray2.default)(_useState67, 2),
+      servicesStatus = _useState68[0],
+      setServicesStatus = _useState68[1];
+
+  var _useState69 = (0, _react.useState)(loading),
+      _useState70 = (0, _slicedToArray2.default)(_useState69, 2),
+      saving = _useState70[0],
+      setSaving = _useState70[1];
+
+  (0, _react.useEffect)(function () {
+    checkAll && setSelectedImages(images.values);
+  }, [checkAll]);
+
   var loadData = /*#__PURE__*/function () {
-    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
-      var _services$, _services$$values;
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+      var _product$article, _product$article2, _services$, _services$$values, _services;
 
-      var services;
-      return _regenerator.default.wrap(function _callee2$(_context2) {
+      return _regenerator.default.wrap(function _callee$(_context) {
         while (1) {
-          switch (_context2.prev = _context2.next) {
+          switch (_context.prev = _context.next) {
             case 0:
-              _context2.next = 2;
-              return (0, _data.getRetailerServices)(productSelected.article.id_article, parseInt(productSelected.article.id_category), productSelected.version);
+              _context.prev = 0;
+              _context.next = 3;
+              return (0, _data2.getRetailerServices)(product === null || product === void 0 ? void 0 : (_product$article = product.article) === null || _product$article === void 0 ? void 0 : _product$article.id_article, parseInt(product === null || product === void 0 ? void 0 : (_product$article2 = product.article) === null || _product$article2 === void 0 ? void 0 : _product$article2.id_category), product === null || product === void 0 ? void 0 : product.version);
 
-            case 2:
-              services = _context2.sent;
-              console.log(services, "parsedResponse"); //Converts the data inside the datasheets object to array
+            case 3:
+              _services = _context.sent;
+              //Converts the data inside the datasheets object to array
+              setServices(_services);
+              getServices(); //setActiveRetailer(product?.retailers[0]);
 
-              setServices(services);
-              setActiveRetailer(productSelected === null || productSelected === void 0 ? void 0 : productSelected.retailers[0]);
               setImages({
                 action: "init",
-                init: services[2]
+                init: _services[2]
               });
-              if (((_services$ = services[2]) === null || _services$ === void 0 ? void 0 : (_services$$values = _services$.values) === null || _services$$values === void 0 ? void 0 : _services$$values.length) > 0) setActiveImage(0);
-              setProduct(productSelected);
+              if (((_services$ = _services[2]) === null || _services$ === void 0 ? void 0 : (_services$$values = _services$.values) === null || _services$$values === void 0 ? void 0 : _services$$values.length) > 0) setActiveImage(0);
+              (0, _data2.getPercentage)({
+                data: [product]
+              }).then(function (res) {
+                return setPercentages(res);
+              });
+              setLoading(false);
+              _context.next = 15;
+              break;
+
+            case 12:
+              _context.prev = 12;
+              _context.t0 = _context["catch"](0);
+              console.log(_context.t0);
 
-            case 9:
+            case 15:
             case "end":
-              return _context2.stop();
+              return _context.stop();
           }
         }
-      }, _callee2);
+      }, _callee, null, [[0, 12]]);
     }));
 
     return function loadData() {
-      return _ref3.apply(this, arguments);
+      return _ref2.apply(this, arguments);
     };
   }();
 
   var getServices = /*#__PURE__*/function () {
-    var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(tab) {
-      var serviceActive, selected, servicesResponse, parsedResponse;
-      return _regenerator.default.wrap(function _callee3$(_context3) {
+    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+      var _product$article3, _product$article4, _servicesResponse$dat;
+
+      var servicesResponse, parsedResponse, retailers, active;
+      return _regenerator.default.wrap(function _callee2$(_context2) {
         while (1) {
-          switch (_context3.prev = _context3.next) {
+          switch (_context2.prev = _context2.next) {
             case 0:
-              serviceActive = "";
-              _context3.t0 = tab;
-              _context3.next = _context3.t0 === "Ficha técnica" ? 4 : _context3.t0 === "Imágenes" ? 6 : 8;
-              break;
-
-            case 4:
-              serviceActive = "datasheet";
-              return _context3.abrupt("break", 10);
-
-            case 6:
-              serviceActive = "images";
-              return _context3.abrupt("break", 10);
-
-            case 8:
-              serviceActive = "description";
-              return _context3.abrupt("break", 10);
-
-            case 10:
-              selected = productSelected;
-              _context3.next = 13;
-              return _axios.default.get("".concat(process.env.REACT_APP_SERVICES_ENDPOINT, "?articleId=").concat(selected.article.id_article, "&orderId=").concat(selected.article.id_order, "&end=true"));
+              _context2.next = 2;
+              return _axios.default.get("".concat(process.env.REACT_APP_SERVICES_ENDPOINT, "?articleId=").concat(product === null || product === void 0 ? void 0 : (_product$article3 = product.article) === null || _product$article3 === void 0 ? void 0 : _product$article3.id_article, "&orderId=").concat((product === null || product === void 0 ? void 0 : (_product$article4 = product.article) === null || _product$article4 === void 0 ? void 0 : _product$article4.id_order) || product.orderId, "&end=true"));
 
-            case 13:
-              servicesResponse = _context3.sent;
-              parsedResponse = JSON.parse(servicesResponse.data.body).data;
+            case 2:
+              servicesResponse = _context2.sent;
+              parsedResponse = JSON.parse(servicesResponse === null || servicesResponse === void 0 ? void 0 : (_servicesResponse$dat = servicesResponse.data) === null || _servicesResponse$dat === void 0 ? void 0 : _servicesResponse$dat.body).data;
+              retailers = product.retailers || product.retailersAvailable;
+              active = retailers === null || retailers === void 0 ? void 0 : retailers.filter(function (retailer) {
+                return parsedResponse === null || parsedResponse === void 0 ? void 0 : parsedResponse.map(function (srv) {
+                  return srv.id_retailer;
+                }).includes(retailer.id);
+              })[0];
+              !activeRetailer.id && setActiveRetailer(active ? active : retailers[0]);
               setServicesData(parsedResponse);
 
-            case 16:
+            case 8:
             case "end":
-              return _context3.stop();
+              return _context2.stop();
           }
         }
-      }, _callee3);
+      }, _callee2);
     }));
 
-    return function getServices(_x2) {
-      return _ref4.apply(this, arguments);
+    return function getServices() {
+      return _ref3.apply(this, arguments);
     };
   }();
 
@@ -391,7 +473,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
     var translation = "";
 
     if (concept === "datasheet") {
-      translation = "Ficha ténica";
+      translation = "Ficha técnica";
     } else if (concept === "description") {
       translation = "Descripción";
     } else if (concept === "images") {
@@ -402,146 +484,253 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
   };
 
   var getComments = /*#__PURE__*/function () {
-    var _ref5 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(tab) {
-      var _productSelected$arti, _productSelected$arti2, _productSelected$arti3;
+    var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
+      var _product$article5, _product$article6, _product$article7;
 
-      var commentsResponse, comments;
-      return _regenerator.default.wrap(function _callee4$(_context4) {
+      var tab,
+          commentsResponse,
+          comments,
+          _args3 = arguments;
+      return _regenerator.default.wrap(function _callee3$(_context3) {
         while (1) {
-          switch (_context4.prev = _context4.next) {
+          switch (_context3.prev = _context3.next) {
             case 0:
-              _context4.next = 2;
-              return Promise.all([_axios.default.get("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT, "?articleId=").concat(productSelected === null || productSelected === void 0 ? void 0 : (_productSelected$arti = productSelected.article) === null || _productSelected$arti === void 0 ? void 0 : _productSelected$arti.id_article, "&concept=description&orderIdColab=").concat(productSelected === null || productSelected === void 0 ? void 0 : productSelected.orderId, "&version=").concat(version)), _axios.default.get("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT, "?articleId=").concat(productSelected === null || productSelected === void 0 ? void 0 : (_productSelected$arti2 = productSelected.article) === null || _productSelected$arti2 === void 0 ? void 0 : _productSelected$arti2.id_article, "&concept=datasheet&orderIdColab=").concat(productSelected === null || productSelected === void 0 ? void 0 : productSelected.orderId, "&version=").concat(version)), _axios.default.get("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT, "?articleId=").concat(productSelected === null || productSelected === void 0 ? void 0 : (_productSelected$arti3 = productSelected.article) === null || _productSelected$arti3 === void 0 ? void 0 : _productSelected$arti3.id_article, "&concept=images&orderIdColab=").concat(productSelected === null || productSelected === void 0 ? void 0 : productSelected.orderId, "&version=").concat(version))]);
+              tab = _args3.length > 0 && _args3[0] !== undefined ? _args3[0] : "Descripción";
+              _context3.next = 3;
+              return Promise.all([_axios.default.get("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT, "?articleId=").concat(product === null || product === void 0 ? void 0 : (_product$article5 = product.article) === null || _product$article5 === void 0 ? void 0 : _product$article5.id_article, "&concept=description&orderIdColab=").concat(product === null || product === void 0 ? void 0 : product.orderId, "&version=").concat(version)), _axios.default.get("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT, "?articleId=").concat(product === null || product === void 0 ? void 0 : (_product$article6 = product.article) === null || _product$article6 === void 0 ? void 0 : _product$article6.id_article, "&concept=datasheet&orderIdColab=").concat(product === null || product === void 0 ? void 0 : product.orderId, "&version=").concat(version)), _axios.default.get("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT, "?articleId=").concat(product === null || product === void 0 ? void 0 : (_product$article7 = product.article) === null || _product$article7 === void 0 ? void 0 : _product$article7.id_article, "&concept=images&orderIdColab=").concat(product === null || product === void 0 ? void 0 : product.orderId, "&version=").concat(version))]);
 
-            case 2:
-              commentsResponse = _context4.sent;
+            case 3:
+              commentsResponse = _context3.sent;
               comments = {};
-              commentsResponse.map(function (comment) {
-                var _JSON$parse$data$;
+              commentsResponse.forEach(function (comment) {
+                var _comment$data, _JSON$parse, _JSON$parse$data$, _comment$data2, _comment$data3;
 
-                return JSON.parse(comment.data.body).data[0] && (comments[translateConcept((_JSON$parse$data$ = JSON.parse(comment.data.body).data[0]) === null || _JSON$parse$data$ === void 0 ? void 0 : _JSON$parse$data$.concept)] = JSON.parse(comment.data.body).data[0]);
+                return JSON.parse(comment === null || comment === void 0 ? void 0 : (_comment$data = comment.data) === null || _comment$data === void 0 ? void 0 : _comment$data.body).data[0] && (comments[translateConcept((_JSON$parse = JSON.parse(comment === null || comment === void 0 ? void 0 : (_comment$data2 = comment.data) === null || _comment$data2 === void 0 ? void 0 : _comment$data2.body)) === null || _JSON$parse === void 0 ? void 0 : (_JSON$parse$data$ = _JSON$parse.data[0]) === null || _JSON$parse$data$ === void 0 ? void 0 : _JSON$parse$data$.concept)] = JSON.parse(comment === null || comment === void 0 ? void 0 : (_comment$data3 = comment.data) === null || _comment$data3 === void 0 ? void 0 : _comment$data3.body).data[0]);
               });
-              setComments(comments); //const comment = JSON.parse(commentsResponse.data.body).data;
-              //setComment(comment[0]);
+              setComment(comments[tab]);
+              setComments(comments);
 
-            case 6:
+            case 8:
             case "end":
-              return _context4.stop();
+              return _context3.stop();
           }
         }
-      }, _callee4);
+      }, _callee3);
     }));
 
-    return function getComments(_x3) {
-      return _ref5.apply(this, arguments);
+    return function getComments() {
+      return _ref4.apply(this, arguments);
     };
   }();
 
-  (0, _react.useEffect)(function () {
-    loadData();
-    (0, _data.getPercentage)({
-      data: [productSelected]
-    }).then(function (res) {
-      return setPercentages(res);
+  (0, _react.useEffect)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4() {
+    var arr;
+    return _regenerator.default.wrap(function _callee4$(_context4) {
+      while (1) {
+        switch (_context4.prev = _context4.next) {
+          case 0:
+            loadData();
+            getComments();
+            _context4.t0 = setUserGroups;
+            _context4.next = 5;
+            return (0, _data2.fetchUsers)(token);
+
+          case 5:
+            _context4.t1 = _context4.sent;
+            (0, _context4.t0)(_context4.t1);
+            arr = [];
+            _context4.t2 = user.id_role;
+            _context4.next = _context4.t2 === 7 ? 11 : _context4.t2 === 8 ? 11 : _context4.t2 === 4 ? 13 : _context4.t2 === 5 ? 13 : _context4.t2 === 6 ? 15 : 17;
+            break;
+
+          case 11:
+            arr = ["IN_PROGRESS", "RF", "RA"];
+            return _context4.abrupt("break", 19);
+
+          case 13:
+            arr = ["RF", "AF", "AA", "AP", "AC"];
+            return _context4.abrupt("break", 19);
+
+          case 15:
+            arr = ["RP", "RC", "AF", "RA"];
+            return _context4.abrupt("break", 19);
+
+          case 17:
+            arr = [];
+            return _context4.abrupt("break", 19);
+
+          case 19:
+            setStatusArray(arr);
+
+          case 20:
+          case "end":
+            return _context4.stop();
+        }
+      }
+    }, _callee4);
+  })), [product]);
+
+  var loadAssignations = function loadAssignations(currentProduct) {
+    var _currentProduct$artic, _currentProduct$artic2, _currentProduct$artic3, _currentProduct$artic4, _currentProduct$artic5, _currentProduct$artic6;
+
+    setAssig({
+      Descripción: {
+        assignations: [{
+          collaboratorType: "especialist",
+          id: currentProduct === null || currentProduct === void 0 ? void 0 : (_currentProduct$artic = currentProduct.article) === null || _currentProduct$artic === void 0 ? void 0 : _currentProduct$artic.id_description_especialist
+        }, {
+          collaboratorType: "facilitator",
+          id: currentProduct === null || currentProduct === void 0 ? void 0 : (_currentProduct$artic2 = currentProduct.article) === null || _currentProduct$artic2 === void 0 ? void 0 : _currentProduct$artic2.id_description_facilitator
+        }],
+        collaborators: {
+          especialist: userGroups[0] || [],
+          facilitator: userGroups[2] || []
+        }
+      },
+      "Ficha técnica": {
+        assignations: [{
+          collaboratorType: "especialist",
+          id: currentProduct === null || currentProduct === void 0 ? void 0 : (_currentProduct$artic3 = currentProduct.article) === null || _currentProduct$artic3 === void 0 ? void 0 : _currentProduct$artic3.id_datasheet_especialist
+        }, {
+          collaboratorType: "facilitator",
+          id: currentProduct === null || currentProduct === void 0 ? void 0 : (_currentProduct$artic4 = currentProduct.article) === null || _currentProduct$artic4 === void 0 ? void 0 : _currentProduct$artic4.id_datasheet_facilitator
+        }],
+        collaborators: {
+          especialist: userGroups[0] || [],
+          facilitator: userGroups[2] || []
+        }
+      },
+      Imágenes: {
+        assignations: [{
+          collaboratorType: "especialist",
+          id: currentProduct === null || currentProduct === void 0 ? void 0 : (_currentProduct$artic5 = currentProduct.article) === null || _currentProduct$artic5 === void 0 ? void 0 : _currentProduct$artic5.id_images_especialist
+        }, {
+          collaboratorType: "facilitator",
+          id: currentProduct === null || currentProduct === void 0 ? void 0 : (_currentProduct$artic6 = currentProduct.article) === null || _currentProduct$artic6 === void 0 ? void 0 : _currentProduct$artic6.id_images_facilitator
+        }],
+        collaborators: {
+          especialist: userGroups[1] || [],
+          facilitator: userGroups[3] || []
+        }
+      }
     });
-    getServices();
-    getComments();
-  }, []);
+  };
+
   (0, _react.useEffect)(function () {
-    var _productSelected$reta;
+    loadAssignations(product);
+  }, [userGroups]);
+  (0, _react.useEffect)(function () {
+    var _product$retailers2, _product$retailers$;
 
-    productSelected.retailers.forEach(function (retailer) {
+    product === null || product === void 0 ? void 0 : (_product$retailers2 = product.retailers) === null || _product$retailers2 === void 0 ? void 0 : _product$retailers2.forEach(function (retailer) {
       var _percentages$filter$;
 
-      retailer["percentage"] = (_percentages$filter$ = percentages.filter(function (percent) {
-        return retailer.id === percent.id_retailer;
+      retailer["percentage"] = percentages === null || percentages === void 0 ? void 0 : (_percentages$filter$ = percentages.filter(function (percent) {
+        return (retailer === null || retailer === void 0 ? void 0 : retailer.id) === (percent === null || percent === void 0 ? void 0 : percent.id_retailer);
       })[0]) === null || _percentages$filter$ === void 0 ? void 0 : _percentages$filter$.percentage;
     });
-    setActivePercentage(productSelected === null || productSelected === void 0 ? void 0 : (_productSelected$reta = productSelected.retailers[0]) === null || _productSelected$reta === void 0 ? void 0 : _productSelected$reta.percentage);
+    setActivePercentage(product === null || product === void 0 ? void 0 : (_product$retailers$ = product.retailers[0]) === null || _product$retailers$ === void 0 ? void 0 : _product$retailers$.percentage);
   }, [percentages]);
   (0, _react.useEffect)(function () {
     if (services.length > 0) {
-      services[0][activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id].data = Object.values(services[0][activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id].data);
-      setActivePercentage(Math.round(activeRetailer.percentage, 0));
-      setDatasheets([services[0][activeRetailer.id], services[0].inputs]);
-      setDescriptions(services[1].filter(function (service) {
-        return service.id === activeRetailer.id;
-      }));
+      var _services$0$activeRet, _services$2, _services$3;
+
+      if ((_services$0$activeRet = services[0][activeRetailer.id]) !== null && _services$0$activeRet !== void 0 && _services$0$activeRet.data) services[0][activeRetailer.id].data = Object.values(services[0][activeRetailer.id].data);
+      setActivePercentage(Math.round(activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.percentage, 0));
+      var datagroups = services[0][activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id];
+      var inputs = (_services$2 = services[0]) === null || _services$2 === void 0 ? void 0 : _services$2.inputs;
+
+      var _descriptions = (_services$3 = services[1]) === null || _services$3 === void 0 ? void 0 : _services$3.filter(function (service) {
+        return (service === null || service === void 0 ? void 0 : service.id) === (activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id);
+      });
+
+      setDatasheets([datagroups, inputs]);
+      setDescriptions(_descriptions);
     }
-  }, [activeRetailer]);
+  }, [activeRetailer, services]);
 
   var thumbs = function thumbs() {
-    var _images$values;
+    var _images$imageType, _images$imagePackagin, _images$values;
 
-    var imageInputs = images.inputs.map(function (e) {
+    var imageInputs = socketType === null || socketType === void 0 ? void 0 : socketType.slice();
+    var imageType = images === null || images === void 0 ? void 0 : (_images$imageType = images.imageType) === null || _images$imageType === void 0 ? void 0 : _images$imageType.map(function (e) {
       return {
-        value: e.id,
-        name: e.name
+        value: e === null || e === void 0 ? void 0 : e.id,
+        name: e === null || e === void 0 ? void 0 : e.name
       };
     });
-    var imageType = images.imageType.map(function (e) {
+    var imagePackagingType = images === null || images === void 0 ? void 0 : (_images$imagePackagin = images.imagePackagingType) === null || _images$imagePackagin === void 0 ? void 0 : _images$imagePackagin.map(function (e) {
       return {
-        value: e.id,
-        name: e.name
-      };
-    });
-    var imagePackagingType = images.imagePackagingType.map(function (e) {
-      return {
-        value: e.id,
-        name: e.name
+        value: e === null || e === void 0 ? void 0 : e.id,
+        name: e === null || e === void 0 ? void 0 : e.name
       };
     });
     return images === null || images === void 0 ? void 0 : (_images$values = images.values) === null || _images$values === void 0 ? void 0 : _images$values.map(function (image, index) {
-      return /*#__PURE__*/React.createElement(_GalleryElement.GalleryElement, {
-        key: index,
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GalleryElement.GalleryElement, {
+        setCheckAll: setCheckAll,
         image: image,
         gridLayout: imageLayout,
         id: "gallery-element-" + index,
-        index: index,
+        index: index + "-" + image.name,
+        number: index,
         imageType: imageType,
         imagePackagingType: imagePackagingType,
         imageInputs: imageInputs,
-        changeImage: setImages
-      });
+        setSocketType: setSocketType,
+        changeImage: setImages,
+        selectedImages: selectedImages,
+        setSelectedImages: setSelectedImages
+      }, index);
     });
   };
 
   var saveDescriptions = /*#__PURE__*/function () {
     var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5() {
-      var _productSelected$arti4;
+      var _product$article8;
 
-      var dataObject;
+      var productTemp, dataObject;
       return _regenerator.default.wrap(function _callee5$(_context5) {
         while (1) {
           switch (_context5.prev = _context5.next) {
             case 0:
+              setLoading(true);
+              productTemp = product;
               dataObject = {
-                articleId: productSelected === null || productSelected === void 0 ? void 0 : (_productSelected$arti4 = productSelected.article) === null || _productSelected$arti4 === void 0 ? void 0 : _productSelected$arti4.id_article,
+                articleId: product === null || product === void 0 ? void 0 : (_product$article8 = product.article) === null || _product$article8 === void 0 ? void 0 : _product$article8.id_article,
                 articleData: updatedDescriptions
               };
-              _context5.prev = 1;
-              _context5.next = 4;
+              if (product !== null && product !== void 0 && product.orderId) dataObject["orderId"] = product === null || product === void 0 ? void 0 : product.orderId;
+              _context5.prev = 4;
+              _context5.next = 7;
               return _axios.default.put("".concat(process.env.REACT_APP_ARTICLE_DATA_ENDPOINT, "?description=true&version=").concat(version), dataObject, {
                 headers: {
-                  Authorization: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmNTkyN2Y4ZS1jYmY3LTQ5MjItOWUwOS1lNjllYzBiMjczMWEiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6ImY1OTI3ZjhlLWNiZjctNDkyMi05ZTA5LWU2OWVjMGIyNzMxYSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIxYTk4MzZlNS1kMDYyLTQ4ZjQtYjY4Yi04NDZhZWEwMDFlMDIiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY0NjM1MzAyMywibmFtZSI6IklzbWFlbCBMb3BleiIsInBob25lX251bWJlciI6Iis1MjMxMTEzNjYzMzYiLCJleHAiOjE2NDYzNTY2MjMsImlhdCI6MTY0NjM1MzAyMywiZW1haWwiOiJpbG9wZXpAY29udGVudG9oLmNvbSJ9.LX6wMUK1eiE49heX3nVIMR4oRrWEaI-xyUErYx9_AWlxLn5jksbmmZmXujeaailxxcvaVQDYIbKSyrahwmqUohaDChM3TgDHCHTvAeiDGoVAFIjKyzk_wzttgVrKu5P_45bNrds7PVmLC981W8aVdQO32JklWhCpO_jEbtIgGeklQ6PF9yOd5TEWtq4kJTuYrbZpl21qnZ_wopbLSOz4Ty_OoIbvkFFcPV2jSBsMggQns3GqlHjlCLMtSN43IgQbuZ711BPWk6MMIFI48tl7HEC9rm1z1l0aejtn7ooiYKNsV2V__OL0Mi3ziDmoTDp3Ra02m0J176b99V17mFmj7A"
+                  Authorization: token
                 }
               });
 
-            case 4:
-              _context5.next = 9;
+            case 7:
+              if (productTemp.status === "ASSIGNED") {
+                productTemp.status = "IN_PROGRESS";
+                setProduct(productTemp);
+                sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
+              }
+
+              setMessage("Descripciones guardadas con éxito");
+              loadData();
+              _context5.next = 15;
               break;
 
-            case 6:
-              _context5.prev = 6;
-              _context5.t0 = _context5["catch"](1);
+            case 12:
+              _context5.prev = 12;
+              _context5.t0 = _context5["catch"](4);
               console.log(_context5.t0);
 
-            case 9:
+            case 15:
             case "end":
               return _context5.stop();
           }
         }
-      }, _callee5, null, [[1, 6]]);
+      }, _callee5, null, [[4, 12]]);
     }));
 
     return function saveDescriptions() {
@@ -551,41 +740,53 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
 
   var saveDatasheets = /*#__PURE__*/function () {
     var _ref7 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6() {
-      var _productSelected$arti5;
+      var _product$article9;
 
-      var dataObject;
+      var productTemp, dataObject;
       return _regenerator.default.wrap(function _callee6$(_context6) {
         while (1) {
           switch (_context6.prev = _context6.next) {
             case 0:
+              setLoading(true);
+              productTemp = product;
               dataObject = {
-                articleId: productSelected === null || productSelected === void 0 ? void 0 : (_productSelected$arti5 = productSelected.article) === null || _productSelected$arti5 === void 0 ? void 0 : _productSelected$arti5.id_article,
+                articleId: product === null || product === void 0 ? void 0 : (_product$article9 = product.article) === null || _product$article9 === void 0 ? void 0 : _product$article9.id_article,
                 articleData: updatedDatasheets
               };
-              _context6.prev = 1;
-              _context6.next = 4;
+              console.log(updatedDatasheets, "updatedDatasheets");
+              if (product !== null && product !== void 0 && product.orderId) dataObject["orderId"] = product === null || product === void 0 ? void 0 : product.orderId;
+              _context6.prev = 5;
+              _context6.next = 8;
               return _axios.default.put("".concat(process.env.REACT_APP_ARTICLE_DATA_ENDPOINT, "?datasheet=true&version=").concat(version), dataObject, {
                 headers: {
-                  Authorization: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmNTkyN2Y4ZS1jYmY3LTQ5MjItOWUwOS1lNjllYzBiMjczMWEiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6ImY1OTI3ZjhlLWNiZjctNDkyMi05ZTA5LWU2OWVjMGIyNzMxYSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIxYTk4MzZlNS1kMDYyLTQ4ZjQtYjY4Yi04NDZhZWEwMDFlMDIiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY0NjM1MzAyMywibmFtZSI6IklzbWFlbCBMb3BleiIsInBob25lX251bWJlciI6Iis1MjMxMTEzNjYzMzYiLCJleHAiOjE2NDYzNTY2MjMsImlhdCI6MTY0NjM1MzAyMywiZW1haWwiOiJpbG9wZXpAY29udGVudG9oLmNvbSJ9.LX6wMUK1eiE49heX3nVIMR4oRrWEaI-xyUErYx9_AWlxLn5jksbmmZmXujeaailxxcvaVQDYIbKSyrahwmqUohaDChM3TgDHCHTvAeiDGoVAFIjKyzk_wzttgVrKu5P_45bNrds7PVmLC981W8aVdQO32JklWhCpO_jEbtIgGeklQ6PF9yOd5TEWtq4kJTuYrbZpl21qnZ_wopbLSOz4Ty_OoIbvkFFcPV2jSBsMggQns3GqlHjlCLMtSN43IgQbuZ711BPWk6MMIFI48tl7HEC9rm1z1l0aejtn7ooiYKNsV2V__OL0Mi3ziDmoTDp3Ra02m0J176b99V17mFmj7A"
+                  Authorization: token
                 }
               });
 
-            case 4:
-              console.log("saved");
-              _context6.next = 10;
+            case 8:
+              setMessage("Fichas técnicas guardadas");
+
+              if (productTemp.status === "ASSIGNED") {
+                productTemp.status = "IN_PROGRESS";
+                setProduct(productTemp);
+                sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
+              }
+
+              loadData();
+              _context6.next = 16;
               break;
 
-            case 7:
-              _context6.prev = 7;
-              _context6.t0 = _context6["catch"](1);
+            case 13:
+              _context6.prev = 13;
+              _context6.t0 = _context6["catch"](5);
               console.log(_context6.t0);
 
-            case 10:
+            case 16:
             case "end":
               return _context6.stop();
           }
         }
-      }, _callee6, null, [[1, 7]]);
+      }, _callee6, null, [[5, 13]]);
     }));
 
     return function saveDatasheets() {
@@ -593,50 +794,69 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
     };
   }();
 
+  (0, _react.useEffect)(function () {
+    var _images$inputs;
+
+    var imageInputs = images === null || images === void 0 ? void 0 : (_images$inputs = images.inputs) === null || _images$inputs === void 0 ? void 0 : _images$inputs.map(function (e) {
+      return {
+        value: e === null || e === void 0 ? void 0 : e.id,
+        name: e === null || e === void 0 ? void 0 : e.name,
+        required: e === null || e === void 0 ? void 0 : e.required,
+        active: images === null || images === void 0 ? void 0 : images.values.some(function (value) {
+          return (value === null || value === void 0 ? void 0 : value.image_id) === (e === null || e === void 0 ? void 0 : e.id);
+        })
+      };
+    });
+    setSocketType(imageInputs);
+  }, [images]);
   var updateImages = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee7() {
-    var _images$values2;
+    var _images$values2, _product$article10, _data$articleData, _data$articleData2, _data$updateImages;
+
+    var imagesList, imagesListTemp, duplicated, attrForImgs, data, valid, _data$updateImages2, _data$articleData3, _data$articleData4, _data$articleData5, promiseArray, productTemp;
 
-    var imagesList, imagesListTemp, duplicated, attrForImgs, data, valid, promiseArray;
     return _regenerator.default.wrap(function _callee7$(_context7) {
       while (1) {
         switch (_context7.prev = _context7.next) {
           case 0:
             imagesList = images === null || images === void 0 ? void 0 : (_images$values2 = images.values) === null || _images$values2 === void 0 ? void 0 : _images$values2.slice();
-            imagesListTemp = imagesList.reduce(function (acc, image) {
-              acc[image.image_id] = ++acc[image.image_id] || 0;
+            imagesListTemp = imagesList === null || imagesList === void 0 ? void 0 : imagesList.reduce(function (acc, image) {
+              acc[image === null || image === void 0 ? void 0 : image.image_id] = ++acc[image === null || image === void 0 ? void 0 : image.image_id] || 0;
               return acc;
             }, {});
-            duplicated = imagesList.filter(function (image) {
-              return imagesListTemp[image.image_id];
+            duplicated = imagesList === null || imagesList === void 0 ? void 0 : imagesList.filter(function (image) {
+              return imagesListTemp[image === null || image === void 0 ? void 0 : image.image_id];
             });
             attrForImgs = Object.values(images === null || images === void 0 ? void 0 : images.attrForImgs);
             attrForImgs.pop();
             data = {
-              articleId: articleId,
-              attrReqImgs: attrForImgs.map(function (e) {
+              articleId: product === null || product === void 0 ? void 0 : (_product$article10 = product.article) === null || _product$article10 === void 0 ? void 0 : _product$article10.id_article,
+              attrReqImgs: attrForImgs === null || attrForImgs === void 0 ? void 0 : attrForImgs.map(function (e) {
+                var _e$, _e$2;
+
                 return {
-                  attrId: e[0].id,
-                  value: e[0].value
+                  attrId: (_e$ = e[0]) === null || _e$ === void 0 ? void 0 : _e$.id,
+                  value: (_e$2 = e[0]) === null || _e$2 === void 0 ? void 0 : _e$2.value
                 };
               }),
-              articleData: imagesList.filter(function (e) {
+              articleData: imagesList === null || imagesList === void 0 ? void 0 : imagesList.filter(function (e) {
                 return !e.id;
               }),
-              updateImages: imagesList.filter(function (e) {
+              updateImages: imagesList === null || imagesList === void 0 ? void 0 : imagesList.filter(function (e) {
                 return e.id;
               })
             };
-            valid = data.articleData.length === 0 ? true : data.articleData.every(function (e, i) {
-              if (e.image_id && e.packing_type && e.image_type) {
+            if (product !== null && product !== void 0 && product.orderId) data["orderId"] = product === null || product === void 0 ? void 0 : product.orderId;
+            valid = (data === null || data === void 0 ? void 0 : (_data$articleData = data.articleData) === null || _data$articleData === void 0 ? void 0 : _data$articleData.length) === 0 ? true : data === null || data === void 0 ? void 0 : (_data$articleData2 = data.articleData) === null || _data$articleData2 === void 0 ? void 0 : _data$articleData2.every(function (e, i) {
+              if (e !== null && e !== void 0 && e.image_id && e !== null && e !== void 0 && e.packing_type && e !== null && e !== void 0 && e.image_type) {
                 return true;
               }
 
               return false;
             });
 
-            if (valid && data.updateImages.length > 0 && duplicated.length === 0) {
-              valid = data.updateImages.every(function (e, i) {
-                if (e.image_id && e.packing_type && e.image_type) {
+            if (valid && (data === null || data === void 0 ? void 0 : (_data$updateImages = data.updateImages) === null || _data$updateImages === void 0 ? void 0 : _data$updateImages.length) > 0 && (duplicated === null || duplicated === void 0 ? void 0 : duplicated.length) === 0) {
+              valid = data === null || data === void 0 ? void 0 : (_data$updateImages2 = data.updateImages) === null || _data$updateImages2 === void 0 ? void 0 : _data$updateImages2.every(function (e, i) {
+                if (e !== null && e !== void 0 && e.image_id && e !== null && e !== void 0 && e.packing_type && e !== null && e !== void 0 && e.image_type) {
                   return true;
                 }
 
@@ -644,75 +864,77 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
               });
             }
 
-            if (!(valid && duplicated.length === 0)) {
-              _context7.next = 29;
+            if (!(valid && (duplicated === null || duplicated === void 0 ? void 0 : duplicated.length) === 0)) {
+              _context7.next = 33;
               break;
             }
 
-            _context7.prev = 9;
-            data.articleData.forEach(function (e) {
+            setLoading(true);
+            _context7.prev = 11;
+            data === null || data === void 0 ? void 0 : (_data$articleData3 = data.articleData) === null || _data$articleData3 === void 0 ? void 0 : _data$articleData3.forEach(function (e) {
               e.uuid = (0, _uuid.v4)();
             });
             setDataImages(data);
 
-            if (!(data.articleData.length > 0)) {
-              _context7.next = 21;
+            if (!((data === null || data === void 0 ? void 0 : (_data$articleData4 = data.articleData) === null || _data$articleData4 === void 0 ? void 0 : _data$articleData4.length) > 0)) {
+              _context7.next = 23;
               break;
             }
 
             setImagesUploaded(false);
             promiseArray = [];
-            data.articleData.forEach(function (e) {
+            data === null || data === void 0 ? void 0 : (_data$articleData5 = data.articleData) === null || _data$articleData5 === void 0 ? void 0 : _data$articleData5.forEach(function (e) {
               var file = Buffer.from(e.src.replace(/^data:image\/\w+;base64,/, ""), "base64");
               var params = {
                 ACL: "public-read",
                 Body: file,
                 Bucket: S3_BUCKET,
-                Key: "id-".concat(data.articleId, "/").concat(version, "/").concat(e.image_id, "-").concat(e.uuid, ".").concat(e.ext)
+                Key: "id-".concat(data.articleId, "/").concat(version, "/").concat(e === null || e === void 0 ? void 0 : e.image_id, "-").concat(e === null || e === void 0 ? void 0 : e.uuid, ".").concat(e === null || e === void 0 ? void 0 : e.ext)
               };
               promiseArray.push(myBucket.putObject(params).promise());
             });
-            _context7.next = 18;
+            _context7.next = 20;
             return Promise.all(promiseArray);
 
-          case 18:
+          case 20:
             setImagesUploaded(true);
-            _context7.next = 22;
+            _context7.next = 24;
             break;
 
-          case 21:
+          case 23:
             setImagesUploaded(true);
 
-          case 22:
-            _context7.next = 27;
+          case 24:
+            productTemp = product;
+
+            if (productTemp.status === "ASSIGNED") {
+              productTemp.status = "IN_PROGRESS";
+              setProduct(productTemp);
+              sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
+            }
+
+            _context7.next = 31;
             break;
 
-          case 24:
-            _context7.prev = 24;
-            _context7.t0 = _context7["catch"](9);
+          case 28:
+            _context7.prev = 28;
+            _context7.t0 = _context7["catch"](11);
             console.log(_context7.t0); // setMainLoading(false);
 
-          case 27:
-            _context7.next = 30;
+          case 31:
+            _context7.next = 34;
             break;
 
-          case 29:
+          case 33:
             // setMainLoading(false);
-            console.log("Completa los campos que solicita cada una de la imágenes o hay imágenes con el mismo tipo de toma.", "Recuerda hay campos obligatorios y no podras avanzar si no estan completos."); // setAlertList((prev) => [
-            //   ...prev,
-            //   {
-            //     titleMsg: "Completa los campos que solicita cada una de la imágenes",
-            //     alertMsg:
-            //       "Recuerda hay campos obligatorios y no podras avanzar si no estan completos.",
-            //   },
-            // ]);
-
-          case 30:
+            setMessage("Completa los campos que solicita cada una de la imágenes o hay imágenes con el mismo tipo de toma.\nRecuerda hay campos obligatorios y no podras avanzar si no estan completos.");
+
+          case 34:
           case "end":
             return _context7.stop();
         }
       }
-    }, _callee7, null, [[9, 24]]);
+    }, _callee7, null, [[11, 28]]);
   })), [images, imagesUploaded]);
   (0, _react.useEffect)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee8() {
     return _regenerator.default.wrap(function _callee8$(_context8) {
@@ -720,65 +942,110 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
         switch (_context8.prev = _context8.next) {
           case 0:
             if (!imagesUploaded) {
-              _context8.next = 11;
+              _context8.next = 13;
               break;
             }
 
-            dataImages.articleData = dataImages.articleData.map(function (e) {
+            dataImages.articleData = dataImages === null || dataImages === void 0 ? void 0 : dataImages.articleData.map(function (e) {
               delete e.src;
               e.imageID = e.image_id;
               e.packingType = e.packing_type;
               e.imageType = e.image_type;
+              if (product !== null && product !== void 0 && product.orderId) e["orderId"] = product === null || product === void 0 ? void 0 : product.orderId;
               return e;
             });
             _context8.prev = 2;
             _context8.next = 5;
             return _axios.default.put("".concat(process.env.REACT_APP_ARTICLE_DATA_ENDPOINT, "?image=true&version=").concat(version), dataImages, {
               headers: {
-                Authorization: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmNTkyN2Y4ZS1jYmY3LTQ5MjItOWUwOS1lNjllYzBiMjczMWEiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6ImY1OTI3ZjhlLWNiZjctNDkyMi05ZTA5LWU2OWVjMGIyNzMxYSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIxYTk4MzZlNS1kMDYyLTQ4ZjQtYjY4Yi04NDZhZWEwMDFlMDIiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY0NjM1MzAyMywibmFtZSI6IklzbWFlbCBMb3BleiIsInBob25lX251bWJlciI6Iis1MjMxMTEzNjYzMzYiLCJleHAiOjE2NDYzNTY2MjMsImlhdCI6MTY0NjM1MzAyMywiZW1haWwiOiJpbG9wZXpAY29udGVudG9oLmNvbSJ9.LX6wMUK1eiE49heX3nVIMR4oRrWEaI-xyUErYx9_AWlxLn5jksbmmZmXujeaailxxcvaVQDYIbKSyrahwmqUohaDChM3TgDHCHTvAeiDGoVAFIjKyzk_wzttgVrKu5P_45bNrds7PVmLC981W8aVdQO32JklWhCpO_jEbtIgGeklQ6PF9yOd5TEWtq4kJTuYrbZpl21qnZ_wopbLSOz4Ty_OoIbvkFFcPV2jSBsMggQns3GqlHjlCLMtSN43IgQbuZ711BPWk6MMIFI48tl7HEC9rm1z1l0aejtn7ooiYKNsV2V__OL0Mi3ziDmoTDp3Ra02m0J176b99V17mFmj7A"
+                Authorization: token
               }
             });
 
           case 5:
-            console.log("imágenes guardadas con éxito");
-            _context8.next = 11;
+            setMessage("Imágenes guardadas con éxito");
+            sessionStorage.removeItem("imagesList");
+            loadData();
+            _context8.next = 13;
             break;
 
-          case 8:
-            _context8.prev = 8;
+          case 10:
+            _context8.prev = 10;
             _context8.t0 = _context8["catch"](2);
             console.log(_context8.t0);
 
-          case 11:
+          case 13:
           case "end":
             return _context8.stop();
         }
       }
-    }, _callee8, null, [[2, 8]]);
+    }, _callee8, null, [[2, 10]]);
   })), [dataImages, imagesUploaded]);
 
-  var approveRejectButtons = function approveRejectButtons(action) {
-    var concept = "";
+  var evaluationFinished = function evaluationFinished(userId, tab, statusArray) {
+    var srv = servicesData.filter(function (serv) {
+      return serv.service === getConcept(tab);
+    });
 
-    switch (activeTab) {
-      case "Descripción":
-        concept = "description";
+    var _srv$filter = srv.filter(function (serv) {
+      return serv.id_retailer === (activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id);
+    }),
+        _srv$filter2 = (0, _slicedToArray2.default)(_srv$filter, 1),
+        srvActive = _srv$filter2[0];
+
+    var unvalidated = product["".concat(getConcept(tab), "_status")] === "QF" || product["".concat(getConcept(tab), "_status")] === "IN_PROGRESS";
+    var auditorUnvalidated = !["RA", "AA", "AC", "AP"].includes(product["".concat(getConcept(tab), "_status")]);
+
+    switch (userId) {
+      case 7:
+      case 8:
+        return ["RA", "RF"].includes(product === null || product === void 0 ? void 0 : product.status) && //"IN_PROGRESS", "RF", "RA"
+        statusArray.includes(srvActive === null || srvActive === void 0 ? void 0 : srvActive.status) || statusArray.includes(product.status) && srv.filter(function (serv) {
+          return statusArray.includes(serv.status);
+        }).length === srv.length;
+
+      case 4:
+      case 5:
+        return unvalidated && ["IN_PROGRESS", "QF"].includes(product.status) && //"RF", "AF", "AA", "AP", "AC
+        srv.filter(function (serv) {
+          return statusArray.includes(serv.status);
+        }).length === srv.length;
+
+      case 6:
+        return statusArray.includes(product.status) && //RP, RC, AF, RA true
+        srv.every(function (serv) {
+          return ["RA", "AA", "AP", "AC"].includes(serv.status);
+        }) && auditorUnvalidated;
+
+      default:
         break;
+    }
+  };
+
+  var getConcept = function getConcept(tab) {
+    switch (tab) {
+      case "Descripción":
+        return "description";
 
       case "Ficha técnica":
-        concept = "datasheet";
-        break;
+        return "datasheet";
 
       case "Imágenes":
-        concept = "images";
-        break;
-
-      default:
-        break;
+        return "images";
     }
+  };
+
+  var approveRejectButtons = function approveRejectButtons(action) {
+    var concept = getConcept(action || activeTab);
 
-    concept = action ? action : concept;
-    return productSelected["".concat(concept, "_status")] === "QF" && (user.id_role === 1 || user.id_role === 4 || user.id_role === 5) || productSelected["".concat(concept, "_status")] === "AF" && (user.id_role === 1 || user.id_role === 6) || productSelected["".concat(concept, "_status")] === "RP" && (user.id_role === 1 || user.id_role === 6);
+    var _servicesData$filter = servicesData.filter(function (srv) {
+      return srv.id_retailer === (activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id) && srv.service === concept;
+    }),
+        _servicesData$filter2 = (0, _slicedToArray2.default)(_servicesData$filter, 1),
+        retailerStatus = _servicesData$filter2[0];
+
+    return (retailerStatus === null || retailerStatus === void 0 ? void 0 : retailerStatus.status) === "QF" && (user.id_role === 1 || user.id_role === 4 || user.id_role === 5) || (retailerStatus === null || retailerStatus === void 0 ? void 0 : retailerStatus.status) === "AF" && ( //sessionStorage product
+    user.id_role === 1 || user.id_role === 6) || (retailerStatus === null || retailerStatus === void 0 ? void 0 : retailerStatus.status) === "RP" && (user.id_role === 1 || user.id_role === 6) || (retailerStatus === null || retailerStatus === void 0 ? void 0 : retailerStatus.status) === "RC" && (user.id_role === 1 || user.id_role === 6);
   };
 
   var getSectionIcon = function getSectionIcon() {
@@ -800,369 +1067,692 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
     }
   };
 
-  var updateCompaniesList = function updateCompaniesList(status, result, retailerId, concept) {
-    var serv = servicesData.slice();
-    var item = serv.find(function (item) {
-      return item.id_retailer === retailerId && item.service === concept;
-    });
-    var index = serv.indexOf(item);
-
-    if (status === "IN_PROGRESS" || status === "QF" || status === "RF" || status === "RA") {
-      if (result === "A") {
-        if (activeTab === "Imágenes") {
-          serv.map(function (item) {
-            item.status = "AF";
-          });
-        } else {
-          serv[index].status = "AF";
-        }
-      } else if (result === "R") {
-        if (activeTab === "Imágenes") {
-          serv.map(function (item) {
-            item.status = "RF";
-          });
-        } else {
-          serv[index].status = "RF";
-        }
-      } else {
-        if (status === "IN_PROGRESS" || status === "ASSIGNED") {
-          serv.map(function (item) {
-            item.status = "QF";
-          });
-        } else {
-          serv.map(function (item) {
-            if (item.status === "RF" || item.status === "RA") {
-              item.status = "QF";
-            }
-
-            return item;
-          });
-        }
-      }
-    } else if (status === "AF" || status === "RP") {
-      if (result === "A") {
-        if (activeTab === "Imágenes") {
-          serv.map(function (item) {
-            item.status = "AA";
-          });
-        } else {
-          serv[index].status = "AA";
-        }
-      } else {
-        if (activeTab === "Imágenes") {
-          serv.map(function (item) {
-            item.status = "RA";
-          });
-        } else {
-          serv[index].status = "RA";
-        }
-      }
-    } //console.log(serv, "serv");
-
-
-    setServicesData(serv);
-  };
-
   var sendToFacilitator = /*#__PURE__*/function () {
     var _ref10 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee9(result) {
-      var concept, evalStatus, productTemp, specialistDone, data;
+      var concept, productTemp, evalStatus, data, specialistDone, statusArr, newStatus;
       return _regenerator.default.wrap(function _callee9$(_context9) {
         while (1) {
           switch (_context9.prev = _context9.next) {
             case 0:
-              console.log("exce");
-              concept = "";
-              _context9.t0 = activeTab;
-              _context9.next = _context9.t0 === "Descripción" ? 5 : _context9.t0 === "Ficha técnica" ? 7 : _context9.t0 === "Imágenes" ? 9 : 11;
-              break;
-
-            case 5:
-              concept = "description";
-              return _context9.abrupt("break", 12);
-
-            case 7:
-              concept = "datasheet";
-              return _context9.abrupt("break", 12);
-
-            case 9:
-              concept = "images";
-              return _context9.abrupt("break", 12);
-
-            case 11:
-              return _context9.abrupt("break", 12);
-
-            case 12:
-              evalStatus = "";
-              productTemp = (0, _objectSpread2.default)({}, productSelected);
-              evalStatus = productSelected["".concat(concept, "_status")];
-              specialistDone = evalStatus === "RF" || evalStatus === "RA" || evalStatus === "IN_PROGRESS";
-
-              if (specialistDone) {
-                setMessage("".concat(activeTab, " enviada a facilitador"));
-                getSectionIcon();
-                productTemp["".concat(concept, "_status")] = "QF";
-              } else if (evalStatus === "QF") {
-                setMessage("Evaluación enviada");
-                getSectionIcon();
-                productTemp["".concat(concept, "_status")] = "AF";
-              } else if (evalStatus === "AF") {
-                setMessage("Evaluación enviada");
-                getSectionIcon();
-                productTemp["".concat(concept, "_status")] = "AA";
-              } else if (evalStatus === "RP") {
-                setMessage("Evaluación enviada");
-                getSectionIcon();
-                productTemp["".concat(concept, "_status")] = "AA";
-              }
-
+              setLoading(true);
+              _context9.prev = 1;
+              concept = getConcept(activeTab);
+              productTemp = (0, _objectSpread2.default)({}, product);
+              evalStatus = product["".concat(concept, "_status")];
               data = {};
 
               if (!result) {
-                _context9.next = 25;
+                _context9.next = 13;
                 break;
               }
 
-              updateCompaniesList(evalStatus, result, activeRetailer.id, concept);
               data = {
-                articleId: productSelected.article.id_article,
-                orderId: productSelected.orderId,
+                articleId: product.article.id_article,
+                orderId: product.orderId,
                 concept: concept,
                 result: result,
                 evalStatus: evalStatus,
                 retailerId: activeRetailer.id
               };
-              _context9.next = 23;
+              _context9.next = 10;
               return _axios.default.put("".concat(process.env.REACT_APP_EVALUATION_ENDPOINT), data, {
                 headers: {
-                  Authorization: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmNTkyN2Y4ZS1jYmY3LTQ5MjItOWUwOS1lNjllYzBiMjczMWEiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6ImY1OTI3ZjhlLWNiZjctNDkyMi05ZTA5LWU2OWVjMGIyNzMxYSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIxYTk4MzZlNS1kMDYyLTQ4ZjQtYjY4Yi04NDZhZWEwMDFlMDIiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY0NjM1MzAyMywibmFtZSI6IklzbWFlbCBMb3BleiIsInBob25lX251bWJlciI6Iis1MjMxMTEzNjYzMzYiLCJleHAiOjE2NDYzNTY2MjMsImlhdCI6MTY0NjM1MzAyMywiZW1haWwiOiJpbG9wZXpAY29udGVudG9oLmNvbSJ9.LX6wMUK1eiE49heX3nVIMR4oRrWEaI-xyUErYx9_AWlxLn5jksbmmZmXujeaailxxcvaVQDYIbKSyrahwmqUohaDChM3TgDHCHTvAeiDGoVAFIjKyzk_wzttgVrKu5P_45bNrds7PVmLC981W8aVdQO32JklWhCpO_jEbtIgGeklQ6PF9yOd5TEWtq4kJTuYrbZpl21qnZ_wopbLSOz4Ty_OoIbvkFFcPV2jSBsMggQns3GqlHjlCLMtSN43IgQbuZ711BPWk6MMIFI48tl7HEC9rm1z1l0aejtn7ooiYKNsV2V__OL0Mi3ziDmoTDp3Ra02m0J176b99V17mFmj7A"
+                  Authorization: token
                 }
               });
 
-            case 23:
-              _context9.next = 38;
+            case 10:
+              getServices();
+              _context9.next = 31;
               break;
 
-            case 25:
+            case 13:
+              specialistDone = evalStatus === "RF" || evalStatus === "RA" || evalStatus === "IN_PROGRESS";
+
               if (specialistDone) {
-                updateCompaniesList(evalStatus, result, activeRetailer.id);
+                setMessage("".concat(activeTab, " enviada a facilitador"));
+                getSectionIcon();
+              } else if (evalStatus === "QF") {
+                setMessage("Evaluación enviada");
+                getSectionIcon();
+              } else if (evalStatus === "AF") {
+                setMessage("Evaluación enviada");
+                getSectionIcon();
+              } else if (evalStatus === "RP") {
+                setMessage("Evaluación enviada");
+                getSectionIcon();
+              } else if (evalStatus === "RC") {
+                setMessage("Evaluación enviada");
+                getSectionIcon();
               }
 
+              statusArr = [];
+              servicesData.forEach(function (srv) {
+                srv.service === concept && statusArr.push(srv.status);
+              });
+              productTemp["".concat(concept, "_status")] = (0, _data2.getNewStatus)(statusArr);
+              newStatus = (0, _data2.getNewStatus)([productTemp.datasheet_status, productTemp.description_status, productTemp.images_status]);
+              productTemp.status = newStatus;
               data = {
-                articleId: productSelected.article.id_article,
-                orderId: productSelected.orderId,
+                articleId: product.article.id_article,
+                orderId: product.orderId,
                 concept: concept,
                 evalStatus: evalStatus,
                 retailerId: activeRetailer.id
               };
-              _context9.t1 = user.id_role;
-              _context9.next = _context9.t1 === 7 ? 30 : _context9.t1 === 8 ? 30 : _context9.t1 === 4 ? 32 : _context9.t1 === 5 ? 32 : 34;
+              _context9.t0 = user.id_role;
+              _context9.next = _context9.t0 === 7 ? 24 : _context9.t0 === 8 ? 24 : _context9.t0 === 4 ? 26 : _context9.t0 === 5 ? 26 : 28;
               break;
 
-            case 30:
+            case 24:
               data.especialist = true;
-              return _context9.abrupt("break", 35);
+              return _context9.abrupt("break", 29);
 
-            case 32:
+            case 26:
               data.facilitator = true;
-              return _context9.abrupt("break", 35);
+              return _context9.abrupt("break", 29);
 
-            case 34:
-              return _context9.abrupt("break", 35);
+            case 28:
+              return _context9.abrupt("break", 29);
 
-            case 35:
-              _axios.default.put("".concat(process.env.REACT_APP_SEND_EVAL), data, {
+            case 29:
+              _context9.next = 31;
+              return _axios.default.put("".concat(process.env.REACT_APP_SEND_EVAL), data, {
                 headers: {
-                  Authorization: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmNTkyN2Y4ZS1jYmY3LTQ5MjItOWUwOS1lNjllYzBiMjczMWEiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6ImY1OTI3ZjhlLWNiZjctNDkyMi05ZTA5LWU2OWVjMGIyNzMxYSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIxYTk4MzZlNS1kMDYyLTQ4ZjQtYjY4Yi04NDZhZWEwMDFlMDIiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY0NjM1MzAyMywibmFtZSI6IklzbWFlbCBMb3BleiIsInBob25lX251bWJlciI6Iis1MjMxMTEzNjYzMzYiLCJleHAiOjE2NDYzNTY2MjMsImlhdCI6MTY0NjM1MzAyMywiZW1haWwiOiJpbG9wZXpAY29udGVudG9oLmNvbSJ9.LX6wMUK1eiE49heX3nVIMR4oRrWEaI-xyUErYx9_AWlxLn5jksbmmZmXujeaailxxcvaVQDYIbKSyrahwmqUohaDChM3TgDHCHTvAeiDGoVAFIjKyzk_wzttgVrKu5P_45bNrds7PVmLC981W8aVdQO32JklWhCpO_jEbtIgGeklQ6PF9yOd5TEWtq4kJTuYrbZpl21qnZ_wopbLSOz4Ty_OoIbvkFFcPV2jSBsMggQns3GqlHjlCLMtSN43IgQbuZ711BPWk6MMIFI48tl7HEC9rm1z1l0aejtn7ooiYKNsV2V__OL0Mi3ziDmoTDp3Ra02m0J176b99V17mFmj7A"
+                  Authorization: token
                 }
               });
 
+            case 31:
+              loadData();
+              sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
               setProduct(productTemp);
-              setModalSent(true);
+              _context9.next = 39;
+              break;
+
+            case 36:
+              _context9.prev = 36;
+              _context9.t1 = _context9["catch"](1);
+              console.log(_context9.t1);
+
+            case 39:
+              setLoading(false);
 
-            case 38:
+            case 40:
             case "end":
               return _context9.stop();
           }
         }
-      }, _callee9);
+      }, _callee9, null, [[1, 36]]);
     }));
 
-    return function sendToFacilitator(_x4) {
+    return function sendToFacilitator(_x) {
       return _ref10.apply(this, arguments);
     };
   }();
 
   var userAssigned = function userAssigned(tab, rol) {
-    var concept = "";
-
-    switch (tab) {
-      case "Ficha técnica":
-        concept = "datasheet";
-        break;
-
-      case "Imágenes":
-        concept = "images";
-        break;
-
-      default:
-        concept = "description";
-        break;
+    var concept = getConcept(activeTab);
+    var allowedRoles = [1, 4, 5, 6, 7, 8];
+    var validUser = allowedRoles.includes(user === null || user === void 0 ? void 0 : user.id_role);
+
+    if (!rol) {
+      switch (user.id_role) {
+        case 4:
+        case 5:
+          rol = "facilitator";
+          break;
+
+        case 7:
+        case 8:
+          rol = "especialist";
+          break;
+      }
     }
 
-    var allowedRoles = [1, 4, 5, 6, 7, 8];
-    var validUser = allowedRoles.indexOf(user === null || user === void 0 ? void 0 : user.id_role) !== -1;
-    return productSelected.article["id_".concat(concept, "_").concat(rol)] === user.id_user && validUser;
+    return user.id_role === 1 || product.article["id_".concat(concept, "_").concat(rol)] === user.id_user && validUser;
   };
 
   var auditorAssigned = function auditorAssigned() {
-    return (productSelected === null || productSelected === void 0 ? void 0 : productSelected.article["id_auditor"]) === user.id_user;
+    return (product === null || product === void 0 ? void 0 : product.article["id_auditor"]) === user.id_user;
   };
 
-  function specialistValid(tab) {
-    var concept = "";
+  var createComment = /*#__PURE__*/function () {
+    var _ref11 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee10(e, body, tab) {
+      var _product$article11;
 
-    switch (tab) {
-      case "Ficha técnica":
-        concept = "datasheet";
-        break;
+      var concept, data;
+      return _regenerator.default.wrap(function _callee10$(_context10) {
+        while (1) {
+          switch (_context10.prev = _context10.next) {
+            case 0:
+              concept = "";
+              _context10.t0 = activeTab;
+              _context10.next = _context10.t0 === "Ficha técnica" ? 4 : _context10.t0 === "Imágenes" ? 6 : 8;
+              break;
 
-      case "Imágenes":
-        concept = "images";
-        break;
+            case 4:
+              concept = "datasheet";
+              return _context10.abrupt("break", 10);
 
-      default:
-        concept = "description";
-        break;
-    }
+            case 6:
+              concept = "images";
+              return _context10.abrupt("break", 10);
 
-    return product["".concat(concept, "_status")] === "IN_PROGRESS" || product["".concat(concept, "_status")] === "RF" || product["".concat(concept, "_status")] === "RA";
-  }
+            case 8:
+              concept = "description";
+              return _context10.abrupt("break", 10);
 
-  function versionMatch() {
-    return (productSelected === null || productSelected === void 0 ? void 0 : productSelected.version) === version;
-  }
+            case 10:
+              data = {
+                articleId: product === null || product === void 0 ? void 0 : (_product$article11 = product.article) === null || _product$article11 === void 0 ? void 0 : _product$article11.id_article,
+                orderId: product === null || product === void 0 ? void 0 : product.orderId,
+                message: body,
+                concept: concept,
+                version: version
+              };
+              _context10.next = 13;
+              return _axios.default.post("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT), data, {
+                headers: {
+                  Authorization: token
+                }
+              });
 
-  (0, _react.useEffect)(function () {// let concept = "";
-    // switch (activeTab) {
-    //   case "Ficha técnica":
-    //     concept = "datasheet";
-    //     break;
-    //   case "Imágenes":
-    //     concept = "images";
-    //     break;
-    //   default:
-    //     concept = "description";
-    //     break;
-    // }
-    // getComments(concept);
+            case 13:
+              _context10.next = 15;
+              return getComments(tab);
+
+            case 15:
+              setMessage("");
+              setComponentsArray([]);
+
+            case 17:
+            case "end":
+              return _context10.stop();
+          }
+        }
+      }, _callee10);
+    }));
+
+    return function createComment(_x2, _x3, _x4) {
+      return _ref11.apply(this, arguments);
+    };
+  }();
+
+  var getRequired = function getRequired(services) {
+    try {
+      var _services$4, _services$4$retailerM, _services$5, _services$5$inputs;
+
+      var objetcTemp = {};
+      var datasheetServicesArray = Object.values(services[0]);
+      var dsInputs = datasheetServicesArray.pop();
+      var descriptionsServicesArray = services[1];
+      var dsInputsRequired = [];
+      var desInputsRequired = 0;
+      datasheetServicesArray === null || datasheetServicesArray === void 0 ? void 0 : datasheetServicesArray.forEach(function (datasheet) {
+        var _servicesData$filter3 = servicesData === null || servicesData === void 0 ? void 0 : servicesData.filter(function (srv) {
+          return srv.id_retailer === datasheet.retailer.id && srv.service === getConcept(activeTab);
+        }),
+            _servicesData$filter4 = (0, _slicedToArray2.default)(_servicesData$filter3, 1),
+            requested = _servicesData$filter4[0];
+
+        requested && (datasheet === null || datasheet === void 0 ? void 0 : datasheet.data) && Object.values(datasheet === null || datasheet === void 0 ? void 0 : datasheet.data).forEach(function (dataGroup) {
+          return dsInputsRequired.push.apply(dsInputsRequired, (0, _toConsumableArray2.default)(dataGroup.inputs.filter(function (input) {
+            return dsInputs[input].required && (dsInputs[input].value === undefined || !dsInputs[input].value);
+          })));
+        });
+      });
+      objetcTemp["Ficha técnica"] = dsInputsRequired.length;
+      descriptionsServicesArray.forEach(function (description) {
+        var _servicesData$filter5 = servicesData.filter(function (srv) {
+          return srv.id_retailer === description.id && srv.service === getConcept(activeTab);
+        }),
+            _servicesData$filter6 = (0, _slicedToArray2.default)(_servicesData$filter5, 1),
+            requested = _servicesData$filter6[0];
+
+        requested && description.inputs.forEach(function (input) {
+          return input.required && (!input.value || input.value.replace(/(<\/?p>)|(<\/?strong>)|(<br>)/gm, "") === "") && desInputsRequired++;
+        });
+      });
+      objetcTemp["Descripción"] = desInputsRequired;
+      var retailersRequested = [];
+      (_services$4 = services[2]) === null || _services$4 === void 0 ? void 0 : (_services$4$retailerM = _services$4.retailerMandatories) === null || _services$4$retailerM === void 0 ? void 0 : _services$4$retailerM.forEach(function (retMan) {
+        return retMan.forEach(function (rm) {
+          return retailersRequested.push(rm);
+        });
+      });
+      var requiredImages = (_services$5 = services[2]) === null || _services$5 === void 0 ? void 0 : (_services$5$inputs = _services$5.inputs) === null || _services$5$inputs === void 0 ? void 0 : _services$5$inputs.filter(function (e) {
+        return e.required === 1 && retailersRequested.filter(function (ret) {
+          return ret.id_image === e.id && servicesData.filter(function (srv) {
+            return srv.id_retailer === ret.id_retailer;
+          }).length > 0;
+        }).length > 0;
+      });
+      var requiredCounter = 0;
+      requiredImages === null || requiredImages === void 0 ? void 0 : requiredImages.forEach(function (req) {
+        return services[2].values.filter(function (img) {
+          return img.image_id === req.id;
+        }).length === 0 && requiredCounter++;
+      });
+      objetcTemp["Imágenes"] = requiredCounter;
+      setRequiredNull(objetcTemp);
+    } catch (error) {
+      console.log(error);
+    }
+  };
+
+  (0, _react.useEffect)(function () {
+    setComment(comments[activeTab]);
   }, [activeTab]);
-  return /*#__PURE__*/React.createElement(_styles.Container, {
-    headerTop: headerTop
-  }, /*#__PURE__*/React.createElement(_HeaderTop.HeaderTop, {
-    setHeaderTop: setHeaderTop
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "data-container"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "image-data-panel"
-  }, /*#__PURE__*/React.createElement(_ImagePreviewer.ImagePreviewer, {
-    activeImage: images !== null && images !== void 0 && images.values ? images === null || images === void 0 ? void 0 : images.values[activeImage] : {},
-    imagesArray: images,
-    setActiveImage: setActiveImage,
-    setShowModal: setShowModal
-  }), /*#__PURE__*/React.createElement(_ImageDataTable.ImageDataTable, {
-    lists: images,
-    activeImage: images !== null && images !== void 0 && images.values ? images === null || images === void 0 ? void 0 : images.values[activeImage] : {},
-    retailerSelected: activeRetailer.id,
-    setImages: setImages,
-    assignationsImages: [productSelected.article.id_images_especialist, productSelected.article.id_images_facilitator],
-    imagesStatus: productSelected === null || productSelected === void 0 ? void 0 : productSelected.images_status
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "product-information"
-  }, /*#__PURE__*/React.createElement(_FullProductNameHeader.FullProductNameHeader, {
-    headerData: product,
-    percent: activePercentage,
-    activeRetailer: activeRetailer,
-    setActiveRetailer: setActiveRetailer,
-    approveRejectButtons: approveRejectButtons,
-    sendToFacilitator: sendToFacilitator,
-    auditorAssigned: auditorAssigned,
-    userAssigned: userAssigned(activeTab, "facilitator")
-  }), /*#__PURE__*/React.createElement(_FullTabsMenu.FullTabsMenu, {
-    tabsSections: tabsSections,
-    status: {
-      Descripción: (_servicesData$filter$ = servicesData.filter(function (service) {
-        return service.id_retailer === (activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id) && service.service === "description";
-      })[0]) === null || _servicesData$filter$ === void 0 ? void 0 : _servicesData$filter$.status,
-      "Ficha técnica": (_servicesData$filter$2 = servicesData.filter(function (service) {
-        return service.id_retailer === (activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id) && service.service === "datasheet";
-      })[0]) === null || _servicesData$filter$2 === void 0 ? void 0 : _servicesData$filter$2.status,
-      Imágenes: product === null || product === void 0 ? void 0 : product.images_status
-    },
-    profileImage: productData.asigned,
-    activeTab: activeTab,
-    setActiveTab: setActiveTab,
-    setImageLayout: setImageLayout,
-    saveDescriptions: saveDescriptions,
-    saveDatasheets: saveDatasheets,
-    updateImages: updateImages,
-    assignations: {
-      Descripción: [productSelected.article.id_description_especialist, productSelected.article.id_description_facilitator],
-      "Ficha técnica": [productSelected.article.id_datasheet_especialist, productSelected.article.id_datasheet_facilitator],
-      Imágenes: [productSelected.article.id_images_especialist, productSelected.article.id_images_facilitator]
+
+  var commentRevised = /*#__PURE__*/function () {
+    var _ref12 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee11() {
+      var data;
+      return _regenerator.default.wrap(function _callee11$(_context11) {
+        while (1) {
+          switch (_context11.prev = _context11.next) {
+            case 0:
+              data = {
+                commentId: comment.id
+              };
+              _context11.next = 3;
+              return _axios.default.put("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT), data, {
+                headers: {
+                  Authorization: sessionStorage.getItem("jwt")
+                }
+              });
+
+            case 3:
+              setCrossComment(false);
+              _context11.next = 6;
+              return getComments();
+
+            case 6:
+            case "end":
+              return _context11.stop();
+          }
+        }
+      }, _callee11);
+    }));
+
+    return function commentRevised() {
+      return _ref12.apply(this, arguments);
+    };
+  }();
+
+  var setAssignation = /*#__PURE__*/function () {
+    var _ref13 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee12(assignationType, assignationId) {
+      var _product$article12;
+
+      var concept, productTemp, data;
+      return _regenerator.default.wrap(function _callee12$(_context12) {
+        while (1) {
+          switch (_context12.prev = _context12.next) {
+            case 0:
+              concept = "";
+              _context12.t0 = activeTab;
+              _context12.next = _context12.t0 === "Ficha técnica" ? 4 : _context12.t0 === "Imágenes" ? 6 : 8;
+              break;
+
+            case 4:
+              concept = "datasheet";
+              return _context12.abrupt("break", 10);
+
+            case 6:
+              concept = "images";
+              return _context12.abrupt("break", 10);
+
+            case 8:
+              concept = "description";
+              return _context12.abrupt("break", 10);
+
+            case 10:
+              productTemp = product;
+              productTemp.article["id_".concat(concept, "_").concat(assignationType)] = assignationId;
+              data = (0, _defineProperty2.default)({
+                articleList: [{
+                  orderId: product.orderId,
+                  articleId: product === null || product === void 0 ? void 0 : (_product$article12 = product.article) === null || _product$article12 === void 0 ? void 0 : _product$article12.id_article
+                }],
+                concept: concept
+              }, "".concat(assignationType, "Id"), assignationId);
+              (0, _axios.default)({
+                method: "post",
+                url: process.env.REACT_APP_ASSIGNATIONS_ENDPOINT,
+                data: data,
+                headers: {
+                  Authorization: token
+                }
+              });
+              loadAssignations(productTemp);
+              sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
+
+            case 16:
+            case "end":
+              return _context12.stop();
+          }
+        }
+      }, _callee12);
+    }));
+
+    return function setAssignation(_x5, _x6) {
+      return _ref13.apply(this, arguments);
+    };
+  }();
+
+  var downloadImages = function downloadImages() {
+    selectedImages.forEach(function (e) {
+      if (e.id) {
+        (0, _fileSaver.saveAs)("https://".concat(process.env.REACT_APP_IMAGES_BUCKET, ".s3.amazonaws.com/").concat(e.srcDB), "".concat(product.article.upc, "_").concat(e.name, ".").concat(e.ext));
+      }
+    });
+  };
+
+  var deleteImages = function deleteImages() {
+    setLoading(true);
+    var values = images.values;
+    var imgsInBack = [];
+    selectedImages.forEach(function (selectedImg) {
+      if (selectedImg.id) imgsInBack.push(selectedImg);
+    });
+    var imgsLeft = values.filter(function (value) {
+      return selectedImages.indexOf(value) === -1;
+    });
+
+    if (imgsInBack.length > 0) {
+      var data = {
+        articleId: product.article.id_article,
+        deleteImages: imgsInBack,
+        orderId: product.orderId
+      };
+
+      try {
+        _axios.default.put("".concat(process.env.REACT_APP_ARTICLE_DATA_ENDPOINT, "?image=true&version=").concat(version), data, {
+          headers: {
+            Authorization: token
+          }
+        });
+      } catch (err) {
+        console.log(err);
+      }
     }
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "services-information-container " + (imageLayout && activeTab === "Imágenes" ? "image-services" : "")
-  }, !imageLayout && /*#__PURE__*/React.createElement(_GalleryHeader.GalleryHeader, null), activeTab === "Ficha técnica" && ((product === null || product === void 0 ? void 0 : (_product$services = product.services) === null || _product$services === void 0 ? void 0 : _product$services.datasheets) === 1 ? (_datasheets$ = datasheets[0]) === null || _datasheets$ === void 0 ? void 0 : (_datasheets$$data = _datasheets$.data) === null || _datasheets$$data === void 0 ? void 0 : _datasheets$$data.map(function (dataGroup, index) {
-    return /*#__PURE__*/React.createElement(_InputGroup.InputGroup, {
-      key: index + "-" + activeRetailer.name,
-      articleId: productSelected.article.id_article,
-      version: version,
-      activeSection: activeTab,
-      inputGroup: dataGroup,
-      dataInputs: datasheets[1],
-      updatedDatasheets: updatedDatasheets,
-      setUpdatedDatasheets: setUpdatedDatasheets
+
+    setImages({
+      action: "deleteImage",
+      selectedImages: selectedImages
     });
-  }) : /*#__PURE__*/React.createElement("p", null, "no tienes este servicio")), activeTab === "Descripción" && ((product === null || product === void 0 ? void 0 : (_product$services2 = product.services) === null || _product$services2 === void 0 ? void 0 : _product$services2.descriptions) === 1 ? /*#__PURE__*/React.createElement(_InputGroup.InputGroup, {
-    activeSection: activeTab,
-    inputGroup: descriptions[0],
-    updatedDescriptions: updatedDescriptions,
-    setUpdatedDescriptions: setUpdatedDescriptions,
-    articleId: articleId,
-    version: version,
-    dinamicHeight: true
-  }) : /*#__PURE__*/React.createElement("p", null, "no tienes este servicio")), activeTab === "Imágenes" && ((product === null || product === void 0 ? void 0 : (_product$services3 = product.services) === null || _product$services3 === void 0 ? void 0 : _product$services3.images) === 1 ? /*#__PURE__*/React.createElement("section", {
-    className: "container"
-  }, /*#__PURE__*/React.createElement("div", getRootProps({
-    className: "dropzone"
-  }), /*#__PURE__*/React.createElement("input", getInputProps()), /*#__PURE__*/React.createElement("aside", null, thumbs()))) : /*#__PURE__*/React.createElement("p", null, "no tienes este servicio"))), (userAssigned(activeTab, "especialist" || "facilitator") || auditorAssigned()) && /*#__PURE__*/React.createElement("div", {
-    className: "commentary-box"
-  }, !comments[activeTab] ? /*#__PURE__*/React.createElement("div", {
-    className: "commentary"
-  }, /*#__PURE__*/React.createElement(_index.TagAndInput, {
-    label: "Caja de Comentario",
-    inputType: "textarea",
-    inputCols: 80,
-    inputRows: 4
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "buttons-box"
-  }, /*#__PURE__*/React.createElement(_GeneralButton.Button, {
-    buttonType: "general-transparent-button",
-    label: "Enviar comentario"
-  }), /*#__PURE__*/React.createElement(_GeneralButton.Button, {
-    buttonType: requiredNull !== 0 || !specialistValid(activeTab) || !versionMatch() ? "general-button-disabled" : "general-green-button",
-    label: "Enviar evaluación",
-    onClick: function onClick() {
-      return sendToFacilitator();
+    getRequired([services[0], services[1], (0, _objectSpread2.default)((0, _objectSpread2.default)({}, services[2]), {}, {
+      values: imgsLeft
+    })]);
+    setTimeout(function () {
+      setLoading(false);
+    }, 500);
+    setMessage("");
+    setComponentsArray([]);
+  };
+
+  var askToDeleteImages = function askToDeleteImages() {
+    if (selectedImages.length > 0) {
+      setMessage("¿Está seguro de eliminar las imágenes seleccionadas?");
+      setComponentsArray([/*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+        text: "¿Está seguro de eliminar las imágenes seleccionadas?",
+        headerType: "retailer-name-header",
+        color: "white"
+      }, "1"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+        buttonType: "general-white-button",
+        label: "Cancelar",
+        onClick: function onClick() {
+          return setMessage("");
+        }
+      }, "2"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+        buttonType: "general-button-default",
+        label: "Aceptar",
+        onClick: function onClick() {
+          setMessage("");
+          deleteImages();
+        }
+      }, "3")]);
     }
-  }))) : /*#__PURE__*/React.createElement(_Commentary.Commentary, {
-    comment: comments[activeTab].message
-  })))), showModal && /*#__PURE__*/React.createElement(_ProductImageModal.ProductImageModal, {
-    images: images,
-    setShowModal: setShowModal,
-    sendToFacilitator: sendToFacilitator,
-    approveRejectButtons: approveRejectButtons
-  }));
+  };
+
+  var getRetailerStatus = function getRetailerStatus(servicesData, tab) {
+    var arr = servicesData === null || servicesData === void 0 ? void 0 : servicesData.slice();
+    var concept = getConcept(tab);
+    var retailerService = {};
+
+    var _arr$filter = arr === null || arr === void 0 ? void 0 : arr.filter(function (service) {
+      return service.id_retailer === (activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id) && service.service === concept;
+    });
+
+    var _arr$filter2 = (0, _slicedToArray2.default)(_arr$filter, 1);
+
+    retailerService = _arr$filter2[0];
+    return retailerService ? retailerService.status : "NS";
+  };
+
+  (0, _react.useEffect)(function () {
+    var status = getRetailerStatus(servicesData, activeTab);
+    setRetailerStatus(status);
+  }, [activeTab, servicesData, activeRetailer]);
+  (0, _react.useEffect)(function () {
+    services.length > 0 && getRequired(services);
+  }, [services, servicesData, activeTab]);
+  (0, _react.useEffect)(function () {
+    setSaving(loading);
+  }, [loading]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    headerTop: headerTop,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTop.HeaderTop, {
+      setHeaderTop: setHeaderTop
+    }), /*#__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: images !== null && images !== void 0 && images.values ? images === null || images === void 0 ? void 0 : images.values[activeImage] : {},
+          imagesArray: images,
+          setActiveImage: setActiveImage,
+          setShowModal: setShowModal
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImageDataTable.ImageDataTable, {
+          lists: images,
+          activeImage: images !== null && images !== void 0 && images.values ? images === null || images === void 0 ? void 0 : images.values[activeImage] : {},
+          retailerSelected: activeRetailer === null || activeRetailer === void 0 ? void 0 : activeRetailer.id,
+          setImages: setImages,
+          assignationsImages: assig["Imágenes"],
+          imagesStatus: product === null || product === void 0 ? void 0 : product.images_status,
+          setAssignation: setAssignation,
+          isRetailer: isRetailer,
+          onClickSave: function onClickSave() {
+            var _product$services;
+
+            return (product === null || product === void 0 ? void 0 : (_product$services = product.services) === null || _product$services === void 0 ? void 0 : _product$services.images) === 1 && updateImages();
+          },
+          showSaveButton: userAssigned()
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "product-information",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FullProductNameHeader.FullProductNameHeader, {
+          headerData: product,
+          percent: activePercentage,
+          activeRetailer: activeRetailer,
+          servicesData: servicesData,
+          setActiveRetailer: setActiveRetailer,
+          sendToFacilitator: sendToFacilitator,
+          approve: function approve() {
+            sendToFacilitator("A");
+          },
+          reject: function reject() {
+            sendToFacilitator("R");
+            setMessage("Rechazado");
+            setComponentsArray([/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+              src: _errorModal.default
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+              text: "Agrega tu comentarios para enviar el rechazo",
+              headerType: "input-name-header",
+              color: "white"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
+              label: "Caja de Comentario",
+              inputType: "textarea",
+              inputId: "modal-commentary-box",
+              index: 0,
+              color: "white"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+              buttonType: "general-default-button",
+              label: "Enviar comentario",
+              onClick: function onClick(e) {
+                return createComment(e, document.querySelector("#modal-commentary-box .ql-container .ql-editor > p").innerHTML, activeTab);
+              }
+            })]);
+          },
+          showValidationButtons: approveRejectButtons() && (auditorAssigned() || userAssigned())
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullTabsMenu.FullTabsMenu, {
+          tabsSections: tabsSections,
+          status: retailerStatus,
+          activeTab: activeTab,
+          setActiveTab: setActiveTab,
+          setImageLayout: setImageLayout,
+          downloadImages: downloadImages,
+          askToDeleteImages: askToDeleteImages,
+          assig: assig[activeTab],
+          setAssignation: setAssignation,
+          isRetailer: isRetailer,
+          showSaveButton: userAssigned(),
+          onClickSave: function onClickSave() {
+            switch (activeTab) {
+              case "Descripción":
+                !saving && (product === null || product === void 0 ? void 0 : product.description_status) !== "NS" && saveDescriptions();
+                break;
+
+              case "Ficha técnica":
+                !saving && (product === null || product === void 0 ? void 0 : product.datasheet_status) !== "NS" && saveDatasheets();
+                break;
+
+              case "Imágenes":
+                !saving && (product === null || product === void 0 ? void 0 : product.images_status) !== "NS" && updateImages();
+                break;
+
+              default:
+                break;
+            }
+          }
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "services-information-container " + (imageLayout && activeTab === "Imágenes" ? "image-services" : ""),
+          children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.Loading, {}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [!imageLayout && activeTab === "Imágenes" && (product === null || product === void 0 ? void 0 : (_product$services2 = product.services) === null || _product$services2 === void 0 ? void 0 : _product$services2.images) === 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GalleryHeader.GalleryHeader, {
+              setSelectedImages: setSelectedImages,
+              checkAll: checkAll,
+              setCheckAll: setCheckAll
+            }), activeTab === "Ficha técnica" && ((product === null || product === void 0 ? void 0 : product.datasheet_status) !== "NS" ? (_datasheets$ = datasheets[0]) === null || _datasheets$ === void 0 ? void 0 : (_datasheets$$data = _datasheets$.data) === null || _datasheets$$data === void 0 ? void 0 : _datasheets$$data.map(function (dataGroup, index) {
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
+                articleId: product.article.id_article,
+                version: version,
+                activeSection: activeTab,
+                inputGroup: dataGroup,
+                dataInputs: datasheets[1],
+                updatedDatasheets: updatedDatasheets,
+                setUpdatedDatasheets: setUpdatedDatasheets
+              }, index + "-" + activeRetailer.name);
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+              text: "No cuentas con este servicio",
+              headerType: "input-name-header"
+            })), activeTab === "Descripción" && ((product === null || product === void 0 ? void 0 : product.description_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
+              activeSection: activeTab,
+              inputGroup: descriptions[0],
+              updatedDescriptions: updatedDescriptions,
+              setUpdatedDescriptions: setUpdatedDescriptions,
+              articleId: product === null || product === void 0 ? void 0 : (_product$article13 = product.article) === null || _product$article13 === void 0 ? void 0 : _product$article13.id_article,
+              version: version,
+              dinamicHeight: true
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+              text: "No cuentas con este servicio",
+              headerType: "input-name-header"
+            })), activeTab === "Imágenes" && ((product === null || product === void 0 ? void 0 : product.images_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)("section", {
+              className: "container",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, getRootProps({
+                className: "dropzone"
+              })), {}, {
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", (0, _objectSpread2.default)({}, getInputProps())), /*#__PURE__*/(0, _jsxRuntime.jsx)("aside", {
+                  children: thumbs()
+                })]
+              }))
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+              text: "No cuentas con este servicio",
+              headerType: "input-name-header"
+            }))]
+          })
+        }), (userAssigned(activeTab) || auditorAssigned()) && product["".concat(getConcept(activeTab), "_status")] !== "NS" && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "commentary-box",
+          children: [!comment ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: "commentary",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
+              label: "Caja de Comentario",
+              inputType: "textarea",
+              inputCols: 80,
+              inputRows: 4,
+              inputId: "commentary-box",
+              index: 0
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "buttons-box",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+                buttonType: "general-transparent-button",
+                label: "Enviar comentario",
+                onClick: function onClick(e) {
+                  return createComment(e, document.querySelector("#commentary-box .ql-container .ql-editor > p").innerHTML, activeTab);
+                }
+              })
+            })]
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: "feedback-box",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Commentary.Commentary, {
+              comment: comment.message,
+              reviewed: crossComment
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+              buttonType: "circular-button accept-button",
+              onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee13() {
+                return _regenerator.default.wrap(function _callee13$(_context13) {
+                  while (1) {
+                    switch (_context13.prev = _context13.next) {
+                      case 0:
+                        setCrossComment(true);
+                        commentRevised();
+
+                      case 2:
+                      case "end":
+                        return _context13.stop();
+                    }
+                  }
+                }, _callee13);
+              }))
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+            buttonType: evaluationFinished(user.id_role, activeTab, statusArray) && requiredNull[activeTab] === 0 ? "general-green-button" : "general-button-disabled",
+            label: "Enviar evaluación",
+            onClick: function onClick() {
+              return sendToFacilitator();
+            }
+          })]
+        })]
+      })]
+    }), showModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductImageModal.ProductImageModal, {
+      images: images,
+      setShowModal: setShowModal,
+      sendToFacilitator: sendToFacilitator,
+      approveRejectButtons: approveRejectButtons
+    }), message.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GenericModal.GenericModal, {
+      buttonType: componentsArray.length > 0 && "delete-product",
+      componentsArray: componentsArray.length > 0 ? componentsArray : [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+        src: _genericModalCheck.default,
+        alt: "success icon"
+      }, "1"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+        headerType: "retailer-name-header",
+        text: message,
+        color: "white"
+      }, "2")],
+      onClick: function onClick() {
+        return setMessage("");
+      }
+    })]
+  });
 };
 
 exports.RetailerProductEdition = RetailerProductEdition;