contentoh-components-library 21.4.123 → 21.4.124

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

@@ -37,7 +37,7 @@ var _GalleryElement = require("../../molecules/GalleryElement");
 
 var _fileSaver = require("file-saver");
 
-var _data2 = require("../../../global-files/data");
+var _data = require("../../../global-files/data");
 
 var _GalleryHeader = require("../../molecules/GalleryHeader");
 
@@ -61,6 +61,8 @@ var _index = require("../../molecules/TagAndInput/index");
 
 var _GeneralButton = require("../../atoms/GeneralButton");
 
+var _Commentary = require("../../atoms/Commentary");
+
 var _GenericModal = require("../../atoms/GenericModal");
 
 var _ScreenHeader = require("../../atoms/ScreenHeader");
@@ -69,16 +71,14 @@ var _Loading = require("../../atoms/Loading");
 
 var _genericModalCheck = _interopRequireDefault(require("../../../assets/images/genericModal/genericModalCheck.svg"));
 
+var _errorModal = _interopRequireDefault(require("../../../assets/images/genericModal/errorModal.svg"));
+
 var _VersionSelector = require("../../organisms/VersionSelector");
 
 var _customHooks = require("../../../global-files/customHooks");
 
 var _utils = require("./utils");
 
-var _Modal = require("../../organisms/Modal");
-
-var _ButtonV = require("../../atoms/ButtonV2");
-
 var _jsxRuntime = require("react/jsx-runtime");
 
 var reducerImages = function reducerImages(state, action) {
@@ -202,7 +202,7 @@ var myBucket = new _awsSdk.default.S3({
 });
 
 var RetailerProductEdition = function RetailerProductEdition(_ref) {
-  var _product$retailers, _location$state, _location$state2, _product$services2, _datasheets$, _datasheets$$data, _product$article17;
+  var _product$retailers, _location$state, _product$services2, _datasheets$, _datasheets$$data, _product$article18, _comment$message;
 
   var tabsSections = _ref.tabsSections,
       _ref$productSelected = _ref.productSelected,
@@ -252,11 +252,6 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       showModal = _useState14[0],
       setShowModal = _useState14[1];
 
-  var _useState15 = (0, _react.useState)(false),
-      _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
-      showRejectModal = _useState16[0],
-      setShowRejectModal = _useState16[1];
-
   var _useDropzone = (0, _reactDropzone.useDropzone)({
     accept: "image/*",
     noKeyboard: true,
@@ -301,149 +296,149 @@ 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];
-
-  var _useState23 = (0, _react.useState)(),
-      _useState24 = (0, _slicedToArray2.default)(_useState23, 2),
-      dataImages = _useState24[0],
-      setDataImages = _useState24[1];
+      dataImages = _useState22[0],
+      setDataImages = _useState22[1];
 
-  var _useState25 = (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({
+  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
   })),
-      _useState26 = (0, _slicedToArray2.default)(_useState25, 2),
-      percentages = _useState26[0],
-      setPercentages = _useState26[1]; // const [percentages, setPercentages] = useState([{ retailers: {} }]);
+      _useState24 = (0, _slicedToArray2.default)(_useState23, 2),
+      percentages = _useState24[0],
+      setPercentages = _useState24[1]; // const [percentages, setPercentages] = useState([{ retailers: {} }]);
+
 
+  var _useState25 = (0, _react.useState)(0),
+      _useState26 = (0, _slicedToArray2.default)(_useState25, 2),
+      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)(JSON.parse(sessionStorage.getItem("productSelected")) ? JSON.parse(sessionStorage.getItem("productSelected")) : productSelected),
+  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)(product === null || product === void 0 ? void 0 : product.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)(""),
-      _useState46 = (0, _slicedToArray2.default)(_useState45, 2),
-      comment = _useState46[0],
-      setComment = _useState46[1];
-
-  var _useState47 = (0, _react.useState)({
+  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),
-      requiredNull = _useState48[0],
-      setRequiredNull = _useState48[1];
+      crossComment = _useState48[0],
+      setCrossComment = _useState48[1];
 
-  var _useState49 = (0, _react.useState)(false),
+  var _useState49 = (0, _react.useState)([]),
       _useState50 = (0, _slicedToArray2.default)(_useState49, 2),
-      crossComment = _useState50[0],
-      setCrossComment = _useState50[1];
+      userGroups = _useState50[0],
+      setUserGroups = _useState50[1];
 
-  var _useState51 = (0, _react.useState)([]),
+  var _useState51 = (0, _react.useState)({}),
       _useState52 = (0, _slicedToArray2.default)(_useState51, 2),
-      userGroups = _useState52[0],
-      setUserGroups = _useState52[1];
+      assig = _useState52[0],
+      setAssig = _useState52[1];
 
-  var _useState53 = (0, _react.useState)({}),
+  var _useState53 = (0, _react.useState)([]),
       _useState54 = (0, _slicedToArray2.default)(_useState53, 2),
-      assig = _useState54[0],
-      setAssig = _useState54[1];
+      selectedImages = _useState54[0],
+      setSelectedImages = _useState54[1];
 
   var _useState55 = (0, _react.useState)([]),
       _useState56 = (0, _slicedToArray2.default)(_useState55, 2),
-      selectedImages = _useState56[0],
-      setSelectedImages = _useState56[1];
+      componentsArray = _useState56[0],
+      setComponentsArray = _useState56[1];
 
-  var _useState57 = (0, _react.useState)([]),
+  var _useState57 = (0, _react.useState)(false),
       _useState58 = (0, _slicedToArray2.default)(_useState57, 2),
-      componentsArray = _useState58[0],
-      setComponentsArray = _useState58[1];
-
-  var _useState59 = (0, _react.useState)(false),
-      _useState60 = (0, _slicedToArray2.default)(_useState59, 2),
-      checkAll = _useState60[0],
-      setCheckAll = _useState60[1];
+      checkAll = _useState58[0],
+      setCheckAll = _useState58[1];
 
   var isRetailer = user === null || user === void 0 ? void 0 : user.is_retailer;
 
-  var _useState61 = (0, _react.useState)(true),
+  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),
-      loading = _useState62[0],
-      setLoading = _useState62[1];
+      retailerStatus = _useState62[0],
+      setRetailerStatus = _useState62[1];
 
-  var _useState63 = (0, _react.useState)("-"),
+  var _useState63 = (0, _react.useState)([]),
       _useState64 = (0, _slicedToArray2.default)(_useState63, 2),
-      retailerStatus = _useState64[0],
-      setRetailerStatus = _useState64[1];
+      statusArray = _useState64[0],
+      setStatusArray = _useState64[1];
 
-  var _useState65 = (0, _react.useState)([]),
+  var _useState65 = (0, _react.useState)(null),
       _useState66 = (0, _slicedToArray2.default)(_useState65, 2),
-      statusArray = _useState66[0],
-      setStatusArray = _useState66[1];
+      socketType = _useState66[0],
+      setSocketType = _useState66[1];
 
-  var _useState67 = (0, _react.useState)(null),
+  var _useState67 = (0, _react.useState)(loading),
       _useState68 = (0, _slicedToArray2.default)(_useState67, 2),
-      socketType = _useState68[0],
-      setSocketType = _useState68[1];
-
-  var _useState69 = (0, _react.useState)(loading),
-      _useState70 = (0, _slicedToArray2.default)(_useState69, 2),
-      saving = _useState70[0],
-      setSaving = _useState70[1];
+      saving = _useState68[0],
+      setSaving = _useState68[1];
 
   var _useCloseModal = (0, _customHooks.useCloseModal)("version-selector"),
       _useCloseModal2 = (0, _slicedToArray2.default)(_useCloseModal, 2),
@@ -452,88 +447,35 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
 
   var shotThd = [58, 59, 60, 61].includes(activeRetailer.id);
 
-  var _useState71 = (0, _react.useState)(null),
+  var _useState69 = (0, _react.useState)(null),
+      _useState70 = (0, _slicedToArray2.default)(_useState69, 2),
+      auditableVersion = _useState70[0],
+      setAuditableVersion = _useState70[1];
+
+  var _useState71 = (0, _react.useState)([]),
       _useState72 = (0, _slicedToArray2.default)(_useState71, 2),
-      auditableVersion = _useState72[0],
-      setAuditableVersion = _useState72[1];
+      auditServices = _useState72[0],
+      setAuditServices = _useState72[1];
 
   var _useState73 = (0, _react.useState)([]),
       _useState74 = (0, _slicedToArray2.default)(_useState73, 2),
-      auditServices = _useState74[0],
-      setAuditServices = _useState74[1];
+      auditDatasheets = _useState74[0],
+      setAuditDatasheets = _useState74[1];
 
   var _useState75 = (0, _react.useState)([]),
       _useState76 = (0, _slicedToArray2.default)(_useState75, 2),
-      auditDatasheets = _useState76[0],
-      setAuditDatasheets = _useState76[1];
+      auditDescriptions = _useState76[0],
+      setAuditDescriptions = _useState76[1];
 
   var _useState77 = (0, _react.useState)([]),
       _useState78 = (0, _slicedToArray2.default)(_useState77, 2),
-      auditDescriptions = _useState78[0],
-      setAuditDescriptions = _useState78[1];
+      auditImages = _useState78[0],
+      setAuditImages = _useState78[1];
 
-  var _useState79 = (0, _react.useState)([]),
+  var _useState79 = (0, _react.useState)(false),
       _useState80 = (0, _slicedToArray2.default)(_useState79, 2),
-      auditImages = _useState80[0],
-      setAuditImages = _useState80[1];
-
-  var _useState81 = (0, _react.useState)(false),
-      _useState82 = (0, _slicedToArray2.default)(_useState81, 2),
-      compare = _useState82[0],
-      setCompare = _useState82[1];
-
-  var _useState83 = (0, _react.useState)(),
-      _useState84 = (0, _slicedToArray2.default)(_useState83, 2),
-      observation = _useState84[0],
-      setObservation = _useState84[1];
-
-  var _useState85 = (0, _react.useState)(false),
-      _useState86 = (0, _slicedToArray2.default)(_useState85, 2),
-      valRejAll = _useState86[0],
-      setValRejAll = _useState86[1];
-
-  var _useState87 = (0, _react.useState)([]),
-      _useState88 = (0, _slicedToArray2.default)(_useState87, 2),
-      desc = _useState88[0],
-      setDesc = _useState88[1];
-
-  var _useState89 = (0, _react.useState)([]),
-      _useState90 = (0, _slicedToArray2.default)(_useState89, 2),
-      fich = _useState90[0],
-      setFich = _useState90[1];
-
-  var _useState91 = (0, _react.useState)([]),
-      _useState92 = (0, _slicedToArray2.default)(_useState91, 2),
-      imag = _useState92[0],
-      setImag = _useState92[1];
-
-  var _useState93 = (0, _react.useState)(false),
-      _useState94 = (0, _slicedToArray2.default)(_useState93, 2),
-      isObservationVisible = _useState94[0],
-      setObservationVisible = _useState94[1];
-
-  var toggleObservation = function toggleObservation() {
-    setObservationVisible(!isObservationVisible);
-  }; // const handleClickOutside = (event) => {
-  //   if (
-  //     isObservationVisible &&
-  //     !event.target.closest(".Observation") &&
-  //     !event.target.closest(".Container")
-  //   ) {
-  //     hideObservation();
-  //   }
-  // };
-  // useEffect(() => {
-  //   document.addEventListener("click", handleClickOutside);
-  //   return () => {
-  //     document.removeEventListener("click", handleClickOutside);
-  //   };
-  // }, [isObservationVisible]);
-
-
-  var hideObservation = function hideObservation() {
-    setObservationVisible(false);
-  };
+      compare = _useState80[0],
+      setCompare = _useState80[1];
 
   (0, _react.useEffect)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
     var _ref3, id_article;
@@ -574,7 +516,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
               }
 
               _context2.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, product === null || product === void 0 ? void 0 : (_product$article2 = product.article) === null || _product$article2 === void 0 ? void 0 : _product$article2.category, parseInt(product === null || product === void 0 ? void 0 : (_product$article3 = product.article) === null || _product$article3 === void 0 ? void 0 : _product$article3.id_category), auditableVersion.version, token);
