contentoh-components-library 21.6.57 → 21.6.59

package/.claude/settings.local.json

@@ -0,0 +1,7 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(npm test *)"
+    ]
+  }
+}

package/dist/components/pages/CreatorsProductEdition/CreatorsProductEditionView.js

@@ -21,30 +21,12 @@ var _utils = require("../RetailerProductEdition/utils");
 
 var _assets = require("../../../global-files/digital-assets/assets.reducer");
 
-var _GeneralButton = require("../../atoms/GeneralButton");
-
-var _GenericModal = require("../../atoms/GenericModal");
-
-var _Loading = require("../../atoms/Loading");
-
-var _ScreenHeader = require("../../atoms/ScreenHeader");
-
-var _ButtonV = require("../../atoms/ButtonV2");
-
 var _GalleryTrayTabs = require("../../molecules/GalleryTrayTabs");
 
 var _HeaderTop = require("../../molecules/HeaderTop");
 
-var _index = require("../../molecules/TagAndInput/index");
-
 var _InputGroup = require("../../organisms/InputGroup");
 
-var _ProductImageModal = require("../../organisms/ProductImageModal");
-
-var _VersionSelector = require("../../organisms/VersionSelector");
-
-var _Modal = require("../../organisms/Modal");
-
 var _LinkVariantsModal = require("../../organisms/LinkVariantsModal");
 
 var _UnlinkVariantModal = require("../../organisms/UnlinkVariantModal");
@@ -77,10 +59,33 @@ var _VariantsPanel = require("./sections/VariantsPanel");
 
 var _CommentBox = require("./sections/CommentBox");
 
+var _NoticeDialog = require("./sections/NoticeDialog");
+
+var _RejectDialog = require("./sections/RejectDialog");
+
+var _ImageGallery = require("./sections/ImageGallery");
+
+var _VersionDrawer = require("./sections/VersionDrawer");
+
+var _tokens = require("./sections/tokens");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var _excluded = ["attributes"];
 
+// Aviso cuando el producto no tiene contratado el servicio de la pestaña.
+var NoService = function NoService() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+    sx: {
+      fontFamily: _tokens.FONTS.Raleway,
+      fontSize: 14,
+      color: _tokens.COLORS.s5,
+      py: 1
+    },
+    children: "No cuentas con este servicio"
+  });
+};
+
 var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
   var _state$errors, _pendingPropagation$k, _family$variants, _variantGroup$members, _variantGroup$group, _state$product, _state$product2, _state$product3, _state$active_retaile, _state$product4, _state$product5, _state$product6, _variantGroup$group2, _location$state, _location$state2, _state$active_retaile2, _state$active_retaile3, _state$images_values$, _state$images_values, _state$images_values$2, _state$product7, _state$active_retaile4, _state$active_percent, _state$active_percent2, _state$active_percent3, _state$active_retaile5, _state$active_retaile6, _state$active_retaile7, _state$product8, _state$services, _state$services$datas, _state$product9, _state$product10, _state$datasheets_inp, _state$datasheets_inp2, _state$product11;
 
@@ -436,19 +441,34 @@ var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
         alt: "error",
         width: 64,
         height: 64
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-        text: "No pudimos cargar el producto",
-        headerType: "input-name-header"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-        style: {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+        sx: {
+          fontFamily: _tokens.FONTS.Raleway,
+          fontSize: 16,
+          color: _tokens.COLORS.s5
+        },
+        children: "No pudimos cargar el producto"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+        sx: {
           color: "#666",
-          maxWidth: 420
+          maxWidth: 420,
+          fontSize: 14
         },
         children: state.errors[0] || "Ocurrió un error al cargar la información del producto."
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
-        buttonType: "general-button-default",
-        label: "Reintentar",
-        onClick: handleRetryLoad
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
+        variant: "contained",
+        disableElevation: true,
+        onClick: handleRetryLoad,
+        sx: {
+          textTransform: "none",
+          borderRadius: "20px",
+          px: 4,
+          bgcolor: _tokens.COLORS.magenta_s2,
+          "&:hover": {
+            bgcolor: _tokens.COLORS.secondary_magenta
+          }
+        },
+        children: "Reintentar"
       })]
     })
   });
@@ -544,110 +564,40 @@ var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
           return setPorDesvincular(null);
         },
         onUnlinked: handleOnUnlinked
