@lookiero/checkout 9.13.0 → 10.0.0-beta.0

package/dist/src/infrastructure/ui/views/summaryTabs/components/checkoutItemsTabs/CheckoutItemsTabs.js

@@ -4,17 +4,17 @@ import { Text, useDevice } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { Tabs } from "@lookiero/sty-psp-ui";
 import { CheckoutItemStatus } from "../../../../../../domain/checkoutItem/model/checkoutItem";
-import { DOMAIN, I18nMessages } from "../../../../i18n/i18n";
+import { I18nMessages } from "../../../../i18n/i18n";
 import { ProductVariant } from "../../../shared/components/productVariant/ProductVariant";
 import { style } from "./CheckoutItemsTabs.style";
 const CheckoutItem = ({ checkoutItemStatus, checkoutItemProductVariant, checkoutItemPrice, country, testID, style: customStyle, onPress, }) => (React.createElement(View, { testID: testID },
     React.createElement(ProductVariant, { brand: checkoutItemProductVariant.brand, color: checkoutItemProductVariant.color, country: country, media: checkoutItemProductVariant.media, name: checkoutItemProductVariant.name, price: checkoutItemPrice, size: checkoutItemProductVariant.size, status: checkoutItemStatus, style: customStyle, onPress: onPress })));
 const CheckoutItemsTabs = ({ tabIndex, checkoutItemsKept, checkoutItemsReturned, country, onPressItem, onChanged, }) => {
     const { screen } = useDevice();
-    const keepTabText = useI18nMessage({ domain: DOMAIN, id: I18nMessages.SUMMARY_KEEP_TAB });
-    const returnTabText = useI18nMessage({ domain: DOMAIN, id: I18nMessages.SUMMARY_RETURN_TAB });
-    const keepEmptyText = useI18nMessage({ domain: DOMAIN, id: I18nMessages.SUMMARY_KEEP_EMPTY });
-    const returnEmptyText = useI18nMessage({ domain: DOMAIN, id: I18nMessages.SUMMARY_RETURN_EMPTY });
+    const keepTabText = useI18nMessage({ id: I18nMessages.SUMMARY_KEEP_TAB });
+    const returnTabText = useI18nMessage({ id: I18nMessages.SUMMARY_RETURN_TAB });
+    const keepEmptyText = useI18nMessage({ id: I18nMessages.SUMMARY_KEEP_EMPTY });
+    const returnEmptyText = useI18nMessage({ id: I18nMessages.SUMMARY_RETURN_EMPTY });
     const handleOnPressItem = useCallback((checkoutItemId) => onPressItem(checkoutItemId), [onPressItem]);
     const data = useMemo(() => [{ id: "0" }, { id: "1" }], []);
     const renderItem = useCallback(({ index }) => index === 0 ? (checkoutItemsKept.length === 0 ? (React.createElement(Text, { style: style.emptyText }, keepEmptyText)) : (React.createElement(React.Fragment, null, checkoutItemsKept.map((checkoutItem) => (React.createElement(CheckoutItem, { key: checkoutItem.id, checkoutItemPrice: checkoutItem.price, checkoutItemStatus: checkoutItem.status, country: country, testID: "keep-checkout-item", checkoutItemProductVariant: checkoutItem.status === CheckoutItemStatus.REPLACED && checkoutItem.replacedFor

package/dist/src/projection/checkout/viewIsCheckoutAccessibleByCustomerId.d.ts

@@ -0,0 +1,26 @@
+import { Query, QueryHandlerFunction, QueryHandlerFunctionArgs } from "@lookiero/messaging";
+
+type IsCheckoutAccessibleByCustomerIdProjection = boolean;
+declare const VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID = "view_is_checkout_accessible_by_customer_id";
+interface ViewIsCheckoutAccessibleByCustomerIdPayload {
+  readonly customerId: string | undefined;
+}
+interface ViewIsCheckoutAccessibleByCustomerId
+  extends Query<typeof VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID>,
+    ViewIsCheckoutAccessibleByCustomerIdPayload {}
+interface ViewIsCheckoutAccessibleByCustomerIdFunction {
+  (payload: ViewIsCheckoutAccessibleByCustomerIdPayload): ViewIsCheckoutAccessibleByCustomerId;
+}
+declare const viewIsCheckoutAccessibleByCustomerId: ViewIsCheckoutAccessibleByCustomerIdFunction;
+interface ViewIsCheckoutAccessibleByCustomerIdHandlerFunctionArgs extends QueryHandlerFunctionArgs {}
+declare const viewIsCheckoutAccessibleByCustomerIdHandler: QueryHandlerFunction<
+  ViewIsCheckoutAccessibleByCustomerId,
+  IsCheckoutAccessibleByCustomerIdProjection,
+  ViewIsCheckoutAccessibleByCustomerIdHandlerFunctionArgs
+>;
+export type { IsCheckoutAccessibleByCustomerIdProjection };
+export {
+  VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID,
+  viewIsCheckoutAccessibleByCustomerId,
+  viewIsCheckoutAccessibleByCustomerIdHandler,
+};

package/dist/src/projection/checkout/viewIsCheckoutAccessibleByCustomerId.js

@@ -0,0 +1,21 @@
+import { query } from "@lookiero/messaging";
+import { viewFirstAvailableCheckoutByCustomerId } from "./viewFirstAvailableCheckoutByCustomerId";
+import { viewIsCheckoutEnabledByCustomerId } from "./viewIsCheckoutEnabledByCustomerId";
+
+const VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID = "view_is_checkout_accessible_by_customer_id";
+const viewIsCheckoutAccessibleByCustomerId = (payload) => ({
+  ...query({ name: VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID }),
+  ...payload,
+});
+const isNonEmptyCustomerId = (customerId) => Boolean(customerId);
+const viewIsCheckoutAccessibleByCustomerIdHandler =
+  ({ queryBus }) =>
+  async ({ customerId }) =>
+    isNonEmptyCustomerId(customerId) &&
+    Boolean(await queryBus(viewFirstAvailableCheckoutByCustomerId({ customerId }))) &&
+    Boolean(await queryBus(viewIsCheckoutEnabledByCustomerId({ customerId })));
+export {
+  VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID,
+  viewIsCheckoutAccessibleByCustomerId,
+  viewIsCheckoutAccessibleByCustomerIdHandler,
+};

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

@@ -4,5 +4,7 @@ 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 };
+export type { Order as OrderProjection };

package/dist/src/projection/shared/country.d.ts

@@ -0,0 +1,14 @@
+declare enum Country {
+  ES = "ES",
+  FR = "FR",
+  GB = "GB",
+  BE = "BE",
+  LU = "LU",
+  IT = "IT",
+  PT = "PT",
+  DE = "DE",
+  AT = "AT",
+  NL = "NL",
+  SE = "SE",
+}
+export { Country };

package/dist/src/projection/shared/country.js

@@ -0,0 +1,15 @@
+var Country;
+(function (Country) {
+  Country["ES"] = "ES";
+  Country["FR"] = "FR";
+  Country["GB"] = "GB";
+  Country["BE"] = "BE";
+  Country["LU"] = "LU";
+  Country["IT"] = "IT";
+  Country["PT"] = "PT";
+  Country["DE"] = "DE";
+  Country["AT"] = "AT";
+  Country["NL"] = "NL";
+  Country["SE"] = "SE";
+})(Country || (Country = {}));
+export { Country };

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

@@ -0,0 +1,9 @@
+import { Country } from "@lookiero/sty-psp-locale";
+import { Segment } from "@lookiero/sty-psp-segment";
+
+interface Customer {
+  readonly customerId: string;
+  readonly country: Country;
+  readonly segment: Segment;
+}
+export type { Customer };

package/dist/src/projection/shared/customer.js

@@ -0,0 +1 @@
+export {};

package/dist/src/projection/shared/locale.d.ts

@@ -0,0 +1,12 @@
+declare enum Locale {
+  ES = "es",
+  FR = "fr",
+  EN = "en",
+  IT = "it",
+  PT = "pt",
+  DE = "de",
+  AT = "at",
+  NL = "nl",
+  SE = "sv",
+}
+export { Locale };

package/dist/src/projection/shared/locale.js

@@ -0,0 +1,13 @@
+var Locale;
+(function (Locale) {
+  Locale["ES"] = "es";
+  Locale["FR"] = "fr";
+  Locale["EN"] = "en";
+  Locale["IT"] = "it";
+  Locale["PT"] = "pt";
+  Locale["DE"] = "de";
+  Locale["AT"] = "at";
+  Locale["NL"] = "nl";
+  Locale["SE"] = "sv";
+})(Locale || (Locale = {}));
+export { Locale };

package/dist/src/projection/shared/order.d.ts

@@ -0,0 +1,6 @@
+interface Order {
+  readonly orderNumber: number;
+  readonly isFirstOrder: boolean;
+  readonly coupon: string | null;
+}
+export type { Order };

package/dist/src/projection/shared/order.js

@@ -0,0 +1 @@
+export {};

package/dist/src/projection/shared/price.d.ts

@@ -0,0 +1,11 @@
+import { Currency } from "../../domain/checkoutItem/model/currency";
+
+interface PriceProjection {
+  readonly amount: number;
+  readonly currency: Currency;
+  readonly discountedPrice?: {
+    readonly amount: number;
+    readonly percentage: number;
+  };
+}
+export type { PriceProjection };

package/dist/src/projection/shared/price.js

@@ -0,0 +1 @@
+export {};

package/dist/src/projection/shared/size.d.ts

@@ -0,0 +1,21 @@
+import { Country } from "./country";
+
+interface SizeProjection {
+  readonly id: string;
+  readonly lookiero: string;
+  readonly uk: string;
+  readonly it: string;
+  readonly europe: string;
+  readonly unique: boolean;
+  readonly visualOrder?: number;
+}
+interface SizeFunctionArgs {
+  readonly size: SizeProjection;
+  readonly country: Country;
+}
+interface SizeFunction {
+  (args: SizeFunctionArgs): string;
+}
+declare const size: SizeFunction;
+export type { SizeProjection };
+export { size };

package/dist/src/projection/shared/size.js

@@ -0,0 +1,4 @@
+import { Country } from "./country";
+
+const size = ({ size, country }) => (country === Country.GB ? size.uk : size.lookiero);
+export { size };

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

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

package/dist/src/projection/shared/subscription.js

@@ -0,0 +1 @@
+export {};

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

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

package/dist/src/shared/ui/components/atoms/aspectRatioView/AspectRatioView.d.ts

@@ -0,0 +1,15 @@
+import { FC, ReactNode } from "react";
+import { StyleProp, ViewStyle } from "react-native";
+declare enum AspectRatioViewResizeDirection {
+    VERTICAL = "VERTICAL",
+    HORIZONTAL = "HORIZONTAL"
+}
+interface AspectRatioViewProps {
+    readonly aspectRatio?: number;
+    readonly resizeDirection?: AspectRatioViewResizeDirection;
+    readonly multiplier?: number;
+    readonly children: ReactNode;
+    readonly style?: StyleProp<ViewStyle>;
+}
+declare const AspectRatioView: FC<AspectRatioViewProps>;
+export { AspectRatioView, AspectRatioViewResizeDirection };

package/dist/src/shared/ui/components/atoms/aspectRatioView/AspectRatioView.js

@@ -0,0 +1,16 @@
+import React, { useCallback, useState } from "react";
+import { View } from "react-native";
+var AspectRatioViewResizeDirection;
+(function (AspectRatioViewResizeDirection) {
+    AspectRatioViewResizeDirection["VERTICAL"] = "VERTICAL";
+    AspectRatioViewResizeDirection["HORIZONTAL"] = "HORIZONTAL";
+})(AspectRatioViewResizeDirection || (AspectRatioViewResizeDirection = {}));
+const AspectRatioView = ({ aspectRatio = 1, resizeDirection = AspectRatioViewResizeDirection.HORIZONTAL, multiplier = 1, style: customStyle = {}, children, }) => {
+    const [{ width, height }, setDimension] = useState({});
+    const handleOnLayout = useCallback(({ nativeEvent: { layout } }) => setDimension(resizeDirection === AspectRatioViewResizeDirection.HORIZONTAL
+        ? { width: layout.width * multiplier, height: layout.width * aspectRatio }
+        : { width: layout.height * aspectRatio, height: layout.height }), [aspectRatio, multiplier, resizeDirection]);
+    return (React.createElement(View, { onLayout: handleOnLayout },
+        React.createElement(View, { style: [{ width, height }, customStyle] }, children)));
+};
+export { AspectRatioView, AspectRatioViewResizeDirection };

package/dist/src/shared/ui/components/atoms/error/Error.d.ts

@@ -0,0 +1,11 @@
+import { FC } from "react";
+import { StyleProp, TextStyle } from "react-native";
+
+type ErrorStyle = StyleProp<TextStyle>;
+interface ErrorProps {
+  readonly error?: string | null;
+  readonly style?: ErrorStyle;
+}
+declare const Error: FC<ErrorProps>;
+export type { ErrorStyle };
+export { Error };

package/dist/src/shared/ui/components/atoms/error/Error.js

@@ -0,0 +1,6 @@
+import React from "react";
+import { COLOR, Text } from "@lookiero/aurora";
+
+const Error = ({ error, style: customStyle }) =>
+  React.createElement(Text, { color: COLOR.TEXT_ERROR, level: 2, style: customStyle, detail: true }, error);
+export { Error };

package/dist/src/shared/ui/components/atoms/field/Field.d.ts

@@ -0,0 +1,14 @@
+import { FC } from "react";
+import { StyleProp, TextStyle, ViewStyle } from "react-native";
+type FieldStyle = {
+    readonly field: StyleProp<ViewStyle>;
+    readonly fieldText: StyleProp<TextStyle>;
+};
+interface FieldProps {
+    readonly label: string;
+    readonly isFocused?: boolean;
+    readonly style?: FieldStyle;
+}
+declare const Field: FC<FieldProps>;
+export type { FieldStyle };
+export { Field };

package/dist/src/shared/ui/components/atoms/field/Field.js

@@ -0,0 +1,29 @@
+import React, { useCallback, useState } from "react";
+import { View } from "react-native";
+import Animated, { useAnimatedStyle, useSharedValue, withTiming } from "react-native-reanimated";
+import { Text } from "@lookiero/aurora";
+import { theme } from "@lookiero/sty-psp-ui";
+import { style } from "./Field.style";
+const SCALE = 0.75;
+const { space1, space4 } = theme();
+const Field = ({ label, isFocused = false, style: customStyle }) => {
+    const [width, setWidth] = useState(0);
+    const handleOnLayout = useCallback(({ nativeEvent: { layout } }) => setWidth(layout.width), []);
+    const scale = useSharedValue(isFocused ? SCALE : 1);
+    scale.value = isFocused ? SCALE : 1;
+    const translateY = useSharedValue(isFocused ? -14 : space4);
+    translateY.value = isFocused ? -14 : space4;
+    const translateX = useSharedValue(isFocused ? -(((1 - SCALE) * width) / 2 + space1) : 0);
+    translateX.value = isFocused ? -(((1 - SCALE) * width) / 2 + space1) : 0;
+    const animatedStyle = useAnimatedStyle(() => ({
+        transform: [
+            { scale: withTiming(scale.value) },
+            { translateY: withTiming(translateY.value) },
+            { translateX: withTiming(translateX.value) },
+        ],
+    }), [scale.value, translateX.value, translateY.value]);
+    return (React.createElement(Animated.View, { pointerEvents: "none", style: [customStyle?.field, animatedStyle], onLayout: handleOnLayout },
+        React.createElement(Text, { level: 1, numberOfLines: 1, style: [style.fieldText, customStyle?.fieldText], detail: true }, label),
+        React.createElement(View, { style: [style.fieldBackground, { opacity: isFocused ? 1 : 0 }] })));
+};
+export { Field };

package/dist/src/shared/ui/components/atoms/field/Field.style.d.ts

@@ -0,0 +1,16 @@
+declare const style: {
+    fieldBackground: {
+        backgroundColor: string;
+        height: "100%";
+        position: "absolute";
+        width: "100%";
+        zIndex: number;
+    };
+    fieldText: {
+        flexWrap: "nowrap";
+        overflow: "hidden";
+        paddingHorizontal: number;
+        zIndex: number;
+    };
+};
+export { style };

package/dist/src/shared/ui/components/atoms/field/Field.style.js

@@ -0,0 +1,19 @@
+import { StyleSheet } from "react-native";
+import { theme } from "@lookiero/sty-psp-ui";
+const { colorBgBase, space1 } = theme();
+const style = StyleSheet.create({
+    fieldBackground: {
+        backgroundColor: colorBgBase,
+        height: "100%",
+        position: "absolute",
+        width: "100%",
+        zIndex: 0,
+    },
+    fieldText: {
+        flexWrap: "nowrap",
+        overflow: "hidden",
+        paddingHorizontal: space1,
+        zIndex: 1,
+    },
+});
+export { style };

package/dist/src/shared/ui/components/molecules/inputField/InputField.d.ts

@@ -0,0 +1,24 @@
+import { FC } from "react";
+import { StyleProp, TextStyle, ViewStyle } from "react-native";
+import { IconName, InputProperties } from "@lookiero/aurora";
+import { ErrorStyle } from "@lookiero/sty-psp-ui";
+import { FieldStyle } from "../../atoms/field/Field";
+type IconStyle = StyleProp<TextStyle>;
+type InputFieldStyle = FieldStyle & {
+    readonly inputField: StyleProp<ViewStyle>;
+    readonly error: ErrorStyle;
+    readonly icon: IconStyle;
+};
+interface InputFieldBaseProps {
+    readonly label: string;
+    readonly multiline?: boolean;
+    readonly error?: string | null;
+    readonly style?: Partial<InputFieldStyle>;
+    readonly onChange?: (value: string) => void;
+    readonly icon?: IconName;
+}
+interface InputFieldProps extends Omit<InputProperties, keyof InputFieldBaseProps>, InputFieldBaseProps {
+}
+declare const InputField: FC<InputFieldProps>;
+export type { InputFieldStyle };
+export { InputField };

package/dist/src/shared/ui/components/molecules/inputField/InputField.js

@@ -0,0 +1,28 @@
+import React, { useCallback, useState } from "react";
+import { View } from "react-native";
+import { COLOR, Icon, Input } from "@lookiero/aurora";
+import { Error, theme } from "@lookiero/sty-psp-ui";
+import { Field } from "../../atoms/field/Field";
+import { style } from "./InputField.style";
+const { colorBgBase, colorBorderInput, colorBorderInputError, colorBorderInputFocus, colorText, colorTextError, colorTextMedium, iconSize, space6, } = theme();
+const inputPaddingRightWithIcon = iconSize + space6;
+const InputField = ({ label, placeholder, value, multiline = false, error, style: customStyle, onChange = () => void 0, icon, testID = "input", ...inputRestProps }) => {
+    const [isFocused, setIsFocused] = useState(false);
+    const handleOnChange = useCallback((text) => onChange(text), [onChange]);
+    const handleOnBlur = useCallback(() => setIsFocused(false), []);
+    const handleOnFocus = useCallback(() => setIsFocused(true), []);
+    const borderColor = error ? colorBorderInputError : isFocused ? colorBorderInputFocus : colorBorderInput;
+    const color = error ? colorTextError : isFocused ? colorText : colorTextMedium;
+    return (React.createElement(View, { style: [style.inputField, { borderColor }, customStyle?.inputField], testID: "input-field" },
+        React.createElement(Field, { isFocused: isFocused || !!value, label: label, style: {
+                field: [style.field, customStyle?.field],
+                fieldText: [{ color }, customStyle?.fieldText],
+            } }),
+        React.createElement(Input, { autoCapitalize: "sentences", multiline: multiline, multilineMaxHeight: 242, placeholder: placeholder, placeholderTextColor: isFocused ? colorTextMedium : colorBgBase, style: [!!icon && { paddingRight: inputPaddingRightWithIcon }, style.input, { color }], testID: testID, value: value, onBlur: handleOnBlur, 
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            onChange: handleOnChange, onFocus: handleOnFocus, ...inputRestProps }),
+        !!icon && React.createElement(Icon, { color: COLOR.GRAYSCALE_L, name: icon, style: [style.icon, customStyle?.icon], testID: "icon" }),
+        !!error && React.createElement(Error, { error: error, style: [style.error, customStyle?.error] })));
+};
+export { InputField };

package/dist/src/shared/ui/components/molecules/inputField/InputField.style.d.ts

@@ -0,0 +1,29 @@
+import { StyleSheet } from "react-native";
+declare const style: StyleSheet.NamedStyles<any> | StyleSheet.NamedStyles<{
+    error: {
+        marginLeft: number;
+        marginTop: number;
+    };
+    field: {
+        left: number;
+        maxWidth: "100%";
+        position: "absolute";
+        zIndex: number;
+    };
+    icon: {
+        height: number;
+        position: "absolute";
+        right: number;
+        top: number;
+        width: number;
+        zIndex: number;
+    };
+    input: {
+        textOverflow?: string | undefined;
+    };
+    inputField: {
+        borderRadius: number;
+        borderWidth: number;
+    };
+}>;
+export { style };

package/dist/src/shared/ui/components/molecules/inputField/InputField.style.js

@@ -0,0 +1,37 @@
+import { StyleSheet, Platform } from "react-native";
+import { theme } from "@lookiero/sty-psp-ui";
+const { space1, space4, space6, borderRadius2, borderWidth1 } = theme();
+const style = StyleSheet.create({
+    error: {
+        marginLeft: space6,
+        marginTop: space1,
+    },
+    field: {
+        left: space4,
+        maxWidth: "100%",
+        position: "absolute",
+        zIndex: 4,
+    },
+    icon: {
+        height: 16,
+        position: "absolute",
+        right: space4,
+        top: space4,
+        width: 16,
+        zIndex: 4,
+    },
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    input: {
+        ...Platform.select({
+            web: {
+                textOverflow: "ellipsis",
+            },
+        }),
+    },
+    inputField: {
+        borderRadius: borderRadius2,
+        borderWidth: borderWidth1,
+    },
+});
+export { style };

package/dist/src/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "9.13.0";
+export declare const VERSION = "10.0.0-beta.0";

package/dist/src/version.js

@@ -1 +1 @@
-export const VERSION = "9.13.0";
+export const VERSION = "10.0.0-beta.0";

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

@@ -7,34 +7,57 @@ 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, callback: (params: StartLegacyBoxCheckoutCallbackArgs) => Promise<void>): void;
+  (paymentFlowPayload: unknown): void;
 }
+
 interface PaymentFlowRef {
   readonly startLegacyBoxCheckout: StartLegacyBoxCheckoutFunction;
 }
+
 const paymentFlowRef: PaymentFlowRef = {
-  startLegacyBoxCheckout: async (_paymentFlowPayload, callback) => {
-    await callback({ status: "EXECUTED", final: true });
-  },
+  startLegacyBoxCheckout: async () => {},
 };
+
 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 };
+
+export {
+  PaymentsQueryProvider,
+  PaymentInstrumentSelect,
+  PaymentFlow,
+  Section,
+  setPaymentsBridge,
+  paymentFlowRef,
+  usePaymentStatusManager,
+};

package/index.ts

@@ -9,12 +9,11 @@ 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";
 import { root, RootProps } from "./src/infrastructure/ui/Root";
-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 { Order } from "./src/projection/order/order";
-import { Subscription } from "./src/projection/subscription/subscription";
+import { OrderProjection } from "./src/projection/order/order";
+import { SubscriptionProjection } from "./src/projection/subscription/subscription";
 
 interface FirstAvailableCheckoutByCustomerIdFunctionArgs {
   readonly customerId: string | undefined;
@@ -45,7 +44,7 @@ const bootstrap: BootstrapFunction = ({ apiUrl, getAuthToken, translations, sent
   const { Component: Messaging, queryBus } = checkoutBootstrap({ apiUrl, getAuthToken });
   const I18n = i18n({
     fetchTranslation: fetchTranslations({ translations }),
-    domain: DOMAIN,
+    contextId: "CheckoutI18n",
   });
 
   const firstAvailableCheckoutByCustomerId: FirstAvailableCheckoutByCustomerIdFunction = ({ customerId }) =>
@@ -58,4 +57,11 @@ const bootstrap: BootstrapFunction = ({ apiUrl, getAuthToken, translations, sent
 };
 
 export { bootstrap, translationEndpoint, translationExternalEndpoint, Country, Segment, CheckoutStatus };
-export type { SentryEnvironment, KameleoonEnvironment, Customer, Subscription, Order, Locale };
+export type {
+  SentryEnvironment,
+  KameleoonEnvironment,
+  Customer,
+  SubscriptionProjection as Subscription,
+  OrderProjection as Order,
+  Locale,
+};

package/jest.config.js

@@ -1,9 +1,9 @@
-const jestReactNativeConfig = require("@lookiero/sty-psp-jest-config/jest.config.expo.js");
+const jestReactNativeConfig = require("@lookiero/sty-psp-jest-config/jest.config.react-native.js");
 
 module.exports = {
   ...jestReactNativeConfig,
-  setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
   setupFiles: ["../../node_modules/react-native-gesture-handler/jestSetup.js"],
+  setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
   moduleNameMapper: {
     ...(jestReactNativeConfig.moduleNameMapper || {}),
   },