contentoh-components-library 21.4.119 → 21.4.121

package/dist/components/atoms/Multiselect/Multiselect.stories.js

@@ -40,7 +40,7 @@ MultiselectDefault.args = {
     }, {
       "groupId": 65,
       "groupName": "Jefe Comercial",
-      "userContentGroup": 0
+      "userContentGroup": 1
     }, {
       "groupId": 66,
       "groupName": "Planogramas",

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

@@ -13,9 +13,11 @@ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"))
 
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
 
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
 
-var _objectSpread6 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _objectSpread4 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 
@@ -109,15 +111,11 @@ var Multiselect = function Multiselect(_ref) {
       setModalData = _useState14[1];
 
   var loadUserGroups = function loadUserGroups(updatedValues) {
-    if (updatedValues && updatedValues.length > 0) {
-      // Ensure updatedValues is defined and has elements
-      setSelectValues(function (prevValues) {
-        return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, prevValues), {}, (0, _defineProperty2.default)({}, idUser, updatedValues.map(function (groupInfo) {
-          return groupInfo.groupName;
-        })));
-      });
+    if (updatedValues && updatedValues.length > 0) {// setSelectValues((prevValues) => ({
+      //   ...prevValues,
+      //   [idUser]: updatedValues.map((groupInfo) => groupInfo.groupName),
+      // }));
     } else {
-      // If no updated values, load initial data
       var hasUserContentGroup1 = groups.some(function (group) {
         return group.userContentGroup === 1;
       });
@@ -129,11 +127,11 @@ var Multiselect = function Multiselect(_ref) {
           return group.groupName;
         }) || [];
         setSelectValues(function (prevValues) {
-          return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, prevValues), {}, (0, _defineProperty2.default)({}, idUser, initialSelectedValues));
+          return (0, _objectSpread4.default)((0, _objectSpread4.default)({}, prevValues), {}, (0, _defineProperty2.default)({}, idUser, initialSelectedValues));
         });
       } else {
         setSelectValues(function (prevValues) {
-          return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, prevValues), {}, (0, _defineProperty2.default)({}, idUser, ["Sin grupos asignados"]));
+          return (0, _objectSpread4.default)((0, _objectSpread4.default)({}, prevValues), {}, (0, _defineProperty2.default)({}, idUser, ["Sin grupos asignados"]));
         });
       }
     }
@@ -143,12 +141,7 @@ var Multiselect = function Multiselect(_ref) {
 
   (0, _react.useEffect)(function () {
     loadUserGroups();
-  }, [idUser, groups]); // useEffect(() => {
-  //   if (selectValues[userId]) {
-  //     setSelectedItems(selectValues[userId]);
-  //   }
-  //   console.log("setSelecr",selectValues)
-  // }, [selectValues, userId]);
+  }, [idUser, groups]);
 
   var onChange = function onChange(evt) {
     setText(evt.target.value);
@@ -157,9 +150,10 @@ var Multiselect = function Multiselect(_ref) {
   var handleChange = function handleChange(userId) {
     return function (event) {
       var value = event.target.value;
+      var filteredArrayCopy = (0, _toConsumableArray2.default)(filters);
       var updatedValues = groups.map(function (group) {
         var isSelected = value.includes(group.groupName);
-        return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, group), {}, {
+        return (0, _objectSpread4.default)((0, _objectSpread4.default)({}, group), {}, {
           userContentGroup: isSelected ? 1 : 0
         });
       });
@@ -167,26 +161,40 @@ var Multiselect = function Multiselect(_ref) {
         return group.userContentGroup === 1;
       }).map(function (group) {
         return group.groupName;
-      }));
-      setSelectValues(function (prevValues) {
-        return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, prevValues), {}, (0, _defineProperty2.default)({}, userId, updatedValues.filter(function (group) {
-          return group.userContentGroup === 1;
-        }).map(function (group) {
-          return group.groupName;
-        })));
+      })); // setSelectValues((prevValues) => ({
+      //   ...prevValues,
+      //   [userId]: updatedValues
+      //     .filter((group) => group.userContentGroup === 1)
+      //     .map((group) => group.groupName),
+      // }));
+
+      var changes = updatedValues.reduce(function (result, group, index) {
+        if (group.userContentGroup !== filteredArrayCopy[index].userContentGroup) {
+          result.push({
+            groupId: group.groupId,
+            userContentGroup: group.userContentGroup
+          });
+        }
+
+        return result;
+      }, []);
+      var updatedGroups = changes.filter(function (change) {
+        return change.userContentGroup === 1;
+      }).map(function (change) {
+        return change.groupId;
       });