+              return (0, _data.getRetailerServices)(product === null || product === void 0 ? void 0 : (_product$article = product.article) === null || _product$article === void 0 ? void 0 : _product$article.id_article, product === null || product === void 0 ? void 0 : (_product$article2 = product.article) === null || _product$article2 === void 0 ? void 0 : _product$article2.category, parseInt(product === null || product === void 0 ? void 0 : (_product$article3 = product.article) === null || _product$article3 === void 0 ? void 0 : _product$article3.id_category), auditableVersion.version, token);
 
             case 3:
               _auditServices = _context2.sent;
@@ -614,7 +556,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
             case 0:
               _context3.prev = 0;
               _context3.next = 3;
-              return (0, _data2.getRetailerServices)(product === null || product === void 0 ? void 0 : (_product$article4 = product.article) === null || _product$article4 === void 0 ? void 0 : _product$article4.id_article, product === null || product === void 0 ? void 0 : (_product$article5 = product.article) === null || _product$article5 === void 0 ? void 0 : _product$article5.category, parseInt(product === null || product === void 0 ? void 0 : (_product$article6 = product.article) === null || _product$article6 === void 0 ? void 0 : _product$article6.id_category), version, token);
+              return (0, _data.getRetailerServices)(product === null || product === void 0 ? void 0 : (_product$article4 = product.article) === null || _product$article4 === void 0 ? void 0 : _product$article4.id_article, product === null || product === void 0 ? void 0 : (_product$article5 = product.article) === null || _product$article5 === void 0 ? void 0 : _product$article5.category, parseInt(product === null || product === void 0 ? void 0 : (_product$article6 = product.article) === null || _product$article6 === void 0 ? void 0 : _product$article6.id_category), version, token);
 
             case 3:
               _services = _context3.sent;
