contentoh-components-library 21.1.63 → 21.1.64

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

@@ -40,6 +40,8 @@ import Slide1_2 from "../../../assets/images/sliderToolTip/slide2.svg";
 import Slide1_3 from "../../../assets/images/sliderToolTip/slide3.svg";
 import Slide1_4 from "../../../assets/images/sliderToolTip/slide4.svg";
 import Slide1_5 from "../../../assets/images/sliderToolTip/slide5.svg";
+import { VersionSelector } from "../../organisms/VersionSelector";
+import { closeModals } from "../../../global-files/customHooks";
 
 const reducerImages = (state, action) => {
   let { values, attrForImgs } = state;
@@ -88,6 +90,7 @@ export const ProviderProductEdition = ({
   revision = false,
   setShowContentohRequestModal,
   showSurvey,
+  company,
 }) => {
   const [activeTab, setActiveTab] = useState("Descripción");
   const [activeImage, setActiveImage] = useState();
@@ -160,9 +163,14 @@ export const ProviderProductEdition = ({
       : productToEdit
   );
   const [icon, setIcon] = useState(null);
-  const [version] = useState(product?.version);
-  const [comments] = useState({});
+  const [version, setVersion] = useState(product?.version);
+  const [comments, setComments] = useState({});
   const [comment, setComment] = useState("");
+  const [requiredNull, setRequiredNull] = useState({
+    "Ficha técnica": 0,
+    Descripción: 0,
+    Imágenes: 0,
+  });
   const [crossComment, setCrossComment] = useState(false);
   const [userGroups, setUserGroups] = useState([]);
   const [assig, setAssig] = useState({});
@@ -171,6 +179,7 @@ export const ProviderProductEdition = ({
   const [checkAll, setCheckAll] = useState(false);
   const isRetailer = user?.is_retailer;
   const [loading, setLoading] = useState(true);
+  const [statusArray, setStatusArray] = useState([]);
 
   const originProp = location?.state?.origin;
   const [origin, setOrigin] = useState({
@@ -202,9 +211,8 @@ export const ProviderProductEdition = ({
   const [modalViewTextArea, setModalViewTextArea] = useState(false);
   const [socketType, setSocketType] = useState(null);
   const [saving, setSaving] = useState(loading);
-  const [retailerStatus, setRetailerStatus] = useState(
-    product.statusByRetailer
-  );
+  const [showVersionSelector, setShowVersionSelector] =
+    closeModals("version-selector");
 
   useEffect(() => {
     checkAll && setSelectedImages(images.values);
@@ -215,7 +223,7 @@ export const ProviderProductEdition = ({
       product?.id_article || product?.article?.id_article,
       product?.article?.company_name || product?.categoryName,
       parseInt(product?.article?.id_category || product?.id_category),
-      product?.version
+      version
     );
 
     //Converts the data inside the datasheets object to array
@@ -230,8 +238,11 @@ export const ProviderProductEdition = ({
       );
     }
 
-    // setActiveRetailer(product?.retailers[0]);
-    setImages({ action: "init", init: services[2] });
+    //setActiveRetailer(product?.retailers[0]);
+    setImages({
+      action: "init",
+      init: services[2],
+    });
     if (services[2]?.values?.length > 0) setActiveImage(0);
 
     getPercentage({ data: [product] }).then((res) => setPercentages(res));
@@ -250,11 +261,10 @@ export const ProviderProductEdition = ({
         }&end=true`
       );
       const parsedResponse = JSON.parse(servicesResponse?.data?.body).data;
-      const retailerResponse = parsedResponse?.map((srv) => srv.id_retailer);
       let retailers = product.retailers || product.retailersAvailable;
-      let active = retailers?.find((retailer) =>
-        retailerResponse.includes(retailer.id)
-      );
+      let active = retailers?.filter((retailer) =>
+        parsedResponse?.map((srv) => srv.id_retailer).includes(retailer.id)
+      )[0];
       !activeRetailer.id && setActiveRetailer(active ? active : retailers[0]);
       setServicesData(parsedResponse);
     }
@@ -275,15 +285,15 @@ export const ProviderProductEdition = ({
         if (revision && currentService === "AP") return true;
       } else {
         const { product } = productEdit;
-        const isRequestWithoutContentoh =
-          orgn === "RequestWithoutContentoh" &&
-          (["R", "CA"].includes(currentService) ||
-            (currentService === "RCA" &&
-              (!product.id_order || !product.orderId)));
-        const isRequestWithContentoh =
-          orgn === "RequestWithContentoh" && currentService === "AA";
-        const isContentoh = orgn === "Contentoh" && currentService === "AA";
-        if (isContentoh || isRequestWithoutContentoh || isRequestWithContentoh)
+        if (
+          orgn === "Contentoh" ||
+          (["RECEIVED", "IN_PROGRESS"].includes(currentService) &&
+            orgn === "RequestWithoutContentoh") ||
+          (currentService === "AA" && orgn === "RequestWithContentoh") ||
+          (currentService === "RC" &&
+            orgn === "RequestWithoutContentoh" &&
+            (!product.id_order || !product.orderId))
+        )
           return true;
       }
     }
@@ -300,12 +310,31 @@ export const ProviderProductEdition = ({
     setInCart(arr.some((e) => e.articleId === product.id_article));
   };
 
-  useEffect(() => {
+  useEffect(async () => {
+    setLoading(true);
     sessionStorage.setItem("user", JSON.stringify(user));
     loadData();
     getCart();
-    fetchUsers(token).then((res) => setUserGroups(res));
-  }, [product]);
+    setUserGroups(await fetchUsers(token));
+    let arr = [];
+    switch (user.id_role) {
+      case 7:
+      case 8:
+        arr = ["IN_PROGRESS", "RF", "RA"];
+        break;
+      case 4:
+      case 5:
+        arr = ["RF", "AF", "AA", "AP", "AC"];
+        break;
+      case 6:
+        arr = ["RP", "RC", "AF"];
+        break;
+      default:
+        arr = [];
+        break;
+    }
+    setStatusArray(arr);
+  }, [product, version]);
 
   const loadAssignations = (currentProduct) => {
     setAssig(product?.asignations);
@@ -319,9 +348,9 @@ export const ProviderProductEdition = ({
     const productTemp = product;
     const retailers = productTemp?.retailersAvailable || productTemp?.retailers;
     retailers?.forEach((retailer) => {
-      retailer["percentage"] = percentages?.find(
+      retailer["percentage"] = percentages?.filter(
         (percent) => retailer?.id === percent?.id_retailer
-      )?.percentage;
+      )[0]?.percentage;
     });
 
     setProduct(productTemp);
@@ -397,7 +426,7 @@ export const ProviderProductEdition = ({
     };
     if (product?.orderId) dataObject["orderId"] = product?.orderId;
     try {
-      const res = await axios.put(
+      await axios.put(
         `${process.env.REACT_APP_ARTICLE_DATA_ENDPOINT}?description=true&version=${version}`,
         dataObject,
         {
@@ -406,10 +435,8 @@ export const ProviderProductEdition = ({
           },
         }
       );
-      if (res.data.statusCode === 200) {
-        setMessage("Descripciones guardadas con éxito");
-        await loadData();
-      }
+      setMessage("Descripciones guardadas con éxito");
+      loadData();
     } catch (error) {
       console.log(error);
     }
@@ -432,10 +459,8 @@ export const ProviderProductEdition = ({
           },
         }
       );
-      if (res.data.statusCode === 200) {
-        setMessage("Fichas técnicas guardadas");
-        await loadData();
-      }
+      setMessage("Fichas técnicas guardadas");
+      loadData();
     } catch (error) {
       console.log(error);
     }
@@ -533,7 +558,7 @@ export const ProviderProductEdition = ({
         return e;
       });
       try {
-        const res = await axios.put(
+        await axios.put(
           `${process.env.REACT_APP_ARTICLE_DATA_ENDPOINT}?image=true&version=${version}`,
           dataImages,
           {
@@ -542,11 +567,9 @@ export const ProviderProductEdition = ({
             },
           }
         );
-        if (res.data.statusCode === 200) {
-          setMessage("Imágenes guardadas con éxito");
-          sessionStorage.removeItem("imagesList");
-          await loadData();
-        }
+        setMessage("Imágenes guardadas con éxito");
+        sessionStorage.removeItem("imagesList");
+        loadData();
       } catch (error) {
         console.log(error);
       }
@@ -648,12 +671,12 @@ export const ProviderProductEdition = ({
         },
       ],
       concept: concept,
-      userId: assignationId,
+      [`${assignationType}Id`]: assignationId,
     };
-    await axios({
+    axios({
       method: "post",
       url: process.env.REACT_APP_ASSIGNATIONS_ENDPOINT,
-      data,
+      data: data,
       headers: {
         Authorization: token,
       },
@@ -671,7 +694,7 @@ export const ProviderProductEdition = ({
       serv = serv.filter((f) => f.id_retailer === activeRetailer.id);
     }
     const statusArray =
-      user.is_retailer === 1 ? ["ACA", "RCA"] : ["AP", "RP", "ACA"];
+      user.is_retailer === 1 ? ["AC", "RC"] : ["AP", "RP", "AC"];
     return (
       serv.length > 0 && serv.every((item) => statusArray.includes(item.status))
     );
@@ -774,7 +797,7 @@ export const ProviderProductEdition = ({
     const { datasheet_status, description_status, images_status } = product;
     const completionStates =
       user.is_retailer === 1
-        ? ["ACA", "Evaluated", "NS"]
+        ? ["AC", "Evaluated", "NS"]
         : ["AP", "Evaluated", "NS"];
     const dsEvaluated = completionStates.includes(datasheet_status);
     const descsEvaluated = completionStates.includes(description_status);
@@ -787,69 +810,54 @@ export const ProviderProductEdition = ({
 
   const sendEvaluation = async (result) => {
     setLoading(true);
-    const concept = getConcept(activeTab);
-    const productTemp = product;
-    const articleId = productTemp.id_article;
-    const orderId = productTemp.id_order ?? productTemp.orderId;
-    const sectionStatusKey = `${getConcept(activeTab)}_status`;
-    const evalStatus = product[sectionStatusKey] || product?.version_status;
-    let data = { articleId, orderId, concept, evalStatus };
+    let data = {};
     const retailerId = activeRetailer?.id;
-    let res;
-    try {
-      if (result) {
-        data.result = result;
-        data.retailerId = retailerId;
-        res = await axios.put(
-          `${process.env.REACT_APP_EVALUATION_ENDPOINT}`,
-          data,
-          {
-            headers: {
-              Authorization: token,
-            },
-          }
-        );
-        const newStatuses = JSON.parse(res.data.body);
-        const orderStatus = newStatuses.newOrderStatus;
-        const serviceStatus =
-          newStatuses.newServiceStatus[articleId][
-            `${getConcept(activeTab)}Status`
-          ];
-
-        const newProductEdit = productEdit;
-        newProductEdit.product[sectionStatusKey] = serviceStatus;
-        setProductEdit(newProductEdit);
-        showSurvey &&
-          showSurvey(!user.is_retailer && orderStatus[orderId] === "AP");
-      } else {
-        res = await axios.put(`${process.env.REACT_APP_SEND_EVAL}`, data, {
-          headers: {
-            Authorization: token,
-          },
-        });
-      }
-      if (res.data.statusCode === 200) {
-        const { newArticleStatus, newServiceStatus, newStatus } = JSON.parse(
-          res.data.body
-        );
-        if (newArticleStatus) productTemp.status = newArticleStatus[articleId];
-        const retailerStatusCopy = { ...retailerStatus };
-        retailerStatusCopy[activeRetailer.id][concept] = newStatus;
-        setRetailerStatus(retailerStatusCopy);
-        productTemp.statusByRetailer = retailerStatusCopy;
-        let status;
-        if (newServiceStatus) {
-          status = newServiceStatus[articleId][`${concept}Status`];
-          productTemp[`${concept}_status`] = status;
-        }
-        setProduct(productTemp);
-        sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
-        setOrigin((prev) => ({ ...prev, [concept]: status }));
-      }
-    } catch (err) {
-      console.log(err);
+    if (result) {
+      data = {
+        articleId: product.id_article,
+        orderId: product.id_order ?? product.orderId,
+        concept: getConcept(activeTab),
+        result: result,
+        retailerId,
+      };
+      await axios.put(`${process.env.REACT_APP_EVALUATION_ENDPOINT}`, data, {
+        headers: {
+          Authorization: token,
+        },
+      });
+    } else {
+      const productTemp = product;
+      const concept = getConcept(activeTab);
+      productTemp[`${concept}_status`] = "Evaluated";
+      data = {
+        articleId: product.id_article,
+        orderId: product.id_order ?? product.orderId,
+        concept,
+      };
+      axios.put(`${process.env.REACT_APP_SEND_EVAL}`, data, {
+        headers: {
+          Authorization: token,
+        },
+      });
+      setProduct(productTemp);
+      sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
+      setProductEdit({
+        ArticleId: productTemp.id_article,
+        idCategory: productTemp.article.id_category,
+        product: productTemp,
+      });
+      sessionStorage.setItem(
+        "productEdit",
+        JSON.stringify({
+          ArticleId: productTemp.id_article,
+          idCategory: productTemp.article.id_category,
+          product: productTemp,
+        })
+      );
+      setOrigin((prev) => ({ ...prev, [concept]: "Evaluated" }));
     }
     loadData();
+    showSurvey && showSurvey(confirmStatusComplete());
   };
 
   const validateAll = async (result) => {
@@ -858,18 +866,14 @@ export const ProviderProductEdition = ({
       const evaluationArray = [];
       const sendAll = [];
       const conceptArray = ["description", "datasheet", "images"];
-      const dataGeneral = {
-        articleId: product.id_article,
-        orderId: product.id_order ?? product.orderId,
-        result,
-      };
+
       servicesData?.forEach((ret) => {
-        const { service, id_retailer } = ret;
-        const data = {
-          ...dataGeneral,
-          concept: service,
-          retailerId: id_retailer,
-          evalStatus: retailerStatus[id_retailer][service],
+        let data = {
+          articleId: product.id_article,
+          orderId: product.id_order ?? product.orderId,
+          concept: ret.service,
+          result: result,
+          retailerId: ret.id_retailer,
         };
         evaluationArray.push(
           axios.put(`${process.env.REACT_APP_EVALUATION_ENDPOINT}`, data, {
@@ -878,6 +882,16 @@ export const ProviderProductEdition = ({
             },
           })
         );
+      });
+
+      await Promise.all(evaluationArray);
+
+      conceptArray?.forEach((concept) => {
+        let data = {
+          articleId: product.id_article,
+          orderId: product.id_order ?? product.orderId,
+          concept,
+        };
         sendAll.push(
           axios.put(`${process.env.REACT_APP_SEND_EVAL}`, data, {
             headers: {
@@ -887,27 +901,15 @@ export const ProviderProductEdition = ({
         );
       });
 
-      await Promise.all([...evaluationArray, ...sendAll]);
-
+      await Promise.all(sendAll);
       const productTemp = product;
-      productTemp.article_status = `${result}CA`;
+      productTemp.article_status = `${result}C`;
       productTemp.datasheet_status =
-        productTemp.datasheet_status === "NA" ? "NA" : `${result}CA`;
+        productTemp.datasheet_status === "NA" ? "NA" : `${result}C`;
       productTemp.description_status =
-        productTemp.description_status === "NA" ? "NA" : `${result}CA`;
+        productTemp.description_status === "NA" ? "NA" : `${result}C`;
       productTemp.images_status =
-        productTemp.images_status === "NA" ? "NA" : `${result}CA`;
-
-      const retailerStatusCopy = { ...retailerStatus };
-      Object.keys(retailerStatusCopy).forEach((key) => {
-        conceptArray.forEach((concept) => {
-          if (retailerStatusCopy[key][concept]) {
-            retailerStatusCopy[key][concept] = `${result}CA`;
-          }
-        });
-      });
-      setRetailerStatus(retailerStatusCopy);
-      productTemp.statusByRetailer = retailerStatusCopy;
+        productTemp.images_status === "NA" ? "NA" : `${result}C`;
       setProduct(productTemp);
       sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
       setProductEdit({
@@ -924,7 +926,7 @@ export const ProviderProductEdition = ({
         })
       );
 
-      await loadData();
+      loadData();
     } catch (error) {
       console.log(error);
     }
@@ -945,7 +947,7 @@ export const ProviderProductEdition = ({
       },
     });
     const prod = productEdit;
-    const statusComplete = user.is_retailer ? `${result}CA` : `${result}P`;
+    const statusComplete = user.is_retailer ? `${result}C` : `${result}P`;
     prod.product.datasheet_status = statusComplete;
     prod.product.description_status = statusComplete;
     prod.product.images_status = statusComplete;
@@ -954,22 +956,24 @@ export const ProviderProductEdition = ({
     sessionStorage.setItem("productEdit", JSON.stringify(prod));
     setProduct(prod);
     setShowGenericModal && setShowGenericModal(false);
-    await loadData();
+    loadData();
   };
 
   const getSectionStatus = () => {
     const concept = getConcept(activeTab);
-    return ["AA", "AP", "R", "CA", "RCA"].includes(
+    return ["AA", "AP", "RECEIVED", "IN_PROGRESS", "RC"].includes(
       productEdit.product[`${concept}_status`]
     );
   };
 
   const enableActions = (versionStatus) => {
     try {
-      if (user.is_retailer) return false;
+      const userIsRetailer = user.is_retailer;
+
+      if (userIsRetailer) return false;
 
       if (versionStatus) {
-        return ["AP", "ACA", "RCA", null].includes(versionStatus);
+        return ["AP", "AC", "RC", null].includes(versionStatus);
       }
       return true;
     } catch (err) {
@@ -1059,21 +1063,23 @@ export const ProviderProductEdition = ({
                   },
                 }));
                 setShowGenericModal(true);
-              } else if (user.is_retailer) {
-                if (product.id_order || product.orderId) {
-                  validateAll("A");
+              } else {
+                if (user.is_retailer) {
+                  if (product.id_order || product.orderId) {
+                    validateAll("A");
+                  } else {
+                    setDataGenericModal((prev) => ({
+                      ...prev,
+                      button2: {
+                        name: "Continuar",
+                        action: () => evaluationToRetailer("A"),
+                      },
+                    }));
+                    setShowGenericModal(true);
+                  }
                 } else {
-                  setDataGenericModal((prev) => ({
-                    ...prev,
-                    button2: {
-                      name: "Continuar",
-                      action: () => evaluationToRetailer("A"),
-                    },
-                  }));
-                  setShowGenericModal(true);
+                  validateAll("A");
                 }
-              } else {
-                validateAll("A");
               }
             }}
             rejectAll={() => {
@@ -1083,23 +1089,25 @@ export const ProviderProductEdition = ({
                 (!product.id_order || !product.orderId)
               ) {
                 return;
-              } else if (user.is_retailer) {
-                if (product.id_order || product.orderId) {
+              } else {
+                if (user.is_retailer) {
+                  if (product.id_order || product.orderId) {
+                    validateAll("R");
+                    setModalViewError(true);
+                  } else {
+                    setDataGenericModal((prev) => ({
+                      ...prev,
+                      button2: {
+                        name: "Continuar",
+                        action: () => evaluationToRetailer("R"),
+                      },
+                    }));
+                    setShowGenericModal(true);
+                  }
+                } else {
                   validateAll("R");
                   setModalViewError(true);
-                } else {
-                  setDataGenericModal((prev) => ({
-                    ...prev,
-                    button2: {
-                      name: "Continuar",
-                      action: () => evaluationToRetailer("R"),
-                    },
-                  }));
-                  setShowGenericModal(true);
                 }
-              } else {
-                validateAll("R");
-                setModalViewError(true);
               }
             }}
             approve={() => {
@@ -1116,21 +1124,23 @@ export const ProviderProductEdition = ({
                   },
                 }));
                 setShowGenericModal(true);
-              } else if (user.is_retailer) {
-                if (product.id_order || product.orderId) {
-                  sendEvaluation("A");
+              } else {
+                if (user.is_retailer) {
+                  if (product.id_order || product.orderId) {
+                    sendEvaluation("A");
+                  } else {
+                    setDataGenericModal((prev) => ({
+                      ...prev,
+                      button2: {
+                        name: "Continuar",
+                        action: () => evaluationToRetailer("A"),
+                      },
+                    }));
+                    setShowGenericModal(true);
+                  }
                 } else {
-                  setDataGenericModal((prev) => ({
-                    ...prev,
-                    button2: {
-                      name: "Continuar",
-                      action: () => evaluationToRetailer("A"),
-                    },
-                  }));
-                  setShowGenericModal(true);
+                  sendEvaluation("A");
                 }
-              } else {
-                sendEvaluation("A");
               }
             }}
             reject={() => {
@@ -1140,33 +1150,33 @@ export const ProviderProductEdition = ({
                 (!product.id_order || !product.orderId)
               ) {
                 return;
-              } else if (user.is_retailer) {
-                if (product.id_order || product.orderId) {
+              } else {
+                if (user.is_retailer) {
+                  if (product.id_order || product.orderId) {
+                    sendEvaluation("R");
+                    setModalViewError(true);
+                  } else {
+                    setDataGenericModal((prev) => ({
+                      ...prev,
+                      button2: {
+                        name: "Continuar",
+                        action: () => evaluationToRetailer("R"),
+                      },
+                    }));
+                    setShowGenericModal(true);
+                  }
+                } else {
                   sendEvaluation("R");
                   setModalViewError(true);
-                } else {
-                  setDataGenericModal((prev) => ({
-                    ...prev,
-                    button2: {
-                      name: "Continuar",
-                      action: () => evaluationToRetailer("R"),
-                    },
-                  }));
-                  setShowGenericModal(true);
                 }
-              } else {
-                sendEvaluation("R");
-                setModalViewError(true);
               }
             }}
           />
           <FullTabsMenu
             tabsSections={tabsSections}
             status={
-              activeRetailer.id && retailerStatus
-                ? retailerStatus[activeRetailer?.id][getConcept(activeTab)] ||
-                  "NS"
-                : "-"
+              product[`${getConcept(activeTab)}_status`] ||
+              product?.version_status
             }
             activeTab={activeTab}
             setActiveTab={setActiveTab}
@@ -1177,6 +1187,8 @@ export const ProviderProductEdition = ({
             setAssignation={setAssignation}
             isRetailer={isRetailer}
             showSaveButton={enableActions(product.version_status)}
+            version={version}
+            setShowVersionSelector={setShowVersionSelector}
             onClickSave={() => {
               switch (activeTab) {
                 case "Descripción":
@@ -1309,44 +1321,56 @@ export const ProviderProductEdition = ({
                   />
                 </div>
               )}
+              <Button
+                buttonType={
+                  evaluationComplete(activeTab) &&
+                  (productEdit.product.id_order || productEdit.product.orderId)
+                    ? "general-green-button"
+                    : "general-button-disabled"
+                }
+                label={"Enviar evaluación"}
+                onClick={() => {
+                  //setModalSent(true);
+                  sendEvaluation();
+                  setMessage(`¡Evaluación de ${activeTab} completada!`);
+                }}
+              />
             </div>
-          ) : (
-            !revision && (
-              <div className="required-inputs-message">
-                <div>
-                  <p>
-                    Los atributos son requeridos por las plataformas de las
-                    cadenas, es muy importante completar los campos requeridos
-                    ya que pueden rechazar el producto por falta de información.
-                  </p>
-                </div>
-                {inCart ? (
-                  <button type="button">
-                    <Link to="/checkout">
-                      <p>Articulo en carrito</p>
-                      <p>Ir a checkout</p>
-                    </Link>
-                  </button>
-                ) : (
-                  <>
-                    <SliderToolTip
-                      infoIcon={InfoIcon}
-                      slidefront={slidefront}
-                      iconSize={"big-image"}
-                      slidePosition={"top-slide"}
-                    />
-                    <Button
-                      onClick={() => {
-                        setShowContentohRequestModal &&
-                          setShowContentohRequestModal(true);
-                      }}
-                      buttonType="general-default-button"
-                      label="Enviar a Content-oh!"
-                    />
-                  </>
-                )}
+          ) : revision ? null : (
+            <div className="required-inputs-message">
+              <div>
+                <p>
+                  Los atributos son requeridos por las plataformas de las
+                  cadenas, es muy importante completar los campos requeridos ya
+                  que pueden rechazar el producto por falta de información.
+                </p>
               </div>
-            )
+              {inCart ? (
+                <button type="button">
+                  <Link to="/checkout">
+                    <p>Articulo en carrito</p>
+                    <p>Ir a checkout</p>
+                  </Link>
+                </button>
+              ) : (
+                <>
+                  <SliderToolTip
+                    infoIcon={InfoIcon}
+                    slidefront={slidefront}
+                    iconSize={"big-image"}
+                    slidePosition={"top-slide"}
+                  ></SliderToolTip>
+                  <Button
+                    onClick={() => {
+                      setShowContentohRequestModal &&
+                        setShowContentohRequestModal(true);
+                    }}
+                    buttonType="general-default-button"
+                    label="Enviar a Content-oh!"
+                  />
+                </>
+              )}
+            </div>
           )}
         </div>
       </div>
@@ -1423,6 +1447,15 @@ export const ProviderProductEdition = ({
           textArea={false}
         />
       )}
+      {showVersionSelector && (
+        <VersionSelector
+          modalId={"version-selector"}
+          articleId={product.id_article}
+          setVersion={setVersion}
+          companyName={company.company_name}
+          currentVersion={version}
+        />
+      )}
     </Container>
   );
 };