contentoh-components-library 21.4.95 → 21.4.97

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

@@ -44,40 +44,34 @@ var ObservationFlag = function ObservationFlag(_ref) {
 
   var observation = _ref.observation,
       contentObservation = _ref.contentObservation,
-      dataProduct = _ref.dataProduct;
-  var PriorityFlags = (_PriorityFlags = {}, (0, _defineProperty2.default)(_PriorityFlags, "none", _noPriority.default), (0, _defineProperty2.default)(_PriorityFlags, "low", _lowPriority.default), (0, _defineProperty2.default)(_PriorityFlags, "medium", _mediumPriority.default), (0, _defineProperty2.default)(_PriorityFlags, "high", _highPriority.default), _PriorityFlags);
+      dataProduct = _ref.dataProduct,
+      isObservationVisible = _ref.isObservationVisible,
+      toggleObservation = _ref.toggleObservation;
+  var PriorityFlags = (_PriorityFlags = {}, (0, _defineProperty2.default)(_PriorityFlags, "none", _noPriority.default), (0, _defineProperty2.default)(_PriorityFlags, "low", _lowPriority.default), (0, _defineProperty2.default)(_PriorityFlags, "medium", _mediumPriority.default), (0, _defineProperty2.default)(_PriorityFlags, "high", _highPriority.default), _PriorityFlags); // const [isObservationVisible, setObservationVisible] = useState(false);
 
-  var _useState = (0, _react.useState)(false),
+  var _useState = (0, _react.useState)(contentObservation || ""),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      isObservationVisible = _useState2[0],
-      setObservationVisible = _useState2[1];
+      material = _useState2[0],
+      setMaterial = _useState2[1];
 
-  var _useState3 = (0, _react.useState)(contentObservation || ""),
+  var _useState3 = (0, _react.useState)(observation),
       _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      material = _useState4[0],
-      setMaterial = _useState4[1];
+      currentObservation = _useState4[0],
+      setCurrentObservation = _useState4[1];
 
-  var _useState5 = (0, _react.useState)(observation),
+  var _useState5 = (0, _react.useState)(false),
       _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      currentObservation = _useState6[0],
-      setCurrentObservation = _useState6[1];
+      showModal = _useState6[0],
+      setShowModal = _useState6[1];
 
-  var _useState7 = (0, _react.useState)(false),
+  var _useState7 = (0, _react.useState)({}),
       _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      showModal = _useState8[0],
-      setShowModal = _useState8[1];
+      modalData = _useState8[0],
+      setModalData = _useState8[1];
 
-  var _useState9 = (0, _react.useState)({}),
-      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      modalData = _useState10[0],
-      setModalData = _useState10[1];
-
-  var textareaRef = (0, _react.useRef)(null);
-
-  var toggleObservation = function toggleObservation() {
-    console.log("VENTANA");
-    setObservationVisible(!isObservationVisible);
-  };
+  var textareaRef = (0, _react.useRef)(null); // const toggleObservation = () => {
+  //   setObservationVisible(!isObservationVisible);
+  // };
 
   (0, _react.useEffect)(function () {
     var handleClickOutside = function handleClickOutside(event) {

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

@@ -17,7 +17,7 @@ var Container = _styledComponents.default.div(_templateObject || (_templateObjec
 
 exports.Container = Container;
 
-var Observation = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  /* height: 100%;\n  width: 100%; */\n"])));
+var Observation = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  /* height: 100%;\n  width: 100%; */\n  z-index: 10000;\n"])));
 
 exports.Observation = Observation;
 

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

@@ -26,7 +26,9 @@ var ProductNameHeader = function ProductNameHeader(_ref) {
       date = _ref.date,
       percentRequired = _ref.percentRequired,
       productObservation = _ref.productObservation,
-      dataProduct = _ref.dataProduct;
+      dataProduct = _ref.dataProduct,
+      isObservationVisible = _ref.isObservationVisible,
+      toggleObservation = _ref.toggleObservation;
   var typeFlag = productObservation !== null && productObservation !== "" ? "high" : "low";
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ScreenHeader, {
@@ -41,7 +43,9 @@ var ProductNameHeader = function ProductNameHeader(_ref) {
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index5.ObservationFlag, {
       observation: typeFlag,
       contentObservation: productObservation,
-      dataProduct: dataProduct
+      dataProduct: dataProduct,
+      isObservationVisible: isObservationVisible,
+      toggleObservation: toggleObservation
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ScreenHeader, {
       headerType: "date-header",
       text: date

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

@@ -35,7 +35,9 @@ var FullProductNameHeader = function FullProductNameHeader(_ref) {
       rejectAll = _ref.rejectAll,
       servicesData = _ref.servicesData,
       showApproveRejectAll = _ref.showApproveRejectAll,
-      productObservation = _ref.productObservation;
+      productObservation = _ref.productObservation,
+      isObservationVisible = _ref.isObservationVisible,
+      toggleObservation = _ref.toggleObservation;
 
   var _useState = (0, _react.useState)([]),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -71,7 +73,9 @@ var FullProductNameHeader = function FullProductNameHeader(_ref) {
       priority: headerData === null || headerData === void 0 ? void 0 : headerData.prio,
       productObservation: productObservation,
       date: getTime((headerData === null || headerData === void 0 ? void 0 : (_headerData$article2 = headerData.article) === null || _headerData$article2 === void 0 ? void 0 : _headerData$article2.timestamp) || (headerData === null || headerData === void 0 ? void 0 : headerData.timestamp)),
-      dataProduct: headerData
+      dataProduct: headerData,
+      isObservationVisible: isObservationVisible,
+      toggleObservation: toggleObservation
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "features-bar-container",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FeaturesBar.FeaturesBar, {

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

@@ -507,6 +507,15 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
       imag = _useState92[0],
       setImag = _useState92[1];
 
+  var _useState93 = (0, _react.useState)(false),
+      _useState94 = (0, _slicedToArray2.default)(_useState93, 2),
+      isObservationVisible = _useState94[0],
+      setObservationVisible = _useState94[1];
+
+  var toggleObservation = function toggleObservation() {
+    setObservationVisible(!isObservationVisible);
+  };
+
   (0, _react.useEffect)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
     var _ref3, id_article;
 
@@ -2022,7 +2031,9 @@ var RetailerProductEdition = function RetailerProductEdition(_ref) {
           rejectAll: function rejectAll() {
             setShowRejectModal(true);
             setValRejAll(true);
-          }
+          },
+          isObservationVisible: isObservationVisible,
+          toggleObservation: toggleObservation
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullTabsMenu.FullTabsMenu, {
           tabsSections: tabsSections,
           status: retailerStatus,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "contentoh-components-library",
-  "version": "21.4.95",
+  "version": "21.4.97",
   "dependencies": {
     "@aws-amplify/auth": "^4.5.3",
     "@aws-amplify/datastore": "^3.11.0",

package/src/components/atoms/ObservationFlag/index.js

@@ -13,6 +13,7 @@ export const ObservationFlag = ({
   observation,
   contentObservation,
   dataProduct,
+  isObservationVisible, toggleObservation,
 }) => {
   const PriorityFlags = {
     ["none"]: without,
@@ -21,7 +22,7 @@ export const ObservationFlag = ({
     ["high"]: high,
   };
 
-  const [isObservationVisible, setObservationVisible] = useState(false);
+ // const [isObservationVisible, setObservationVisible] = useState(false);
   const [material, setMaterial] = useState(contentObservation || "");
   const [currentObservation, setCurrentObservation] = useState(observation);
 
@@ -29,10 +30,9 @@ export const ObservationFlag = ({
   const [modalData, setModalData] = useState({});
 
   const textareaRef = useRef(null);
-  const toggleObservation = () => {
-    console.log("VENTANA");
-    setObservationVisible(!isObservationVisible);
-  };
+  // const toggleObservation = () => {
+  //   setObservationVisible(!isObservationVisible);
+  // };
   useEffect(() => {
     const handleClickOutside = (event) => {
       if (

package/src/components/atoms/ObservationFlag/styles.js

@@ -9,6 +9,7 @@ export const Observation = styled.div`
   position: relative;
   /* height: 100%;
   width: 100%; */
+  z-index: 10000;
 `;
 
 export const Content = styled.div`

package/src/components/molecules/ProductNameHeader/index.js

@@ -13,6 +13,8 @@ export const ProductNameHeader = ({
   percentRequired,
   productObservation,
   dataProduct,
+  isObservationVisible,
+toggleObservation
 }) => {
   const typeFlag =
     productObservation !== null && productObservation !== "" ? "high" : "low";
@@ -30,6 +32,8 @@ export const ProductNameHeader = ({
         observation={typeFlag}
         contentObservation={productObservation}
         dataProduct={dataProduct}
+        isObservationVisible ={isObservationVisible}
+        toggleObservation = {toggleObservation}
       />
       <ScreenHeader headerType={"date-header"} text={date} />
     </Container>

package/src/components/organisms/FullProductNameHeader/index.js

@@ -18,6 +18,8 @@ export const FullProductNameHeader = ({
   servicesData,
   showApproveRejectAll,
   productObservation,
+  isObservationVisible,
+  toggleObservation
 }) => {
   const [retailers, setRetailers] = useState([]);
 
@@ -56,6 +58,8 @@ export const FullProductNameHeader = ({
         productObservation={productObservation}
         date={getTime(headerData?.article?.timestamp || headerData?.timestamp)}
         dataProduct={headerData}
+        isObservationVisible ={isObservationVisible}
+        toggleObservation = {toggleObservation}
       />
       <div className="features-bar-container">
         <FeaturesBar

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

@@ -231,6 +231,13 @@ export const RetailerProductEdition = ({
   const [fich, setFich] = useState([]);
   const [imag, setImag] = useState([]);
 
+  const [isObservationVisible, setObservationVisible] = useState(false);
+
+  const toggleObservation = () => {
+    setObservationVisible(!isObservationVisible);
+  };
+
+
   useEffect(async () => {
     const { id_article } = product?.article || {};
     if (id_article)
@@ -1362,6 +1369,8 @@ export const RetailerProductEdition = ({
               setShowRejectModal(true);
               setValRejAll(true);
             }}
+            isObservationVisible={isObservationVisible}
+            toggleObservation={toggleObservation}
           />
           <FullTabsMenu
             tabsSections={tabsSections}