contentoh-components-library 21.4.62 → 21.4.64

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

@@ -40,6 +40,8 @@ export const Dashboard = ({ jwt, user, company }) => {
   const [applicantsFilter, setApplicantsFilter] = useState([]);
   const [totalCount, setTotalCount] = useState(0);
   const [isProviderFinanced] = useState(company?.financedRetailers?.length > 0);
+  const [trades, setTrades] = useState([]);
+  const [tradesSelected, setTradesSelected] = useState([]);
 
   const loadProductVersions = async (queryObject) => {
     const keys = Object.keys(queryObject);
@@ -84,9 +86,10 @@ export const Dashboard = ({ jwt, user, company }) => {
     const isRetailer = user.is_retailer && company.retailers;
     const isProvider = !user.is_retailer && user.id_role === 0;
     const isCollaborator = user.id_role > 0;
-    const { ordersBydate, ordersByStatus } =
+    const { ordersBydate, ordersByStatus, ordersByActive, companyTrades } =
       (await loadProductVersions(orderByStatus)) || {};
 
+    if (trades.length === 0) setTrades(companyTrades);
     const { total = 0, R = 0, PA = 0, Ex = 0, ACA = 0 } = ordersByStatus;
     let productsFinished = 0;
     if (isRetailer) productsFinished = Ex;
@@ -100,13 +103,18 @@ export const Dashboard = ({ jwt, user, company }) => {
           : prev,
       0
     );
+
+    const registeredProducts = ordersByActive.registered;
     let metricsArray = [
       metricsData[0]
         ? metricsData[0]
         : { label: "Productos totales", value: total },
     ];
 
+    console.log(registeredProducts);
+
     metricsArray.push(
+      { label: "Productos activos", value: registeredProducts },
       { label: "Productos filtrados", value: total },
       { label: "Productos sin asignar", value: PA + R },
       { label: "Productos en proceso", value: inProcess },
@@ -229,14 +237,23 @@ export const Dashboard = ({ jwt, user, company }) => {
       startDate: startDate,
       endDate: endDate,
     };
-    companyId.length > 0 && (queryObject["companyId"] = companyId.join(","));
-    retailerId.length > 0 && (queryObject["retailerId"] = retailerId.join(","));
-    categoryId.length > 0 && (queryObject["categoryId"] = categoryId.join(","));
+    if (companyId.length > 0) queryObject["companyId"] = companyId.join(",");
+    if (retailerId.length > 0) queryObject["retailerId"] = retailerId.join(",");
+    if (categoryId.length > 0) queryObject["categoryId"] = categoryId.join(",");
+    if (tradesSelected.length > 0)
+      queryObject["trades"] = encodeURIComponent(tradesSelected.join(","));
     applicantsFilter.length > 0 &&
       (queryObject["requestedBy"] = applicantsFilter.join(","));
 
     await loadProductsByStatus(queryObject, true);
-  }, [companyId, retailerId, categoryId, datesRange, applicantsFilter]);
+  }, [
+    companyId,
+    retailerId,
+    categoryId,
+    datesRange,
+    applicantsFilter,
+    tradesSelected,
+  ]);
 
   return loading ? (
     <Loading />
@@ -301,6 +318,17 @@ export const Dashboard = ({ jwt, user, company }) => {
             defaultOption="Todos los solicitantes"
           />
         )}
