@betterstore/react 0.3.13 → 0.3.15

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @betterstore/sdk
 
+## 0.3.15
+
+### Patch Changes
+
+- bug fixes
+
+## 0.3.14
+
+### Patch Changes
+
+- bug fix
+
 ## 0.3.13
 
 ### Patch Changes

package/dist/components/checkout-embed/checkout-form.d.ts

@@ -17,6 +17,10 @@ interface CheckoutFormProps {
     setShippingCost: (cost: number) => void;
     exchangeRate: number;
     setCheckout: (checkout: any) => void;
+    setPaymentSecret: (paymentSecret: string) => void;
+    setPublicKey: (publicKey: string) => void;
+    paymentSecret: string | null;
+    publicKey: string | null;
 }
-export default function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, }: CheckoutFormProps): React.JSX.Element;
+export default function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, setPaymentSecret, setPublicKey, paymentSecret, publicKey, }: CheckoutFormProps): React.JSX.Element;
 export {};

package/dist/components/checkout-embed/useFormStore.d.ts

@@ -19,4 +19,4 @@ export declare const useFormStore: import("zustand").UseBoundStore<Omit<import("
         getOptions: () => Partial<import("zustand/middleware").PersistOptions<FormStore, FormStore>>;
     };
 }>;
-export declare const resetFormStore: () => void;
+export declare const resetFormStore: (formData: Partial<CheckoutFormData>) => void;

package/dist/index.cjs.js

@@ -35440,9 +35440,9 @@ const useFormStore = create()(persist((set) => ({
     checkoutId: "",
     setCheckoutId: (checkoutId) => set({ checkoutId }),
 }), { name: `checkout` }));
