@lookiero/checkout 9.9.0-beta.1 → 9.9.0

package/dist/index.js

@@ -10,11 +10,11 @@ const bootstrap = ({ apiUrl, getAuthToken, translations, sentry, kameleoon }) =>
     const { Component: Messaging, queryBus } = checkoutBootstrap({ apiUrl, getAuthToken });
     const I18n = i18n({
         fetchTranslation: fetchTranslations({ translations }),
-        contextId: "CheckoutI18n",
+        domain: "CheckoutI18n",
     });
     const firstAvailableCheckoutByCustomerId = ({ customerId }) => queryBus(viewFirstAvailableCheckoutByCustomerId({ customerId: customerId }));
     return {
-        root: root({ Messaging, I18n, getAuthToken, sentry, kameleoon }),
+        root: root({ Messaging, I18n, queryBus, getAuthToken, sentry, kameleoon }),
         firstAvailableCheckoutByCustomerId,
     };
 };

package/dist/src/ExpoRoot.js

@@ -24,11 +24,9 @@ const order = {
     coupon: "MYLOOKIERO",
 };
 const customer = {
-    customerId: "9413fe3a-09fc-4264-905e-040bb7b4ca75",
+    customerId: "d3c2354b-9811-46d4-b2ba-5fba012ed94d",
     country: Country.ES,
     segment: Segment.WOMEN,
-    email: "email@example.com",
-    name: "Adèle Léonce Émilie",
 };
 const sentryConfig = {
     publicKey: "66cadf9444db4ea5945670f12ec08ae7",
@@ -41,7 +39,7 @@ const apiUrl = Platform.OS !== "web"
     : __DEV__
         ? "/local-to-dev"
         : "/checkout/api";
-const authToken = "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NTIwMjgsImV4cCI6MTczOTQ0MTYwMSwiZGlzcGxheU5hbWUiOiJNaWtlbCIsImNvdW50cnlfY29kZSI6IkVTIiwiYWNjZXNzVmlhIjoiZW1haWwiLCJzdWJzY3JpcHRpb25TdGFydGluZ0RhdGUiOiIyMDI0LTExLTE4IiwiaW1wZXJzb25hdGVkIjpmYWxzZSwidXVpZCI6Ijk0MTNmZTNhLTA5ZmMtNDI2NC05MDVlLTA0MGJiN2I0Y2E3NSIsImlhdCI6MTczNjc2MzIwMn0.ZaFu4743f9XR0aK3LgMMhbmRHNloHtC1Sm0FDUtj8B8";
+const authToken = "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NDg3OTAsImV4cCI6MTc0MjM2OTcyNywiZGlzcGxheU5hbWUiOiJUZXN0aW5nIiwiY291bnRyeV9jb2RlIjoiRVMiLCJhY2Nlc3NWaWEiOiJlbWFpbCIsInN1YnNjcmlwdGlvblN0YXJ0aW5nRGF0ZSI6IjIwMjQtMTEtMDgiLCJpbXBlcnNvbmF0ZWQiOmZhbHNlLCJ1dWlkIjoiNzRjYjRmNzYtM2YxNC00OTgzLTgxYTYtMmVlMmE5YTI3NWQ0IiwiaWF0IjoxNzM5OTUwNTI3fQ.ajNczGc6YhM23--PsqlAoDrp_GN87TnHEBOYyg2hoWM";
 const getAuthToken = () => Promise.resolve(authToken);
 const externalTranslationsUrl = Platform.OS !== "web"
     ? "https://backend-for-user.dev.envs.lookiero.tech/api/v2/translations"
@@ -76,22 +74,22 @@ setPaymentsBridge({
     useFeatureFlags: () => ({}),
     locale: () => Promise.resolve("es-ES"),
     scrollView: ScrollView,
-    hostUrl: "",
 });
 const kameleoonConfig = {
     siteCode: "aplm4v3ckn",
     experiments: {},
 };
-const { Component: Messaging } = process.env.EXPO_PUBLIC_APP_VARIANT === "test"
+const { Component: Messaging, queryBus } = process.env.EXPO_PUBLIC_APP_VARIANT === "test"
     ? checkoutMockBootstrap()
     : checkoutBootstrap({ apiUrl: () => apiUrl, getAuthToken });
 const I18n = i18n({
     fetchTranslation: fetchTranslations({ translations }),
-    contextId: "CheckoutI18n",
+    domain: "CheckoutI18n",
 });
 const Root = root({
     Messaging,
     I18n,
+    queryBus,
     getAuthToken,
     development: false,
     sentry: () => (process.env.EXPO_PUBLIC_APP_VARIANT === "test" ? {} : sentryConfig),

package/dist/src/infrastructure/ui/Root.d.ts

@@ -1,6 +1,7 @@
 import { ComponentType } from "react";
 import { useRoutes as reactRouterUseRoutes } from "react-router-native";
 import { I18n } from "@lookiero/i18n-react";
+import { QueryBus } from "@lookiero/messaging";
 import { MessagingRoot } from "@lookiero/messaging-react/bootstrap";
 import { Locale } from "@lookiero/sty-psp-locale";
 import { SentryEnvironment, SentryLoggerFunctionArgs } from "@lookiero/sty-psp-logging";
@@ -12,6 +13,7 @@ import { KameleoonEnvironment } from "../ab-testing/kameleoonEnvironment";
 interface RootFunctionArgs {
     readonly Messaging: MessagingRoot;
     readonly I18n: I18n;
+    readonly queryBus: QueryBus;
     readonly development?: boolean;
     readonly sentry: () => SentryEnvironment;
     readonly getAuthToken: () => Promise<string>;

package/dist/src/infrastructure/ui/Root.js

@@ -4,15 +4,17 @@ import { Platform } from "react-native";
 import { useRoutes as reactRouterUseRoutes } from "react-router-native";
 import { Locale } from "@lookiero/sty-psp-locale";
 import { sentryLogger, sentryLoggerHOC } from "@lookiero/sty-psp-logging";
+import { QueryBusProvider } from "./hooks/useQueryBus";
 import { Routing } from "./routing/Routing";
-const root = ({ Messaging, I18n, getAuthToken, development, sentry, kameleoon: kameleoonConfig }) => {
+const root = ({ Messaging, I18n, queryBus, getAuthToken, development, sentry, kameleoon: kameleoonConfig, }) => {
     const logger = sentryLogger(sentry);
     const kameleoon = kameleoonConfig();
     // eslint-disable-next-line react/display-name, react/prop-types
     const Root = ({ basePath, locale = Locale.en_GB, customer, order, subscription, layout, onNotAccessible, onCheckoutSubmitted, useRedirect, useRoutes = reactRouterUseRoutes, }) => {
         const handleOnI18nError = useCallback((error) => logger.captureException(error), []);
         return (React.createElement(Messaging, { includeReactQueryDevTools: Platform.OS === "web" },
-            React.createElement(Routing, { I18n: I18n, basePath: basePath, customer: customer, getAuthToken: getAuthToken, kameleoon: kameleoon, layout: layout, locale: locale, order: order, subscription: subscription, useRedirect: useRedirect, useRoutes: useRoutes, onCheckoutSubmitted: onCheckoutSubmitted, onI18nError: development ? undefined : handleOnI18nError, onNotAccessible: onNotAccessible })));
+            React.createElement(QueryBusProvider, { queryBus: queryBus },
+                React.createElement(Routing, { I18n: I18n, basePath: basePath, customer: customer, getAuthToken: getAuthToken, kameleoon: kameleoon, layout: layout, locale: locale, order: order, subscription: subscription, useRedirect: useRedirect, useRoutes: useRoutes, onCheckoutSubmitted: onCheckoutSubmitted, onI18nError: development ? undefined : handleOnI18nError, onNotAccessible: onNotAccessible }))));
     };
     const hoc = sentryLoggerHOC({ logger });
     /**

package/dist/src/infrastructure/ui/components/organisms/checkoutQuestions/components/textareaCheckoutQuestionItem/TextareaCheckoutQuestionItem.js

@@ -8,7 +8,7 @@ const TextareaCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParent
     const placeholderText = useMemo(() => (checkoutQuestion.placeholder ? formatMessage({ id: checkoutQuestion.placeholder }) : ""), [formatMessage, checkoutQuestion.placeholder]);
     const { feedback, onChange } = useCheckoutQuestionFeedbackForId({ id: checkoutQuestionParentId });
     const handleOnChange = useCallback((value) => onChange({ checkoutQuestionId: checkoutQuestionParentId, checkoutQuestionFeedback: value }), [onChange, checkoutQuestionParentId]);
-    return (React.createElement(InputField, { label: placeholderText, value: feedback, input: ({ onBlur, onFocus, style }) => (React.createElement(TextInput, { placeholder: placeholderText, style: style, testID: testID, value: feedback, multiline: true, onBlur: onBlur, onChange: handleOnChange, onFocus: onFocus })), style: {
+    return (React.createElement(InputField, { label: placeholderText, value: feedback, input: ({ onBlur, onFocus, style }) => (React.createElement(TextInput, { placeholder: placeholderText, style: style, testID: testID, textAlignVertical: "top", value: feedback, multiline: true, onBlur: onBlur, onChange: handleOnChange, onFocus: onFocus })), style: {
             inputField: style.inputField,
             input: { container: style.inputContainer, input: style.input },
         } }));

package/dist/src/infrastructure/ui/components/organisms/checkoutQuestions/components/textareaCheckoutQuestionItem/TextareaCheckoutQuestionItem.style.d.ts

@@ -1,7 +1,6 @@
 declare const style: {
     input: {
         paddingTop: number;
-        height?: "auto" | undefined;
     };
     inputContainer: {
         alignItems?: "flex-start" | undefined;

package/dist/src/infrastructure/ui/components/organisms/checkoutQuestions/components/textareaCheckoutQuestionItem/TextareaCheckoutQuestionItem.style.js

@@ -8,7 +8,6 @@ const style = StyleSheet.create({
         ...Platform.select({
             android: {
                 paddingTop: space2,
-                height: "auto",
             },
         }),
     },

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem.js

@@ -11,7 +11,7 @@ const TextareaReturnQuestionItem = ({ returnQuestion, returnQuestionParent, test
     const { feedback, onChange } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion: returnQuestionParent });
     const handleOnChange = useCallback((value) => onChange({ returnQuestionId: returnQuestionParent.id, returnQuestionFeedback: value }), [onChange, returnQuestionParent.id]);
     return (React.createElement(View, { style: style.wrapper, testID: "textarea-return-question-item" },
-        React.createElement(InputField, { label: placeholderText, value: feedback, input: ({ onBlur, onFocus, style }) => (React.createElement(TextInput, { placeholder: placeholderText, style: style, testID: testID, value: feedback, multiline: true, onBlur: onBlur, onChange: handleOnChange, onFocus: onFocus })), style: {
+        React.createElement(InputField, { label: placeholderText, value: feedback, input: ({ onBlur, onFocus, style }) => (React.createElement(TextInput, { placeholder: placeholderText, style: style, testID: testID, textAlignVertical: "top", value: feedback, multiline: true, onBlur: onBlur, onChange: handleOnChange, onFocus: onFocus })), style: {
                 inputField: style.inputField,
                 input: { container: style.inputContainer, input: style.input },
             } })));

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem.style.d.ts

@@ -1,7 +1,6 @@
 declare const style: {
     input: {
         paddingTop: number;
-        height?: "auto" | undefined;
     };
     inputContainer: {
         alignItems?: "flex-start" | undefined;

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem.style.js

@@ -8,7 +8,6 @@ const style = StyleSheet.create({
         ...Platform.select({
             android: {
                 paddingTop: space2,
-                height: "auto",
             },
         }),
     },

package/dist/src/infrastructure/ui/hooks/usePaymentInstrumentEvents.d.ts

@@ -1,7 +1,6 @@
-import { PaymentPayload } from "@lookiero/payments-front";
+import { Logger } from "@lookiero/sty-psp-logging";
 interface UsePaymentInstrumentEventsFunctionArgs {
-    readonly onSuccess: (payload: PaymentPayload) => void;
-    readonly onError: (payload: PaymentPayload) => void;
+    readonly logger: Logger;
 }
 interface UsePaymentInstrumentEventsFunction {
     (args: UsePaymentInstrumentEventsFunctionArgs): void;

package/dist/src/infrastructure/ui/hooks/usePaymentInstrumentEvents.js

@@ -1,20 +1,29 @@
-import { useEffect } from "react";
-import { Section, usePaymentStatusManager } from "@lookiero/payments-front";
-const usePaymentInstrumentEvents = ({ onSuccess, onError }) => {
-    const refreshStatus = usePaymentStatusManager(Section.BOX_CHECKOUT);
-    useEffect(() => {
-        const { isLoading, consumePayload } = refreshStatus;
-        if (isLoading) {
-            return;
+import { useCallback, useEffect } from "react";
+import { useEvent } from "@lookiero/event";
+import { NotificationLevel, useCreateToastNotification } from "@lookiero/sty-psp-notifications";
+import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
+import { I18nMessages } from "../i18n/i18n";
+const PAYMENT_ERROR = "ERROR";
+const PAYMENT_SUCCESS = "PAYMENT_INSTRUMENT_UPDATED";
+const usePaymentInstrumentEvents = ({ logger }) => {
+    const { subscribe, unsubscribe } = useEvent();
+    const [createNotification] = useCreateToastNotification({ contextId: MESSAGING_CONTEXT_ID, logger });
+    const onSuccess = useCallback(({ message }) => createNotification({ bodyI18nKey: message.id, level: NotificationLevel.SUCCESS }), [createNotification]);
+    const onError = useCallback(({ error }) => {
+        if (error.toaster) {
+            createNotification({
+                bodyI18nKey: error.toaster.id || I18nMessages.CHECKOUT_TOAST_PAYMENT_ERROR,
+                level: NotificationLevel.ERROR,
+            });
         }
-        consumePayload((payload) => {
-            if (payload.success) {
-                onSuccess(payload);
-            }
-            else {
-                onError(payload);
-            }
-        });
-    }, [onError, onSuccess, refreshStatus]);
+    }, [createNotification]);
+    useEffect(() => {
+        subscribe({ event: PAYMENT_ERROR }, onError);
+        subscribe({ event: PAYMENT_SUCCESS }, onSuccess);
+        return () => {
+            unsubscribe({ event: PAYMENT_ERROR }, onError);
+            unsubscribe({ event: PAYMENT_SUCCESS }, onSuccess);
+        };
+    }, [subscribe, unsubscribe, createNotification, onError, onSuccess]);
 };
 export { usePaymentInstrumentEvents };

package/dist/src/infrastructure/ui/hooks/useQueryBus.d.ts

@@ -0,0 +1,9 @@
+import { FC, ReactNode } from "react";
+import { QueryBus } from "@lookiero/messaging";
+interface QueryBusProviderProps {
+    readonly children: ReactNode;
+    readonly queryBus: QueryBus;
+}
+declare const QueryBusProvider: FC<QueryBusProviderProps>;
+declare const useQueryBus: () => QueryBus;
+export { useQueryBus, QueryBusProvider };

package/dist/src/infrastructure/ui/hooks/useQueryBus.js

@@ -0,0 +1,10 @@
+import React, { createContext, useContext } from "react";
+import invariant from "tiny-invariant";
+const QueryBusContext = createContext(null);
+const QueryBusProvider = ({ children, queryBus }) => (React.createElement(QueryBusContext.Provider, { value: queryBus }, children));
+const useQueryBus = () => {
+    const queryBus = useContext(QueryBusContext);
+    invariant(queryBus, "Your are trying to use the useQueryBus hook without wrapping your app with the <QueryBusProvider>.");
+    return queryBus;
+};
+export { useQueryBus, QueryBusProvider };

package/dist/src/infrastructure/ui/hooks/useSubmitCheckout.d.ts

@@ -16,7 +16,7 @@ interface UseSubmitCheckoutFunctionArgs {
     readonly checkoutBookingId: string;
     readonly paymentFlowRef: RefObject<PaymentFlowRef>;
     readonly onError: () => void;
-    readonly onSuccess: () => void;
+    readonly onSuccess?: () => void;
     readonly logger: Logger;
 }
 interface UseSubmitCheckoutFunction {

package/dist/src/infrastructure/ui/hooks/useSubmitCheckout.js

@@ -1,15 +1,29 @@
 import { useCallback, useMemo, useState } from "react";
 import { CommandStatus } from "@lookiero/messaging-react";
 import { NotificationLevel, useCreateToastNotification } from "@lookiero/sty-psp-notifications";
+import { viewCheckoutBookingById, } from "../../../projection/checkoutBooking/viewCheckoutBookingById";
 import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
 import { useSubmitCheckout as useSubmitCheckoutCommand } from "../../domain/checkout/react/useSubmitCheckout";
 import { useBlockCheckoutBooking } from "../../domain/checkoutBooking/react/useBlockCheckoutBooking";
 import { I18nMessages } from "../i18n/i18n";
-import { usePaymentInstrumentEvents } from "./usePaymentInstrumentEvents";
+import { useQueryBus } from "./useQueryBus";
+var ChargeStatus;
+(function (ChargeStatus) {
+    ChargeStatus["EXECUTED"] = "EXECUTED";
+    ChargeStatus["REQUIRES_ACTION"] = "REQUIRES_ACTION";
+    ChargeStatus["REQUIRED_ACTION_CANCELLED"] = "REQUIRED_ACTION_CANCELLED";
+    ChargeStatus["REJECTED"] = "REJECTED";
+    ChargeStatus["CANCELLED"] = "CANCELLED";
+    ChargeStatus["TO_CONFIRM"] = "TO_CONFIRM";
+    ChargeStatus["ERROR"] = "ERROR";
+    ChargeStatus["UNKNOWN"] = "UNKNOWN";
+})(ChargeStatus || (ChargeStatus = {}));
 const useSubmitCheckout = ({ checkoutId, checkoutBookingId, paymentFlowRef, onError, onSuccess, logger, }) => {
+    const queryBus = useQueryBus();
     const [submitCheckoutCommand, submitCheckoutCommandStatus] = useSubmitCheckoutCommand({ checkoutId, logger });
     const [blockCheckoutBooking, blockCheckoutBookingStatus] = useBlockCheckoutBooking({ checkoutBookingId, logger });
     const [createNotification] = useCreateToastNotification({ contextId: MESSAGING_CONTEXT_ID, logger });
+    const [checkoutBookingExpired, setCheckoutBookingExpired] = useState(false);
     const [startLegacyBoxCheckoutStatus, setStartLegacyBoxCheckoutStatus] = useState("idle");
     const submitCheckout = useCallback(async ({ paymentFlowPayload, sizeChangeEnabled }) => {
         try {
@@ -18,27 +32,40 @@ const useSubmitCheckout = ({ checkoutId, checkoutBookingId, paymentFlowRef, onEr
         catch (error) {
             return;
         }
-        setStartLegacyBoxCheckoutStatus("loading");
+        const checkoutBooking = await queryBus(viewCheckoutBookingById({ checkoutBookingId }));
+        if (checkoutBooking?.isExpired) {
+            setCheckoutBookingExpired(true);
+            return;
+        }
+        paymentFlowRef.current?.startLegacyBoxCheckout(
         // eslint-disable-next-line @typescript-eslint/ban-ts-comment
         // @ts-ignore
-        paymentFlowRef.current?.startLegacyBoxCheckout(paymentFlowPayload);
-    }, [paymentFlowRef, blockCheckoutBooking]);
-    const onPaymentSuccess = useCallback(async () => {
-        setStartLegacyBoxCheckoutStatus("success");
-        await submitCheckoutCommand();
-        createNotification({
-            bodyI18nKey: I18nMessages.CHECKOUT_TOAST_PAYMENT_SUCCESS,
-            level: NotificationLevel.SUCCESS,
-        });
-    }, [createNotification, submitCheckoutCommand]);
-    const onPaymentError = useCallback((payload) => {
-        setStartLegacyBoxCheckoutStatus("error");
-        createNotification({
-            bodyI18nKey: payload.metadata?.toaster?.id || I18nMessages.CHECKOUT_TOAST_PAYMENT_ERROR,
-            level: NotificationLevel.ERROR,
+        paymentFlowPayload, async ({ status, toaster, final }) => {
+            setStartLegacyBoxCheckoutStatus("loading");
+            if (final) {
+                if (status === ChargeStatus.EXECUTED) {
+                    setStartLegacyBoxCheckoutStatus("success");
+                    await submitCheckoutCommand();
+                    onSuccess?.();
+                }
+                else {
+                    createNotification({
+                        level: NotificationLevel.ERROR,
+                        bodyI18nKey: toaster?.id || I18nMessages.CHECKOUT_TOAST_PAYMENT_ERROR,
+                    });
+                    setStartLegacyBoxCheckoutStatus("error");
+                }
+            }
         });
-    }, [createNotification]);
-    usePaymentInstrumentEvents({ onSuccess: onPaymentSuccess, onError: onPaymentError });
+    }, [
+        queryBus,
+        checkoutBookingId,
+        paymentFlowRef,
+        blockCheckoutBooking,
+        submitCheckoutCommand,
+        onSuccess,
+        createNotification,
+    ]);
     const status = useMemo(() => {
         if (blockCheckoutBookingStatus === CommandStatus.LOADING ||
             startLegacyBoxCheckoutStatus === "loading" ||
@@ -48,17 +75,23 @@ const useSubmitCheckout = ({ checkoutId, checkoutBookingId, paymentFlowRef, onEr
         if (blockCheckoutBookingStatus === CommandStatus.SUCCESS &&
             startLegacyBoxCheckoutStatus === "success" &&
             submitCheckoutCommandStatus === CommandStatus.SUCCESS) {
-            onSuccess();
             return "success";
         }
         if (blockCheckoutBookingStatus === CommandStatus.ERROR ||
             startLegacyBoxCheckoutStatus === "error" ||
-            submitCheckoutCommandStatus === CommandStatus.ERROR) {
+            submitCheckoutCommandStatus === CommandStatus.ERROR ||
+            checkoutBookingExpired) {
             onError();
             return "error";
         }
         return "idle";
-    }, [blockCheckoutBookingStatus, startLegacyBoxCheckoutStatus, submitCheckoutCommandStatus, onSuccess, onError]);
+    }, [
+        blockCheckoutBookingStatus,
+        startLegacyBoxCheckoutStatus,
+        submitCheckoutCommandStatus,
+        checkoutBookingExpired,
+        onError,
+    ]);
     return [submitCheckout, status];
 };
 export { useSubmitCheckout };

package/dist/src/infrastructure/ui/i18n/i18n.d.ts

@@ -46,7 +46,6 @@ declare enum I18nMessages {
     CHECKOUT_TITLE = "checkout.title",
     CHECKOUT_PAY_BUTTON = "checkout.pay_button",
     CHECKOUT_TOAST_PAYMENT_ERROR = "checkout.toast_payment_error",
-    CHECKOUT_TOAST_PAYMENT_SUCCESS = "checkout.toast_payment_success",
     CHECKOUT_SUCCESS_MODAL_TITLE = "checkout.success_modal_title",
     CHECKOUT_SUCCESS_MODAL_DESCRIPTION = "checkout.success_modal_description",
     CHECKOUT_SUCCESS_MODAL_BUTTON = "checkout.success_modal_button",

package/dist/src/infrastructure/ui/i18n/i18n.js

@@ -48,7 +48,6 @@ var I18nMessages;
     I18nMessages["CHECKOUT_TITLE"] = "checkout.title";
     I18nMessages["CHECKOUT_PAY_BUTTON"] = "checkout.pay_button";
     I18nMessages["CHECKOUT_TOAST_PAYMENT_ERROR"] = "checkout.toast_payment_error";
-    I18nMessages["CHECKOUT_TOAST_PAYMENT_SUCCESS"] = "checkout.toast_payment_success";
     I18nMessages["CHECKOUT_SUCCESS_MODAL_TITLE"] = "checkout.success_modal_title";
     I18nMessages["CHECKOUT_SUCCESS_MODAL_DESCRIPTION"] = "checkout.success_modal_description";
     I18nMessages["CHECKOUT_SUCCESS_MODAL_BUTTON"] = "checkout.success_modal_button";

package/dist/src/infrastructure/ui/views/checkout/Checkout.js

@@ -4,7 +4,6 @@ import { useNavigate } from "react-router-native";
 import { Box, Button, Layout as AuroraLayout, Spinner, Text, useDevice } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { QueryStatus } from "@lookiero/messaging-react";
-import { Country } from "@lookiero/sty-psp-locale";
 import { Sticky } from "@lookiero/sty-psp-ui";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
@@ -78,15 +77,13 @@ const Checkout = ({ children, layout: Layout, useRedirect }) => {
             React.createElement(AuroraLayout, { fullWidth: !screen.L, style: [screen.L && style.desktopLayoutSpacing, !screen.L && { paddingBottom: pricingHeight }] },
                 React.createElement(Box, { size: { L: "2/3" }, style: screen.L && style.desktopListSpacing },
                     React.createElement(View, { style: [style.contentWrapper, screen.L && style.desktopContentWrapper] },
-                        country === Country.NL && (React.createElement(View, { style: style.paymentSelectorNL },
-                            React.createElement(PaymentInstrument, { useRedirect: useRedirect }))),
                         React.createElement(Text, { level: 3, style: style.title, heading: true }, titleText),
                         checkoutItemsKept?.map((checkoutItem) => (React.createElement(View, { key: checkoutItem.id, testID: "checkout-items-kept" },
                             React.createElement(ProductVariant, { brand: checkoutItem.productVariant.brand, color: checkoutItem.productVariant.color, country: country, media: checkoutItem.productVariant.media, name: checkoutItem.productVariant.name, price: checkoutItem.price, status: checkoutItem.status, size: checkoutItem.status === CheckoutItemStatus.REPLACED && checkoutItem.replacedFor
                                     ? checkoutItem.replacedFor.size
                                     : checkoutItem.productVariant.size })))),
-                        country !== Country.NL && (React.createElement(View, { style: style.paymentSelector },
-                            React.createElement(PaymentInstrument, { useRedirect: useRedirect }))))),
+                        React.createElement(View, { style: style.paymentSelector },
+                            React.createElement(PaymentInstrument, { useRedirect: useRedirect })))),
                 React.createElement(Box, { size: { L: "1/3" }, style: [style.resume, screen.L && style.desktopResume] }, pricing ? (React.createElement(View, { style: [style.princingWrapper, !screen.L && style.princingWrapperSmall] },
                     React.createElement(Pricing, { pricing: pricing, totalCheckoutItemsKept: checkoutItemsKept?.length || 0 }),
                     screen.L ? (React.createElement(Button, { testID: "confirm-checkout-button", onPress: handleOnSubmit }, submitButtonText)) : null)) : null))),

package/dist/src/infrastructure/ui/views/checkout/Checkout.style.d.ts

@@ -24,9 +24,6 @@ declare const style: {
     paymentSelector: {
         marginTop: number;
     };
-    paymentSelectorNL: {
-        marginBottom: number;
-    };
     princingWrapper: {
         padding: number;
     };

package/dist/src/infrastructure/ui/views/checkout/Checkout.style.js

@@ -28,9 +28,6 @@ const style = StyleSheet.create({
     paymentSelector: {
         marginTop: space6,
     },
-    paymentSelectorNL: {
-        marginBottom: space6,
-    },
     princingWrapper: {
         padding: space6,
     },

package/dist/src/infrastructure/ui/views/checkout/components/checkoutPaymentModal/CheckoutPaymentModal.js

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useRef, useState } from "react";
 import { useNavigate } from "react-router-native";
 import { QueryStatus } from "@lookiero/messaging-react";
-import { PaymentFlow, Section } from "@lookiero/payments-front";
+import { PaymentFlow } from "@lookiero/payments-front";
 import { useLogger } from "@lookiero/sty-psp-logging";
 import { CheckoutItemStatus } from "../../../../../../domain/checkoutItem/model/checkoutItem";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
@@ -85,6 +85,6 @@ const CheckoutPaymentModal = ({ coupon, isFirstOrder, subscription, orderNumber,
     const dependenciesLoaded = (dependenciesLoadedStatuses.includes(checkoutStatus) || checkout) && authToken;
     if (!dependenciesLoaded)
         return null;
-    return React.createElement(PaymentFlow, { ref: paymentFlowRef, section: Section.BOX_CHECKOUT, token: authToken });
+    return React.createElement(PaymentFlow, { ref: paymentFlowRef, token: authToken });
 };
 export { CheckoutPaymentModal };

package/dist/src/infrastructure/ui/views/checkout/components/paymentInstrument/PaymentInstrument.js

@@ -1,12 +1,12 @@
-import React from "react";
+import React, { useRef } from "react";
 import { PaymentInstrumentSelect, Section } from "@lookiero/payments-front";
-import { useStaticInfo } from "../../../../hooks/useStaticInfo";
+import { useLogger } from "@lookiero/sty-psp-logging";
+import { usePaymentInstrumentEvents } from "../../../../hooks/usePaymentInstrumentEvents";
 const PaymentInstrument = ({ useRedirect }) => {
+    const paymentInstrumentSelectRef = useRef(null);
     const { returnUrl } = useRedirect();
-    const { customer } = useStaticInfo();
-    return (React.createElement(PaymentInstrumentSelect, { beforeRedirect: returnUrl ? () => Promise.resolve(returnUrl) : undefined, hasError: false, section: Section.BOX_CHECKOUT, userInformation: {
-            email: customer.email,
-            name: customer.name,
-        }, showSingleUsePaymentMethods: true }));
+    const logger = useLogger();
+    usePaymentInstrumentEvents({ logger });
+    return (React.createElement(PaymentInstrumentSelect, { ref: paymentInstrumentSelectRef, beforeRedirect: returnUrl ? () => Promise.resolve(returnUrl) : undefined, hasError: false, section: Section.BOX_CHECKOUT }));
 };
 export { PaymentInstrument };

package/dist/src/projection/customer/customer.d.ts

@@ -4,7 +4,5 @@ interface Customer {
     readonly customerId: string;
     readonly country: Country;
     readonly segment: Segment;
-    readonly name: string;
-    readonly email: string;
 }
 export type { Customer };

package/dist/src/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "9.9.0-beta.1";
+export declare const VERSION = "9.9.0";

package/dist/src/version.js

@@ -1 +1 @@
-export const VERSION = "9.9.0-beta.1";
+export const VERSION = "9.9.0";

package/index.ts

@@ -44,14 +44,14 @@ const bootstrap: BootstrapFunction = ({ apiUrl, getAuthToken, translations, sent
   const { Component: Messaging, queryBus } = checkoutBootstrap({ apiUrl, getAuthToken });
   const I18n = i18n({
     fetchTranslation: fetchTranslations({ translations }),
-    contextId: "CheckoutI18n",
+    domain: "CheckoutI18n",
   });
 
   const firstAvailableCheckoutByCustomerId: FirstAvailableCheckoutByCustomerIdFunction = ({ customerId }) =>
     queryBus(viewFirstAvailableCheckoutByCustomerId({ customerId: customerId as string }));
 
   return {
-    root: root({ Messaging, I18n, getAuthToken, sentry, kameleoon }),
+    root: root({ Messaging, I18n, queryBus, getAuthToken, sentry, kameleoon }),
     firstAvailableCheckoutByCustomerId,
   };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "9.9.0-beta.1",
+  "version": "9.9.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "sideEffects": "false",
@@ -24,10 +24,10 @@
     "@lookiero/sty-psp-ab-testing": "^0.3",
     "@lookiero/sty-psp-expo-config": "^0.2",
     "@lookiero/sty-psp-http": "^2.0",
-    "@lookiero/sty-psp-i18n": "^0.2",
+    "@lookiero/sty-psp-i18n": "^0.3",
     "@lookiero/sty-psp-locale": "^0.4",
     "@lookiero/sty-psp-logging": "^0.5",
-    "@lookiero/sty-psp-notifications": "^0.6",
+    "@lookiero/sty-psp-notifications": "^0.7",
     "@lookiero/sty-psp-react-native": "^0.3",
     "@lookiero/sty-psp-segment": "^0.1",
     "@lookiero/sty-psp-storage": "^0.2",
@@ -46,7 +46,7 @@
     "@cypress/webpack-preprocessor": "^6.0.2",
     "@lookiero/eslint-config-sty-psp": "*",
     "@lookiero/event": "^0.3",
-    "@lookiero/payments-front": "7.0.0-LK-37736-2025.2.12.160011",
+    "@lookiero/payments-front": "6.0.3",
     "@lookiero/sty-psp-jest-config": "*",
     "@lookiero/sty-psp-prettier-config": "*",
     "@lookiero/sty-psp-scripts": "*",
@@ -74,9 +74,9 @@
     "@lookiero/aurora-fonts": ">=2",
     "@lookiero/aurora-iconfont": ">=3",
     "@lookiero/event": "^0.3",
-    "@lookiero/i18n": ">=0.9",
-    "@lookiero/i18n-react": ">=0.9",
-    "@lookiero/payments-front": "7.0.0-LK-37736-2025.2.12.160011",
+    "@lookiero/i18n": ">=1",
+    "@lookiero/i18n-react": ">=1",
+    "@lookiero/payments-front": "6.0.3",
     "apollo-boost": "0.4.4",
     "expo": ">=51",
     "expo-font": ">=12",

package/src/ExpoRoot.tsx

@@ -32,11 +32,9 @@ const order: Order = {
 };
 
 const customer: Customer = {
-  customerId: "9413fe3a-09fc-4264-905e-040bb7b4ca75",
+  customerId: "d3c2354b-9811-46d4-b2ba-5fba012ed94d",
   country: Country.ES,
   segment: Segment.WOMEN,
-  email: "email@example.com",
-  name: "Adèle Léonce Émilie",
 };
 
 const sentryConfig: SentryEnvironment = {
@@ -53,7 +51,7 @@ const apiUrl =
       ? "/local-to-dev"
       : "/checkout/api";
 const authToken =
-  "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NTIwMjgsImV4cCI6MTczOTQ0MTYwMSwiZGlzcGxheU5hbWUiOiJNaWtlbCIsImNvdW50cnlfY29kZSI6IkVTIiwiYWNjZXNzVmlhIjoiZW1haWwiLCJzdWJzY3JpcHRpb25TdGFydGluZ0RhdGUiOiIyMDI0LTExLTE4IiwiaW1wZXJzb25hdGVkIjpmYWxzZSwidXVpZCI6Ijk0MTNmZTNhLTA5ZmMtNDI2NC05MDVlLTA0MGJiN2I0Y2E3NSIsImlhdCI6MTczNjc2MzIwMn0.ZaFu4743f9XR0aK3LgMMhbmRHNloHtC1Sm0FDUtj8B8";
+  "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NDg3OTAsImV4cCI6MTc0MjM2OTcyNywiZGlzcGxheU5hbWUiOiJUZXN0aW5nIiwiY291bnRyeV9jb2RlIjoiRVMiLCJhY2Nlc3NWaWEiOiJlbWFpbCIsInN1YnNjcmlwdGlvblN0YXJ0aW5nRGF0ZSI6IjIwMjQtMTEtMDgiLCJpbXBlcnNvbmF0ZWQiOmZhbHNlLCJ1dWlkIjoiNzRjYjRmNzYtM2YxNC00OTgzLTgxYTYtMmVlMmE5YTI3NWQ0IiwiaWF0IjoxNzM5OTUwNTI3fQ.ajNczGc6YhM23--PsqlAoDrp_GN87TnHEBOYyg2hoWM";
 const getAuthToken = () => Promise.resolve(authToken);
 
 const externalTranslationsUrl =
@@ -94,7 +92,6 @@ setPaymentsBridge({
   useFeatureFlags: () => ({}),
   locale: () => Promise.resolve("es-ES"),
   scrollView: ScrollView,
-  hostUrl: "",
 });
 
 const kameleoonConfig: KameleoonEnvironment = {
@@ -102,17 +99,18 @@ const kameleoonConfig: KameleoonEnvironment = {
   experiments: {},
 };
 
-const { Component: Messaging } =
+const { Component: Messaging, queryBus } =
   process.env.EXPO_PUBLIC_APP_VARIANT === "test"
     ? checkoutMockBootstrap()
     : checkoutBootstrap({ apiUrl: () => apiUrl, getAuthToken });
 const I18n = i18n({
   fetchTranslation: fetchTranslations({ translations }),
-  contextId: "CheckoutI18n",
+  domain: "CheckoutI18n",
 });
 const Root = root({
   Messaging,
   I18n,
+  queryBus,
   getAuthToken,
   development: false,
   sentry: () => (process.env.EXPO_PUBLIC_APP_VARIANT === "test" ? ({} as SentryEnvironment) : sentryConfig),