@lookiero/checkout 10.0.0-beta.4 → 10.0.1

package/dist/src/infrastructure/ui/routing/routes.d.ts

@@ -5,6 +5,7 @@ export declare enum Routes {
     SUMMARY = "summary",
     SUMMARY_TABS = "tabs/:tab",
     CHECKOUT = "checkout",
+    CHECKOUT_PAYMENT = "payment",
     FEEDBACK = "feedback",
     RETURN = "return/:id"
 }

package/dist/src/infrastructure/ui/routing/routes.js

@@ -6,6 +6,7 @@ export var Routes;
     Routes["SUMMARY"] = "summary";
     Routes["SUMMARY_TABS"] = "tabs/:tab";
     Routes["CHECKOUT"] = "checkout";
+    Routes["CHECKOUT_PAYMENT"] = "payment";
     Routes["FEEDBACK"] = "feedback";
     Routes["RETURN"] = "return/:id";
 })(Routes || (Routes = {}));

package/dist/src/infrastructure/ui/views/App.js

@@ -1,15 +1,16 @@
-import { PortalHost } from "@gorhom/portal";
+import { PortalProvider } from "@gorhom/portal";
 import React from "react";
 import { StatusBar } from "react-native";
 import { SafeAreaProvider } from "react-native-safe-area-context";
+import { PortalProvider as AuroraPortalProvider } from "@lookiero/aurora";
 import { Notifications } from "@lookiero/sty-psp-notifications";
 import { theme } from "@lookiero/sty-psp-ui";
 import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
 import { DOMAIN } from "../i18n/i18n";
 const { colorBgBase } = theme();
 const App = ({ children }) => (React.createElement(SafeAreaProvider, null,
-    React.createElement(StatusBar, { backgroundColor: colorBgBase, barStyle: "dark-content", translucent: true }),
-    React.createElement(Notifications, { contextId: MESSAGING_CONTEXT_ID, domain: DOMAIN, portalHostName: "Checkout" }),
-    React.createElement(PortalHost, { name: "Checkout" }),
-    children));
+    React.createElement(PortalProvider, { rootHostName: "Checkout" },
+        React.createElement(StatusBar, { backgroundColor: colorBgBase, barStyle: "dark-content", translucent: true }),
+        React.createElement(Notifications, { contextId: MESSAGING_CONTEXT_ID, domain: DOMAIN, portalHostName: "Checkout" }),
+        React.createElement(AuroraPortalProvider, null, children))));
 export { App };

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

@@ -1,13 +1,8 @@
-import { FC } from "react";
+import { FC, ReactNode } from "react";
 import { Layout as UiLayout } from "@lookiero/sty-psp-ui";
-import { OrderProjection } from "../../../../projection/order/order";
-import { SubscriptionProjection } from "../../../../projection/subscription/subscription";
 interface CheckoutProps {
+    readonly children?: ReactNode;
     readonly layout: UiLayout;
-    readonly order: OrderProjection;
-    readonly subscription: SubscriptionProjection;
-    readonly getAuthToken: () => Promise<string>;
-    readonly onCheckoutFlowSuccess: () => void;
     readonly useRedirect: () => Record<string, string>;
 }
 declare const Checkout: FC<CheckoutProps>;

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";
@@ -15,7 +14,6 @@ import { useTrackPressBack } from "../../../tracking/useTrackPressBack";
 import { useTrackPressContinue } from "../../../tracking/useTrackPressContinue";
 import { Body } from "../../components/layouts/body/Body";
 import { CheckoutHeader } from "../../components/templates/header/checkoutHeader/CheckoutHeader";
-import { useCheckoutFlow } from "../../hooks/useCheckoutFlow";
 import { useStaticInfo } from "../../hooks/useStaticInfo";
 import { DOMAIN, I18nMessages } from "../../i18n/i18n";
 import { Routes } from "../../routing/routes";