@@ -643,7 +585,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
               headers = {
                 Authorization: token
               };
-              (0, _data2.getPercentage)({
+              (0, _data.getPercentage)({
                 data: data,
                 headers: headers
               }).then(function (res) {
@@ -769,7 +711,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
             getComments();
             _context6.t0 = setUserGroups;
             _context6.next = 6;
-            return (0, _data2.fetchUsers)(token);
+            return (0, _data.fetchUsers)(token);
 
           case 6:
             _context6.t1 = _context6.sent;
@@ -1086,7 +1028,6 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       };
     });
     setSocketType(imageInputs);
-    console.log(images);
   }, [images]);
   var updateImages = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee9() {
     var _images$values3, _images$attrForImgs, _product$article14, _data$articleData, _data$articleData2, _data$updateImages;
@@ -1389,11 +1330,84 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       default:
         break;
     }
-  };
+  }; // const sendToFacilitator = async (result) => {
+  //   setLoading(true);
+  //   try {
+  //     let concept = getConcept(activeTab);
+  //     const productTemp = { ...product };
+  //     const evalStatus = retailerStatus;
+  //     const articleId = product.article.id_article;
+  //     const orderId = product.orderId;
+  //     // const body = {
+  //     //   orderArticleRetailers: [
+  //     //     { orderId, articleId, retailersIds: [activeRetailer.id] },
+  //     //   ],
+  //     //   isAproved: false,
+  //     //   service: concept,
+  //     // };
+  //     const body = {
+  //       articleId: product.article.id_article,
+  //       orderId: product.orderId,
+  //       concept: concept,
+  //       result: result,
+  //       evalStatus: evalStatus,
+  //       retailerId: activeRetailer.id,
+  //     };
+  //     let res;
+  //     let message;
+  //     if (result) {
+  //       body.isAproved = result === "A";
+  //       res = await axios.put(
+  //         `${process.env.REACT_APP_EVALUATION_ENDPOINT}`,
+  //         body,
+  //         {
+  //           headers: {
+  //             Authorization: token,
+  //           },
+  //         }
+  //       );
+  //       console.log(JSON.parse(res.data.body), "res");
+  //       getServices();
+  //     } else {
+  //       const specialistDone = ["RC", "RA", "CA"].includes(evalStatus);
+  //       if (specialistDone) {
+  //         message = `${activeTab} enviada a facilitador`;
+  //         getSectionIcon();
+  //       } else if (["IE", "AC", "RP", "RCA"].includes(evalStatus)) {
+  //         message = "Evaluación enviada";
+  //         getSectionIcon();
+  //       }
+  //       res = await axios.put(
+  //         `${process.env.REACT_APP_EVALUATION_ENDPOINT}`,
+  //         body,
+  //         {
+  //           headers: {
+  //             Authorization: token,
+  //           },
+  //         }
+  //       );
+  //     }
+  //     if (res.data.statusCode === 200) {
+  //       const response = JSON.parse(res.data.body)?.successfulData;
+  //       const statusObject =
+  //         response[`${orderId}-${articleId}-${activeRetailer.id}`];
+  //       productTemp.status = statusObject["generalStatus"];
+  //       productTemp[`${concept}_status`] = statusObject[`${concept}Status`];
+  //       await loadData();
+  //       if (message) setMessage(message);
+  //       sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
+  //       setProduct(productTemp);
+  //     }
+  //   } catch (error) {
+  //     console.log(error);
+  //   }
+  //   setLoading(false);
+  // };
+
 
   var sendToFacilitator = /*#__PURE__*/function () {
     var _ref15 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee11(result) {
-      var concept, productTemp, evalStatus, articleId, orderId, data, res, _message, specialistDone, _JSON$parse5, newStatus, newOrderStatus, newArticleStatus, messageToChat, _data;
+      var concept, productTemp, evalStatus, articleId, orderId, data, res, _message, specialistDone, _JSON$parse5, newStatus, newOrderStatus, newArticleStatus;
 
       return _regenerator.default.wrap(function _callee11$(_context11) {
         while (1) {
@@ -1456,59 +1470,39 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
 
             case 21:
               if (!(res.data.statusCode === 200)) {
-                _context11.next = 34;
+                _context11.next = 30;
                 break;
               }
 
               _JSON$parse5 = JSON.parse(res.data.body), newStatus = _JSON$parse5.newStatus, newOrderStatus = _JSON$parse5.newOrderStatus, newArticleStatus = _JSON$parse5.newArticleStatus;
-              messageToChat = (0, _utils.createMessage)(product.retailers, activeRetailer.id, evalStatus, newStatus, activeTab);
-              _data = {
-                paramsBody: {
-                  id: product.article.id_article,
-                  version: version,
-                  items: [{
-                    type: "status",
-                    value: messageToChat
-                  }],
-                  retailerId: activeRetailer.id,
-                  status: product.status
-                },
-                paramsHeader: {
-                  Authorization: token
-                }
-              };
-              _context11.next = 27;
-              return (0, _utils.sendMessage)(_data);
-
-            case 27:
               if (newOrderStatus) productTemp.status = newArticleStatus[articleId];
               productTemp["".concat(concept, "_status")] = newStatus;
-              _context11.next = 31;
+              _context11.next = 27;
               return loadData();
 
-            case 31:
+            case 27:
               if (_message) setMessage(_message);
               sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
               setProduct(productTemp);
 
-            case 34:
-              _context11.next = 39;
+            case 30:
+              _context11.next = 35;
               break;
 
-            case 36:
-              _context11.prev = 36;
+            case 32:
+              _context11.prev = 32;
               _context11.t0 = _context11["catch"](1);
               console.log(_context11.t0);
 
-            case 39:
+            case 35:
               setLoading(false);
 
-            case 40:
+            case 36:
             case "end":
               return _context11.stop();
           }
         }
-      }, _callee11, null, [[1, 36]]);
+      }, _callee11, null, [[1, 32]]);
     }));
 
     return function sendToFacilitator(_x) {
@@ -1543,33 +1537,55 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
   };
 
   var createComment = /*#__PURE__*/function () {
-    var _ref16 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee12() {
-      var messages,
-          retailerId,
-          data,
-          _args12 = arguments;
+    var _ref16 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee12(e, body, tab) {
+      var _product$article16;
+
+      var concept, data;
       return _regenerator.default.wrap(function _callee12$(_context12) {
         while (1) {
           switch (_context12.prev = _context12.next) {
             case 0:
-              messages = _args12.length > 0 && _args12[0] !== undefined ? _args12[0] : [];
-              retailerId = _args12.length > 1 ? _args12[1] : undefined;
+              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:
               data = {
-                paramsBody: {
-                  id: product.article.id_article,
-                  version: version,
-                  items: messages,
-                  retailerId: retailerId,
-                  status: product.status
-                },
-                paramsHeader: {
+                articleId: product === null || product === void 0 ? void 0 : (_product$article16 = product.article) === null || _product$article16 === void 0 ? void 0 : _product$article16.id_article,
+                orderId: product === null || product === void 0 ? void 0 : product.orderId,
+                message: body === null || body === void 0 ? void 0 : body.replace(/<.*?\/?>/gm, ""),
+                concept: concept,
+                version: version
+              };
+              _context12.next = 13;
+              return _axios.default.post("".concat(process.env.REACT_APP_COMMENTS_ENDPOINT), data, {
+                headers: {
                   Authorization: token
                 }
-              };
+              });
+
+            case 13:
+              _context12.next = 15;
+              return getComments(tab);
+
+            case 15:
               setMessage("");
-              return _context12.abrupt("return", (0, _utils.sendMessage)(data));
+              setComponentsArray([]);
 
-            case 5:
+            case 17:
             case "end":
               return _context12.stop();
           }
@@ -1577,7 +1593,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       }, _callee12);
     }));
 
-    return function createComment() {
+    return function createComment(_x2, _x3, _x4) {
       return _ref16.apply(this, arguments);
     };
   }();
@@ -1692,7 +1708,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
 
   var setAssignation = /*#__PURE__*/function () {
     var _ref18 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee14(assignationType, assignationId) {
-      var _product$article16;
+      var _product$article17;
 
       var concept, productTemp, data;
       return _regenerator.default.wrap(function _callee14$(_context14) {
@@ -1722,7 +1738,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
               data = {
                 articleList: [{
                   orderId: product.orderId,
-                  articleId: product === null || product === void 0 ? void 0 : (_product$article16 = product.article) === null || _product$article16 === void 0 ? void 0 : _product$article16.id_article
+                  articleId: product === null || product === void 0 ? void 0 : (_product$article17 = product.article) === null || _product$article17 === void 0 ? void 0 : _product$article17.id_article
                 }],
                 concept: concept,
                 userId: assignationId
@@ -1749,7 +1765,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       }, _callee14);
     }));
 
-    return function setAssignation(_x2, _x3) {
+    return function setAssignation(_x5, _x6) {
       return _ref18.apply(this, arguments);
     };
   }();
@@ -1851,7 +1867,6 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
   };
 
   (0, _react.useEffect)(function () {
-    console.log(servicesData, "servicesData");
     var status = getRetailerStatus(servicesData, activeTab);
     setRetailerStatus(status);
   }, [activeTab, servicesData, activeRetailer]);
