contentoh-components-library 21.1.51 → 21.1.52

package/dist/components/atoms/VerticalSideMenuMainPage/index.js

@@ -15,16 +15,8 @@ var _styles = require("./styles");
 
 var _iconLogoContentoh = _interopRequireDefault(require("../../../assets/images/verticalSideMenuMainPage/iconLogoContentoh.svg"));
 
-var _iconProduct = _interopRequireDefault(require("../../../assets/images/verticalSideMenuMainPage/iconProduct.svg"));
-
-var _iconGroup = _interopRequireDefault(require("../../../assets/images/verticalSideMenuMainPage/iconGroup.svg"));
-
 var _iconLogo = _interopRequireDefault(require("../../../assets/images/verticalSideMenuMainPage/iconLogo.svg"));
 
-var _iconSpeedometer = _interopRequireDefault(require("../../../assets/images/verticalSideMenuMainPage/iconSpeedometer.svg"));
-
-var _iconTask = _interopRequireDefault(require("../../../assets/images/verticalSideMenuMainPage/iconTask.svg"));
-
 var _openMenu = _interopRequireDefault(require("../../../assets/images/verticalSideMenuMainPage/openMenu.svg"));
 
 var _closeMenu = _interopRequireDefault(require("../../../assets/images/verticalSideMenuMainPage/closeMenu.svg"));
@@ -33,16 +25,17 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var VerticalSideMenuMainPage = function VerticalSideMenuMainPage() {
-  var _useState = (0, _react.useState)(false),
+var VerticalSideMenuMainPage = function VerticalSideMenuMainPage(_ref) {
+  var menuoption = _ref.menuoption;
+
+  var _useState = (0, _react.useState)(""),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       trueBar = _useState2[0],
       setTrueBar = _useState2[1];
 
-  var active = function active() {//document.getElementById("slidea1").style.border= "1px solid rgb(227, 58, 169)";
-  };
-
+  var sub;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    className: trueBar,
     bar: trueBar,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "navbar-top",
@@ -50,58 +43,39 @@ var VerticalSideMenuMainPage = function VerticalSideMenuMainPage() {
         src: trueBar ? _iconLogoContentoh.default : _iconLogo.default,
         alt: "Logo",
         className: "logo"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "option",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("a", {
-          href: "/Dashboard",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-            src: _iconSpeedometer.default,
-            alt: "Speed Meter",
-            width: "25px"
-          }), trueBar && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-            children: "Dashborad"
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", {
-          href: "/products",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-            src: _iconProduct.default,
-            alt: "Focus Product",
-            width: "25px"
-          }), trueBar && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-            children: "Productos"
-          })]
-        }), trueBar && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          className: "sub-option",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
-            href: "/Dashboard",
-            children: trueBar && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-              children: "General"
-            })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
-            href: "/AddProducts",
-            children: trueBar && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-              children: "Agregar Producto"
-            })
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", {
-          href: "/providers",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-            src: _iconGroup.default,
-            alt: "Group",
-            width: "25px"
-          }), trueBar && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-            children: "Proovedores"
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", {
-          href: "/ContentohProducts",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-            src: _iconLogo.default,
-            alt: "Logo",
-            width: "25px"
-          }), trueBar && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-            children: "Content Oh!"
-          })]
-        })]
+        children: menuoption.map(function (item) {
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+              className: "option-link",
+              exact: true,
+              activeClassName: "active",
+              to: item.path,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+                src: item.icon,
+                alt: item.title,
+                width: "25px"
+              }), trueBar && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+                children: item.title
+              })]
+            }), item.suboption === undefined ? "" : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+              children: menuoption[1].suboption.map(function (subitem) {
+                return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+                  className: "sub-option",
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+                    exact: true,
+                    activeClassName: "active",
+                    to: subitem.path,
+                    children: trueBar && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+                      children: subitem.title
+                    })
+                  })
+                });
+              })
+            })]
+          });
+        })
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "menu-bottom",
@@ -110,7 +84,7 @@ var VerticalSideMenuMainPage = function VerticalSideMenuMainPage() {
         alt: "Open Menu",
         onClick: function onClick() {
           {
-            trueBar ? setTrueBar(false) : setTrueBar(true);
+            trueBar ? setTrueBar("") : setTrueBar("actived");
           }
         }
       })