@@ -24,7 +22,7 @@ import { Pricing } from "../summary/components/pricing/Pricing";
 import { style } from "./Checkout.style";
 import { DeliveryBanner } from "./components/deliveryBanner/DeliveryBanner";
 import { PaymentInstrument } from "./components/paymentInstrument/PaymentInstrument";
-const Checkout = ({ layout: Layout, order, subscription, getAuthToken, useRedirect, onCheckoutFlowSuccess, }) => {
+const Checkout = ({ children, layout: Layout, useRedirect }) => {
     const { customer: { customerId, country, segment }, basePath, } = useStaticInfo();
     const titleText = useI18nMessage({ domain: DOMAIN, id: I18nMessages.CHECKOUT_TITLE });
     const submitButtonText = useI18nMessage({ domain: DOMAIN, id: I18nMessages.CHECKOUT_PAY_BUTTON });
@@ -33,13 +31,6 @@ const Checkout = ({ layout: Layout, order, subscription, getAuthToken, useRedire
     const handleOnPricingLayout = useCallback(({ height }) => setPricingHeight(height), []);
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const [pricing, pricingStatus] = useViewPricingByCheckoutId({ checkoutId: checkout?.id });
-    const [checkoutFlow, checkoutFlowStatus, paymentFlowComponent] = useCheckoutFlow({
-        checkout,
-        order,
-        subscription,
-        getAuthToken,
-        onSuccess: onCheckoutFlowSuccess,
-    });
     useTrackPageView({
         page: TrackingPage.CHECKOUT,
         country,
@@ -53,10 +44,10 @@ const Checkout = ({ layout: Layout, order, subscription, getAuthToken, useRedire
         segment,
         checkoutId: checkout?.id,
     });
-    const handleOnSubmit = useCallback(async () => {
+    const handleOnSubmit = useCallback(() => {
         trackPressContinue();
-        await checkoutFlow();
-    }, [checkoutFlow, trackPressContinue]);
+        navigate(`${basePath}/${Routes.CHECKOUT}/${Routes.CHECKOUT_PAYMENT}`, { replace: true });
+    }, [basePath, navigate, trackPressContinue]);
     const checkoutItemsKept = useMemo(() => checkout?.items.filter((checkoutItem) => checkoutItem.status === CheckoutItemStatus.KEPT || checkoutItem.status === CheckoutItemStatus.REPLACED), [checkout?.items]);
     const hasReplacedCheckoutItem = useMemo(() => checkout?.items.some((checkoutItem) => checkoutItem.status === CheckoutItemStatus.REPLACED), [checkout?.items]);
     const trackPressBack = useTrackPressBack({
@@ -84,21 +75,19 @@ const Checkout = ({ layout: Layout, order, subscription, getAuthToken, useRedire
             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, { busy: checkoutFlowStatus === "loading", testID: "confirm-checkout-button", onPress: handleOnSubmit }, submitButtonText)) : null)) : null))),
+                    screen.L ? (React.createElement(Button, { testID: "confirm-checkout-button", onPress: handleOnSubmit }, submitButtonText)) : null)) : null))),
         pricing && !screen.L ? (React.createElement(Sticky, { style: style.sticky, onLayout: Platform.OS !== "web" ? handleOnPricingLayout : undefined },
             React.createElement(Body, null,
-                React.createElement(Button, { busy: checkoutFlowStatus === "loading", testID: "confirm-checkout-button", small: true, onPress: handleOnSubmit }, submitButtonText)))) : null,
-        paymentFlowComponent));
+                React.createElement(Button, { testID: "confirm-checkout-button", small: true, onPress: handleOnSubmit }, submitButtonText)))) : null,
+        children));
 };
 export { Checkout };

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

@@ -13,11 +13,10 @@ import { useTrackCheckout } from "../../../../../tracking/useTrackCheckout";
 import { useStaticInfo } from "../../../../hooks/useStaticInfo";
 import { useSubmitCheckout } from "../../../../hooks/useSubmitCheckout";
 import { Routes } from "../../../../routing/routes";