-      })), showRejectModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
-        title: rejectAll ? "Agregar mensaje para rechazar todo" : "Agregar mensaje de rechazo",
-        show: showRejectModal,
-        customComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.TagAndInput, {
-          inputType: "textarea",
-          inputId: "modal-message-box",
-          index: 0,
-          color: "white"
-        }),
-        buttons: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
-          type: "white",
-          label: "Cancelar",
-          size: 12,
-          onClick: function onClick() {
-            setShowRejectModal(false);
-          }
-        }, "btn-Cancelar"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
-          type: "pink",
-          label: "Aceptar",
-          size: 12,
-          onClick: /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-            var elements, isMessageEmpty, container, existingAlert, alert, fullMessage;
+      })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RejectDialog.RejectDialog, {
+        open: showRejectModal,
+        rejectAll: rejectAll,
+        onCancel: function onCancel() {
+          return setShowRejectModal(false);
+        },
+        onConfirm: /*#__PURE__*/function () {
+          var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(message) {
             return _regenerator.default.wrap(function _callee$(_context) {
               while (1) {
                 switch (_context.prev = _context.next) {
                   case 0:
-                    elements = document.querySelectorAll("#modal-message-box .ql-container .ql-editor > p");
-
-                    if (!(!elements || elements.length === 0)) {
-                      _context.next = 4;
-                      break;
-                    }
-
-                    console.error("Elemento no encontrado");
-                    return _context.abrupt("return");
-
-                  case 4:
-                    isMessageEmpty = Array.from(elements).every(function (el) {
-                      var body = el.innerHTML;
-                      return !body || body.replace(/<.*?\/?>/gm, "").trim() === "";
-                    });
-
-                    if (!isMessageEmpty) {
-                      _context.next = 10;
-                      break;
-                    }
-
-                    container = document.querySelector(".container-customComponent");
-                    existingAlert = container.querySelector(".alert-error");
-
-                    if (!existingAlert) {
-                      alert = document.createElement("div");
-                      alert.className = "alert-error";
-                      alert.style.cssText = "\n                                color: #d32f2f;\n                                background-color: #ffebee;\n                                border: 1px solid #ef5350;\n                                border-radius: 4px;\n                                padding: 12px 16px;\n                                margin-top: 10px;\n                                font-size: 14px;\n                                display: flex;\n                                align-items: center;\n                                gap: 8px;\n                                font-family: 'Roboto', sans-serif;\n                                text-align: center;\n                              ";
-                      alert.innerHTML = "<span>El mensaje no puede estar vac\xEDo.</span>";
-                      container.appendChild(alert);
-                    }
+                    _context.next = 2;
+                    return createComment(message, token);
 
-                    return _context.abrupt("return");
-
-                  case 10:
-                    fullMessage = Array.from(elements).map(function (element) {
-                      return element.innerHTML;
-                    }).join("").replace(/<br\s*\/?>/gi, "\n");
-                    _context.next = 13;
-                    return createComment(fullMessage, token);
-
-                  case 13:
+                  case 2:
                     rejectAll ? sendBulkEvaluation("R") : sendSingleEvaluation("R");
                     setShowRejectModal(false);
 
-                  case 15:
+                  case 4:
                   case "end":
                     return _context.stop();
                 }
               }
             }, _callee);
-          }))
-        }, "btn-Aceptar")]
-      }), state.modal.show && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GenericModal.GenericModal, {
-        componentsArray: [state.modal.image && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-          src: state.modal.image,
-          alt: "modal icon"
-        }, "1"), state.modal.title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-          headerType: "retailer-name-header",
-          text: state.modal.title,
-          color: "white"
-        }, "2"), state.modal.message && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-          headerType: "retailer-name-header",
-          text: state.modal.message,
-          color: "white"
-        }, "3"), state.modal.buttons && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          style: {
-            marginTop: "16px"
-          },
-          children: state.modal.buttons.map(function (button, index) {
-            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
-              buttonType: button.buttonType,
-              label: button.text,
-              onClick: button.action
-            }, index);
-          })
-        }, "4")].filter(Boolean),
-        onClick: function onClick() {
+          }));
+
+          return function (_x) {
+            return _ref2.apply(this, arguments);
+          };
+        }()
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_NoticeDialog.NoticeDialog, {
+        modal: state.modal,
+        onClose: function onClose() {
           return dispatch({
             type: "SET_MODAL",
             payload: {
@@ -658,12 +608,14 @@ var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
             }
           });
         }
-      }), showModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductImageModal.ProductImageModal, {
+      }), showModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImageGallery.ImageGallery, {
         images: state.images_values,
+        initialIndex: state.current_image,
         setShowModal: setShowModal,
         approveRejectButtons: canShowSingleEvaluationButtons(),
         sendToFacilitator: handleOnSendEvaluationToFacilitator
-      }), showVersionSelector && /*#__PURE__*/(0, _jsxRuntime.jsx)(_VersionSelector.VersionSelector, {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_VersionDrawer.VersionDrawer, {
+        open: showVersionSelector,
         modalId: "version-selector",
         articleId: state.product.id_article,
         setVersion: handleOnChangeProductVersion,
@@ -794,7 +746,19 @@ var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
             className: "services-information-container",
             id: "services-information-container",
-            children: state.saving ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.Loading, {}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: state.saving ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
+              alignItems: "center",
+              justifyContent: "center",
+              sx: {
+                py: 6
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.CircularProgress, {
+                size: 32,
+                sx: {
+                  color: _tokens.COLORS.magenta_s2
+                }
+              })
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
               children: [state.active_tab === "Descripción" && (((_state$product8 = state.product) === null || _state$product8 === void 0 ? void 0 : _state$product8.description_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
                 activeSection: state.active_tab,
                 inputGroup: state.descriptions_inputs[0],
@@ -810,10 +774,7 @@ var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
                 setUpdatedDescriptions: handleOnSetUpdatedDescriptions,
                 dinamicHeight: true,
                 compare: compare
-              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-                text: "No cuentas con este servicio",
-                headerType: "input-name-header"
-              })), state.active_tab === "Ficha técnica" && (((_state$product10 = state.product) === null || _state$product10 === void 0 ? void 0 : _state$product10.datasheet_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(NoService, {})), state.active_tab === "Ficha técnica" && (((_state$product10 = state.product) === null || _state$product10 === void 0 ? void 0 : _state$product10.datasheet_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
                 children: (_state$datasheets_inp = state.datasheets_inputs[0]) === null || _state$datasheets_inp === void 0 ? void 0 : (_state$datasheets_inp2 = _state$datasheets_inp.data) === null || _state$datasheets_inp2 === void 0 ? void 0 : _state$datasheets_inp2.map(function (dataGroup, index) {
                   var _state$services2, _state$services2$data;
 
@@ -831,10 +792,7 @@ var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
                     compare: compare
                   }, index + "-" + state.active_retailer.retailer);
                 })
-              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-                text: "No cuentas con este servicio",
-                headerType: "input-name-header"
-              })), state.active_tab === "Imágenes" && (((_state$product11 = state.product) === null || _state$product11 === void 0 ? void 0 : _state$product11.images_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagesSection.ImagesSection, {
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(NoService, {})), state.active_tab === "Imágenes" && (((_state$product11 = state.product) === null || _state$product11 === void 0 ? void 0 : _state$product11.images_status) !== "NS" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagesSection.ImagesSection, {
                 imagesValues: state.images_values,
                 selectedImages: state.selected_images,
                 imageLayout: imageLayout,
@@ -866,10 +824,7 @@ var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
                 getInputProps: getInputProps,
                 isDragActive: isDragActive,
                 openFilePicker: open
-              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
-                text: "No cuentas con este servicio",
-                headerType: "input-name-header"
-              }))]
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(NoService, {}))]
             })
           }), (isUserAssignedToService(state.active_tab) || isAuditorAssigned()) && state.product["".concat((0, _utils.getConceptByTab)(state.active_tab), "_status")] !== "NS" && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CommentBox.CommentBox, {
             comment: state.comment,
@@ -890,7 +845,7 @@ var CreatorsProductEditionView = function CreatorsProductEditionView(_ref) {
           })]
         })]
       })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChangeStatusModal.default, {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ReusedModalsStyles, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChangeStatusModal.default, {
       state: state,
       open: openChangeStatusModal,
       onClose: function onClose() {