contentoh-components-library 21.6.55 → 21.6.57

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

@@ -0,0 +1,905 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CreatorsProductEditionView = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _material = require("@mui/material");
+
+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");
+
+var _VariantGroupModal = require("../../organisms/VariantGroupModal");
+
+var _PropagateChangesModal = require("../../organisms/PropagateChangesModal");
+
+var _ChangeStatusModal = _interopRequireDefault(require("../../organisms/ChangeStatusModal"));
+
+var _AiProductEdition = require("../../../contexts/AiProductEdition");
+
+var _errorModal = _interopRequireDefault(require("../../../assets/images/genericModal/errorModal.svg"));
+
+var _useCreatorsProductEdition = require("./hooks/useCreatorsProductEdition");
+
+var _constants = require("./constants");
+
+var _styles = require("./styles");
+
+var _ProductHeader = require("./sections/ProductHeader");
+
+var _TabsBar = require("./sections/TabsBar");
+
+var _ImagePanel = require("./sections/ImagePanel");
+
+var _ImagesSection = require("./sections/ImagesSection");
+
+var _VariantsPanel = require("./sections/VariantsPanel");
+
+var _CommentBox = require("./sections/CommentBox");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _excluded = ["attributes"];
+
+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;
+
+  var tabsSections = _ref.tabsSections,
+      _ref$productSelected = _ref.productSelected,
+      productSelected = _ref$productSelected === void 0 ? {} : _ref$productSelected,
+      _ref$user = _ref.user,
+      user = _ref$user === void 0 ? {} : _ref$user,
+      token = _ref.token,
+      location = _ref.location,
+      _ref$enableDigitalAss = _ref.enableDigitalAssets,
+      enableDigitalAssets = _ref$enableDigitalAss === void 0 ? false : _ref$enableDigitalAss;
+
+  var _useCreatorsProductEd = (0, _useCreatorsProductEdition.useCreatorsProductEdition)({
+    tabsSections: tabsSections,
+    productSelected: productSelected,
+    user: user,
+    token: token,
+    location: location,
+    enableDigitalAssets: enableDigitalAssets
+  }),
+      isRetailer = _useCreatorsProductEd.isRetailer,
+      digitalAssets = _useCreatorsProductEd.digitalAssets,
+      currentTray = _useCreatorsProductEd.currentTray,
+      assetsLoadedFor = _useCreatorsProductEd.assetsLoadedFor,
+      handleOnSetSelectedAssets = _useCreatorsProductEd.handleOnSetSelectedAssets,
+      handleOnSetAllAssetsChecked = _useCreatorsProductEd.handleOnSetAllAssetsChecked,
+      initializeProduct = _useCreatorsProductEd.initializeProduct,
+      loadAuditableData = _useCreatorsProductEd.loadAuditableData,
+      loadData = _useCreatorsProductEd.loadData,
+      handleOnChangeCurrentImage = _useCreatorsProductEd.handleOnChangeCurrentImage,
+      handleOnShowModalGallery = _useCreatorsProductEd.handleOnShowModalGallery,
+      handleOnChangeActiveRetailer = _useCreatorsProductEd.handleOnChangeActiveRetailer,
+      handleOnChangeActiveTab = _useCreatorsProductEd.handleOnChangeActiveTab,
+      handleOnToggleImageLayout = _useCreatorsProductEd.handleOnToggleImageLayout,
+      handleOnToggleObservation = _useCreatorsProductEd.handleOnToggleObservation,
+      handleOnHideObservation = _useCreatorsProductEd.handleOnHideObservation,
+      isAuditorAssigned = _useCreatorsProductEd.isAuditorAssigned,
+      isAssignedAs = _useCreatorsProductEd.isAssignedAs,
+      isUserAssignedToService = _useCreatorsProductEd.isUserAssignedToService,
+      canShowSingleEvaluationButtons = _useCreatorsProductEd.canShowSingleEvaluationButtons,
+      canShowBulkEvaluationButtons = _useCreatorsProductEd.canShowBulkEvaluationButtons,
+      getStatusByCurrentServiceAndRetailer = _useCreatorsProductEd.getStatusByCurrentServiceAndRetailer,
+      handleOnSaveAssets = _useCreatorsProductEd.handleOnSaveAssets,
+      handleOnClickSaveImages = _useCreatorsProductEd.handleOnClickSaveImages,
+      loadFamily = _useCreatorsProductEd.loadFamily,
+      hijosDelProducto = _useCreatorsProductEd.hijosDelProducto,
+      esHijoDeOtro = _useCreatorsProductEd.esHijoDeOtro,
+      puedeAgruparse = _useCreatorsProductEd.puedeAgruparse,
+      handleOnUnlinked = _useCreatorsProductEd.handleOnUnlinked,
+      loadVariantGroup = _useCreatorsProductEd.loadVariantGroup,
+      handleOnLeaveGroup = _useCreatorsProductEd.handleOnLeaveGroup,
+      openFamilyMember = _useCreatorsProductEd.openFamilyMember,
+      handleOnLinkedVariants = _useCreatorsProductEd.handleOnLinkedVariants,
+      handleOnRestoreInheritance = _useCreatorsProductEd.handleOnRestoreInheritance,
+      cambiosDeFichaTecnica = _useCreatorsProductEd.cambiosDeFichaTecnica,
+      cambiosDeDescripciones = _useCreatorsProductEd.cambiosDeDescripciones,
+      handleOnClickSave = _useCreatorsProductEd.handleOnClickSave,
+      handleOnSetUpdatedDescriptions = _useCreatorsProductEd.handleOnSetUpdatedDescriptions,
+      handleOnSetUpdatedDatasheets = _useCreatorsProductEd.handleOnSetUpdatedDatasheets,
+      handleOnDownloadAssets = _useCreatorsProductEd.handleOnDownloadAssets,
+      handleOnAskToDeleteAssets = _useCreatorsProductEd.handleOnAskToDeleteAssets,
+      handleOnAskToDeleteImages = _useCreatorsProductEd.handleOnAskToDeleteImages,
+      handleOnApproveSingleService = _useCreatorsProductEd.handleOnApproveSingleService,
+      handleOnRejectSingleService = _useCreatorsProductEd.handleOnRejectSingleService,
+      sendSingleEvaluation = _useCreatorsProductEd.sendSingleEvaluation,
+      handleOnApproveAllServices = _useCreatorsProductEd.handleOnApproveAllServices,
+      handleOnRejectAllServices = _useCreatorsProductEd.handleOnRejectAllServices,
+      sendBulkEvaluation = _useCreatorsProductEd.sendBulkEvaluation,
+      handleOnChangeAssignations = _useCreatorsProductEd.handleOnChangeAssignations,
+      handleOnSetAssignation = _useCreatorsProductEd.handleOnSetAssignation,
+      handleOnSetImages = _useCreatorsProductEd.handleOnSetImages,
+      handleOnSetCheckAll = _useCreatorsProductEd.handleOnSetCheckAll,
+      handleOnSetSelectedImages = _useCreatorsProductEd.handleOnSetSelectedImages,
+      handleOnSubmitComment = _useCreatorsProductEd.handleOnSubmitComment,
+      handleOnSendEvaluationToFacilitator = _useCreatorsProductEd.handleOnSendEvaluationToFacilitator,
+      isEvaluationFinished = _useCreatorsProductEd.isEvaluationFinished,
+      handleOnChangeProductVersion = _useCreatorsProductEd.handleOnChangeProductVersion,
+      handleRetryLoad = _useCreatorsProductEd.handleRetryLoad,
+      showVersionSelector = _useCreatorsProductEd.showVersionSelector,
+      setShowVersionSelector = _useCreatorsProductEd.setShowVersionSelector,
+      auditableVersion = _useCreatorsProductEd.auditableVersion,
+      setAuditableVersion = _useCreatorsProductEd.setAuditableVersion,
+      headerTop = _useCreatorsProductEd.headerTop,
+      setHeaderTop = _useCreatorsProductEd.setHeaderTop,
+      shotThd = _useCreatorsProductEd.shotThd,
+      setShotThd = _useCreatorsProductEd.setShotThd,
+      observation = _useCreatorsProductEd.observation,
+      setObservation = _useCreatorsProductEd.setObservation,
+      showRejectModal = _useCreatorsProductEd.showRejectModal,
+      setShowRejectModal = _useCreatorsProductEd.setShowRejectModal,
+      isObservationVisible = _useCreatorsProductEd.isObservationVisible,
+      setObservationVisible = _useCreatorsProductEd.setObservationVisible,
+      imageLayout = _useCreatorsProductEd.imageLayout,
+      setImageLayout = _useCreatorsProductEd.setImageLayout,
+      crossComment = _useCreatorsProductEd.crossComment,
+      setCrossComment = _useCreatorsProductEd.setCrossComment,
+      statusArray = _useCreatorsProductEd.statusArray,
+      setStatusArray = _useCreatorsProductEd.setStatusArray,
+      rejectAll = _useCreatorsProductEd.rejectAll,
+      setRejectAll = _useCreatorsProductEd.setRejectAll,
+      showLinkVariants = _useCreatorsProductEd.showLinkVariants,
+      setShowLinkVariants = _useCreatorsProductEd.setShowLinkVariants,
+      family = _useCreatorsProductEd.family,
+      setFamily = _useCreatorsProductEd.setFamily,
+      showFamily = _useCreatorsProductEd.showFamily,
+      setShowFamily = _useCreatorsProductEd.setShowFamily,
+      loadingVariant = _useCreatorsProductEd.loadingVariant,
+      setLoadingVariant = _useCreatorsProductEd.setLoadingVariant,
+      variantGroup = _useCreatorsProductEd.variantGroup,
+      setVariantGroup = _useCreatorsProductEd.setVariantGroup,
+      showGroup = _useCreatorsProductEd.showGroup,
+      setShowGroup = _useCreatorsProductEd.setShowGroup,
+      showGroupModal = _useCreatorsProductEd.showGroupModal,
+      setShowGroupModal = _useCreatorsProductEd.setShowGroupModal,
+      porDesvincular = _useCreatorsProductEd.porDesvincular,
+      setPorDesvincular = _useCreatorsProductEd.setPorDesvincular,
+      avisoFamilia = _useCreatorsProductEd.avisoFamilia,
+      setAvisoFamilia = _useCreatorsProductEd.setAvisoFamilia,
+      pendingPropagation = _useCreatorsProductEd.pendingPropagation,
+      setPendingPropagation = _useCreatorsProductEd.setPendingPropagation,
+      preparandoPropagacion = _useCreatorsProductEd.preparandoPropagacion,
+      setPreparandoPropagacion = _useCreatorsProductEd.setPreparandoPropagacion,
+      auditServices = _useCreatorsProductEd.auditServices,
+      setAuditServices = _useCreatorsProductEd.setAuditServices,
+      auditDatasheets = _useCreatorsProductEd.auditDatasheets,
+      setAuditDatasheets = _useCreatorsProductEd.setAuditDatasheets,
+      auditDescriptions = _useCreatorsProductEd.auditDescriptions,
+      setAuditDescriptions = _useCreatorsProductEd.setAuditDescriptions,
+      showModal = _useCreatorsProductEd.showModal,
+      setShowModal = _useCreatorsProductEd.setShowModal,
+      compare = _useCreatorsProductEd.compare,
+      setCompare = _useCreatorsProductEd.setCompare,
+      openChangeStatusModal = _useCreatorsProductEd.openChangeStatusModal,
+      setOpenChangeStatusModal = _useCreatorsProductEd.setOpenChangeStatusModal,
+      assetNotices = _useCreatorsProductEd.assetNotices,
+      setAssetNotices = _useCreatorsProductEd.setAssetNotices,
+      activeTray = _useCreatorsProductEd.activeTray,
+      setActiveTray = _useCreatorsProductEd.setActiveTray,
+      state = _useCreatorsProductEd.state,
+      dispatch = _useCreatorsProductEd.dispatch,
+      saveDatasheets = _useCreatorsProductEd.saveDatasheets,
+      saveDescriptions = _useCreatorsProductEd.saveDescriptions,
+      updateImages = _useCreatorsProductEd.updateImages,
+      deleteImages = _useCreatorsProductEd.deleteImages,
+      saveAssets = _useCreatorsProductEd.saveAssets,
+      registerUploadedAssets = _useCreatorsProductEd.registerUploadedAssets,
+      handleOnDownloadImages = _useCreatorsProductEd.handleOnDownloadImages,
+      createComment = _useCreatorsProductEd.createComment,
+      getRootProps = _useCreatorsProductEd.getRootProps,
+      getInputProps = _useCreatorsProductEd.getInputProps,
+      isDragActive = _useCreatorsProductEd.isDragActive,
+      open = _useCreatorsProductEd.open;
+
+  var ProductEditionSkeleton = function ProductEditionSkeleton() {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+      headerTop: 0,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+        px: 1.5,
+        py: 1,
+        pb: 0,
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+          variant: "text",
+          width: "min(300px, 60%)",
+          height: 40
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
+          direction: "row",
+          spacing: 2,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+            variant: "circular",
+            width: 32,
+            height: 32
+          })
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "data-container",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "image-data-panel",
+          style: {
+            display: "flex",
+            flexDirection: "column",
+            gap: "20px"
+          },
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+            variant: "rounded",
+            width: "100%",
+            height: 320
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
+            direction: "row",
+            spacing: 2,
+            justifyContent: "center",
+            children: [1, 2, 3, 4].map(function (item) {
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                variant: "rounded",
+                width: 60,
+                height: 80
+              }, item);
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+            mt: 2,
+            children: [1, 2, 3, 4].map(function (item) {
+              return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+                display: "flex",
+                justifyContent: "space-between",
+                py: 1,
+                borderBottom: "1px solid #f0f0f0",
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                  variant: "text",
+                  width: "40%"
+                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                  variant: "text",
+                  width: "20%"
+                })]
+              }, item);
+            })
+          })]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "product-information",
+          style: {
+            flex: 1,
+            display: "flex",
+            flexDirection: "column",
+            gap: "14px"
+          },
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+              variant: "text",
+              width: "80%",
+              height: 50
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
+              direction: "row",
+              spacing: 2,
+              alignItems: "center",
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                variant: "rounded",
+                width: "30%",
+                height: 24
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                variant: "rounded",
+                width: "45%",
+                height: 24
+              })]
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+            display: "flex",
+            gap: 4,
+            pb: 1,
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+              variant: "text",
+              width: "28%",
+              height: 45
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+              variant: "text",
+              width: "28%",
+              height: 45
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+              variant: "text",
+              width: "28%",
+              height: 45
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+            display: "flex",
+            flexDirection: "column",
+            gap: 4,
+            children: [1, 2, 3].map(function (item) {
+              return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+                  display: "flex",
+                  justifyContent: "space-between",
+                  alignItems: "center",
+                  mb: 1,
+                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                    variant: "text",
+                    width: "30%",
+                    height: 24
+                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                    variant: "rounded",
+                    width: "min(175px, 35%)",
+                    height: 25,
+                    sx: {
+                      borderRadius: "7.5px"
+                    }
+                  })]
+                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                  variant: "rounded",
+                  width: "100%",
+                  height: 70
+                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+                  display: "flex",
+                  justifyContent: "flex-end",
+                  mt: 0.5,
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                    variant: "text",
+                    width: 60
+                  })
+                })]
+              }, item);
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+            mt: "auto",
+            pt: 4,
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+              variant: "rounded",
+              width: "100%",
+              height: 120
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+              display: "flex",
+              justifyContent: "flex-end",
+              gap: 2,
+              mt: 2,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                variant: "rounded",
+                width: "min(180px, 45%)",
+                height: 45,
+                sx: {
+                  borderRadius: "24px"
+                }
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Skeleton, {
+                variant: "rounded",
+                width: "min(180px, 45%)",
+                height: 45,
+                sx: {
+                  borderRadius: "24px"
+                }
+              })]
+            })]
+          })]
+        })]
+      })]
+    });
+  }; // Si la carga falló y no tenemos servicios, mostramos un estado de error con
+  // opción de reintentar en vez de quedarnos colgados en el skeleton.
+
+
+  if (!state.loading && ((_state$errors = state.errors) === null || _state$errors === void 0 ? void 0 : _state$errors.length) > 0 && !state.services) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
+    headerTop: 0,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center",
+      gap: 2,
+      sx: {
+        minHeight: "60vh",
+        textAlign: "center",
+        padding: "40px"
+      },
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+        src: _errorModal.default,
+        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: {
+          color: "#666",
+          maxWidth: 420
+        },
+        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
+      })]
+    })
+  });
+  /*
+    `images_values` entra al guard junto a `services` y `product`.
+     React 17 no agrupa los dispatch que van después de un `await`: cada uno
+    re-renderiza al instante. En `loadData` el orden es SET_SERVICES →
+    …_INPUTS → SET_IMAGES_VALUES, así que había renders intermedios con
+    `services` ya puesto —el guard los dejaba pasar— y el resto todavía en null.
+    El cuerpo de abajo lee `datasheets_inputs[1]`, `descriptions_inputs[0]` y
+    `images_values.values` sin protección, y tumbaba la pantalla entera.
+     Se comprueba `images_values` y no cada uno: es el ÚLTIMO que `loadData`
+    despacha, así que si ya está, los anteriores también.
+  */
+
+  if (state.loading || !state.services || !state.product || !state.images_values) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ProductEditionSkeleton, {})
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_AiProductEdition.AiProductEditionProvider, {
+    isCreatorsEdition: true,
+    user: user,
+    token: token,
+    state: state,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+      headerTop: headerTop,
+      children: [pendingPropagation && /*#__PURE__*/(0, _jsxRuntime.jsx)(_PropagateChangesModal.PropagateChangesModal, {
+        changedAttributes: pendingPropagation.cambios,
+        kind: (_pendingPropagation$k = pendingPropagation.kind) !== null && _pendingPropagation$k !== void 0 ? _pendingPropagation$k : "datasheet",
+        variants: esHijoDeOtro ? [] : ((_family$variants = family === null || family === void 0 ? void 0 : family.variants) !== null && _family$variants !== void 0 ? _family$variants : []).filter(function (v) {
+          return !v.isCurrent;
+        }),
+        groupMembers: ((_variantGroup$members = variantGroup === null || variantGroup === void 0 ? void 0 : variantGroup.members) !== null && _variantGroup$members !== void 0 ? _variantGroup$members : []).filter(function (m) {
+          return !m.isCurrent;
+        }),
+        groupCode: (_variantGroup$group = variantGroup === null || variantGroup === void 0 ? void 0 : variantGroup.group) !== null && _variantGroup$group !== void 0 ? _variantGroup$group : null,
+        saving: state.saving,
+        onCancel: function onCancel() {
+          return setPendingPropagation(null);
+        },
+        onConfirm: function onConfirm(propagation) {
+          var esDescripcion = pendingPropagation.kind === "description";
+          setPendingPropagation(null);
+
+          if (!propagation) {
+            if (esDescripcion) saveDescriptions(token);else saveDatasheets(token);
+            return;
+          }
+          /*
+            El diálogo habla de «atributos» porque es el mismo componente
+            para las dos pestañas. Al guardar hay que ponerlo en la lista
+            que corresponde: el servidor recibe `attributes` o
+            `descriptions`, nunca una por la otra.
+          */
+
+
+          var attributes = propagation.attributes,
+              destinos = (0, _objectWithoutProperties2.default)(propagation, _excluded);
+
+          if (esDescripcion) {
+            saveDescriptions(token, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, destinos), {}, {
+              descriptions: attributes
+            }));
+          } else {
+            saveDatasheets(token, propagation);
+          }
+        }
+      }), showLinkVariants && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkVariantsModal.LinkVariantsModal, {
+        articleId: (_state$product = state.product) === null || _state$product === void 0 ? void 0 : _state$product.id_article,
+        articleName: (_state$product2 = state.product) === null || _state$product2 === void 0 ? void 0 : _state$product2.name,
+        articleUpc: (_state$product3 = state.product) === null || _state$product3 === void 0 ? void 0 : _state$product3.upc,
+        activeRetailerId: (_state$active_retaile = state.active_retailer) === null || _state$active_retaile === void 0 ? void 0 : _state$active_retaile.id_retailer,
+        token: token,
+        onClose: function onClose() {
+          return setShowLinkVariants(false);
+        },
+        onLinked: handleOnLinkedVariants
+      }), showGroupModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_VariantGroupModal.VariantGroupModal, {
+        articleId: (_state$product4 = state.product) === null || _state$product4 === void 0 ? void 0 : _state$product4.id_article,
+        articleName: (_state$product5 = state.product) === null || _state$product5 === void 0 ? void 0 : _state$product5.name,
+        articleUpc: (_state$product6 = state.product) === null || _state$product6 === void 0 ? void 0 : _state$product6.upc,
+        currentGroup: (_variantGroup$group2 = variantGroup === null || variantGroup === void 0 ? void 0 : variantGroup.group) !== null && _variantGroup$group2 !== void 0 ? _variantGroup$group2 : null,
+        token: token,
+        onClose: function onClose() {
+          return setShowGroupModal(false);
+        },
+        onSaved: function onSaved(result) {
+          setVariantGroup(result);
+          setShowGroup(true);
+        }
+      }), porDesvincular && /*#__PURE__*/(0, _jsxRuntime.jsx)(_UnlinkVariantModal.UnlinkVariantModal, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, porDesvincular), {}, {
+        token: token,
+        onClose: function onClose() {
+          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;
+            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);
+                    }
+
+                    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:
+                    rejectAll ? sendBulkEvaluation("R") : sendSingleEvaluation("R");
+                    setShowRejectModal(false);
+
+                  case 15:
+                  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 dispatch({
+            type: "SET_MODAL",
+            payload: {
+              show: false,
+              title: "",
+              message: "",
+              image: null
+            }
+          });
+        }
+      }), showModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductImageModal.ProductImageModal, {
+        images: state.images_values,
+        setShowModal: setShowModal,
+        approveRejectButtons: canShowSingleEvaluationButtons(),
+        sendToFacilitator: handleOnSendEvaluationToFacilitator
+      }), showVersionSelector && /*#__PURE__*/(0, _jsxRuntime.jsx)(_VersionSelector.VersionSelector, {
+        modalId: "version-selector",
+        articleId: state.product.id_article,
+        setVersion: handleOnChangeProductVersion,
+        companyName: state.product.company,
+        currentVersion: state.product.version,
+        setShowVersionSelector: setShowVersionSelector,
+        jwt: token
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTop.HeaderTop, {
+        setHeaderTop: setHeaderTop,
+        auditableVersion: auditableVersion,
+        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: state.product,
+        token: token,
+        activeRetailer: {
+          id: (_state$active_retaile2 = state.active_retailer) === null || _state$active_retaile2 === void 0 ? void 0 : _state$active_retaile2.id_retailer,
+          name: (_state$active_retaile3 = state.active_retailer) === null || _state$active_retaile3 === void 0 ? void 0 : _state$active_retaile3.retailer
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "data-container",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "image-data-panel",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagePanel.ImagePanel
+          /*
+            `images_values` puede ser null en pleno render: React 17 no
+            agrupa los dispatch que van después de un `await` y hay un render
+            con `services` puesto y las imágenes todavía no (ver el guard de
+            arriba). Por eso las interrogaciones.
+          */
+          , {
+            imagesArray: state.images_values || [],
+            activeImage: (_state$images_values$ = (_state$images_values = state.images_values) === null || _state$images_values === void 0 ? void 0 : (_state$images_values$2 = _state$images_values.values) === null || _state$images_values$2 === void 0 ? void 0 : _state$images_values$2[state.current_image]) !== null && _state$images_values$ !== void 0 ? _state$images_values$ : {},
+            currentIndex: state.current_image,
+            setActiveImage: handleOnChangeCurrentImage,
+            setShowModal: handleOnShowModalGallery // datos de la imagen
+            ,
+            lists: state.images_values || [],
+            assignationsImages: state.collaborator_assignations["Imágenes"],
+            imagesStatus: ((_state$product7 = state.product) === null || _state$product7 === void 0 ? void 0 : _state$product7.images_status) || "-",
+            retailerSelected: (_state$active_retaile4 = state.active_retailer) === null || _state$active_retaile4 === void 0 ? void 0 : _state$active_retaile4.id_retailer,
+            isRetailer: isRetailer,
+            version: state.product.version,
+            shotThd: shotThd,
+            setShowVersionSelector: setShowVersionSelector,
+            setImages: handleOnChangeCurrentImage,
+            setAssignation: handleOnChangeAssignations,
+            onClickSave: handleOnClickSaveImages,
+            showSaveButton: isAuditorAssigned() || isUserAssignedToService()
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "product-information",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_VariantsPanel.VariantsPanel, {
+            product: state.product,
+            esHijoDeOtro: esHijoDeOtro,
+            hijosDelProducto: hijosDelProducto,
+            family: family,
+            showFamily: showFamily,
+            setShowFamily: setShowFamily,
+            loadFamily: loadFamily,
+            loadingVariant: loadingVariant,
+            avisoFamilia: avisoFamilia,
+            openFamilyMember: openFamilyMember,
+            setPorDesvincular: setPorDesvincular,
+            setShowLinkVariants: setShowLinkVariants,
+            puedeAgruparse: puedeAgruparse,
+            variantGroup: variantGroup,
+            showGroup: showGroup,
+            setShowGroup: setShowGroup,
+            setShowGroupModal: setShowGroupModal,
+            handleOnLeaveGroup: handleOnLeaveGroup
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductHeader.ProductHeader // states
+          , {
+            headerData: state.product,
+            productObservation: observation,
+            percent: (_state$active_percent = (_state$active_percent2 = state.active_percentage) === null || _state$active_percent2 === void 0 ? void 0 : (_state$active_percent3 = _state$active_percent2.percentagesGeneral) === null || _state$active_percent3 === void 0 ? void 0 : _state$active_percent3.required) !== null && _state$active_percent !== void 0 ? _state$active_percent : 0,
+            activeRetailer: {
+              id: (_state$active_retaile5 = state.active_retailer) === null || _state$active_retaile5 === void 0 ? void 0 : _state$active_retaile5.id_retailer,
+              name: (_state$active_retaile6 = state.active_retailer) === null || _state$active_retaile6 === void 0 ? void 0 : _state$active_retaile6.retailer,
+              image: (_state$active_retaile7 = state.active_retailer) === null || _state$active_retaile7 === void 0 ? void 0 : _state$active_retaile7.image
+            },
+            servicesData: state.services_data ? state.services_data : null,
+            isObservationVisible: isObservationVisible // actions
+            ,
+            setActiveRetailer: handleOnChangeActiveRetailer,
+            approve: handleOnApproveSingleService,
+            approveAll: handleOnApproveAllServices,
+            reject: handleOnRejectSingleService,
+            rejectAll: handleOnRejectAllServices,
+            toggleObservation: handleOnToggleObservation,
+            hideObservation: handleOnHideObservation // sendToFacilitator={handleOnSendEvaluationToFacilitator} // No se usa?
+            // validations
+            ,
+            showApproveRejectAll: canShowBulkEvaluationButtons() || isAuditorAssigned() || isUserAssignedToService(),
+            showValidationButtons: canShowSingleEvaluationButtons() && (isAuditorAssigned() || isUserAssignedToService())
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabsBar.TabsBar, {
+            tabsSections: tabsSections,
+            imageLayout: imageLayout,
+            status: getStatusByCurrentServiceAndRetailer(),
+            activeTab: state.active_tab,
+            isRetailer: isRetailer,
+            assig: state.collaborator_assignations[state.active_tab],
+            version: state.product.version,
+            updatedDescriptions: state.updated_descriptions_inputs,
+            updatedDatasheets: state.updated_datasheets_inputs,
+            updatedImages: state.updated_images_values,
+            images: state.services.images // setters
+            ,
+            setActiveTab: handleOnChangeActiveTab,
+            setImageLayout: handleOnToggleImageLayout,
+            setUpdatedDescriptions: handleOnSetUpdatedDescriptions,
+            setUpdatedDatasheets: handleOnSetUpdatedDatasheets,
+            setAssignation: handleOnSetAssignation // No se usa?
+            ,
+            setImages: handleOnSetImages // No se usa?
+            ,
+            setShowVersionSelector: setShowVersionSelector // actions
+            // El botón actúa sobre la bandeja visible: en activos descargaba
+            // las imágenes del producto, que no es lo que el usuario pidió.
+            ,
+            downloadImages: currentTray === _GalleryTrayTabs.TRAYS.ASSETS ? handleOnDownloadAssets : handleOnDownloadImages,
+            askToDeleteImages: handleOnAskToDeleteImages,
+            showSaveButton: isAuditorAssigned() || isUserAssignedToService(),
+            onClickSave: handleOnClickSave // validations
+            ,
+            canAssign: ![7, 8].includes(user.id_role)
+          }), /*#__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.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],
+                updatedDescriptions: state.updated_descriptions_inputs
+                /* El parentesco es del producto, no del servicio: los
+                   dos endpoints lo devuelven igual. */
+                ,
+                variant: (_state$services = state.services) === null || _state$services === void 0 ? void 0 : (_state$services$datas = _state$services.datasheets) === null || _state$services$datas === void 0 ? void 0 : _state$services$datas.variant,
+                onRestoreInheritance: handleOnRestoreInheritance,
+                articleId: (_state$product9 = state.product) === null || _state$product9 === void 0 ? void 0 : _state$product9.id_article,
+                version: state.product.version,
+                auditInputGroup: auditDescriptions[0],
+                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, {
+                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;
+
+                  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputGroup.InputGroup, {
+                    articleId: state.product.id_article,
+                    version: state.version,
+                    activeSection: state.active_tab,
+                    inputGroup: dataGroup,
+                    dataInputs: state.datasheets_inputs[1],
+                    variant: (_state$services2 = state.services) === null || _state$services2 === void 0 ? void 0 : (_state$services2$data = _state$services2.datasheets) === null || _state$services2$data === void 0 ? void 0 : _state$services2$data.variant,
+                    onRestoreInheritance: handleOnRestoreInheritance,
+                    auditInputs: auditDatasheets[1],
+                    updatedDatasheets: state.updated_datasheets_inputs,
+                    setUpdatedDatasheets: handleOnSetUpdatedDatasheets,
+                    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, {
+                imagesValues: state.images_values,
+                selectedImages: state.selected_images,
+                imageLayout: imageLayout,
+                enableDigitalAssets: enableDigitalAssets,
+                currentTray: currentTray,
+                setActiveTray: setActiveTray,
+                digitalAssets: digitalAssets,
+                unsavedAssets: (0, _assets.countUnsavedAssets)(state),
+                selectedAssets: state.selected_assets,
+                setSelectedAssets: handleOnSetSelectedAssets,
+                setAllAssetsChecked: handleOnSetAllAssetsChecked,
+                canEdit: isAuditorAssigned() || isUserAssignedToService(),
+                setCheckAll: handleOnSetCheckAll,
+                setSelectedImages: handleOnSetSelectedImages,
+                onChangeCurrentImage: handleOnChangeCurrentImage,
+                onUpdateImage: function onUpdateImage(item) {
+                  return dispatch({
+                    type: "UPDATE_IMAGE_VALUE",
+                    payload: item
+                  });
+                },
+                onSelectImage: function onSelectImage(item) {
+                  return dispatch({
+                    type: "SET_SELECTED_IMAGE",
+                    payload: item
+                  });
+                },
+                getRootProps: getRootProps,
+                getInputProps: getInputProps,
+                isDragActive: isDragActive,
+                openFilePicker: open
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+                text: "No cuentas con este servicio",
+                headerType: "input-name-header"
+              }))]
+            })
+          }), (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,
+            crossComment: crossComment,
+            createComment: createComment,
+            token: token,
+            dispatch: dispatch,
+            showChangeStatus: _constants.allowedAccountsToViewChangeStatus.includes(user === null || user === void 0 ? void 0 : user.email),
+            onOpenChangeStatus: function onOpenChangeStatus() {
+              return setOpenChangeStatusModal(true);
+            },
+            showSendEvaluation: [7, 8].includes(user.id_role) // Solo para los roles 7 y 8, como en la vista original: para
+            // el rol 6, `isEvaluationFinished` usa un `srv` que no existe
+            // (defecto heredado) y tumbaría la pantalla.
+            ,
+            canSendEvaluation: [7, 8].includes(user.id_role) && isEvaluationFinished(user.id_role, state.active_tab, statusArray) && state.missing_required_fields[state.active_tab] === 0,
+            onSendEvaluation: handleOnSendEvaluationToFacilitator
+          })]
+        })]
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChangeStatusModal.default, {
+      state: state,
+      open: openChangeStatusModal,
+      onClose: function onClose() {
+        setOpenChangeStatusModal(false);
+      },
+      reloadData: loadData,
+      token: token
+    })]
+  });
+};
+
+exports.CreatorsProductEditionView = CreatorsProductEditionView;