-import { useBasePath } from "../../../../routing/useBasePath";
 const CheckoutPaymentModal = ({ coupon, isFirstOrder, subscription, orderNumber, getAuthToken, onCheckoutSubmitted, }) => {
     const paymentFlowRef = useRef(null);
     const logger = useLogger();
-    const { customer: { customerId, country, segment }, } = useStaticInfo();
+    const { customer: { customerId, country, segment }, basePath, } = useStaticInfo();
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const [paymentFlowPayload] = useViewPaymentFlowPayloadByCheckoutId({
         checkoutId: checkout?.id,
@@ -32,7 +31,6 @@ const CheckoutPaymentModal = ({ coupon, isFirstOrder, subscription, orderNumber,
         const loadAuthToken = async () => setAuthToken(await getAuthToken());
         loadAuthToken();
     }, [getAuthToken]);
-    const basePath = useBasePath();
     const navigate = useNavigate();
     const trackCheckout = useTrackCheckout({
         page: TrackingPage.CHECKOUT,

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/infrastructure/ui/views/summary/Summary.js

@@ -21,7 +21,7 @@ import { Routes } from "../../routing/routes";
 import { style } from "./Summary.style";
 import { CollapsiblePricing } from "./components/collapsiblePricing/CollapsiblePricing";
 const Summary = ({ layout: Layout, children }) => {
-    const { customer: { customerId, country, segment }, } = useStaticInfo();
+    const { customer: { customerId, country, segment }, basePath, } = useStaticInfo();
     const [pricingCollapsed, setPricingCollapsed] = useState(true);
     const [pricingHeight, setPricingHeight] = useState(0);
     const titleText = useI18nMessage({ domain: DOMAIN, id: I18nMessages.SUMMARY_TITLE });
@@ -32,7 +32,6 @@ const Summary = ({ layout: Layout, children }) => {
     const [pricing, pricingStatus] = useViewPricingByCheckoutId({ checkoutId: checkout?.id });
     const [fiveItemsDiscount = 0, fiveItemsDiscountStatus] = useViewFiveItemsDiscountByCustomerId({ customerId });
     const navigate = useNavigate();
-    const { basePath } = useStaticInfo();
     const match = useMatch(`${basePath}/${Routes.SUMMARY}/${Routes.SUMMARY_TABS}`);
     const tab = match?.params.tab;
     const trackPressPricing = useTrackPressPricing({

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/projection/order/order.d.ts

@@ -3,4 +3,4 @@ interface Order {
     readonly isFirstOrder: boolean;
     readonly coupon: string | null;
 }
-export type { Order as OrderProjection };
+export type { Order };

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

@@ -1,2 +1,2 @@
 type Subscription = "o" | "m" | "b" | "q";
-export type { Subscription as SubscriptionProjection };
+export type { Subscription };

package/dist/src/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "10.0.0-beta.4";
+export declare const VERSION = "10.0.1";

package/dist/src/version.js

@@ -1 +1 @@
-export const VERSION = "10.0.0-beta.4";
+export const VERSION = "10.0.1";

package/fake-dependencies/@lookiero/payments-front/index.tsx

@@ -7,57 +7,34 @@ import {
   RefAttributes,
   useImperativeHandle,
 } from "react";
-import { PaymentPayload } from "@lookiero/payments-front";
 
 const setPaymentsBridge = () => void 0;
 const PaymentsQueryProvider: FC<PropsWithChildren> = ({ children }) => children;
 const PaymentInstrumentSelect: FC = () => null;
-
+interface StartLegacyBoxCheckoutCallbackArgs {
+  readonly status: string;
+  readonly final: boolean;
+}
 interface StartLegacyBoxCheckoutFunction {
-  (paymentFlowPayload: unknown): void;
+  (paymentFlowPayload: unknown, callback: (params: StartLegacyBoxCheckoutCallbackArgs) => Promise<void>): void;
 }
-
 interface PaymentFlowRef {
   readonly startLegacyBoxCheckout: StartLegacyBoxCheckoutFunction;
 }
-
 const paymentFlowRef: PaymentFlowRef = {
-  startLegacyBoxCheckout: async () => {},
+  startLegacyBoxCheckout: async (_paymentFlowPayload, callback) => {
+    await callback({ status: "EXECUTED", final: true });
+  },
 };
-
 const PaymentFlow: ForwardRefExoticComponent<RefAttributes<PaymentFlowRef>> = forwardRef<PaymentFlowRef, unknown>(
   (_props, ref) => {
     useImperativeHandle(ref, () => paymentFlowRef, []);
     return null;
   },
 );
-
 PaymentFlow.displayName = "PaymentFlow";
-
-interface UsePaymentStatusManagerResult {
-  isLoading: boolean;
-  consumePayload: (callback: (payload: PaymentPayload) => void) => void;
-}
-
-const paymentStatusManagerResult: UsePaymentStatusManagerResult = {
-  isLoading: false,
-  consumePayload: (callback) => callback({ success: true } as PaymentPayload),
-};
-
-const usePaymentStatusManager: (section: Section) => UsePaymentStatusManagerResult = () => paymentStatusManagerResult;
-
 enum Section {
   BOX_CHECKOUT = "box-checkout",
 }
-
 export type { PaymentFlowRef };
-
-export {
-  PaymentsQueryProvider,
-  PaymentInstrumentSelect,
-  PaymentFlow,
-  Section,
-  setPaymentsBridge,
-  paymentFlowRef,
-  usePaymentStatusManager,
-};
+export { PaymentsQueryProvider, PaymentInstrumentSelect, PaymentFlow, Section, setPaymentsBridge, paymentFlowRef };

package/index.ts

@@ -5,6 +5,7 @@ import { fetchTranslations, translationEndpoint, translationExternalEndpoint } f
 import { Country, Locale } from "@lookiero/sty-psp-locale";
 import { SentryEnvironment, SentryLoggerFunctionArgs } from "@lookiero/sty-psp-logging";
 import { Segment } from "@lookiero/sty-psp-segment";
+import { Tradename } from "@lookiero/sty-sp-tradename";
 import { CheckoutStatus } from "./src/domain/checkout/model/checkout";
 import { KameleoonEnvironment } from "./src/infrastructure/ab-testing/kameleoonEnvironment";
 import { bootstrap as checkoutBootstrap } from "./src/infrastructure/delivery/bootstrap";
@@ -13,8 +14,8 @@ import { DOMAIN } from "./src/infrastructure/ui/i18n/i18n";
 import { CheckoutProjection } from "./src/projection/checkout/checkout";
 import { viewFirstAvailableCheckoutByCustomerId } from "./src/projection/checkout/viewFirstAvailableCheckoutByCustomerId";
 import { Customer } from "./src/projection/customer/customer";
-import { OrderProjection } from "./src/projection/order/order";
-import { SubscriptionProjection } from "./src/projection/subscription/subscription";
+import { Order } from "./src/projection/order/order";
+import { Subscription } from "./src/projection/subscription/subscription";
 
 interface FirstAvailableCheckoutByCustomerIdFunctionArgs {
   readonly customerId: string | undefined;
@@ -57,12 +58,5 @@ const bootstrap: BootstrapFunction = ({ apiUrl, getAuthToken, translations, sent
   };
 };
 
-export { bootstrap, translationEndpoint, translationExternalEndpoint, Country, Segment, CheckoutStatus };
-export type {
-  SentryEnvironment,
-  KameleoonEnvironment,
-  Customer,
-  SubscriptionProjection as Subscription,
-  OrderProjection as Order,
-  Locale,
-};
+export { bootstrap, translationEndpoint, translationExternalEndpoint, Country, Segment, CheckoutStatus, Tradename };
+export type { SentryEnvironment, KameleoonEnvironment, Customer, Subscription, Order, Locale };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "10.0.0-beta.4",
+  "version": "10.0.1",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "sideEffects": "false",
@@ -32,6 +32,7 @@
     "@lookiero/sty-psp-segment": "^0.1",
     "@lookiero/sty-psp-storage": "^0.2",
     "@lookiero/sty-psp-tracking": "^0.2",
+    "@lookiero/sty-sp-tradename": "^0.1",
     "@lookiero/sty-psp-ui": "^0.7",
     "@lookiero/sty-psp-ui-settings": "^0.2",
     "@lookiero/sty-psp-units": "^0.1",
@@ -45,7 +46,7 @@
     "@cypress/webpack-preprocessor": "^6.0.2",
     "@lookiero/eslint-config-sty-psp": "*",
     "@lookiero/event": "^0.3",
-    "@lookiero/payments-front": "7.0.0-alpha.3",
+    "@lookiero/payments-front": "6.0.3",
     "@lookiero/sty-psp-jest-config": "*",
     "@lookiero/sty-psp-prettier-config": "*",
     "@lookiero/sty-psp-scripts": "*",
@@ -75,7 +76,7 @@
     "@lookiero/event": "^0.3",
     "@lookiero/i18n": ">=2",
     "@lookiero/i18n-react": ">=2",
-    "@lookiero/payments-front": "7.0.0-alpha.3",
+    "@lookiero/payments-front": "6.0.3",
     "apollo-boost": "0.4.4",
     "expo": ">=51",
     "expo-font": ">=12",

package/src/ExpoRoot.tsx

@@ -1,4 +1,3 @@
-import { PortalProvider } from "@gorhom/portal";
 import { useFonts } from "expo-font";
 import "expo/build/Expo.fx";
 import React, { FC, useCallback, useState } from "react";
@@ -14,6 +13,7 @@ import { Country, Locale } from "@lookiero/sty-psp-locale";
 import { SentryEnvironment } from "@lookiero/sty-psp-logging";
 import { Segment } from "@lookiero/sty-psp-segment";
 import { DummyLayout } from "@lookiero/sty-psp-ui";
+import { Tradename } from "@lookiero/sty-sp-tradename";
 import { KameleoonEnvironment } from "./infrastructure/ab-testing/kameleoonEnvironment";
 import { bootstrap as checkoutBootstrap } from "./infrastructure/delivery/bootstrap";
 import { bootstrap as checkoutMockBootstrap } from "./infrastructure/delivery/bootstrap.mock";
@@ -21,24 +21,22 @@ import { root } from "./infrastructure/ui/Root";
 import { DOMAIN } from "./infrastructure/ui/i18n/i18n";
 import { Router } from "./infrastructure/ui/routing/router/Router";
 import { Customer } from "./projection/customer/customer";
-import { OrderProjection } from "./projection/order/order";
-import { SubscriptionProjection } from "./projection/subscription/subscription";
+import { Order } from "./projection/order/order";
+import { Subscription } from "./projection/subscription/subscription";
 import { VERSION } from "./version";
 
-const locale: Locale = Locale.es_ES;
-const subscription: SubscriptionProjection = "b";
-const order: OrderProjection = {
+const locale: Locale = Locale.en_GB;
+const subscription: Subscription = "b";
+const order: Order = {
   isFirstOrder: false,
   orderNumber: 3687582,
   coupon: "MYLOOKIERO",
 };
 
 const customer: Customer = {
-  customerId: "9cfb056e-6008-44b1-9075-320479bf92ac",
-  country: Country.NL,
+  customerId: "a4355713-469b-4684-bf90-3215702dfb1c",
+  country: Country.ES,
   segment: Segment.WOMEN,
-  email: "email@example.com",
-  name: "Adèle Léonce Émilie",
 };
 
 const sentryConfig: SentryEnvironment = {
@@ -55,7 +53,7 @@ const apiUrl =
       ? "/local-to-dev"
       : "/checkout/api";
 const authToken =
-  "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NDk0NjYsImV4cCI6MTc0MjQ3MDI5OSwiZGlzcGxheU5hbWUiOiJNaWtlbCIsImNvdW50cnlfY29kZSI6IkVTIiwiYWNjZXNzVmlhIjoiZW1haWwiLCJzdWJzY3JpcHRpb25TdGFydGluZ0RhdGUiOiIyMDI0LTExLTExIiwiaW1wZXJzb25hdGVkIjpmYWxzZSwidXVpZCI6ImQzYzIzNTRiLTk4MTEtNDZkNC1iMmJhLTVmYmEwMTJlZDk0ZCIsImlhdCI6MTc0MDA1MTA5OX0.AkuUZTsn9mgplQwatg0dPKyv1Hsc6r267UMahxMH19g";
+  "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2ODkxMDAsImV4cCI6MTc0NjI3ODQwMiwiZGlzcGxheU5hbWUiOiJUZXN0aW5nIiwiY291bnRyeV9jb2RlIjoiRVMiLCJhY2Nlc3NWaWEiOiJlbWFpbCIsInN1YnNjcmlwdGlvblN0YXJ0aW5nRGF0ZSI6IjIwMjUtMDQtMDMiLCJpbXBlcnNvbmF0ZWQiOmZhbHNlLCJ1dWlkIjoiYTQzNTU3MTMtNDY5Yi00Njg0LWJmOTAtMzIxNTcwMmRmYjFjIiwiaWF0IjoxNzQzNjg2NDAyfQ.pmqFo-4s0USFpzCnijRt78bWuBdu2Q7f4L9UtOkfAwo";
 const getAuthToken = () => Promise.resolve(authToken);
 
 const externalTranslationsUrl =
@@ -96,7 +94,6 @@ setPaymentsBridge({
   useFeatureFlags: () => ({}),
   locale: () => Promise.resolve("es-ES"),
   scrollView: ScrollView,
-  hostUrl: "",
 });
 
 const kameleoonConfig: KameleoonEnvironment = {
@@ -134,38 +131,36 @@ const ExpoRoot: FC = () => {
   const onNotAccessible = useCallback(() => setIsAccessible(false), []);
 
   return fontsLoaded ? (
-    <PortalProvider>
-      <PaymentsQueryProvider>
-        <EventProvider>
-          <Aurora>
-            {isAccessible === false && <Text heading={true}>Checkout is not accessible!</Text>}
+    <PaymentsQueryProvider>
+      <EventProvider>
+        <Aurora>
+          {isAccessible === false && <Text heading={true}>Checkout is not accessible!</Text>}
 
-            <Router>
-              <Routes>
-                <Route
-                  path="/checkout/*"
-                  element={
-                    <Root
-                      basePath="/checkout"
-                      customer={customer}
-                      layout={DummyLayout}
-                      locale={locale}
-                      order={order}
-                      subscription={subscription}
-                      useRedirect={useRedirect}
-                      onCheckoutFlowSuccess={() => console.log("Checkout flow success!")}
-                      onNotAccessible={onNotAccessible}
-                    />
-                  }
-                />
+          <Router>
+            <Routes>
+              <Route
+                path="/checkout/*"
+                element={
+                  <Root
+                    basePath="/checkout"
+                    customer={customer}
+                    layout={DummyLayout}
+                    locale={locale}
+                    order={order}
+                    subscription={subscription}
+                    tradename={Tradename.LOOKIERO}
+                    useRedirect={useRedirect}
+                    onNotAccessible={onNotAccessible}
+                  />
+                }
+              />
 
-                <Route element={<Navigate to="/checkout" replace />} path="*" />
-              </Routes>
-            </Router>
-          </Aurora>
-        </EventProvider>
-      </PaymentsQueryProvider>
-    </PortalProvider>
+              <Route element={<Navigate to="/checkout" replace />} path="*" />
+            </Routes>
+          </Router>
+        </Aurora>
+      </EventProvider>
+    </PaymentsQueryProvider>
   ) : null;
 };
 

package/src/infrastructure/domain/checkoutBooking/react/useBlockCheckoutBooking.ts

@@ -1,5 +1,4 @@
 import { useCallback } from "react";
-import invariant from "tiny-invariant";
 import { CommandStatus, useCommand } from "@lookiero/messaging-react";
 import { Logger } from "@lookiero/sty-psp-logging";
 import { NotificationLevel, useCreateToastNotification } from "@lookiero/sty-psp-notifications";
@@ -14,7 +13,7 @@ interface BlockCheckoutBookingFunction {
 type UseBlockCheckoutBooking = [blockCheckoutBooking: BlockCheckoutBookingFunction, status: CommandStatus];
 
 interface UseBlockCheckoutBookingFunctionArgs {
-  readonly checkoutBookingId: string | undefined;
+  readonly checkoutBookingId: string;
   readonly logger: Logger;
 }
 
@@ -27,8 +26,6 @@ const useBlockCheckoutBooking: UseBlockCheckoutBookingFunction = ({ checkoutBook
   const [createNotification] = useCreateToastNotification({ contextId: MESSAGING_CONTEXT_ID, logger });
 
   const blockCheckoutBooking = useCallback(async () => {
-    invariant(checkoutBookingId, "checkoutBookingId is required");
-
     try {
       await commandBus(
         blockCheckoutBookingCommand({

package/src/infrastructure/projection/pricing/react/useViewPricingByCheckoutId.ts

@@ -23,7 +23,7 @@ const DEFAULT_QUERY_OPTIONS: QueryOptions = {
 };
 
 interface UseViewPricingByCheckoutIdFunctionArgs {
-  readonly checkoutId: string | undefined;
+  readonly checkoutId: string;
   readonly queryOptions?: QueryOptions;
 }
 
@@ -36,7 +36,7 @@ const useViewPricingByCheckoutId: UseViewPricingByCheckoutIdFunction = ({
   queryOptions = DEFAULT_QUERY_OPTIONS,
 }) =>
   useQuery({
-    query: viewPricingByCheckoutId({ checkoutId: checkoutId as string }),
+    query: viewPricingByCheckoutId({ checkoutId }),
     contextId: MESSAGING_CONTEXT_ID,
     invalidation: shouldInvalidate,
     options: {
@@ -44,7 +44,6 @@ const useViewPricingByCheckoutId: UseViewPricingByCheckoutIdFunction = ({
       staleTime: Infinity,
       retry: false,
       refetchOnWindowFocus: false,
-      enabled: Boolean(checkoutId),
     },
   });
 

package/src/infrastructure/tracking/tracking.ts

@@ -2,7 +2,7 @@ import { BaseTrackingEvent, TrackingEventCategory } from "@lookiero/sty-psp-trac
 import { CheckoutItemStatus } from "../../domain/checkoutItem/model/checkoutItem";
 import { Currency } from "../../domain/checkoutItem/model/currency";
 import { MediaPerspective } from "../../projection/checkoutItem/checkoutItem";
-import { SubscriptionProjection } from "../../projection/subscription/subscription";
+import { Subscription } from "../../projection/subscription/subscription";
 
 const PROJECT = "checkout";
 
@@ -121,7 +121,7 @@ interface CheckoutTrackingEvent
       readonly actionField: {
         readonly items: number;
         readonly currencyCode: Currency;
-        readonly subscription: SubscriptionProjection;
+        readonly subscription: Subscription;
         readonly coupon: string | null;
         readonly orderId: number;
         readonly value: number;