@@ -1860,11 +1875,68 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
   }, [services, servicesData, activeTab]);
   (0, _react.useEffect)(function () {
     setSaving(loading);
-  }, [loading]);
+  }, [loading]); // const validateAll = async (result) => {
+  //   try {
+  //     setLoading(true);
+  //     const evaluationArray = [];
+  //     let conceptArray = ["description", "datasheet", "images"];
+  //     switch (user.id_role) {
+  //       case 4:
+  //         conceptArray = ["description", "datasheet"];
+  //         break;
+  //       case 5:
+  //         conceptArray = ["images"];
+  //         break;
+  //       default:
+  //         conceptArray = ["description", "datasheet", "images"];
+  //         break;
+  //     }
+  //     const isAproved = result === "A";
+  //     const retailersIds = [];
+  //     servicesData?.forEach((ret) => {
+  //       if (!retailersIds.includes(ret.id_retailer))
+  //         retailersIds.push(ret.id_retailer);
+  //     });
+  //     const body = {
+  //       orderArticleRetailers: [
+  //         {
+  //           orderId: product.id_order ?? product.orderId,
+  //           articleId: product.article.id_article,
+  //           retailersIds,
+  //         },
+  //       ],
+  //       isAproved,
+  //     };
+  //     conceptArray.forEach((concept) => {
+  //       body.service = concept;
+  //       evaluationArray.push(
+  //         axios.put(`${process.env.REACT_APP_EVALUATION_ENDPOINT}`, body, {
+  //           headers: {
+  //             Authorization: token,
+  //           },
+  //         })
+  //       );
+  //     });
+  //     await Promise.all(evaluationArray);
+  //     const productTemp = product;
+  //     productTemp.status = `${result}A`;
+  //     productTemp.datasheet_status =
+  //       productTemp.datasheet_status === "NA" ? "NA" : `${result}A`;
+  //     productTemp.description_status =
+  //       productTemp.description_status === "NA" ? "NA" : `${result}A`;
+  //     productTemp.images_status =
+  //       productTemp.images_status === "NA" ? "NA" : `${result}A`;
+  //     sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
+  //     setProduct(productTemp);
+  //     await loadData();
+  //   } catch (error) {
+  //     console.log(error);
+  //   }
+  // };
 
   var validateAll = /*#__PURE__*/function () {
     var _ref19 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee15(result) {
-      var evaluationArray, conceptArray, messages, productTemp, messagesResponse;
+      var evaluationArray, conceptArray, productTemp;
       return _regenerator.default.wrap(function _callee15$(_context15) {
         while (1) {
           switch (_context15.prev = _context15.next) {
@@ -1890,7 +1962,6 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
               return _context15.abrupt("break", 13);
 
             case 13:
-              messages = [];
               servicesData === null || servicesData === void 0 ? void 0 : servicesData.forEach(function (ret) {
                 if (conceptArray.includes(ret.service)) {
                   var _product$id_order;
@@ -1910,82 +1981,42 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
                   }));
                 }
               });
-              _context15.next = 17;
+              _context15.next = 16;
               return Promise.all(evaluationArray);
 
-            case 17:
+            case 16:
               productTemp = product;
               productTemp.status = "".concat(result, "A");
-              productTemp.datasheet_status = productTemp.datasheet_status === "NS" ? "NS" : "".concat(result, "A");
-              productTemp.description_status = productTemp.description_status === "NS" ? "NS" : "".concat(result, "A");
-              productTemp.images_status = productTemp.images_status === "NS" ? "NS" : "".concat(result, "A");
+              productTemp.datasheet_status = productTemp.datasheet_status === "NA" ? "NA" : "".concat(result, "A");
+              productTemp.description_status = productTemp.description_status === "NA" ? "NA" : "".concat(result, "A");
+              productTemp.images_status = productTemp.images_status === "NA" ? "NA" : "".concat(result, "A");
               sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
               setProduct(productTemp);
-              _context15.next = 26;
-              return Promise.all(messages);
-
-            case 26:
-              messagesResponse = _context15.sent;
-              _context15.next = 29;
+              _context15.next = 25;
               return loadData();
 
-            case 29:
-              _context15.next = 34;
+            case 25:
+              _context15.next = 30;
               break;
 
-            case 31:
-              _context15.prev = 31;
+            case 27:
+              _context15.prev = 27;
               _context15.t1 = _context15["catch"](0);
               console.log(_context15.t1);
 
-            case 34:
+            case 30:
             case "end":
               return _context15.stop();
           }
         }
-      }, _callee15, null, [[0, 31]]);
+      }, _callee15, null, [[0, 27]]);
     }));
 