-const resetFormStore = () => {
+const resetFormStore = (formData) => {
     const currentState = JSON.parse(localStorage.getItem("checkout") || "{}");
-    localStorage.setItem("checkout", JSON.stringify(Object.assign(Object.assign({}, currentState), { state: Object.assign(Object.assign({}, currentState.state), { step: "customer", formData: { customer: currentState.customer } }) })));
+    localStorage.setItem("checkout", JSON.stringify(Object.assign(Object.assign({}, currentState), { state: Object.assign(Object.assign({}, currentState.state), { step: "customer", formData: { customer: formData.customer } }) })));
 };
 
 const motionSettings = {
@@ -35451,10 +35451,8 @@ const motionSettings = {
     exit: { opacity: 0 },
     transition: { duration: 0.2 },
 };
-function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, }) {
+function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, setPaymentSecret, setPublicKey, paymentSecret, publicKey, }) {
     const { formData, setFormData, step, setStep, checkoutId: storedCheckoutId, setCheckoutId, } = useFormStore();
-    const [paymentSecret, setPaymentSecret] = React.useState(null);
-    const [publicKey, setPublicKey] = React.useState(null);
     const [shippingRates, setShippingRates] = React.useState([]);
     const validateStep = React.useCallback(() => {
         if (step === "customer")
@@ -35609,9 +35607,7 @@ function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl,
     };
     React.useEffect(() => {
         const asyncFunc = () => __awaiter(this, void 0, void 0, function* () {
-            const _a = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId), { paymentSecret, publicKey, checkoutSession: newCheckout } = _a, rest = __rest(_a, ["paymentSecret", "publicKey", "checkoutSession"]);
-            console.log("newCheckout", newCheckout);
-            console.log("rest", rest);
+            const _a = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId), { paymentSecret, publicKey, checkoutSession: newCheckout } = _a; __rest(_a, ["paymentSecret", "publicKey", "checkoutSession"]);
             setPaymentSecret(paymentSecret);
             setPublicKey(publicKey);
             setCheckout(newCheckout);
@@ -35854,7 +35850,9 @@ function CheckoutEmbed({ checkoutId, config }) {
     const { cancelUrl, successUrl, appearance, locale, clientSecret, clientProxy, } = config;
     const storeClient = React.useMemo(() => sdk.createStoreClient({ proxy: clientProxy }), [clientProxy]);
     React.useMemo(() => createI18nInstance(locale), []);
-    const { formData, setFormData, setStep } = useFormStore();
+    const { formData, step } = useFormStore();
+    const [paymentSecret, setPaymentSecret] = React.useState(null);
+    const [publicKey, setPublicKey] = React.useState(null);
     const [checkout, setCheckout] = React.useState(null);
     const [loading, setLoading] = React.useState(true);
     React.useEffect(() => {
@@ -35883,13 +35881,13 @@ function CheckoutEmbed({ checkoutId, config }) {
         };
     }, [checkoutId]); // Only re-run if checkoutId changes
     const onSuccess = () => {
-        resetFormStore();
+        resetFormStore(formData);
         if (successUrl) {
             window.location.href = successUrl;
         }
     };
     const onCancel = () => {
-        resetFormStore();
+        resetFormStore(formData);
         if (cancelUrl) {
             window.location.href = cancelUrl;
         }
@@ -35908,12 +35906,28 @@ function CheckoutEmbed({ checkoutId, config }) {
         setCheckout(newCheckout);
     });
     const revalidateDiscounts = () => __awaiter(this, void 0, void 0, function* () {
-        const newCheckout = yield storeClient.revalidateDiscounts(clientSecret, checkoutId);
-        setCheckout(newCheckout);
+        if (step === "payment") {
+            const { paymentSecret, publicKey, checkoutSession } = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId);
+            setPaymentSecret(paymentSecret);
+            setPublicKey(publicKey);
+            setCheckout(checkoutSession);
+        }
+        else {
+            const newCheckout = yield storeClient.revalidateDiscounts(clientSecret, checkoutId);
+            setCheckout(newCheckout);
+        }
     });
     const removeDiscount = (id) => __awaiter(this, void 0, void 0, function* () {
         const newCheckout = yield storeClient.removeDiscount(clientSecret, checkoutId, id);
-        setCheckout(newCheckout);
+        if (step === "payment") {
+            const { paymentSecret, publicKey, checkoutSession } = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId);
+            setPaymentSecret(paymentSecret);
+            setPublicKey(publicKey);
+            setCheckout(checkoutSession);
+        }
+        else {
+            setCheckout(newCheckout);
+        }
     });
     React.useEffect(() => {
         const interval = setTimeout(() => {
@@ -35923,7 +35937,7 @@ function CheckoutEmbed({ checkoutId, config }) {
     }, []);
     return (React.createElement("div", { className: "checkout-embed scrollbar-hidden mx-auto max-w-[1200px] min-h-screen overflow-x-hidden gap-6 md:gap-0 py-4 md:py-12 flex flex-col md:grid md:grid-cols-7 " },
         React.createElement(Appearance, { appearance: appearance }),
-        React.createElement("div", { className: "md:col-span-4 px-4 md:px-8" }, loading ? (React.createElement(CheckoutFormLoading, null)) : (React.createElement(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, setCheckout: setCheckout }))),
+        React.createElement("div", { className: "md:col-span-4 px-4 md:px-8" }, loading ? (React.createElement(CheckoutFormLoading, null)) : (React.createElement(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, setCheckout: setCheckout, setPublicKey: setPublicKey, publicKey: publicKey, setPaymentSecret: setPaymentSecret, paymentSecret: paymentSecret }))),
         React.createElement("div", { className: "md:col-span-3 px-4 md:px-8 order-first md:order-last" },
             React.createElement(Toaster, null),
             loading ? (React.createElement(CheckoutSummaryLoading, null)) : (React.createElement(CheckoutSummary, { currency: (_c = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _c !== void 0 ? _c : "", lineItems: (_d = checkout === null || checkout === void 0 ? void 0 : checkout.lineItems) !== null && _d !== void 0 ? _d : [], shipping: checkout === null || checkout === void 0 ? void 0 : checkout.shipping, tax: checkout === null || checkout === void 0 ? void 0 : checkout.tax, onCancel: onCancel, exchangeRate: (_e = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _e !== void 0 ? _e : 1, applyDiscountCode: applyDiscountCode, appliedDiscounts: (_f = checkout === null || checkout === void 0 ? void 0 : checkout.appliedDiscounts) !== null && _f !== void 0 ? _f : [], revalidateDiscounts: revalidateDiscounts, removeDiscount: removeDiscount })))));

package/dist/index.mjs

@@ -35417,9 +35417,9 @@ const useFormStore = create()(persist((set) => ({
     checkoutId: "",
     setCheckoutId: (checkoutId) => set({ checkoutId }),
 }), { name: `checkout` }));
-const resetFormStore = () => {
+const resetFormStore = (formData) => {
     const currentState = JSON.parse(localStorage.getItem("checkout") || "{}");
-    localStorage.setItem("checkout", JSON.stringify(Object.assign(Object.assign({}, currentState), { state: Object.assign(Object.assign({}, currentState.state), { step: "customer", formData: { customer: currentState.customer } }) })));
+    localStorage.setItem("checkout", JSON.stringify(Object.assign(Object.assign({}, currentState), { state: Object.assign(Object.assign({}, currentState.state), { step: "customer", formData: { customer: formData.customer } }) })));
 };
 
 const motionSettings = {
@@ -35428,10 +35428,8 @@ const motionSettings = {
     exit: { opacity: 0 },
     transition: { duration: 0.2 },
 };
-function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, }) {
+function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, setPaymentSecret, setPublicKey, paymentSecret, publicKey, }) {
     const { formData, setFormData, step, setStep, checkoutId: storedCheckoutId, setCheckoutId, } = useFormStore();
-    const [paymentSecret, setPaymentSecret] = useState(null);
-    const [publicKey, setPublicKey] = useState(null);
     const [shippingRates, setShippingRates] = useState([]);
     const validateStep = useCallback(() => {
         if (step === "customer")
@@ -35586,9 +35584,7 @@ function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl,
     };
     useEffect(() => {
         const asyncFunc = () => __awaiter(this, void 0, void 0, function* () {
-            const _a = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId), { paymentSecret, publicKey, checkoutSession: newCheckout } = _a, rest = __rest(_a, ["paymentSecret", "publicKey", "checkoutSession"]);
-            console.log("newCheckout", newCheckout);
-            console.log("rest", rest);
+            const _a = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId), { paymentSecret, publicKey, checkoutSession: newCheckout } = _a; __rest(_a, ["paymentSecret", "publicKey", "checkoutSession"]);
             setPaymentSecret(paymentSecret);
             setPublicKey(publicKey);
             setCheckout(newCheckout);
@@ -35831,7 +35827,9 @@ function CheckoutEmbed({ checkoutId, config }) {
     const { cancelUrl, successUrl, appearance, locale, clientSecret, clientProxy, } = config;
     const storeClient = React__default.useMemo(() => createStoreClient({ proxy: clientProxy }), [clientProxy]);
     React__default.useMemo(() => createI18nInstance(locale), []);
-    const { formData, setFormData, setStep } = useFormStore();
+    const { formData, step } = useFormStore();
+    const [paymentSecret, setPaymentSecret] = useState(null);
+    const [publicKey, setPublicKey] = useState(null);
     const [checkout, setCheckout] = useState(null);
     const [loading, setLoading] = useState(true);
     useEffect(() => {
@@ -35860,13 +35858,13 @@ function CheckoutEmbed({ checkoutId, config }) {
         };
     }, [checkoutId]); // Only re-run if checkoutId changes
     const onSuccess = () => {
-        resetFormStore();
+        resetFormStore(formData);
         if (successUrl) {
             window.location.href = successUrl;
         }
     };
     const onCancel = () => {
-        resetFormStore();
+        resetFormStore(formData);
         if (cancelUrl) {
             window.location.href = cancelUrl;
         }
@@ -35885,12 +35883,28 @@ function CheckoutEmbed({ checkoutId, config }) {
         setCheckout(newCheckout);
     });
     const revalidateDiscounts = () => __awaiter(this, void 0, void 0, function* () {
-        const newCheckout = yield storeClient.revalidateDiscounts(clientSecret, checkoutId);
-        setCheckout(newCheckout);
+        if (step === "payment") {
+            const { paymentSecret, publicKey, checkoutSession } = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId);
+            setPaymentSecret(paymentSecret);
+            setPublicKey(publicKey);
+            setCheckout(checkoutSession);
+        }
+        else {
+            const newCheckout = yield storeClient.revalidateDiscounts(clientSecret, checkoutId);
+            setCheckout(newCheckout);
+        }
     });
     const removeDiscount = (id) => __awaiter(this, void 0, void 0, function* () {
         const newCheckout = yield storeClient.removeDiscount(clientSecret, checkoutId, id);
-        setCheckout(newCheckout);
+        if (step === "payment") {
+            const { paymentSecret, publicKey, checkoutSession } = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId);
+            setPaymentSecret(paymentSecret);
+            setPublicKey(publicKey);
+            setCheckout(checkoutSession);
+        }
+        else {
+            setCheckout(newCheckout);
+        }
     });
     useEffect(() => {
         const interval = setTimeout(() => {
@@ -35900,7 +35914,7 @@ function CheckoutEmbed({ checkoutId, config }) {
     }, []);
     return (React__default.createElement("div", { className: "checkout-embed scrollbar-hidden mx-auto max-w-[1200px] min-h-screen overflow-x-hidden gap-6 md:gap-0 py-4 md:py-12 flex flex-col md:grid md:grid-cols-7 " },
         React__default.createElement(Appearance, { appearance: appearance }),
-        React__default.createElement("div", { className: "md:col-span-4 px-4 md:px-8" }, loading ? (React__default.createElement(CheckoutFormLoading, null)) : (React__default.createElement(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, setCheckout: setCheckout }))),
+        React__default.createElement("div", { className: "md:col-span-4 px-4 md:px-8" }, loading ? (React__default.createElement(CheckoutFormLoading, null)) : (React__default.createElement(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, setCheckout: setCheckout, setPublicKey: setPublicKey, publicKey: publicKey, setPaymentSecret: setPaymentSecret, paymentSecret: paymentSecret }))),
         React__default.createElement("div", { className: "md:col-span-3 px-4 md:px-8 order-first md:order-last" },
             React__default.createElement(Toaster, null),
             loading ? (React__default.createElement(CheckoutSummaryLoading, null)) : (React__default.createElement(CheckoutSummary, { currency: (_c = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _c !== void 0 ? _c : "", lineItems: (_d = checkout === null || checkout === void 0 ? void 0 : checkout.lineItems) !== null && _d !== void 0 ? _d : [], shipping: checkout === null || checkout === void 0 ? void 0 : checkout.shipping, tax: checkout === null || checkout === void 0 ? void 0 : checkout.tax, onCancel: onCancel, exchangeRate: (_e = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _e !== void 0 ? _e : 1, applyDiscountCode: applyDiscountCode, appliedDiscounts: (_f = checkout === null || checkout === void 0 ? void 0 : checkout.appliedDiscounts) !== null && _f !== void 0 ? _f : [], revalidateDiscounts: revalidateDiscounts, removeDiscount: removeDiscount })))));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@betterstore/react",
-  "version": "0.3.13",
+  "version": "0.3.15",
   "description": "E-commerce for Developers",
   "private": false,
   "publishConfig": {