+        {user.id_role === 0 && trades?.length > 0 && (
+          <CustomSelect
+            showSearchBar={true}
+            options={trades}
+            selectLabel="Todas las marcas"
+            placeHolder="Buscar marca"
+            customSelectId="trade-select"
+            parameterArray={tradesSelected}
+            setParameterArray={setTradesSelected}
+          />
+        )}
       </div>
       <div className="metric-cards">
         {metricsData.map((metric, index) => (

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

@@ -21,39 +21,41 @@ ProviderProductEditionDefault.args = {
   category: 287,
   version: 1,
   productSelected: {
-    id_article:39550,
-    upc:43654697,
-    name:"Campana de Cocina",
-    timestamp:"2023-08-04T22:23:40.000Z",
-    categoryName:"Ferretería|Ferretería General|Tornillos, Tuercas y Arandelas",
-    id_category:287,
-    version:1,
-    retailersAvailable:[
-      {name:"The Home Depot Golden","id":58},
-      {name:"The Home Depot Onboarding","id":68}],
-      percentage:"89"
-    },
+    id_article: 39550,
+    upc: 43654697,
+    name: "Campana de Cocina",
+    timestamp: "2023-08-04T22:23:40.000Z",
+    categoryName:
+      "Ferretería|Ferretería General|Tornillos, Tuercas y Arandelas",
+    id_category: 287,
+    version: 1,
+    retailersAvailable: [
+      { name: "The Home Depot Golden", id: 58 },
+      { name: "The Home Depot Onboarding", id: 68 },
+    ],
+    percentage: "89",
+  },
   productToEdit: {
-    idCategory:287,
-    ArticleId:39550,
-    product:[{
-      id_article:39550,
-      upc:43654697,
-      name:"Campana de Cocina",
-      timestamp:"2023-08-04T22:23:40.000Z",
-      categoryName:"Ferretería|Ferretería General|Tornillos, Tuercas y Arandelas",
-      id_category:287,
-      version:1,
-      retailersAvailable:[
-        {name:"The Home Depot Golden",
-        id:58,
-        percentage:100},
-        {name:"The Home Depot Onboarding",
-        id:68,
-        percentage:78}
-      ],
-      percentage:"89"}] 
-    },
+    idCategory: 287,
+    ArticleId: 39550,
+    product: [
+      {
+        id_article: 39550,
+        upc: 43654697,
+        name: "Campana de Cocina",
+        timestamp: "2023-08-04T22:23:40.000Z",
+        categoryName:
+          "Ferretería|Ferretería General|Tornillos, Tuercas y Arandelas",
+        id_category: 287,
+        version: 1,
+        retailersAvailable: [
+          { name: "The Home Depot Golden", id: 58, percentage: 100 },
+          { name: "The Home Depot Onboarding", id: 68, percentage: 78 },
+        ],
+        percentage: "89",
+      },
+    ],
+  },
   location: {
     pathname: "/EditProducts",
     search: "",
@@ -66,57 +68,72 @@ ProviderProductEditionDefault.args = {
     key: "24vwut",
   },
   user: {
-    id_user:191,
-    name:"Demo",
-    last_name:"Demo",
-    email:"merchants24feb@allfreemail.net",
-    position:"Test",
-    telephone:"+52123456789",
-    country:"México",
-    id_company:923,
-    id_cognito:"c3cd160c-76c2-497c-9357-5ef949307e1e",
-    birth_Date:null,
-    about_me:null,
-    zip_code:null,
-    address:null,
-    job:null,
-    id_stripe:null,
-    id_role:0,
-    active:1,
-    is_retailer:0,
-    email_notify:1,
-    is_user_tech:null,
-    membership:
-    {id:114,
-      start_date:"2023-02-24T18:14:43.000Z",
-      end_date:"2024-02-24T18:14:43.000Z",
-      planID:8,
-      plan:"prod_KtlhECVSFG2iro",
-      name:"Plan Pro",
-      user_limit:"50",
-      products_limit:"5000",
-      type:"Enterprise"},
-      src:"https://content-management-profile.s3.amazonaws.com/id-191/191.png?1697171804447"},
+    id_user: 191,
+    name: "Demo",
+    last_name: "Demo",
+    email: "merchants24feb@allfreemail.net",
+    position: "Test",
+    telephone: "+52123456789",
+    country: "México",
+    id_company: 923,
+    id_cognito: "c3cd160c-76c2-497c-9357-5ef949307e1e",
+    birth_Date: null,
+    about_me: null,
+    zip_code: null,
+    address: null,
+    job: null,
+    id_stripe: null,
+    id_role: 0,
+    active: 1,
+    is_retailer: 0,
+    email_notify: 1,
+    is_user_tech: null,
+    membership: {
+      id: 114,
+      start_date: "2023-02-24T18:14:43.000Z",
+      end_date: "2024-02-24T18:14:43.000Z",
+      planID: 8,
+      plan: "prod_KtlhECVSFG2iro",
+      name: "Plan Pro",
+      user_limit: "50",
+      products_limit: "5000",
+      type: "Enterprise",
+    },
+    src: "https://content-management-profile.s3.amazonaws.com/id-191/191.png?1697171804447",
+  },
   company: {
-    id_company:923,
-    trade_name:"Demo",
-    company_name:"Demo",
-    rfc:"Demo",
-    adress:"Demo",
-    about_company:null,
-    telephone:null,
-    web_site:null,
-    zip_code:null,
-    email:null,
-    social_link:null,
-    is_retailer:0,
-    financedRetailers:
-    [{id:68,
-      name:"The Home Depot Onboarding",
-      country:"México",
-      id_region:1,
-      active:1,
-      flow:1}],
-      retailers:[{id:68,name:"The Home Depot Onboarding",country:"México",id_region:1,"active":1,flow:1}]},
+    id_company: 923,
+    trade_name: "Demo",
+    company_name: "Demo",
+    rfc: "Demo",
+    adress: "Demo",
+    about_company: null,
+    telephone: null,
+    web_site: null,
+    zip_code: null,
+    email: null,
+    social_link: null,
+    is_retailer: 0,
+    financedRetailers: [
+      {
+        id: 68,
+        name: "The Home Depot Onboarding",
+        country: "México",
+        id_region: 1,
+        active: 1,
+        flow: 1,
+      },
+    ],
+    retailers: [
+      {
+        id: 68,
+        name: "The Home Depot Onboarding",
+        country: "México",
+        id_region: 1,
+        active: 1,
+        flow: 1,
+      },
+    ],
+  },
   showSurvey: (v) => v && alert("se muestra"),
 };

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