-    return function validateAll(_x4) {
+    return function validateAll(_x7) {
       return _ref19.apply(this, arguments);
     };
   }();
 
-  var getObservation = /*#__PURE__*/function () {
-    var _ref20 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee16() {
-      var response, parseData;
-      return _regenerator.default.wrap(function _callee16$(_context16) {
-        while (1) {
-          switch (_context16.prev = _context16.next) {
-            case 0:
-              _context16.next = 2;
-              return _axios.default.get("".concat(process.env.REACT_APP_READ_OBSERVATION, "?articleId=").concat(product.article.id_article, "&orderId=").concat(product === null || product === void 0 ? void 0 : product.orderId), {
-                headers: {
-                  Authorization: sessionStorage.getItem("jwt")
-                }
-              });
-
-            case 2:
-              response = _context16.sent;
-              parseData = JSON.parse(response.data.body).data[0];
-              setObservation(parseData.observations);
-
-            case 5:
-            case "end":
-              return _context16.stop();
-          }
-        }
-      }, _callee16);
-    }));
-
-    return function getObservation() {
-      return _ref20.apply(this, arguments);
-    };
-  }();
-
-  (0, _react.useEffect)(function () {
-    getObservation();
-  }, []);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     headerTop: headerTop,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTop.HeaderTop, {
@@ -1994,10 +2025,8 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       setCompare: setCompare,
       isAuditor: [1, 6].includes(user.id_role),
       withChat: location === null || location === void 0 ? void 0 : (_location$state = location.state) === null || _location$state === void 0 ? void 0 : _location$state.withChat,
-      chatType: location === null || location === void 0 ? void 0 : (_location$state2 = location.state) === null || _location$state2 === void 0 ? void 0 : _location$state2.chatType,
-      productSelected: product,
-      token: token,
-      activeRetailer: activeRetailer
+      productSelected: productSelected,
+      token: token
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "data-container",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -2030,7 +2059,6 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
         className: "product-information",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FullProductNameHeader.FullProductNameHeader, {
           headerData: product,
-          productObservation: observation,
           percent: activePercentage,
           activeRetailer: activeRetailer,
           servicesData: servicesData,
@@ -2040,7 +2068,27 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
             sendToFacilitator("A");
           },
           reject: function reject() {
-            setShowRejectModal(true);
+            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);
+              }
+            })]);
           },
           showApproveRejectAll: approveRejectAllButtons() && (auditorAssigned() || userAssigned()),
           showValidationButtons: approveRejectButtons() && (auditorAssigned() || userAssigned()),