package/dist/components/atoms/VerticalSideMenuMainPage/styles.js

@@ -11,25 +11,40 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
+var _reactRouterDom = require("react-router-dom");
+
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 100%;\n  width: ", "px;\n  box-sizing: border-box;\n  padding: 23px 10px ", "px 10px;\n  flex-direction: column;\n  justify-content: space-between;\n  overflow: auto;\n  border-radius: ", "px;\n  background: linear-gradient(180deg, #e33aa9 0%, #3b1366 100%);\n  scrollbar-width: none;\n  display: flex;\n  text-align: center;\n  .navbar-top {\n    .logo {\n      & + * {\n        margin-top: ", "%;\n      }\n    }\n    .option {\n      a {\n        cursor: pointer;\n        height: 38px;\n        display: flex;\n        justify-content: center;\n        border-radius: ", "px;\n        align-items: center;\n        font-family: \"Raleway\";\n        font-style: normal;\n        font-weight: 400;\n        font-size: 18px;\n        line-height: 21px;\n        letter-spacing: -0.015em;\n        color: #fafafa;\n        text-decoration: none;\n        img {\n          & + * {\n            margin-left: 12px;\n          }\n        }\n        &:hover {\n          background: #e33aa9;\n        }\n        /* & + * {\n          margin-top: 12px;\n        } */\n      }\n      .sub-option {\n        display: flex;\n        flex-direction: column;\n        padding-left: 40px;\n        a {\n          display: flex;\n          justify-content: flex-start;\n          text-decoration: none;\n          position: relative;\n          font-family: Raleway;\n          font-style: normal;\n          font-weight: normal;\n          font-size: 13px;\n          border-left: 1px solid #f0eef2;\n          border-radius: 0;\n          line-height: 16px;\n          letter-spacing: -0.015em;\n          color: #f0eef2;\n          padding-top: 20px;\n          padding-left: 12px;\n          height: 25px;\n          &::before {\n            border-left: 1px solid #e33aa9;\n            width: 10px;\n            content: \"\";\n            border-radius: 50%;\n            height: 10px;\n            background-color: white;\n            position: absolute;\n            left: -4%;\n            bottom: 1%;\n          }\n          &:hover {\n            background-color: transparent;\n          }\n        }\n        & + * {\n          margin-top: 12px;\n        }\n      }\n    }\n  }\n  .menu-bottom {\n    display: flex;\n    justify-content: ", ";\n    cursor: pointer;\n  }\n"])), function (_ref) {
+//styled(NavLink)
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 100%;\n  width: 58px;\n  box-sizing: border-box;\n  padding: 23px 10px 70px 10px;\n  flex-direction: column;\n  justify-content: space-between;\n  overflow: auto;\n  border-radius: 50px;\n  background: linear-gradient(180deg, #e33aa9 0%, #3b1366 100%);\n  scrollbar-width: none;\n  display: flex;\n  text-align: center;\n  &.actived {\n    width: 200px;\n    padding: 23px 10px 15px 10px;\n    border-radius: 20px;\n  }\n  .navbar-top {\n    .logo {\n      & + * {\n        margin-top: ", "%;\n      }\n    }\n    .option {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      padding-left: ", "px;\n      div {\n        height: ", "px;\n        width: ", "px;\n        display: flex;\n        justify-content: ", ";\n        border-radius: ", "px;\n        align-items: center;\n        font-family: \"Raleway\";\n        font-style: normal;\n        font-weight: 400;\n        font-size: 18px;\n        line-height: 21px;\n        letter-spacing: -0.015em;\n        color: #fafafa;\n        text-decoration: none;\n        &.option-link {\n          cursor: pointer;\n          margin-top: 12px;\n          padding-left: ", "px;\n        }\n        p {\n          cursor: pointer;\n        }\n        img {\n          & + * {\n            margin-left: 12px;\n          }\n        }\n      }\n      .option-link:hover {\n        background: #e33aa9;\n      }\n      .sub-option {\n        display: flex;\n        flex-direction: column;\n        padding-left: ", "px;\n        height: auto;\n        width: auto;\n        div {\n          display: flex;\n          justify-content: flex-start;\n          text-decoration: none;\n          position: relative;\n          font-size: 13px;\n          border-left: 1px solid #f0eef2;\n          border-radius: 0;\n          color: #f0eef2;\n          padding-top: 20px;\n          padding-left: 12px;\n          height: 25px;\n          &::before {\n            border-left: 1px solid #e33aa9;\n            width: 10px;\n            content: \"\";\n            border-radius: 50%;\n            height: 10px;\n            background-color: white;\n            position: absolute;\n            left: ", "%;\n            bottom: 1%;\n          }\n        }\n      }\n    }\n  }\n  .menu-bottom {\n    display: flex;\n    justify-content: ", ";\n    cursor: pointer;\n  }\n"])), function (_ref) {
   var bar = _ref.bar;
-  return bar ? 200 : 58;
+  return bar === "" ? 145 : 50;
 }, function (_ref2) {
   var bar = _ref2.bar;
-  return bar ? 15 : 70;
+  return bar ? 5 : 0;
 }, function (_ref3) {
   var bar = _ref3.bar;
-  return bar ? 20 : 50;
+  return bar ? 32 : 38;
 }, function (_ref4) {
   var bar = _ref4.bar;
-  return bar ? 45 : 225;
+  return bar ? 165 : 38;
 }, function (_ref5) {
   var bar = _ref5.bar;
-  return bar ? 18 : 100;
+  return bar ? "flex-start" : "center";
 }, function (_ref6) {
   var bar = _ref6.bar;
+  return bar ? 18 : 100;
+}, function (_ref7) {
+  var bar = _ref7.bar;
+  return bar ? 15 : 0;
+}, function (_ref8) {
+  var bar = _ref8.bar;
+  return bar ? 28 : 20;
+}, function (_ref9) {
+  var bar = _ref9.bar;
+  return bar ? -4 : -16;
+}, function (_ref10) {
+  var bar = _ref10.bar;
   return bar ? "flex-end" : "center";
 });
 

