@agrada_digital/pbm 0.0.55 → 0.0.56

package/dist/index.mjs

@@ -53,8 +53,81 @@ var Container_default = Container;
 
 // src/components/Footer/index.tsx
 import classNames2 from "classnames";
+import { useEffect, useState } from "react";
+
+// src/libs/zustand/usePBM.tsx
+import { createStore } from "zustand";
+import { useStore } from "zustand/react";
+var initialPBMState = {
+  securityNumber: "",
+  state: "isEmpty",
+  availableDiscountSelected: {
+    quantity: 0,
+    discount: {
+      unit: 0,
+      total: 0
+    },
+    totalPrice: 0
+  },
+  targetProduct: null,
+  campaign: "pbm_campaign"
+};
+var createPBMStore = (set) => ({
+  ...initialPBMState,
+  setSecurityNumber: (securityNumber) => set({ securityNumber }),
+  setState: (state) => set({ state }),
+  setTargetProduct: (targetProduct) => set({ targetProduct }),
+  setAvailableDiscountSelected: (availableDiscount) => set({ availableDiscountSelected: availableDiscount })
+});
+var pbmStore = createStore(createPBMStore);
+function usePBMStore(selector) {
+  if (selector) {
+    return useStore(pbmStore, selector);
+  }
+  return useStore(pbmStore, (state) => state);
+}
+
+// src/services/get-product-by-ean.ts
+import Cookies from "js-cookie";
+var GetProductByEAN = async ({ PRODUCT_EAN }) => {
+  const API_URL = import.meta.env.VITE_API_URL;
+  const AUTH_TOKEN = Cookies.get("pbm-token");
+  if (!AUTH_TOKEN) {
+    throw new Error("Token is not defined in cookies or is expired");
+  }
+  const response = await fetch(`${API_URL}/products/ean/${PRODUCT_EAN}`, {
+    method: "GET",
+    headers: {
+      Authorization: `Bearer ${AUTH_TOKEN}`,
+      "Content-Type": "application/json"
+    }
+  });
+  const dataResponse = await response.json();
+  if (!dataResponse.sucesso) {
+    throw new Error(dataResponse.message || "Failed to fetch authorization");
+  }
+  return dataResponse;
+};
+
+// src/components/Footer/index.tsx
 import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-function Footer({ industryLogo }) {
+function Footer() {
+  const [industryLogo, setIndustryLogo] = useState(void 0);
+  const { targetProduct } = usePBMStore();
+  useEffect(() => {
+    const fetchProductByEan = async () => {
+      if (!targetProduct) return;
+      try {
+        const response = await GetProductByEAN({ PRODUCT_EAN: targetProduct.ean });
+        if (response.sucesso && response.dados) {
+          setIndustryLogo(response.dados.pbm.imageLink);
+        }
+      } catch (error) {
+        console.error(error);
+      }
+    };
+    fetchProductByEan();
+  }, [targetProduct]);
   return /* @__PURE__ */ jsx3("footer", { className: "w-full h-auto relative", id: "footer_pbm", children: /* @__PURE__ */ jsxs2("section", { className: classNames2("flex items-center w-full h-auto gap-4", { "justify-center": industryLogo, "justify-start": !industryLogo }), children: [
     /* @__PURE__ */ jsxs2("section", { className: "w-4/5 h-auto", children: [
       /* @__PURE__ */ jsx3("h3", { className: "text-start font-semibold text-sm", children: "Economize com o benef\xEDcio do laborat\xF3rio." }),
@@ -65,7 +138,7 @@ function Footer({ industryLogo }) {
       {
         src: industryLogo,
         alt: "parceiro",
-        className: "w-1/5 min-w-20 h-auto aspect-square",
+        className: "w-1/5 min-w-20 h-auto aspect-auto",
         loading: "eager",
         id: "footer_industry_logo_pbm",
         "data-testid": "footer_industry_logo_pbm"
@@ -86,7 +159,8 @@ var validationSchema = z.strictObject({
   }, "CPF deve conter no m\xEDnimo 11 caracteres.").refine((doc) => {
     const replacedDoc = doc.replace(/\D/g, "");
     return !!Number(replacedDoc);
-  }, "CPF deve conter apenas n\xFAmeros.")
+  }, "CPF deve conter apenas n\xFAmeros."),
+  coupon: z.string().min(0)
 });
 
 // src/utils/format.ts
@@ -98,51 +172,20 @@ var toFormat = (value) => {
 };
 
 // src/components/Form/index.tsx
-import classNames3 from "classnames";
+import classNames4 from "classnames";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm } from "react-hook-form";
 import { ArrowRight } from "lucide-react";
-
-// src/libs/zustand/usePBM.tsx
-import { createStore } from "zustand";
-import { useStore } from "zustand/react";
-var initialPBMState = {
-  securityNumber: "",
-  state: "isEmpty",
-  availableDiscountSelected: {
-    quantity: 0,
-    discount: {
-      unit: 0,
-      total: 0
-    },
-    totalPrice: 0
-  },
-  targetProduct: null,
-  campaign: "pbm_campaign"
-};
-var createPBMStore = (set) => ({
-  ...initialPBMState,
-  setSecurityNumber: (securityNumber) => set({ securityNumber }),
-  setState: (state) => set({ state }),
-  setTargetProduct: (targetProduct) => set({ targetProduct }),
-  setAvailableDiscountSelected: (availableDiscount) => set({ availableDiscountSelected: availableDiscount })
-});
-var pbmStore = createStore(createPBMStore);
-function usePBMStore(selector) {
-  if (selector) {
-    return useStore(pbmStore, selector);
-  }
-  return useStore(pbmStore, (state) => state);
-}
+import { useState as useState2 } from "react";
 
 // src/services/validate-document.ts
-import Cookies from "js-cookie";
+import Cookies2 from "js-cookie";
 var ValidateDocument = async ({ document, products }) => {
   const API_URL = import.meta.env.VITE_API_URL;
   if (!API_URL) {
     throw new Error("API URL is not defined in environment variables");
   }
-  const AUTH_TOKEN = Cookies.get("pbm-token");
+  const AUTH_TOKEN = Cookies2.get("pbm-token");
   if (!AUTH_TOKEN) {
     throw new Error("Token is not defined in cookies or is expired");
   }
@@ -161,10 +204,29 @@ var ValidateDocument = async ({ document, products }) => {
   return dataResponse;
 };
 
+// src/components/UI/Button/index.tsx
+import classNames3 from "classnames";
+import { jsx as jsx4 } from "react/jsx-runtime";
+function Button(props) {
+  return /* @__PURE__ */ jsx4(
+    "button",
+    {
+      ...props,
+      className: classNames3(
+        "w-3xs cursor-pointer h-10 rounded-full bg-blue-500 hover:bg-blue-400 text-white text-sm font-semibold transition-colors",
+        props.className
+      ),
+      children: props.children
+    }
+  );
+}
+var Button_default = Button;
+
 // src/components/Form/index.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 function Form({ setLoading }) {
   const { setSecurityNumber, setState, securityNumber, targetProduct } = usePBMStore();
+  const [showCoupoField, setShowCoupoField] = useState2(false);
   const {
     handleSubmit,
     register,
@@ -180,7 +242,7 @@ function Form({ setLoading }) {
     setLoading(true);
     try {
       if (targetProduct === null) {
-        console.error("Product is not defined!");
+        console.error("PBMLOG: Product is not defined!");
         return;
       }
       const response = await ValidateDocument({
@@ -196,76 +258,125 @@ function Form({ setLoading }) {
         setState(status[response.data.process_platform.status]);
       }
     } catch (error) {
-      console.error("Error validating document:", error);
+      console.error("PBMLOG: Error validating document -", error);
     } finally {
       setLoading(false);
     }
     ;
   };
-  return /* @__PURE__ */ jsxs3(
-    "form",
-    {
-      onSubmit: handleSubmit(onSubmitDefault),
-      className: classNames3(
-        "w-full h-auto flex items-center justify-center mb-0 transition-all duration-150",
-        { "mb-4": errors.securityNumber }
-      ),
-      id: "form_security_number_pbm",
-      children: [
-        /* @__PURE__ */ jsxs3(
-          "label",
-          {
-            htmlFor: "cpf",
-            className: "w-4/5 h-auto flex items-start flex-col justify-center relative py-2",
-            id: "label_security_number_pbm",
-            children: [
-              /* @__PURE__ */ jsx4(
-                "input",
-                {
-                  type: "text",
-                  className: classNames3(
-                    "w-full h-8 bg-[#44c2c0]/20 rounded-s-full text-sm font-semibold focus:outline focus:outline-[#339c9b] focus:bg-[#44c2c0]/30  text-zinc-600 placeholder:text-zinc-600 px-4 placeholder:text-sm placeholder:font-semibold",
-                    { "outline outline-red-600": errors.securityNumber }
-                  ),
-                  placeholder: "Digite seu CPF aqui...",
-                  required: true,
-                  maxLength: 14,
-                  ...register("securityNumber", {
-                    onChange: (e) => {
-                      const formatted = toFormat(e.target.value);
-                      setValue("securityNumber", formatted, {
-                        shouldValidate: true
-                      });
-                    }
-                  }),
-                  defaultValue: securityNumber || "",
-                  id: "input_security_number_pbm"
-                }
-              ),
-              errors.securityNumber && /* @__PURE__ */ jsx4("span", { className: "text-red-400 text-xs font-semibold  absolute -bottom-3 left-2 text-nowrap", id: "security_number_form_error", children: errors.securityNumber.message })
-            ]
-          }
+  return /* @__PURE__ */ jsxs3(Fragment, { children: [
+    /* @__PURE__ */ jsxs3(
+      "form",
+      {
+        onSubmit: handleSubmit(onSubmitDefault),
+        className: classNames4(
+          "w-full h-auto flex items-center justify-center mb-0 transition-all duration-150",
+          { "mb-4": errors.securityNumber || errors.coupon, "gap-2": showCoupoField }
         ),
-        /* @__PURE__ */ jsx4(
-          "button",
-          {
-            type: "submit",
-            className: "bg-gray-400 w-1/5 h-8 flex items-center justify-center rounded-e-full cursor-pointer",
-            id: "button_submit_security_number_pbm",
-            children: /* @__PURE__ */ jsx4(ArrowRight, { size: 24, color: "white", strokeWidth: 2 })
-          }
-        )
-      ]
-    }
-  );
+        id: "form_security_number_pbm",
+        children: [
+          /* @__PURE__ */ jsxs3(
+            "label",
+            {
+              htmlFor: "cpf",
+              className: "w-4/5 h-auto flex items-start flex-col justify-center relative py-2",
+              id: "label_security_number_pbm",
+              children: [
+                /* @__PURE__ */ jsx5(
+                  "input",
+                  {
+                    type: "text",
+                    className: classNames4(
+                      "w-full h-8 bg-[#44c2c0]/20 rounded-s-full text-sm font-semibold focus:outline focus:outline-[#339c9b] focus:bg-[#44c2c0]/30  text-zinc-600 placeholder:text-zinc-600 px-4 placeholder:text-sm placeholder:font-semibold",
+                      { "outline outline-red-600": errors.securityNumber, "rounded-full": showCoupoField }
+                    ),
+                    placeholder: "Digite seu CPF aqui...",
+                    required: true,
+                    maxLength: 14,
+                    ...register("securityNumber", {
+                      onChange: (e) => {
+                        const formatted = toFormat(e.target.value);
+                        setValue("securityNumber", formatted, {
+                          shouldValidate: true
+                        });
+                      }
+                    }),
+                    defaultValue: securityNumber || "",
+                    id: "input_security_number_pbm"
+                  }
+                ),
+                errors.securityNumber && /* @__PURE__ */ jsx5("span", { className: "text-red-400 text-xs font-semibold  absolute -bottom-3 left-2 text-nowrap", id: "security_number_form_error", children: errors.securityNumber.message })
+              ]
+            }
+          ),
+          showCoupoField && /* @__PURE__ */ jsxs3(
+            "label",
+            {
+              htmlFor: "coupon",
+              className: "w-4/5 h-auto flex items-start flex-col justify-center relative py-2",
+              id: "label_coupon_pbm",
+              children: [
+                /* @__PURE__ */ jsx5(
+                  "input",
+                  {
+                    type: "text",
+                    className: classNames4(
+                      "w-full h-8 bg-[#44c2c0]/20 rounded-s-full text-sm font-semibold focus:outline focus:outline-[#339c9b] focus:bg-[#44c2c0]/30  text-zinc-600 placeholder:text-zinc-600 px-4 placeholder:text-sm placeholder:font-semibold",
+                      { "outline outline-red-600": errors.coupon, "rounded-full": showCoupoField }
+                    ),
+                    placeholder: "Cupom / ID do Cart\xE3o",
+                    required: true,
+                    maxLength: 14,
+                    ...register("coupon", {
+                      onChange: (e) => {
+                        setValue("coupon", e.target.value, {
+                          shouldValidate: true
+                        });
+                      }
+                    }),
+                    id: "input_coupon_pbm"
+                  }
+                ),
+                errors.coupon && /* @__PURE__ */ jsx5("span", { className: "text-red-400 text-xs font-semibold  absolute -bottom-3 left-2 text-nowrap", id: "coupon_form_error", children: errors.coupon.message })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx5(
+            "button",
+            {
+              type: "submit",
+              className: classNames4(
+                "bg-gray-400 w-1/5 h-8 flex items-center justify-center rounded-e-full cursor-pointer",
+                { "rounded-full": showCoupoField }
+              ),
+              id: "button_submit_security_number_pbm",
+              children: /* @__PURE__ */ jsx5(ArrowRight, { size: 24, color: "white", strokeWidth: 2 })
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs3(
+      Button_default,
+      {
+        className: "bg-transparent p-0 pl-2 w-auto h-auto text-zinc-600 underline cursor-pointer hover:text-zinc-900 hover:bg-transparent flex items-center justify-start gap-1",
+        onClick: () => setShowCoupoField(!showCoupoField),
+        id: "check_benefits_button",
+        children: [
+          /* @__PURE__ */ jsx5("span", { children: !showCoupoField ? "Possui cupom?" : "N\xE3o possui cupom?" }),
+          /* @__PURE__ */ jsx5(ArrowRight, { size: 16, className: classNames4({ "rotate-0": !showCoupoField, "rotate-180": showCoupoField }) })
+        ]
+      }
+    )
+  ] });
 }
 var Form_default = Form;
 
 // src/components/UI/Loading/index.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 function Loading({ textColor }) {
   return /* @__PURE__ */ jsxs4("main", { className: "flex items-center justify-center gap-4", id: "loading_pbm", children: [
-    /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsx6(
       "div",
       {
         "data-testid": "test_id_spin",
@@ -273,7 +384,7 @@ function Loading({ textColor }) {
         id: "loading_spin"
       }
     ),
-    /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsx6(
       "p",
       {
         className: "text-sm font-semibold text-start text-zinc-900",
@@ -286,26 +397,8 @@ function Loading({ textColor }) {
 }
 var Loading_default = Loading;
 
-// src/components/UI/Button/index.tsx
-import classNames4 from "classnames";
-import { jsx as jsx6 } from "react/jsx-runtime";
-function Button(props) {
-  return /* @__PURE__ */ jsx6(
-    "button",
-    {
-      ...props,
-      className: classNames4(
-        "w-3xs cursor-pointer h-10 rounded-full bg-blue-500 hover:bg-blue-400 text-white text-sm font-semibold transition-colors",
-        props.className
-      ),
-      children: props.children
-    }
-  );
-}
-var Button_default = Button;
-
 // src/components/BenefitsTable/index.tsx
-import { useState } from "react";
+import { useState as useState3 } from "react";
 
 // src/mocks/benefits.ts
 var BENEFITS_ITEMS = [
@@ -354,7 +447,7 @@ var Title_default = Title;
 
 // src/components/BenefitsTable/Item.tsx
 import { Badge, BadgeCheck } from "lucide-react";
-import { useCallback, useEffect } from "react";
+import { useCallback, useEffect as useEffect2 } from "react";
 import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
 function Item({ data, onChange, checked, originalProductPrice }) {
   const { setAvailableDiscountSelected, securityNumber } = usePBMStore();
@@ -383,7 +476,7 @@ function Item({ data, onChange, checked, originalProductPrice }) {
     totalPriceProductWithDiscountBenefit,
     unitDiscountValue
   ]);
-  useEffect(() => {
+  useEffect2(() => {
     updateStorageData();
   }, [updateStorageData]);
   return /* @__PURE__ */ jsxs5(
@@ -440,7 +533,7 @@ function BenefitsTable({
   originalProductPrice
 }) {
   const { securityNumber, setState } = usePBMStore();
-  const [selectedDiscout, setSelectedDiscount] = useState(null);
+  const [selectedDiscout, setSelectedDiscount] = useState3(null);
   return /* @__PURE__ */ jsxs6(
     "section",
     {
@@ -584,10 +677,10 @@ function Iframe({ url, title, openModal, setOpenModal }) {
 var Iframe_default = Iframe;
 
 // src/components/SecurityNumberInvalid/index.tsx
-import { useState as useState2 } from "react";
+import { useState as useState4 } from "react";
 import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 function SecurityNumberInvalid({ textColor }) {
-  const [openModal, setOpenModal] = useState2(false);
+  const [openModal, setOpenModal] = useState4(false);
   return /* @__PURE__ */ jsxs8(
     "section",
     {
@@ -622,7 +715,7 @@ function SecurityNumberInvalid({ textColor }) {
 var SecurityNumberInvalid_default = SecurityNumberInvalid;
 
 // src/PBM.tsx
-import { useCallback as useCallback2, useEffect as useEffect2, useState as useState3 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect3, useState as useState5 } from "react";
 
 // src/components/UI/Link/index.tsx
 import classNames8 from "classnames";
@@ -683,7 +776,7 @@ function SecurityNumberRegitered({ textColor }) {
 var SecurityNumberRegitered_default = SecurityNumberRegitered;
 
 // src/services/authorization.ts
-import Cookies2 from "js-cookie";
+import Cookies3 from "js-cookie";
 var GetAuthorization = async ({ clientID }) => {
   const API_URL = import.meta.env.VITE_API_URL;
   const STORE_ID = import.meta.env.VITE_STORE_ID;
@@ -709,12 +802,13 @@ var GetAuthorization = async ({ clientID }) => {
   if (!dataResponse.success) {
     throw new Error(dataResponse.message || "Failed to fetch authorization");
   }
-  Cookies2.set("pbm-token", dataResponse.data.token, {
-    expires: parseInt(dataResponse.data.expiresIn, 10) / (60 * 60),
+  Cookies3.set("pbm-token", dataResponse.data.Token, {
+    expires: dataResponse.data.ExpiresIn / (60 * 60),
     secure: true,
     sameSite: "Strict"
   });
-  Cookies2.set("pbm-token-refresh", dataResponse.data.refreshToken, {
+  Cookies3.set("pbm-token-refresh", dataResponse.data.RefreshToken, {
+    expires: dataResponse.data.RefreshExpiresIn / (60 * 60),
     secure: true,
     sameSite: "Strict"
   });
@@ -723,19 +817,18 @@ var GetAuthorization = async ({ clientID }) => {
 
 // src/PBM.tsx
 import { ArrowRight as ArrowRight2 } from "lucide-react";
-import { Fragment, jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
 function PBM({
   originalProductPrice,
-  industryLogo,
   clientID,
   eanProduct
 }) {
   const formatedOriginalProductPrice = Number(
     String(originalProductPrice).replace(",", ".")
   );
-  const [loading, setLoading] = useState3(false);
+  const [loading, setLoading] = useState5(false);
   const { setState, state, setTargetProduct } = usePBMStore();
-  useEffect2(() => {
+  useEffect3(() => {
     if (eanProduct) {
       setTargetProduct({ ean: eanProduct, quantity: 1 });
     }
@@ -743,22 +836,20 @@ function PBM({
   const handleAuthorizationRequest = useCallback2(async () => {
     try {
       const response = await GetAuthorization({ clientID });
-      if (response.success) {
-        console.log("Authorization successful:", response.data);
-      } else {
-        console.error("Authorization failed:", response.message);
+      if (!response.success) {
+        console.error("PBMLOG: Authorization failed!");
       }
     } catch (error) {
       console.error("Error fetching authorization:", error);
     }
   }, [clientID]);
-  useEffect2(() => {
+  useEffect3(() => {
     handleAuthorizationRequest();
   }, [handleAuthorizationRequest]);
   return /* @__PURE__ */ jsxs10(Container_default, { variant: "main", children: [
     /* @__PURE__ */ jsx15(Header_default, { originalProductPrice: formatedOriginalProductPrice || 0 }),
     /* @__PURE__ */ jsxs10(Container_default, { variant: "simple", children: [
-      state === "isEmpty" && !loading && /* @__PURE__ */ jsxs10(Fragment, { children: [
+      state === "isEmpty" && !loading && /* @__PURE__ */ jsxs10(Fragment2, { children: [
         /* @__PURE__ */ jsx15(Form_default, { setLoading }),
         /* @__PURE__ */ jsxs10(
           Button_default,
@@ -778,7 +869,7 @@ function PBM({
       state === "isRegistered" && !loading && /* @__PURE__ */ jsx15(SecurityNumberRegitered_default, {}),
       state === "isActivated" && !loading && /* @__PURE__ */ jsx15(BenefitsTable_default, { originalProductPrice: formatedOriginalProductPrice })
     ] }),
-    /* @__PURE__ */ jsx15(Footer_default, { industryLogo: industryLogo || void 0 })
+    /* @__PURE__ */ jsx15(Footer_default, {})
   ] });
 }
 var PBM_default = PBM;