@@ -2048,13 +2096,28 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
             return validateAll("A");
           },
           rejectAll: function rejectAll() {
-            setShowRejectModal(true);
-            setValRejAll(true);
-          },
-          isObservationVisible: isObservationVisible,
-          toggleObservation: toggleObservation // handleClickOutside={handleClickOutside}
-          ,
-          hideObservation: hideObservation
+            validateAll("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);
+              }
+            })]);
+          }
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullTabsMenu.FullTabsMenu, {
           tabsSections: tabsSections,
           status: retailerStatus,
@@ -2068,12 +2131,6 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
           isRetailer: isRetailer,
           showSaveButton: auditorAssigned() || userAssigned(),
           version: version,
-          desc: desc,
-          setDesc: setDesc,
-          fich: fich,
-          setFich: setFich,
-          imag: imag,
-          setImag: setImag,
           updatedDescriptions: updatedDescriptions,
           setUpdatedDescriptions: setUpdatedDescriptions,
           updatedDatasheets: updatedDatasheets,
@@ -2131,7 +2188,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
               auditInputGroup: auditDescriptions[0],
               updatedDescriptions: updatedDescriptions,
               setUpdatedDescriptions: setUpdatedDescriptions,
-              articleId: product === null || product === void 0 ? void 0 : (_product$article17 = product.article) === null || _product$article17 === void 0 ? void 0 : _product$article17.id_article,
+              articleId: product === null || product === void 0 ? void 0 : (_product$article18 = product.article) === null || _product$article18 === void 0 ? void 0 : _product$article18.id_article,
               version: version,
               dinamicHeight: true,
               compare: compare
@@ -2152,15 +2209,57 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
               headerType: "input-name-header"
             }))]
           })