package/dist/components/molecules/HeaderTop/index.js

@@ -26,7 +26,10 @@ var HeaderTop = function HeaderTop(_ref) {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ScreenHeader, {
       text: "Edici\xF3n de producto"
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Button, {
-      buttonType: "close-button"
+      buttonType: "close-button",
+      onClick: function onClick() {
+        window.location.href = "/products";
+      }
     })]
   });
 };

package/dist/components/molecules/RetailerSelector/index.js

@@ -7,6 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.RetailerSelector = void 0;
 
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 
 var _styles = require("./styles");
@@ -39,11 +43,39 @@ var RetailerSelector = function RetailerSelector(_ref) {
     }
   };
 
+  var getRetailerImage = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              console.log("https://content-management-images.s3.amazonaws.com/retailers/".concat(activeRetailer.id, ".png"));
+              activeRetailer.image = "https://content-management-images.s3.amazonaws.com/retailers/".concat(activeRetailer.id, ".png");
+              retailers.forEach(function (retailer) {
+                return retailer.image = "https://content-management-images.s3.amazonaws.com/retailers/".concat(retailer.id, ".png");
+              });
+
+            case 3:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+
+    return function getRetailerImage() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
   (0, _react.useEffect)(function () {
     if (retailersPanel) {
       document.addEventListener("click", closeRetailersPanel, false);
     }
   }, [retailersPanel]);