@@ -39,6 +39,10 @@ import Slide1_4 from "../../../assets/images/sliderToolTip/slide4.svg";
 import Slide1_5 from "../../../assets/images/sliderToolTip/slide5.svg";
 import { VersionSelector } from "../../organisms/VersionSelector";
 import { useCloseModal } from "../../../global-files/customHooks";
+import { createMessage, sendMessage } from "../RetailerProductEdition/utils";
+import { Modal } from "../../organisms/Modal";
+import { ButtonV2 } from "../../atoms/ButtonV2";
+import { Box } from "../../organisms/Box";
 
 const reducerImages = (state, action) => {
   let { values, attrForImgs, inputsByRetailer } = state;
@@ -215,6 +219,7 @@ export const ProviderProductEdition = ({
   const isRetailer = user?.is_retailer;
   const [loading, setLoading] = useState(true);
   const [validatedAll, setValidatedAll] = useState(false);
+  const [showRejectModal, setShowRejectModal] = useState(false);
 
   const [origin, setOrigin] = useState({
     "Ficha técnica": null,
@@ -344,28 +349,6 @@ export const ProviderProductEdition = ({
     (type) => {
       const formatter = new Intl.ListFormat("es", { type: "conjunction" });
       switch (type) {
-        case "error":
-          setGlobalModal({
-            message: `${activeTab} rechazada`,
-            detail: "Agrega tu comentarios para enviar el rechazo",
-            img: errorModal,
-            textArea: true,
-            button1: {
-              name: "Enviar",
-              action: (e) => {
-                const textArea = document.querySelector("#area");
-                if (textArea.value) {
-                  textArea.style.border = "none";
-                  createComment(e, textArea.value);
-                  showGlobalModal("commentsSent");
-                  validatedAll ? validateAll("R") : sendEvaluation("R");
-                } else {
-                  textArea.style.border = "2px solid red";
-                }
-              },
-            },
-          });
-          break;
         case "generic":
           setGlobalModal(dataGenericModal);
           break;
@@ -526,7 +509,9 @@ export const ProviderProductEdition = ({
       );
       setServicesData(parsedResponse);
     }
-    !activeRetailer.id && setActiveRetailer(active ? active : retailers[0]);
+    retailers &&
+      !activeRetailer.id &&
+      setActiveRetailer(active ? active : retailers[0]);
   };
 
   const isRevision = () => {
@@ -602,7 +587,7 @@ export const ProviderProductEdition = ({
       });
     }
     setProduct(productTemp);
-    setActivePercentage(retailers[0]?.percentage);
+    retailers && setActivePercentage(retailers[0]?.percentage);
   }, [percentages]);
 
   const loadInputs = () => {
@@ -862,33 +847,21 @@ export const ProviderProductEdition = ({
         return "images";
     }
   };
+  
 
-  const createComment = async (e, body, tab) => {
-    let concept = "";
-    switch (activeTab) {
-      case "Ficha técnica":
-        concept = "datasheet";
-        break;
-      case "Imágenes":
-        concept = "images";
-        break;
-
-      default:
-        concept = "description";
-        break;
-    }
+  const createComment = async (messages = [], retailerId) => {
     const data = {
-      articleId: product?.id_article,
-      orderId: product?.orderId,
-      message: body,
-      concept: concept,
-      version: version,
-    };
-    await axios.post(`${process.env.REACT_APP_COMMENTS_ENDPOINT}`, data, {
-      headers: {
-        Authorization: token,
+      paramsBody: {
+        id: product.article.id_article || productEdit.ArticleId,
+        version: version,
+        items: messages,
+        retailerId: retailerId,
+        status: product.status || productEdit.product.status,
       },
-    });
+      paramsHeader: { Authorization: token },
+    };
+    setMessage("");
+    return sendMessage(data);
   };
 
   useEffect(() => {
@@ -1224,8 +1197,6 @@ export const ProviderProductEdition = ({
 
   const enableActions = (versionStatus) => {
     try {
-      if (user.is_retailer) return false;
-
       if (versionStatus) {
         return ["AP", "ACA", "RCA", null].includes(versionStatus);
       }
@@ -1309,8 +1280,7 @@ export const ProviderProductEdition = ({
         return;
       } else if (user.is_retailer) {
         if (product.id_order || product.orderId) {
-          setValidatedAll(true);
-          showGlobalModal("error");
+          sendEvaluation("R");
         } else {
           setDataGenericModal((prev) => ({
             ...prev,
@@ -1322,8 +1292,7 @@ export const ProviderProductEdition = ({
           showGlobalModal("generic");
         }
       } else {
-        setValidatedAll(true);
-        showGlobalModal("error");
+        sendEvaluation("R");
       }
     }
   };
@@ -1333,6 +1302,7 @@ export const ProviderProductEdition = ({
       <HeaderTop
         setHeaderTop={setHeaderTop}
         withChat={location?.state?.withChat}
+        chatType={location?.state?.chatType}
         productSelected={productSelected}
         token={token}
         activeRetailer={activeRetailer}
@@ -1411,7 +1381,7 @@ export const ProviderProductEdition = ({
               } else if (user.is_retailer) {
                 if (product.id_order || product.orderId) {
                   setValidatedAll(true);
-                  showGlobalModal("error");
+                  setShowRejectModal(true);
                 } else {
                   setDataGenericModal((prev) => ({
                     ...prev,
@@ -1423,12 +1393,14 @@ export const ProviderProductEdition = ({
                   showGlobalModal("generic");
                 }
               } else {
+                setShowRejectModal(true);
                 setValidatedAll(true);
-                showGlobalModal("error");
               }
             }}
             approve={() => sendToEvaluation("A")}
-            reject={() => sendToEvaluation("R")}
+            reject={() => {
+              setShowRejectModal(true);
+            }}
           />
           <FullTabsMenu
             tabsSections={tabsSections}
@@ -1531,6 +1503,7 @@ export const ProviderProductEdition = ({
                       setUpdatedDescriptions={setUpdatedDescriptions}
                       articleId={product?.id_article}
                       version={version}
+                      isShowbox={false}
                       dinamicHeight={true}
                     />
                   ) : (
@@ -1557,87 +1530,41 @@ export const ProviderProductEdition = ({
               </>
             )}
           </div>
-          {isRevision() && getSectionStatus() ? (
-            <div className="commentary-box">
-              {!comment ? (
-                <div className="commentary">
-                  <TagAndInput
-                    label={"Caja de Comentario"}
-                    inputType={"textarea"}
-                    inputCols={80}
-                    inputRows={4}
-                    inputId={"commentary-box"}
-                    index={0}
-                  />
-                  <div className="buttons-box">
-                    <Button
-                      buttonType={"general-transparent-button"}
-                      label={"Enviar comentario"}
-                      onClick={(e) =>
-                        createComment(
-                          e,
-                          document.querySelector(
-                            "#description-commentary-box-0 .ql-container .ql-editor > p"
-                          ).innerHTML,
-                          activeTab
-                        )
-                      }
-                    />
-                  </div>
-                </div>
+          {!(isRevision() && getSectionStatus()) && !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>
               ) : (
-                <div className="feedback-box">
-                  <Commentary
-                    comment={comment.message}
-                    reviewed={crossComment}
+                <>
+                  <SliderToolTip
+                    infoIcon={InfoIcon}
+                    slidefront={slidefront}
+                    iconSize={"big-image"}
+                    slidePosition={"top-slide"}
                   />
                   <Button
-                    buttonType={"circular-button accept-button"}
-                    onClick={async () => {
-                      setCrossComment(true);
-                      commentRevised();
+                    onClick={() => {
+                      setShowContentohRequestModal &&
+                        setShowContentohRequestModal(true);
                     }}
+                    buttonType="general-default-button"
+                    label="Enviar a Content-oh!"
                   />
-                </div>
+                </>
               )}
             </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!"
-                    />
-                  </>
-                )}
-              </div>
-            )
           )}
         </div>
       </div>
@@ -1680,6 +1607,48 @@ export const ProviderProductEdition = ({
           jwt={token}
         />
       )}
+      {showRejectModal && (
+        <Modal
+          title={"Agregar mensaje de rechazo"}
+          show={showRejectModal}
+          customComponent={
+            <TagAndInput
+              inputType={"textarea"}
+              inputId={"modal-message-box"}
+              index={0}
+              color={"white"}
+            />
+          }
+          buttons={[
+            <ButtonV2
+              key={"btn-Cancelar"}
+              type={"white"}
+              label={"Cancelar"}
+              size={12}
+              onClick={() => {
+                setShowRejectModal(false);
+              }}
+            />,
+            <ButtonV2
+              key={"btn-Aceptar"}
+              type={"pink"}
+              label={"Aceptar"}
+              size={12}
+              onClick={async () => {
+                const body = document.querySelector(
+                  "#modal-message-box .ql-container .ql-editor > p"
+                ).innerHTML;
+                const messages = [
+                  { type: "message", value: body?.replace(/<.*?\/?>/gm, "") },
+                ];
+                await createComment(messages, activeRetailer.id);
+                validatedAll ? validateAll("R") : sendToEvaluation("R");
+                setShowRejectModal(false);
+              }}
+            />,
+          ]}
+        />
+      )}
     </Container>
   );
 };

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

@@ -107,6 +107,10 @@ export const Container = styled.div`
       }
     }
   }
+  #modal-message-box {
+    width: 400px;
+    height: 100px;
+  }
   .container {
     width: 100%;
     height: 100%;
@@ -115,4 +119,4 @@ export const Container = styled.div`
       width: 100%;
     }
   }
-`;
+`;

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

@@ -16,7 +16,7 @@ RetailerProductEditionDefault.args = {
     Imágenes: false,
   },
   token:
-    "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiI5YTIxMzEyOC02NDgyLTRjMTYtYTRiNi02ZTY0ZjIyNWIxYmQiLCJjb2duaXRvOmdyb3VwcyI6WyJjb2xhYm9yYWRvcmVzX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6IjlhMjEzMTI4LTY0ODItNGMxNi1hNGI2LTZlNjRmMjI1YjFiZCIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiI0OTMyY2JhZC1lYzcyLTRjYWItODgyNS0wMzY2M2RkNmE2ODIiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY5Mjc1MDY0NywibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTY5Mjc1NDI0NywiaWF0IjoxNjkyNzUwNjQ3LCJlbWFpbCI6ImlzbWFlbDk3bG9wZXpAZ21haWwuY29tIn0.eqOY-gcS-W99WcEC632Ewckcg3WJzKoV9fIGcn1AkEE44_odGTcEk8fhVs-6_evIJkfShQOP0RFX0d2Dn31F-xFh5Lez6LvbT9F41_rAmMb3ELyRvdcz42V4eMw2IBH-FGrpGhSsJOHKV2T3WuUyZxPJu-C04ZAadfFSoNBBWnxX6SFk_eefcp9KghNmnELSSnWDh6DD1XDrWqEaLOVlQ5H7q4ARJqBo07KcXHIQo056anVud-inUMiX9KDTaorXdBCD0doWgv8NkYWSEpUS_Ctj-NG6vAled9g-6oLnC6DLR_ay6PRnAKGVNCv8bRZJL0GqF8ZnWk02svDHfUPJ0Q",
+    "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiI5YTIxMzEyOC02NDgyLTRjMTYtYTRiNi02ZTY0ZjIyNWIxYmQiLCJjb2duaXRvOmdyb3VwcyI6WyJjb2xhYm9yYWRvcmVzX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6IjlhMjEzMTI4LTY0ODItNGMxNi1hNGI2LTZlNjRmMjI1YjFiZCIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiI5OGE0NzYxMy04ZGIyLTRlZjUtYjA0Mi01ZDU3MWRkZjIwMWIiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY4Mzg3NTIyNiwibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTY4Mzg3ODgyNiwiaWF0IjoxNjgzODc1MjI2LCJlbWFpbCI6ImlzbWFlbDk3bG9wZXpAZ21haWwuY29tIn0.EtgmT_THMx-Zy_zB5yZK4gz6TXNTVVJEKFt5X0JK2UkGVrp_q_92YCEuejS4n976fyTez0jkwOee6IkVHLV71uZWRBDFt-3Yw4ZxfsZYPNJWhoHXGNxhMU8MCkSntfu597esBTk-VsUpstT5R7L-WJfN8viE7R-qVo-42RlPTG0TFrWA9q0oTcqjv8vbxLpOBUjiEpjmqRhg4blJZwgkGNta6MOlw1vfmisOVbo9wMvqwnCZ9xx9KMKoH9U4uNObK_JomjbvPmTmkcUXsE-wGSD7XcoSwtuhBngLC7-jiu1u8MvL_ff5Z0Qp70sSpLdUglcSS8d1Xf7j_fcZuJ5jKA",
   productSelected: {
     services: {
       datasheets: 1,
@@ -73,7 +73,11 @@ RetailerProductEditionDefault.args = {
     upc: "7543453453",
   },
   location: {
-    product: { articleId: 39290, versionId: 7 },
+    product: { articleId: 354, versionId: 3 },
+    state: {
+      withChat: true,
+      chatType: "product_status",
+    },
   },
   user: {
     id_user: 37,