-      var groupIds = updatedValues.filter(function (group) {
-        return group.userContentGroup === 1;
-      }).map(function (group) {
-        return group.groupId;
+      var deletedGroups = changes.filter(function (change) {
+        return change.userContentGroup === 0;
+      }).map(function (change) {
+        return change.groupId;
       });
 
-      if (groupIds.length > 0) {
-        // Llamada a la función de actualización si hay grupos seleccionados
-        updateGroup(groupIds);
-      } else {
-        // Llamada a la función de eliminación si no hay grupos seleccionados
-        deleteGroup([userId]);
+      if (updatedGroups.length > 0) {
+        updateGroup(updatedGroups);
+      }
+
+      if (deletedGroups.length > 0) {
+        deleteGroup(deletedGroups);
       }
     };
   }; //actualiza los grupos seleccionados
@@ -213,38 +221,22 @@ var Multiselect = function Multiselect(_ref) {
 
             case 4:
               response = _context.sent;
-              setModalData({
-                show: true,
-                className: "modal-save",
-                title: "",
-                message: "El cambio de grupo fue aplicado correctamente.",
-                icon: "successv2",
-                buttons: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonV.ButtonV2, {
-                  type: "pink",
-                  label: "Aceptar",
-                  size: 12,
-                  onClick: function onClick() {
-                    setModalData(false);
-                  }
-                }, "btn-Aceptar-guardar")]
-              });
               console.log("grupo actualizado correctamente", response.data.body);
-              console.log("body", body);
               loadUserGroups();
-              _context.next = 14;
+              _context.next = 12;
               break;
 
-            case 11:
-              _context.prev = 11;
+            case 9:
+              _context.prev = 9;
               _context.t0 = _context["catch"](0);
               console.error("Error al cambiar grupos de usuarios:", _context.t0);
 