-        }), (userAssigned(activeTab) || auditorAssigned()) && product["".concat(getConcept(activeTab), "_status")] !== "NS" && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        }), (userAssigned(activeTab) || auditorAssigned()) && product["".concat(getConcept(activeTab), "_status")] !== "NS" && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "commentary-box",
-          children: [7, 8].includes(user.id_role) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+          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 === null || comment === void 0 ? void 0 : (_comment$message = comment.message) === null || _comment$message === void 0 ? void 0 : _comment$message.replace(/<.*?\/?>/gm, ""),
+              reviewed: crossComment
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+              buttonType: "circular-button accept-button",
+              onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee16() {
+                return _regenerator.default.wrap(function _callee16$(_context16) {
+                  while (1) {
+                    switch (_context16.prev = _context16.next) {
+                      case 0:
+                        setCrossComment(true);
+                        commentRevised();
+
+                      case 2:
+                      case "end":
+                        return _context16.stop();
+                    }
+                  }
+                }, _callee16);
+              }))
+            })]
+          }), [7, 8].includes(user.id_role) && /*#__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, {
@@ -2189,53 +2288,6 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       currentVersion: version,
       setShowVersionSelector: setShowVersionSelector,
       jwt: token
-    }), showRejectModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
-      title: "Agregar mensaje de rechazo para ".concat(activeTab === null || activeTab === void 0 ? void 0 : activeTab.toLowerCase()),
-      show: showRejectModal,
-      customComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
-        inputType: "textarea",
-        inputId: "modal-message-box",
-        index: 0,
-        color: "white"
-      }),
-      buttons: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
-        type: "white",
-        label: "Cancelar",
-        size: 12,
-        onClick: function onClick() {
-          setShowRejectModal(false);
-        }
-      }, "btn-Cancelar"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
-        type: "pink",
-        label: "Aceptar",
-        size: 12,
-        onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee17() {
-          var body, messages;
-          return _regenerator.default.wrap(function _callee17$(_context17) {
-            while (1) {
-              switch (_context17.prev = _context17.next) {
-                case 0:
-                  body = document.querySelector("#modal-message-box .ql-container .ql-editor > p").innerHTML;
-                  messages = [{
-                    type: "message",
-                    value: body === null || body === void 0 ? void 0 : body.replace(/<.*?\/?>/gm, "")
-                  }];
-                  _context17.next = 4;
-                  return createComment(messages, activeRetailer.id);
-
-                case 4:
-                  valRejAll ? validateAll("R") : sendToFacilitator("R");
-                  setMessage("Rechazado");
-                  setShowRejectModal(false);
-
-                case 7:
-                case "end":
-                  return _context17.stop();
-              }
-            }
-          }, _callee17);
-        }))
-      }, "btn-Aceptar")]
     })]
   });
 };