+  (0, _react.useEffect)(function () {
+    getRetailerImage();
+  }, [activeRetailer]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     id: "retailers-assignation",
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Avatar.Avatar, {

package/dist/components/molecules/StatusAsignationInfo/index.js

@@ -25,6 +25,16 @@ var _index3 = require("../../atoms/AsignationOption/index");
 
 var _data = require("../../../global-files/data");
 
+var _SliderToolTip = require("../../atoms/SliderToolTip");
+
+var _infoIcon = _interopRequireDefault(require("../../../assets/images/sliderToolTip/infoIcon.svg"));
+
+var _slide = _interopRequireDefault(require("../../../assets/images/sliderToolTip/slide21.svg"));
+
+var _slide2 = _interopRequireDefault(require("../../../assets/images/sliderToolTip/slide22.svg"));
+
+var _slide3 = _interopRequireDefault(require("../../../assets/images/sliderToolTip/slide23.svg"));
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var StatusAsignationInfo = function StatusAsignationInfo(_ref) {
@@ -44,7 +54,8 @@ var StatusAsignationInfo = function StatusAsignationInfo(_ref) {
       _ref$id = _ref.id,
       id = _ref$id === void 0 ? "default-id" : _ref$id,
       onClickSave = _ref.onClickSave,
-      showSaveButton = _ref.showSaveButton;
+      showSaveButton = _ref.showSaveButton,
+      canAssign = _ref.canAssign;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -68,6 +79,19 @@ var StatusAsignationInfo = function StatusAsignationInfo(_ref) {
     }
   };
 
+  var slidefront = [{
+    slide: _slide.default,
+    title: "Valida tu producto en cada activo digital",
+    description: "Al solicitar a Content-oh! podrás validar la información, imágenes y documentación de tu producto, esto hará más sencillo que puedas aprobar o rechazar el contenido."
+  }, {
+    slide: _slide2.default,
+    title: "Aprueba o rechaza con un clic",
+    description: "Cuando termines de revisar tu información, elige si aproebas o rechazas, esto enviara una notificiación a nuestro equipo, para continuar o corregir el producto."
+  }, {
+    slide: _slide3.default,
+    title: "Estatus de tu producto en el proceso",
+    description: "La mayor parte del proceso podrás identificar que estatus tiene tu producto, esto dara visibilidad a todo tu equipo para saber la etapa se encuentra."
+  }];
   (0, _react.useEffect)(function () {
     if (showAsignationPanel) {
       document.addEventListener("click", closeAsignations, false);
@@ -75,7 +99,12 @@ var StatusAsignationInfo = function StatusAsignationInfo(_ref) {
   }, [showAsignationPanel]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     id: id,
-    children: [status !== "-" && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.StatusTag, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_SliderToolTip.SliderToolTip, {
+      infoIcon: _infoIcon.default,
+      slidefront: slidefront,
+      iconSize: "medium-image",
+      slidePosition: "bottom-slide"
+    }), status !== "-" && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.StatusTag, {
       statusType: status,
       ovalForm: true
     }), showSaveButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
@@ -118,7 +147,7 @@ var StatusAsignationInfo = function StatusAsignationInfo(_ref) {
       color: "#969696",
       fontFamily: "Avenir Next",
       headerType: "input-name-header"
-    }), showAsignationPanel && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    }), showAsignationPanel && canAssign && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "asignation-panel",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "asignation-header",

package/dist/components/organisms/FullTabsMenu/index.js

@@ -32,7 +32,8 @@ var FullTabsMenu = function FullTabsMenu(_ref) {
       downloadImages = _ref.downloadImages,
       askToDeleteImages = _ref.askToDeleteImages,
       onClickSave = _ref.onClickSave,
-      showSaveButton = _ref.showSaveButton;
+      showSaveButton = _ref.showSaveButton,
+      canAssign = _ref.canAssign;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -45,6 +46,7 @@ var FullTabsMenu = function FullTabsMenu(_ref) {
       setImagesSection: setImagesSection,
       setActiveTab: setActiveTab
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.StatusAsignationInfo, {
+      canAssign: canAssign,
       status: status,
       activeTab: activeTab,
       setImageLayout: setImageLayout,

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

@@ -81,6 +81,20 @@ var _errorModal = _interopRequireDefault(require("../../../assets/images/generic
 
 var _index2 = require("../../organisms/GlobalModal/index");
 
+var _SliderToolTip = require("../../atoms/SliderToolTip");
+
+var _infoIcon = _interopRequireDefault(require("../../../assets/images/sliderToolTip/infoIcon.svg"));
+
+var _slide = _interopRequireDefault(require("../../../assets/images/sliderToolTip/slide1.svg"));
+
+var _slide2 = _interopRequireDefault(require("../../../assets/images/sliderToolTip/slide2.svg"));
+
+var _slide3 = _interopRequireDefault(require("../../../assets/images/sliderToolTip/slide3.svg"));
+
+var _slide4 = _interopRequireDefault(require("../../../assets/images/sliderToolTip/slide4.svg"));
+
+var _slide5 = _interopRequireDefault(require("../../../assets/images/sliderToolTip/slide5.svg"));
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var reducerImages = function reducerImages(state, action) {
@@ -1544,6 +1558,23 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
   (0, _react.useEffect)(function () {
     setSaving(loading);
   }, [loading]);
+  var slidefront = [{
+    slide: _slide.default,
+    description: "Creamos tu contenido, y todo lo que haga falta para tu producto, cada sección puedes socilitar contenido enriquecido, y nosotros lo haremos por ti."
+  }, {
+    slide: _slide2.default,
+    description: "Puedes agregar solicitudes de contenido enriquecido a tu carrito de compra las veces que sean necesarias. Una vez completada tu lista con los servicios necesitados sigue el proceso de compra en checkout."
+  }, {
+    slide: _slide3.default,
+    description: "Revisa el contenido que deseas solicilitar, valida y tambien puedes agregar contenido extra, traducciones, o simplemente completar el checkout."
+  }, {
+    slide: _slide4.default,
+    description: "Elige el tipo de entrega de tu producto, puedes ser recolección en el lugar o por el contrario puedes dejarlo en nuestras oficinas."
+  }, {
+    slide: _slide5.default,
+    title: "Bienvenido al modo Content-oh!",
+    description: "Finalmente elige la forma de pago que más te guste, procede con el pago y listo."
+  }];
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     headerTop: headerTop,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTop.HeaderTop, {
@@ -1851,12 +1882,19 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
                 children: "Ir a checkout"
               })]
             })
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
-            onClick: function onClick() {
-              setShowContentohRequestModal && setShowContentohRequestModal(true);
-            },
-            buttonType: "general-default-button",
-            label: "Enviar a Content-oh!"
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_SliderToolTip.SliderToolTip, {
+              infoIcon: _infoIcon.default,
+              slidefront: slidefront,
+              iconSize: "big-image",
+              slidePosition: "top-slide"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+              onClick: function onClick() {
+                setShowContentohRequestModal && setShowContentohRequestModal(true);
+              },
+              buttonType: "general-default-button",
+              label: "Enviar a Content-oh!"
+            })]
           })]
         })]
       })]

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