-            case 14:
+            case 12:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[0, 11]]);
+      }, _callee, null, [[0, 9]]);
     }));
 
     return function updateGroup(_x) {
@@ -254,7 +246,7 @@ var Multiselect = function Multiselect(_ref) {
 
 
   var deleteGroup = /*#__PURE__*/function () {
-    var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(userIds) {
+    var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(groups) {
       var body, response;
       return _regenerator.default.wrap(function _callee2$(_context2) {
         while (1) {
@@ -262,8 +254,8 @@ var Multiselect = function Multiselect(_ref) {
             case 0:
               _context2.prev = 0;
               body = {
-                userIds: userIds,
-                groupsIds: []
+                userIds: [userId],
+                groupsIds: groups
               };
               _context2.next = 4;
               return _axios.default.post("".concat(process.env.REACT_APP_USERS_ONBOARDING_ENDPOINT, "/delete"), body, {
@@ -276,16 +268,15 @@ var Multiselect = function Multiselect(_ref) {
               response = _context2.sent;
               console.log("borrado correctamente", response.data.body);
               loadUserGroups();
-              _context2.next = 13;
+              _context2.next = 12;
               break;
 
             case 9:
               _context2.prev = 9;
               _context2.t0 = _context2["catch"](0);
-              console.error("Error al cambiar grupos de usuarios:", _context2.t0);
-              setLoading(false);
+              console.error("Error al eliminar grupos de usuarios:", _context2.t0);
 
-            case 13:
+            case 12:
             case "end":
               return _context2.stop();
           }
@@ -467,10 +458,10 @@ var Multiselect = function Multiselect(_ref) {
         setIsEditGroupVisible(false);
         setIsItemListVisible(true);
       }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, (0, _objectSpread6.default)((0, _objectSpread6.default)({}, modalData), {}, {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, (0, _objectSpread4.default)((0, _objectSpread4.default)({}, modalData), {}, {
       onClickBtnDefault: function onClickBtnDefault() {
         return setModalData(function (prev) {
-          return (0, _objectSpread6.default)((0, _objectSpread6.default)({}, prev), {}, {
+          return (0, _objectSpread4.default)((0, _objectSpread4.default)({}, prev), {}, {
             show: false
           });
         });

package/package.json

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

package/src/components/atoms/Multiselect/Multiselect.stories.js

@@ -29,7 +29,7 @@ MultiselectDefault.args = {
             {
                 "groupId": 65,
                 "groupName": "Jefe Comercial",
-                "userContentGroup": 0
+                "userContentGroup": 1
             },
             {
                 "groupId": 66,

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

@@ -41,13 +41,11 @@ export const Multiselect = ({
 
 const loadUserGroups = (updatedValues) => {
   if (updatedValues && updatedValues.length > 0) {
-    // Ensure updatedValues is defined and has elements
-    setSelectValues((prevValues) => ({
-      ...prevValues,
-      [idUser]: updatedValues.map((groupInfo) => groupInfo.groupName),
-    }));
+    // setSelectValues((prevValues) => ({
+    //   ...prevValues,
+    //   [idUser]: updatedValues.map((groupInfo) => groupInfo.groupName),
+    // }));
   } else {
-    // If no updated values, load initial data
     const hasUserContentGroup1 = groups.some((group) => group.userContentGroup === 1);
 
     if (hasUserContentGroup1) {
@@ -74,50 +72,54 @@ const loadUserGroups = (updatedValues) => {
     loadUserGroups(); 
   }, [idUser, groups]);
 
-  // useEffect(() => {
-  //   if (selectValues[userId]) {
-  //     setSelectedItems(selectValues[userId]);
-  //   }
-  //   console.log("setSelecr",selectValues)
-  // }, [selectValues, userId]);
-
   const onChange = (evt) => {
     setText(evt.target.value);
   };
-
   const handleChange = (userId) => (event) => {
     const {
       target: { value },
     } = event;
+    const filteredArrayCopy = [...filters];
   
     const updatedValues = groups.map((group) => {
       const isSelected = value.includes(group.groupName);
-  
       return {
         ...group,
         userContentGroup: isSelected ? 1 : 0,
       };
     });
-  
     setSelectedItems(updatedValues.filter((group) => group.userContentGroup === 1).map((group) => group.groupName));
   
-    setSelectValues((prevValues) => ({
-      ...prevValues,
-      [userId]: updatedValues
-        .filter((group) => group.userContentGroup === 1)
-        .map((group) => group.groupName),
-    }));
+    // setSelectValues((prevValues) => ({
+    //   ...prevValues,
+    //   [userId]: updatedValues
+    //     .filter((group) => group.userContentGroup === 1)
+    //     .map((group) => group.groupName),
+    // }));
+
+    const changes = updatedValues.reduce((result, group, index) => {
+      if (group.userContentGroup !== filteredArrayCopy[index].userContentGroup) {
+        result.push({
+          groupId: group.groupId,
+          userContentGroup: group.userContentGroup,
+        });
+      }
+      return result;
+    }, []);
+  
+    const updatedGroups = changes.filter((change) => change.userContentGroup === 1).map((change) => change.groupId);
+    const deletedGroups = changes.filter((change) => change.userContentGroup === 0).map((change) => change.groupId);
+    if (updatedGroups.length > 0) {
+      updateGroup(updatedGroups);
+    }
   
-    const groupIds = updatedValues.filter((group) => group.userContentGroup === 1).map((group) => group.groupId);
-    if (groupIds.length > 0) {
-      // Llamada a la función de actualización si hay grupos seleccionados
-      updateGroup(groupIds);
-    } else {
-      // Llamada a la función de eliminación si no hay grupos seleccionados
-      deleteGroup([userId]);
+    if (deletedGroups.length > 0) {
+      deleteGroup(deletedGroups);
     }
   };
   
+  
+  
 
   //actualiza los grupos seleccionados
   const updateGroup = async (groupsIds) => {
@@ -135,26 +137,7 @@ const loadUserGroups = (updatedValues) => {
           },
         }
       );
-      setModalData({
-        show: true,
-        className: "modal-save",
-        title: "",
-        message: `El cambio de grupo fue aplicado correctamente.`,
-        icon: "successv2",
-        buttons: [
-          <ButtonV2
-            key="btn-Aceptar-guardar"
-            type="pink"
-            label="Aceptar"
-            size={12}
-            onClick={() => {
-              setModalData(false);
-            }}
-          />,
-        ],
-      })
       console.log("grupo actualizado correctamente", response.data.body);
-      console.log("body", body);
       loadUserGroups(); 
     } catch (error) {
       console.error("Error al cambiar grupos de usuarios:", error);
@@ -162,11 +145,11 @@ const loadUserGroups = (updatedValues) => {
   };
 
     //Elimina todos los grupos de usuarios seleccionados
-    const deleteGroup = async (userIds) => {
+    const deleteGroup = async (groups) => {
       try {
         const body = {
-          userIds,
-          groupsIds: [],
+          userIds:[userId],
+          groupsIds:groups,
         };
         const response = await axios.post(
           `${process.env.REACT_APP_USERS_ONBOARDING_ENDPOINT}/delete`,
@@ -180,8 +163,7 @@ const loadUserGroups = (updatedValues) => {
         console.log("borrado correctamente", response.data.body);
         loadUserGroups(); 
       } catch (error) {
-        console.error("Error al cambiar grupos de usuarios:", error);
-        setLoading(false);
+        console.error("Error al eliminar grupos de usuarios:", error);
       }
     };