contentoh-components-library 21.5.2 → 21.5.3

package/src/components/pages/MultipleEdition/utils.js

@@ -1,1073 +0,0 @@
-import axios from "axios";
-import { ImageVisor } from "../../organisms/ImageVisor";
-import { ButtonV2 } from "../../atoms/ButtonV2";
-import { deleteImage, saveData} from "./saveData";
-import { Container, Input, InputBase, TextField } from "@mui/material";
-import { ValidationPanel } from "../../atoms/ValidationPanel";
-import { TagAndInput } from "../../molecules/TagAndInput";
-import acceptIcon from "../../../assets/images/generalButton/acceptIcon.svg";
-import rejectIcon from "../../../assets/images/generalButton/rejectIcon.svg";
-import infoIcon from "../../../assets/images/Icons/info.svg";
-import saveWhite from "../../../assets/images/Icons/save-white.svg";
-import saveWhiteGray from "../../../assets/images/Icons/save-white-gray.svg";
-import { DockSharp } from "@mui/icons-material";
-import React, { useState } from 'react';
-import nullIcon from "../../../assets/images/generalButton/nullIcon.svg";
-import { Tooltip } from "../../atoms/Tooltip";
-
-// variables
-export const optionsSelect = [
-  {
-    label: "item 1",
-    value: 1,
-  },
-  {
-    label: "item 2",
-    value: 2,
-  },
-  {
-    label: "item 3",
-    value: 3,
-  },
-  {
-    label: "item 4",
-    value: 4,
-  },
-];
-
-export const columnsBase = [
-  {
-    Header: "UPC",
-    accessor: "upc",
-    width: "100px",
-    fixedToLeft: 0,
-    style: {
-      textAlign: "left",
-    },
-  },
-  {
-    Header: "Nombre",
-    accessor: "name",
-    width: "100px",
-    fixedToLeft: 100,
-  },
-  {
-    Header: "Categoría",
-    accessor: "category",
-    width: "100px",
-    fixedToLeft: 200,
-  },
-  {
-    Header: "Est.",
-    accessor: "status",
-    width: "30px",
-    fixedToLeft: 300,
-  },
-  {
-    Header: "Ver.",
-    accessor: "version",
-    width: "30px",
-    fixedToLeft: 330,
-    style: {
-      borderRight: "1px solid #f0f0f0",
-    },
-  },
-];
-
-// data
-async function getData(service, articles, versions, token) {
-  const encodedArticles = encodeURIComponent(articles.join(","));
-  const encodedVersion = encodeURIComponent(versions.join(","));
-  const params = `?articles=${encodedArticles}&versions=${encodedVersion}`;
-  const res = await axios.get(
-    `${process.env.REACT_APP_BASE_MULTIPLE_EDITION_ENDPOINT}/${service}${params}`,
-    {
-      headers: {
-        Authorization: token,
-      },
-    }
-  );
-  return JSON.parse(res.data.body);
-}
-
-// functions
-export function dataReducer(state, action) {
-  if (action.type === "init") {
-    return action.payload;
-  }
-  if (action.type === "updateImage") {
-    const { articleId, imageId ,token } = action.payload;
-    const newImageData = state.images.data.slice();
-    const articleIndex = newImageData.findIndex((f) => f.id === articleId);
-    const id = newImageData[articleIndex]?.images[imageId]?.value?.id;
-    newImageData[articleIndex].images[imageId].value = {
-      ...action.payload,
-      id,
-    };
-    const data = newImageData;
-    saveData({section:"images", data: {data}, token: token});
-    return {
-      ...state,
-      images: {
-        ...state.images,
-        data: newImageData,
-      },
-    };
-  }
-  if (action.type === "deleteImage") {
-    const { articleId, imageId, token } = action.payload;
-    const newImageData = state.images.data.slice();
-    const articleIndex = newImageData.findIndex((f) => f.id === articleId);
-    const id = newImageData[articleIndex]?.images[imageId]?.value?.id;
-    delete newImageData[articleIndex]?.images[imageId]?.value;
-    const data = {
-      articleId,
-      deleteImages: [
-        {
-          id,
-        },
-      ],
-    };
-    deleteImage(data, newImageData[articleIndex].version, token);
-    return {
-      ...state,
-      images: {
-        ...state.images,
-        data: newImageData,
-      },
-    };
-  }
-  return state;
-}
-
-export async function initData(setDataServices, articles, versions, token) {
-  const [description, datasheet, images] = await Promise.all([
-    getData("description", articles, versions, token),
-    getData("datasheet", articles, versions, token),
-    getData("images", articles, versions, token),
-  ]);
-  const { data: dataDescription, attributes: rulesDescription } = description;
-  const { data: dataDatasheet, attributes: rulesDatasheet } = datasheet;
-  const { data: dataImage, typesShot: rulesImage } = images;
-  const payload = {
-    description: {
-      data: Object.values(dataDescription),
-      rules: rulesDescription,
-    },
-    datasheet: {
-      data: Object.values(dataDatasheet),
-      rules: rulesDatasheet,
-    },
-    images: {
-      data: Object.values(dataImage),
-      rules: rulesImage.reduce(
-        (prev, curr) =>
-          (prev = {
-            ...prev,
-            [curr.id]: curr.name,
-          }),
-        {}
-      ),
-    },
-  };
-  setDataServices({
-    type: "init",
-    payload,
-  });
-}
-
-export function setDataColumns(
-  section,
-  dataService,
-  token,
-  setModalFromTable,
-  setDataServices,
-  setModal,
-  setShowValidationPanel,
-  setAttributeSelected,
-  setShowRejectModal,
-  setAttributesReviewed,
-  setMessage,
-  showValidationPanel,
-  attributeSelected,
-  attributesReviewed,
-  descriptionsReviewed,
-  imagesReviewed
-) {
-  const { data, rules } = dataService;
-  const columns = [...columnsBase];
-  const values = [];
-
-  const styleRetailer = {
-    borderRight: "1px solid #f0f0f0",
-    borderLeft: "1px solid #f0f0f0",
-  };
-  const styleSaveButtonCol = {
-    borderRight: "1px solid #f0f0f0",
-    //borderLeft: "1px solid #f0f0f0",
-  };
-  const styleData = {
-    textAlign: "center",
-    display: "flex",
-    justifyContent: "center",
-  };
-
-  const styleApprovalAttributes = {
-    textAlign: "center",
-    display: "flex",
-    justifyContent: "center",
-    border: "1px solid #ECDD1D",
-    background: "#ECDD1D"
-  };
-
-  const retailersAdded = {
-    id: [],
-    attr: [],
-  };
-  data.forEach((item) => {
-    const currentData = {};
-    ["upc", "name", "accessor", "category", "status", "version"].forEach(
-      (key) => {
-        currentData[key] = <p className="content"> {item[key]} </p>;
-      }
-    );
-    if (item.status)
-      currentData["status"] = (
-        <StatusTag statusType={item.status} ovalForm={true} />
-      );
-    if (section === "images") {
-      const { images } = item;
-      item.retailer.forEach((ret) => {
-        if (!retailersAdded.id.includes(ret.id)) {
-          retailersAdded.id.push(ret.id);
-          columns.push({
-            Header: "Cadena",
-            accessor: `retailer${ret.id}`,
-            width: "100px"
-          });
-          columns.push({
-            Header: "",
-            accessor: `retailer${ret.id}-save`,
-            width: "60px",
-            style: styleSaveButtonCol,
-          });
-        }
-        currentData[`retailer${ret.id}`] = <p> {ret.name} </p>;
-        ret.images.forEach((imgId) => {
-          if (!retailersAdded.attr.includes(`img${imgId}`)) {
-            retailersAdded.attr.push(`img${imgId}`);
-            columns.push({
-              Header: rules[imgId],
-              accessor: `img${imgId}`,
-              width: "170px",
-              style: styleData,
-            });
-          }
-        });
-        var saveAvailable=true;
-        /**var saveAvailable = imagesReviewed
-        .filter((e) => e.articleId === item.id)
-        .every((e) => e.isReviewed === true);
-      if (
-        imagesReviewed.filter((e) => e.articleId === item.id).length == 0
-      ) {
-        saveAvailable = false;
-      }**/
-        currentData[`retailer${ret.id}-save`] = (
-          <button
-            onClick={() => {
-              var articlesImagesUpdateBody = [];
-              var articleImages = imagesReviewed.filter(
-                (e) => e.articleId === item.id && e.versionId === item.version
-              );
-              articleImages.forEach((articleImage) => {
-                articlesImagesUpdateBody.push({
-                  articleId: articleImage.articleId,
-                  versionId: articleImage.versionId,
-                  attributeId: articleImage.imageId,
-                  value: articleImage.srcdb,
-                  isApproved: articleImage.isApproved,
-                  comment: articleImage.comment,
-                });
-              });
-              updateArticleData(
-                item.version,
-                item.id,
-                articlesImagesUpdateBody,
-                token,
-                setMessage,
-                section
-              );
-            }}
-            className="validation-option"
-            disabled={!saveAvailable}
-          >
-            {saveAvailable && <img src={saveWhite} alt="guardar" />}{" "}
-            {!saveAvailable && <img src={saveWhiteGray} alt="guardar" />}{" "}
-          </button>
-        );
-        
-        Object.values(images).forEach(({ value, isApproved, imageId, comment}) => {
-          const props = {
-            name: rules[imageId],
-            value: value,
-            setModalFromTable,
-            articleId: item.id,
-            setDataServices,
-            imageId,
-            setModal,
-            token,
-          };
-          if (
-            !imagesReviewed.find(
-              (e) =>
-                e.articleId == item.id &&
-                e.imageId == imageId &&
-                e.versionId == item.version
-            )
-          )
-            imagesReviewed.push({
-              articleId: item.id,
-              imageId: imageId,
-              versionId: item.version,
-              isApproved: isApproved? isApproved: false,
-              isReviewed: isApproved!=null? true: false,
-              comment: "",
-              srcdb: value? value.src: ""
-            });
-            var index = imagesReviewed.findIndex(
-              (e) =>
-                e.articleId === item.id &&
-                e.imageId=== imageId &&
-                e.versionId === item.version
-            );
-          currentData[`img${imageId}`] = 
-          <>
-            {/**<button
-                onClick={() => {
-                  setShowValidationPanel(true);
-                  setAttributeSelected({
-                    articleId: item.id,
-                    attributeId: imageId,
-                    versionId: item.version,
-                  });
-                }}
-                className="validation-button"
-              > 
-              {imagesReviewed[index].isReviewed &&
-                  imagesReviewed[index].isApproved && (
-                    <img
-                      id={
-                        "button_" +
-                        item.id +
-                        "_" +
-                        imageId +
-                        "_" +
-                        item.version
-                      }
-                      src={acceptIcon}
-                      alt="accept button"
-                    />
-                  )}{" "}
-                {imagesReviewed[index].isReviewed &&
-                  !imagesReviewed[index].isApproved && (
-                    <img
-                      id={
-                        "button_" +
-                        item.id +
-                        "_" +
-                        imageId +
-                        "_" +
-                        item.version
-                      }
-                      src={rejectIcon}
-                      alt="reject button"
-                    />
-                  )}{" "}
-                {
-                  !imagesReviewed[index].isReviewed && (
-                    <img
-                      id={
-                        "button_" +
-                        item.id +
-                        "_" +
-                        imageId +
-                        "_" +
-                        item.version
-                      }
-                      src={rejectIcon}
-                      alt="reject button"
-                    />
-                  )}
-              </button>{" "}
-          {showValidationPanel &&
-                attributeSelected.articleId === item.id &&
-                attributeSelected.attributeId === imageId &&
-                attributeSelected.versionId === item.version && (
-                  <div className="buttons-container" style={{left: "70px"}}>
-                    <button
-                      onClick={() => {
-                        imagesReviewed[index].isApproved = true;
-                        imagesReviewed[index].isReviewed = true;
-                        //document.getElementById(item.id+'_'+des.attributeId+'_'+item.version).style.borderColor="#71DE56";
-                        setShowValidationPanel(false);
-                      }}
-                      className="validation-option"
-                    >
-                      <img src={acceptIcon} alt="accept button" />
-                      <p> Validar </p>{" "}
-                    </button>{" "}
-                    <button
-                      onClick={() => {
-                        setShowValidationPanel(false);
-                        setShowRejectModal(true);
-                      }}
-                      className="validation-option"
-                    >
-                      <img src={rejectIcon} alt="reject button" />
-                      <p> Rechazar </p>{" "}
-                    </button>{" "}
-                  </div>
-                    )}{" "**/}
-          {comment && <div class="tooltip">
-            <ImageVisor {...props}/>
-            <span class="tooltiptext"><p><b>Comentarios del rechazo</b></p><p>{des.comment}</p></span>
-          </div>}
-          {!comment && <div>
-            <ImageVisor {...props} />
-          </div>} 
-        </>;
-        });
-      });
-    }
-    if (section === "datasheet") {
-      item.retailer.forEach((ret) => {
-        if (!retailersAdded.id.includes(ret.id)) {
-          retailersAdded.id.push(ret.id);
-          columns.push({
-            Header: "Cadena",
-            accessor: `retailer${ret.id}`,
-            width: "100px",
-          });
-          columns.push({
-            Header: "",
-            accessor: `retailer${ret.id}-save`,
-            width: "60px",
-            style: styleSaveButtonCol,
-          });
-        }
-        currentData[`retailer${ret.id}`] = <p> {ret.name} </p>;
-        var saveAvailable = attributesReviewed
-          .filter((e) => e.articleId === item.id)
-          .every((e) => e.isReviewed === true);
-        if (
-          attributesReviewed.filter((e) => e.articleId === item.id).length == 0
-        ) {
-          saveAvailable = false;
-        }
-        currentData[`retailer${ret.id}-save`] = (
-          <button
-            onClick={() => {
-              var articlesAtributesUpdateBody = [];
-              var articleAttributes = attributesReviewed.filter(
-                (e) => e.articleId === item.id && e.versionId === item.version
-              );
-              var value;
-              articleAttributes.forEach((articleAttribute) => {
-                if(articleAttribute.attributeId==6700 || articleAttribute.attributeId==6701){
-                  value= document.getElementById(
-                    articleAttribute.articleId +
-                      "_" +
-                      articleAttribute.attributeId +
-                      "_" +
-                      articleAttribute.versionId
-                  ).checked;
-                }
-                else{
-                  value = document.getElementById(
-                    articleAttribute.articleId +
-                      "_" +
-                      articleAttribute.attributeId +
-                      "_" +
-                      articleAttribute.versionId
-                  ).value;
-                }
-                articlesAtributesUpdateBody.push({
-                  articleId: articleAttribute.articleId,
-                  versionId: articleAttribute.versionId,
-                  attributeId: articleAttribute.attributeId,
-                  value: value!=undefined ? value : "",
-                  isApproved: articleAttribute.isApproved,
-                  comment: articleAttribute.comment,
-                });
-              });
-              updateArticleData(
-                item.version,
-                item.id,
-                articlesAtributesUpdateBody,
-                token,
-                setMessage,
-                section
-              );
-            }}
-            className="validation-option"
-            disabled={!saveAvailable}
-          >
-            {saveAvailable && <img src={saveWhite} alt="guardar" />}{" "}
-            {!saveAvailable && <img src={saveWhiteGray} alt="guardar" />}{" "}
-          </button>
-        );
-        ret.attributes.forEach((attributeId) => {
-          if (!retailersAdded.attr.includes(`${attributeId + "-" + ret.id}`)) {
-            retailersAdded.attr.push(`${attributeId + "-" + ret.id}`);
-            columns.push({
-              Header: rules[attributeId].name,
-              accessor: `${attributeId + "-" + ret.id}`,
-              width: "200px",
-              style: (attributeId==6700 || attributeId==6701) ? styleApprovalAttributes : styleData,
-              description: rules[attributeId].description,
-            });
-          }
-        });
-
-        const handleChangeOptions = (attributeId, newValue) => {
-          const updatedAttributes = Object.values(item.attributes).map((attr) => {
-            if (attr.attributeId === attributeId) {
-              return { ...attr, value: newValue };
-            }
-            return attr;
-          });
-          const updatedAttributesObject = {};
-          updatedAttributes.forEach((attr) => {
-            updatedAttributesObject[attr.attributeId] = attr;
-          });
-          return updatedAttributesObject;
-        };
-
-
-        
-        const inputTypeValue = (type) => {
-          switch (type) {
-            case "Booleano":
-              return "checkbox";
-            case "Numérico":
-              return "number";
-            default:
-              return "text";
-          }
-        };
-        Object.values(item.attributes).forEach((des) => {
-          const props = {
-            inputId:
-              item.id +
-              "_" +
-              rules[des.attributeId].attributeId +
-              "_" +
-              item.version,
-            name:
-              item.id +
-              "-" +
-              rules[des.attributeId].attributeId +
-              "-" +
-              item.version,
-            value: des.value,
-            inputType:inputTypeValue(des.type),
-          };
-          let inputComponent;
-          if (des.option_list.length>0) {
-            inputComponent = (
-              <select
-                id={
-                  item.id +
-                  "_" +
-                  rules[des.attributeId].attributeId +
-                  "_" +
-                  item.version
-                }
-                name={
-                  item.id +
-                  "-" +
-                  rules[des.attributeId].attributeId +
-                  "-" +
-                  item.version
-                }
-                className="select-edition-multiple"
-                defaultValue={des.value}
-                onChange={(e) =>{
-                  handleChangeOptions(des.attributeId, e.target.value)}
-                }
-              >
-              <option value="" selected disabled>Selecciona una opción</option>
-                {des.option_list.map((option, index) => (
-                  <option key={index} value={option}>
-                    {option}
-                  </option>
-                ))}
-              </select>
-            );
-            
-          } else {
-            inputComponent = <TagAndInput {...props} />;
-          }
-        
-          if (
-            !attributesReviewed.find(
-              (e) =>
-                e.articleId == item.id &&
-                e.attributeId == des.attributeId &&
-                e.versionId == item.version
-            )
-          )
-            attributesReviewed.push({
-              articleId: item.id,
-              attributeId: des.attributeId,
-              versionId: item.version,
-              isApproved: des.isApproved ? des.isApproved : false,
-              isReviewed: des.isApproved != null ? true : false,
-              comment: "",
-            });
-          var index = attributesReviewed.findIndex(
-            (e) =>
-              e.articleId === item.id &&
-              e.attributeId === des.attributeId &&
-              e.versionId === item.version
-          );
-          currentData[`${des.attributeId + "-" + ret.id}`] = (
-            <>
-              <button
-                onClick={() => {
-                  setShowValidationPanel(true);
-                  setAttributeSelected({
-                    articleId: item.id,
-                    attributeId: des.attributeId,
-                    versionId: item.version,
-                  });
-                }}
-                className="validation-button"
-              >
-                {attributesReviewed[index].isReviewed &&
-                  attributesReviewed[index].isApproved && (
-                    <img
-                      id={
-                        "button_" +
-                        item.id +
-                        "_" +
-                        des.attributeId +
-                        "_" +
-                        item.version
-                      }
-                      src={acceptIcon}
-                      alt="accept button"
-                    />
-                  )}
-                {attributesReviewed[index].isReviewed &&
-                  !attributesReviewed[index].isApproved && (
-                  /**<Tooltip position="topCenter" componentTooltip={<span>Debes aprobar o rechazar para continuar</span>}>**/
-                    <div>
-                      <img
-                        id={
-                          "button_" +
-                          item.id +
-                          "_" +
-                          des.attributeId +
-                          "_" +
-                          item.version
-                        }
-                        src={rejectIcon}
-                        alt="reject icon"
-                      />
-                    </div>
-                  /*</Tooltip>*/
-                  )}
-                {typeof des.isApproved === "undefined" &&
-                  !attributesReviewed[index].isReviewed && (
-                    <Tooltip position="topCenter" componentTooltip={<span>Debes aprobar o rechazar para continuar</span>}>
-                    <div>
-                      <img
-                        id={
-                          "button_" +
-                          item.id +
-                          "_" +
-                          des.attributeId +
-                          "_" +
-                          item.version
-                        }
-                        src={nullIcon}
-                        alt="null button"
-                      />
-                    </div>
-                  </Tooltip>
-                   
-                  )}
-              </button>
-              {showValidationPanel &&
-                attributeSelected.articleId === item.id &&
-                attributeSelected.attributeId === des.attributeId &&
-                attributeSelected.versionId === item.version && (
-                  <div className="buttons-container" style={{left: "35px"}}>
-                    <button
-                      onClick={() => {
-                        attributesReviewed[index].isApproved = true;
-                        attributesReviewed[index].isReviewed = true;
-                        //document.getElementById(item.id+'_'+des.attributeId+'_'+item.version).style.borderColor="#71DE56";
-                        setShowValidationPanel(false);
-                      }}
-                      className="validation-option"
-                    >
-                      <img src={acceptIcon} alt="accept button" />
-                      <p> Validar </p>{" "}
-                    </button>{" "}
-                    <button
-                      onClick={() => {
-                        setShowValidationPanel(false);
-                        setShowRejectModal(true);
-                      }}
-                      className="validation-option"
-                    >
-                      <img src={rejectIcon} alt="reject button" />
-                      <p> Rechazar </p>{" "}
-                    </button>{" "}
-                  </div>
-                )}{" "}
-              {des.comment && <div class="tooltip">
-              {inputComponent}
-                <span class="tooltiptext"><p><b>Comentarios del rechazo</b></p><p>{des.comment}</p></span>
-              </div>}
-              {!des.comment && <div>
-                {inputComponent}
-               </div>}
-            </>
-          );
-        });
-      });
-    }
-    if (section === "description") {
-      item.retailer.forEach((ret) => {
-        if (!retailersAdded.id.includes(ret.id)) {
-          retailersAdded.id.push(ret.id);
-          columns.push({
-            Header: "Cadena",
-            accessor: `retailer${ret.id}`,
-            width: "100px"
-          });
-          columns.push({
-            Header: "",
-            accessor: `retailer${ret.id}-save`,
-            width: "60px",
-            style: styleSaveButtonCol,
-          });
-        }
-        var saveAvailable=true;
-        /**var saveAvailable = descriptionsReviewed
-        .filter((e) => e.articleId === item.id)
-        .every((e) => e.isReviewed === true);
-      if (
-        descriptionsReviewed.filter((e) => e.articleId === item.id).length == 0
-      ) {
-        saveAvailable = false;
-      }**/
-        currentData[`retailer${ret.id}`] = <p> {ret.name} </p>;
-        ret.descriptions.forEach((descriptionId) => {
-          if (!retailersAdded.attr.includes(`${descriptionId}`)) {
-            retailersAdded.attr.push(`${descriptionId}`);
-            columns.push({
-              Header: rules[ret.id][descriptionId].name,
-              accessor: `${descriptionId}`,
-              width: "250px",
-              style: styleData,
-              description:rules[ret.id][descriptionId].description
-            });
-          }
-        });
-        
-        currentData[`retailer${ret.id}-save`] = (
-          <button
-            onClick={() => {
-              var articlesDescriptionsUpdateBody = [];
-              var articleDescriptions = descriptionsReviewed.filter(
-                (e) => e.articleId === item.id && e.versionId === item.version
-              );
-              articleDescriptions.forEach((articleDescription) => {
-                const value = document.getElementById(
-                    articleDescription.articleId +
-                    "_" +
-                    articleDescription.attributeId +
-                    "_" +
-                    articleDescription.versionId
-                ).value;
-                articlesDescriptionsUpdateBody.push({
-                  articleId: articleDescription.articleId,
-                  versionId: articleDescription.versionId,
-                  attributeId: articleDescription.attributeId,
-                  value: value ? value : "",
-                  isApproved: articleDescription.isApproved,
-                  comment: articleDescription.comment,
-                });
-              });
-              updateArticleData(
-                item.version,
-                item.id,
-                articlesDescriptionsUpdateBody,
-                token,
-                setMessage,
-                section
-              );
-            }}
-            className="validation-option"
-            disabled={!saveAvailable}
-          >
-            {saveAvailable && <img src={saveWhite} alt="guardar" />}{" "}
-            {!saveAvailable && <img src={saveWhiteGray} alt="guardar" />}{" "}
-          </button>
-        );
-        Object.values(item.descriptions).forEach((des) => {
-          const props = {
-            name: rules[des.attributeId],
-            id: item.id + "_" + des.attributeId + "_" + item.version,
-            cols: 30,
-            rows: 2,
-            defaultValue: des.value
-          };
-          if (
-            !descriptionsReviewed.find(
-              (e) =>
-                e.articleId == item.id &&
-                e.attributeId == des.attributeId &&
-                e.versionId == item.version
-            )
-          )
-            descriptionsReviewed.push({
-              articleId: item.id,
-              attributeId: des.attributeId,
-              versionId: item.version,
-              isApproved: des.isApproved ? des.isApproved : false,
-              isReviewed: des.isApproved != null ? true : false,
-              comment: "",
-            });
-          var index = descriptionsReviewed.findIndex(
-            (e) =>
-              e.articleId === item.id &&
-              e.attributeId === des.attributeId &&
-              e.versionId === item.version
-          );
-          currentData[`${des.attributeId}`] = (
-            <>
-            {/**<button
-                onClick={() => {
-                  setShowValidationPanel(true);
-                  setAttributeSelected({
-                    articleId: item.id,
-                    attributeId: des.attributeId,
-                    versionId: item.version,
-                  });
-                }}
-                className="validation-button"
-              >
-                {descriptionsReviewed[index].isReviewed &&
-                  descriptionsReviewed[index].isApproved && (
-                    <img
-                      id={
-                        "button_" +
-                        item.id +
-                        "_" +
-                        des.attributeId +
-                        "_" +
-                        item.version
-                      }
-                      src={acceptIcon}
-                      alt="accept button"
-                    />
-                  )}{" "}
-                {descriptionsReviewed[index].isReviewed &&
-                  !descriptionsReviewed[index].isApproved && (
-                    <img
-                      id={
-                        "button_" +
-                        item.id +
-                        "_" +
-                        des.attributeId +
-                        "_" +
-                        item.version
-                      }
-                      src={rejectIcon}
-                      alt="reject button"
-                    />
-                  )}{" "}
-                {typeof des.isApproved === "undefined" &&
-                  !descriptionsReviewed[index].isReviewed && (
-                    <img
-                      id={
-                        "button_" +
-                        item.id +
-                        "_" +
-                        des.attributeId +
-                        "_" +
-                        item.version
-                      }
-                      src={rejectIcon}
-                      alt="reject button"
-                    />
-                  )}
-              </button>{" "}
-              {showValidationPanel &&
-                attributeSelected.articleId === item.id &&
-                attributeSelected.attributeId === des.attributeId &&
-                attributeSelected.versionId === item.version && (
-                  <div className="buttons-container" style={{left: "35px"}}>
-                    <button
-                      onClick={() => {
-                        descriptionsReviewed[index].isApproved = true;
-                        descriptionsReviewed[index].isReviewed = true;
-                        setShowValidationPanel(false);
-                      }}
-                      className="validation-option"
-                    >
-                      <img src={acceptIcon} alt="accept button" />
-                      <p> Validar </p>{" "}
-                    </button>{" "}
-                    <button
-                      onClick={() => {
-                        setShowValidationPanel(false);
-                        setShowRejectModal(true);
-                      }}
-                      className="validation-option"
-                    >
-                      <img src={rejectIcon} alt="reject button" />
-                      <p> Rechazar </p>{" "}
-                    </button>{" "}
-                  </div>
-                    )}{" "}**/}
-                {des.comment && <div class="tooltip">
-                  <textarea {...props}></textarea>
-                  <span class="tooltiptext"><p><b>Comentarios del rechazo</b></p><p>{des.comment}</p></span>
-                </div>}
-                {!des.comment && <div>
-                  <textarea {...props}></textarea>
-                </div>}
-            </>
-          );
-        });
-      });
-    }
-    values.push(currentData);
-  });
-  return [columns, values];
-}
-
-export function modalReducer(state, action) {
-  if (action.type === "close") {
-    return {
-      show: false,
-    };
-  }
-  const { setModal, setDataServices } = action?.functions;
-  const buttons = [
-    <ButtonV2
-      key="btn-Cancelar"
-      type="white"
-      label="Cancelar"
-      onClick={() =>
-        setModal({
-          type: "close",
-        })
-      }
-    />,
-  ];
-  if (action.type === "saved successfully") {
-    buttons[0] = (
-      <ButtonV2
-        key="btn-Aceptar"
-        type="pink"
-        label="Aceptar"
-        onClick={async () =>
-          setModal({
-            type: "close",
-          })
-        }
-      />
-    );
-    return {
-      show: true,
-      title: "Servicio guardado con éxito",
-      message: `El servicio de ${action.payload?.service} se ha guardado con éxito.`,
-      icon: "success",
-      buttons,
-    };
-  }
-  if (action.type === "delete") {
-    buttons.push(
-      <ButtonV2
-        key="btn-Aceptar"
-        type="pink"
-        label="Aceptar"
-        onClick={async () => {
-          setDataServices({
-            type: "deleteImage",
-            payload: action.payload,
-          });
-          setModal({
-            type: "close",
-          });
-        }}
-      />
-    );
-    return {
-      show: true,
-      title: "Eliminar imagen",
-      message: "¿Está seguro de eliminar la imagen seleccionada?",
-      icon: "warning",
-      buttons,
-    };
-  }
-  return state;
-}
-
-async function updateArticleData(
-  version,
-  articleId,
-  attributes,
-  token,
-  setMessage,
-  section
-) {
-  var body={} ;
-  var params=""
-  if(section!="images"){
-    body = {
-      articleId: articleId,
-      articleData: attributes,
-    };
-    params = `?${section}=true&version=${version}`;
-  }
-  else{
-    body = {
-      articleId: articleId,
-      onboardingImagesData: attributes,
-    };
-    params = `?image=true&version=${version}`;
-    
-  }
-  try {
-    const res = await axios.put(
-      `${process.env.REACT_APP_ARTICLE_DATA_ENDPOINT}` + params,
-      body,
-      {
-        headers: {
-          Authorization: token,
-        },
-      }
-    );
-    if (res.data.statusCode === 200 && section=="description") {
-      setMessage("Descripciones de los productos guardados con éxito");
-    }
-    if (res.data.statusCode === 200 && section=="datasheet") {
-      setMessage("Atributos de los productos guardados con éxito");
-    }
-    if (res.data.statusCode === 200 && section=="images") {
-      setMessage("Imágenes de los productos guardados con éxito");
-    }
-  } catch (error) {
-    console.log(error);
-  }
-}
-