@@ -135,7 +135,7 @@ var myBucket = new _awsSdk.default.S3({
 });
 
 var RetailerProductEdition = function RetailerProductEdition(_ref) {
-  var _product$retailers, _product$services2, _datasheets$, _datasheets$$data, _product$article14;
+  var _product$retailers, _product$services2, _datasheets$, _datasheets$$data, _product$article14, _comment$message;
 
   var tabsSections = _ref.tabsSections,
       _ref$productSelected = _ref.productSelected,
@@ -1245,7 +1245,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
               data = {
                 articleId: product === null || product === void 0 ? void 0 : (_product$article12 = product.article) === null || _product$article12 === void 0 ? void 0 : _product$article12.id_article,
                 orderId: product === null || product === void 0 ? void 0 : product.orderId,
-                message: body,
+                message: body === null || body === void 0 ? void 0 : body.replace(/<.*?\/?>/gm, ""),
                 concept: concept,
                 version: version
               };
@@ -1653,7 +1653,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
 
             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()
+          showSaveButton: auditorAssigned() || userAssigned()
         })]
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "product-information",
@@ -1721,6 +1721,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
             })]);
           }
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullTabsMenu.FullTabsMenu, {
+          canAssign: ![7, 8].includes(user.id_role),
           tabsSections: tabsSections,
           status: retailerStatus,
           activeTab: activeTab,
@@ -1731,7 +1732,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
           assig: assig[activeTab],
           setAssignation: setAssignation,
           isRetailer: isRetailer,
-          showSaveButton: userAssigned(),
+          showSaveButton: auditorAssigned() || userAssigned(),
           onClickSave: function onClickSave() {
             switch (activeTab) {
               case "Descripción":
@@ -1819,7 +1820,7 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
           }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
             className: "feedback-box",
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Commentary.Commentary, {
-              comment: comment.message,
+              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",

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

@@ -13,7 +13,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  flex: 1;\n  overflow: auto;\n\n  .data-container {\n    display: flex;\n    flex: 0%;\n    height: calc(100% - ", "px);\n    .image-data-panel {\n      width: 340px;\n\n      & + * {\n        margin-left: 10px;\n      }\n    }\n\n    .product-information {\n      width: 100%;\n      display: flex;\n      flex-direction: column;\n\n      .services-information-container {\n        height: 100%;\n        overflow: auto;\n      }\n\n      .image-services {\n        aside {\n          display: grid;\n          grid-template-columns: repeat(auto-fill, 179px);\n          column-gap: 15px;\n          row-gap: 15px;\n          padding: 20px;\n        }\n      }\n\n      .commentary-box {\n        display: flex;\n        justify-content: space-between;\n        align-items: flex-end;\n        padding: 10px;\n        padding-left: 0;\n\n        .commentary {\n          display: flex;\n          align-items: flex-end;\n\n          .input-container {\n            width: 500px;\n\n            .quill {\n              height: 100px;\n            }\n\n            & + * {\n              margin-left: 5px;\n            }\n          }\n\n          .buttons-box {\n            display: flex;\n            width: 210px;\n            flex-wrap: wrap;\n\n            .general-transparent-button {\n              & + * {\n                margin-top: 5px;\n              }\n            }\n\n            .general-transparent-button,\n            .general-green-button,\n            .general-button-disabled {\n              width: fit-content;\n              min-width: 201px;\n              height: 40px;\n            }\n          }\n        }\n      }\n\n      .feedback-box {\n        display: flex;\n      }\n    }\n  }\n  .container {\n    width: 100%;\n    height: 100%;\n    .dropzone {\n      height: 100%;\n      width: 100%;\n    }\n  }\n"])), function (_ref) {
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  flex: 1;\n  overflow: auto;\n\n  .data-container {\n    display: flex;\n    flex: 0%;\n    height: calc(100% - ", "px);\n    .image-data-panel {\n      width: 340px;\n\n      & + * {\n        margin-left: 10px;\n      }\n    }\n\n    .product-information {\n      width: calc(100% - 341px);\n      display: flex;\n      flex-direction: column;\n\n      .services-information-container {\n        height: 100%;\n        overflow: auto;\n      }\n\n      .image-services {\n        aside {\n          display: grid;\n          grid-template-columns: repeat(auto-fill, 179px);\n          column-gap: 15px;\n          row-gap: 15px;\n          padding: 20px;\n        }\n      }\n\n      .commentary-box {\n        display: flex;\n        justify-content: space-between;\n        align-items: flex-end;\n        padding: 10px;\n        padding-left: 0;\n\n        .commentary {\n          display: flex;\n          align-items: flex-end;\n\n          .input-container {\n            width: 500px;\n\n            .quill {\n              height: 100px;\n            }\n\n            & + * {\n              margin-left: 5px;\n            }\n          }\n\n          .buttons-box {\n            display: flex;\n            width: 210px;\n            flex-wrap: wrap;\n\n            .general-transparent-button {\n              & + * {\n                margin-top: 5px;\n              }\n            }\n\n            .general-transparent-button,\n            .general-green-button,\n            .general-button-disabled {\n              width: fit-content;\n              min-width: 201px;\n              height: 40px;\n            }\n          }\n        }\n      }\n\n      .feedback-box {\n        display: flex;\n      }\n    }\n  }\n  .container {\n    width: 100%;\n    height: 100%;\n    .dropzone {\n      height: 100%;\n      width: 100%;\n    }\n  }\n"])), function (_ref) {
   var headerTop = _ref.headerTop;
   return headerTop;
 });