@lookiero/checkout 10.0.0-beta.2 → 10.0.0-beta.3

package/dist/index.js

@@ -5,12 +5,13 @@ import { Segment } from "@lookiero/sty-psp-segment";
 import { CheckoutStatus } from "./src/domain/checkout/model/checkout";
 import { bootstrap as checkoutBootstrap } from "./src/infrastructure/delivery/bootstrap";
 import { root } from "./src/infrastructure/ui/Root";
+import { DOMAIN } from "./src/infrastructure/ui/i18n/i18n";
 import { viewFirstAvailableCheckoutByCustomerId } from "./src/projection/checkout/viewFirstAvailableCheckoutByCustomerId";
 const bootstrap = ({ apiUrl, getAuthToken, translations, sentry, kameleoon }) => {
     const { Component: Messaging, queryBus } = checkoutBootstrap({ apiUrl, getAuthToken });
     const I18n = i18n({
         fetchTranslation: fetchTranslations({ translations }),
-        contextId: "CheckoutI18n",
+        domain: DOMAIN,
     });
     const firstAvailableCheckoutByCustomerId = ({ customerId }) => queryBus(viewFirstAvailableCheckoutByCustomerId({ customerId: customerId }));
     return {

package/dist/src/ExpoRoot.js

@@ -15,6 +15,7 @@ import { DummyLayout } from "@lookiero/sty-psp-ui";
 import { bootstrap as checkoutBootstrap } from "./infrastructure/delivery/bootstrap";
 import { bootstrap as checkoutMockBootstrap } from "./infrastructure/delivery/bootstrap.mock";
 import { root } from "./infrastructure/ui/Root";
+import { DOMAIN } from "./infrastructure/ui/i18n/i18n";
 import { Router } from "./infrastructure/ui/routing/router/Router";
 import { VERSION } from "./version";
 const locale = Locale.es_ES;
@@ -52,7 +53,7 @@ const externalTranslationsUrl = Platform.OS !== "web"
 const translations = [
     (locale) => translationExternalEndpoint({
         translationsUrl: externalTranslationsUrl,
-        projects: [["user-area-front"], ["inventory-catalog", "feature;feature_value;Color"], ["checkout"]],
+        projects: [["checkout"]],
     })(locale),
 ];
 const useRedirect = () => ({
@@ -88,7 +89,7 @@ const { Component: Messaging, queryBus } = process.env.EXPO_PUBLIC_APP_VARIANT =
     : checkoutBootstrap({ apiUrl: () => apiUrl, getAuthToken });
 const I18n = i18n({
     fetchTranslation: fetchTranslations({ translations }),
-    contextId: "CheckoutI18n",
+    domain: DOMAIN,
 });
 const Root = root({
     Messaging,

package/dist/src/infrastructure/ui/components/atoms/fiveItemsDiscountBanner/FiveItemsDiscountBanner.js

@@ -1,10 +1,11 @@
 import React from "react";
 import { ALIGN, DISPLAY, InfoBox, INFOBOX_TYPE, Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
-import { I18nMessages } from "../../../i18n/i18n";
+import { DOMAIN, I18nMessages } from "../../../i18n/i18n";
 import { style } from "./FiveItemsDiscountBanner.style";
 const FiveItemsDiscountBanner = ({ fiveItemsDiscount }) => {
     const bannerText = useI18nMessage({
+        domain: DOMAIN,
         id: I18nMessages.BANNER_DISCOUNT_TEXT,
         values: {
             discount: fiveItemsDiscount.toString(),

package/dist/src/infrastructure/ui/components/atoms/fiveItemsDiscountBanner/FiveItemsDiscountBanner.style.js

@@ -1,8 +1,9 @@
 import { StyleSheet } from "react-native";
-// TODO: get the font family from Aurora
+import { theme } from "@lookiero/sty-psp-ui";
+const { fontMap } = theme();
 const style = StyleSheet.create({
     textBold: {
-        fontFamily: "AreaNormal-Extrabold",
+        fontFamily: fontMap.Action,
     },
 });
 export { style };

package/dist/src/infrastructure/ui/components/atoms/price/Price.js

@@ -2,6 +2,7 @@ import React from "react";
 import { View } from "react-native";
 import { Text } from "@lookiero/aurora";
 import { useI18nNumber } from "@lookiero/i18n-react";
+import { DOMAIN } from "../../../i18n/i18n";
 import { style } from "./Price.style";
 const PRICE_VARIANT = {
     default: { detail: true, level: 1 },
@@ -12,11 +13,13 @@ const PRICE_VARIANT = {
 const Price = ({ price, variant = "default", withPercentage = false }) => {
     const isDiscounted = price.discountedPrice && price.discountedPrice.percentage > 0;
     const productPrice = useI18nNumber({
+        domain: DOMAIN,
         value: price.amount / 100,
         style: "currency",
         currency: price.currency,
     });
     const productDiscountedPrice = useI18nNumber({
+        domain: DOMAIN,
         value: (price.discountedPrice?.amount || 0) / 100,
         style: "currency",
         currency: price.currency,

package/dist/src/infrastructure/ui/components/organisms/checkoutQuestions/components/buttonCheckoutQuestionItem/ButtonCheckoutQuestionItem.js

@@ -1,12 +1,16 @@
 import React, { useCallback } from "react";
-import { Button, BUTTON_VARIANT } from "@lookiero/aurora";
+import { TouchableOpacity } from "react-native";
+import { ALIGN, Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { useCheckoutQuestionFeedbackForId } from "../../behaviors/useCheckoutQuestionFeedback";
 import { style } from "./ButtonCheckoutQuestionItem.style";
+const ACTIVE_OPACITY = 0.6;
 const ButtonCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, testID, }) => {
     const { feedback, onChange } = useCheckoutQuestionFeedbackForId({ id: checkoutQuestionParentId });
-    const optionText = useI18nMessage({ id: checkoutQuestion.name });
+    const optionText = useI18nMessage({ domain: DOMAIN, id: checkoutQuestion.name });
     const handleOnPress = useCallback(() => onChange({ checkoutQuestionId: checkoutQuestionParentId, checkoutQuestionFeedback: checkoutQuestion.id }), [onChange, checkoutQuestion.id, checkoutQuestionParentId]);
-    return (React.createElement(Button, { accessibilityLabel: testID, style: style.button, testID: testID, variant: feedback === checkoutQuestion.id ? BUTTON_VARIANT.PRIMARY : BUTTON_VARIANT.SECONDARY, onPress: handleOnPress }, optionText));
+    return (React.createElement(TouchableOpacity, { accessibilityLabel: testID, activeOpacity: ACTIVE_OPACITY, style: [style.button, feedback === checkoutQuestion.id && style.buttonActive], testID: testID, onPress: handleOnPress },
+        React.createElement(Text, { align: ALIGN.CENTER, level: 3, style: feedback === checkoutQuestion.id && style.textActive, action: true }, optionText)));
 };
 export { ButtonCheckoutQuestionItem };

package/dist/src/infrastructure/ui/components/organisms/checkoutQuestions/components/buttonCheckoutQuestionItem/ButtonCheckoutQuestionItem.style.d.ts

@@ -1,5 +1,21 @@
-import { ViewStyle } from "react-native";
 declare const style: {
-    button: ViewStyle;
+    button: {
+        alignContent: "center";
+        borderColor: string;
+        borderRadius: number;
+        borderWidth: number;
+        flex: number;
+        height: number;
+        justifyContent: "center";
+        marginHorizontal: number;
+        paddingLeft: number;
+        paddingRight: number;
+    };
+    buttonActive: {
+        backgroundColor: string;
+    };
+    textActive: {
+        color: string;
+    };
 };
 export { style };

package/dist/src/infrastructure/ui/components/organisms/checkoutQuestions/components/buttonCheckoutQuestionItem/ButtonCheckoutQuestionItem.style.js

@@ -1,13 +1,25 @@
 import { StyleSheet } from "react-native";
 import { theme } from "@lookiero/sty-psp-ui";
-const { colorBorderActionSecondary, borderWidth2, borderStyle } = theme();
+const { colorBorderActionSecondary, colorBgActionPrimaryActive, colorTextActionPrimary, borderWidth2, borderRadiusFull, space6, space16, } = theme();
+const HEIGHT = space16;
 const style = StyleSheet.create({
     button: {
+        alignContent: "center",
         borderColor: colorBorderActionSecondary,
-        borderStyle: borderStyle,
+        borderRadius: borderRadiusFull,
         borderWidth: borderWidth2,
         flex: 1,
+        height: HEIGHT,
+        justifyContent: "center",
         marginHorizontal: 12,
+        paddingLeft: space6,
+        paddingRight: space6,
+    },
+    buttonActive: {
+        backgroundColor: colorBgActionPrimaryActive,
+    },
+    textActive: {
+        color: colorTextActionPrimary,
     },
 });
 export { style };

package/dist/src/infrastructure/ui/components/organisms/checkoutQuestions/components/hostDefaultCheckoutQuestionItem/HostDefaultCheckoutQuestionItem.js

@@ -2,9 +2,10 @@ import React from "react";
 import { View } from "react-native";
 import { Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { style } from "./HostDefaultCheckoutQuestionItem.style";
 const HostDefaultCheckoutQuestionItem = ({ checkoutQuestion, children, }) => {
-    const titleText = useI18nMessage({ id: checkoutQuestion.name });
+    const titleText = useI18nMessage({ domain: DOMAIN, id: checkoutQuestion.name });
     return (React.createElement(React.Fragment, null,
         React.createElement(Text, { level: 3, style: style.title }, titleText),
         React.createElement(View, { style: style.content }, children)));

package/dist/src/infrastructure/ui/components/organisms/checkoutQuestions/components/hostSelectCheckoutQuestionItem/HostSelectCheckoutQuestionItem.js

@@ -2,9 +2,10 @@ import React from "react";
 import { View } from "react-native";
 import { Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { style } from "./HostSelectCheckoutQuestionItem.style";
 const HostSelectCheckoutQuestionItem = ({ checkoutQuestion, children, }) => {
-    const titleText = useI18nMessage({ id: checkoutQuestion.name });
+    const titleText = useI18nMessage({ domain: DOMAIN, id: checkoutQuestion.name });
     return (React.createElement(React.Fragment, null,
         React.createElement(Text, { level: 3, style: style.title }, titleText),
         React.createElement(View, { style: style.content }, children)));

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

@@ -1,14 +1,15 @@
 import React, { useCallback, useMemo } from "react";
-import { useIntl } from "@lookiero/i18n-react";
+import { useI18n } from "@lookiero/i18n-react";
 import { InputField, TextInput } from "@lookiero/sty-psp-ui";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { useCheckoutQuestionFeedbackForId } from "../../behaviors/useCheckoutQuestionFeedback";
 import { style } from "./TextareaCheckoutQuestionItem.style";
 const TextareaCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, testID, }) => {
-    const { formatMessage } = useIntl();
+    const { formatMessage } = useI18n({ domain: DOMAIN });
     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/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem.js

@@ -1,12 +1,12 @@
 /* eslint-disable react/prop-types */
 import React from "react";
 import { Text, View } from "@lookiero/aurora";
-import { useIntl } from "@lookiero/i18n-react";
+import { useI18n } from "@lookiero/i18n-react";
 import { returnQuestionWithTranslationKey } from "../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
-import { I18nMessages } from "../../../../../i18n/i18n";
+import { DOMAIN, I18nMessages } from "../../../../../i18n/i18n";
 import { style } from "./HostDefaultReturnQuestionItem.style";
 const HostDefaultReturnQuestionItem = ({ returnQuestion, children, }) => {
-    const { formatMessage } = useIntl();
+    const { formatMessage } = useI18n({ domain: DOMAIN });
     const isAllOptions = returnQuestion.translationKey === I18nMessages.RETURN_QUESTION_MAIN_ALL_OPINION;
     return (React.createElement(React.Fragment, null,
         returnQuestionWithTranslationKey(returnQuestion) && returnQuestion.translationKey !== " " && !isAllOptions ? (React.createElement(View, { style: style.title },

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostRadioGroupReturnQuestionItem/HostRadioGroupReturnQuestionItem.js

@@ -2,10 +2,11 @@
 import React, { useMemo } from "react";
 import { View } from "react-native";
 import { Text } from "@lookiero/aurora";
-import { useIntl } from "@lookiero/i18n-react";
+import { useI18n } from "@lookiero/i18n-react";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { style } from "./HostRadioGroupReturnQuestionItem.style";
 const HostRadioGroupReturnQuestionItem = ({ returnQuestion, children, testID, }) => {
-    const { formatMessage } = useIntl();
+    const { formatMessage } = useI18n({ domain: DOMAIN });
     const placeholderText = useMemo(() => (returnQuestion.metadata.placeholder ? formatMessage({ id: returnQuestion.metadata.placeholder }) : ""), [formatMessage, returnQuestion.metadata.placeholder]);
     return (React.createElement(React.Fragment, null,
         React.createElement(View, { style: style.wrapper, testID: testID },

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem.js

@@ -2,21 +2,21 @@
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { TouchableHighlight, View } from "react-native";
 import { ButtonIcon } from "@lookiero/aurora";
-import { useIntl } from "@lookiero/i18n-react";
+import { useI18n } from "@lookiero/i18n-react";
 import { InputField, Modal, TextInput } from "@lookiero/sty-psp-ui";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedback, useReturnQuestionFeedbackForReturnQuestion, } from "../../behaviors/useReturnQuestionFeedback";
 import { deepestReturnQuestionWithFeedbackForReturnQuestion, feedbackForReturnQuestion, } from "../../util/returnQuestionFeedback";
 import { style, containerUnderlayColor } from "./HostSelectReturnQuestionItem.style";
 const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName, testID, }) => {
-    const { formatMessage } = useIntl();
+    const { formatMessage } = useI18n({ domain: DOMAIN });
     const placeholderText = useMemo(() => (returnQuestion.metadata.placeholder ? formatMessage({ id: returnQuestion.metadata.placeholder }) : ""), [formatMessage, returnQuestion.metadata.placeholder]);
     const [modalVisible, setModalVisible] = useState(false);
     const handleOnPress = useCallback(() => setModalVisible(true), []);
     const handleOnModalClose = useCallback(() => setModalVisible(false), []);
     const feedback = useReturnQuestionFeedback();
     const { onChange } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion });
-    const intl = useIntl();
-    const translate = useCallback((returnQuestionName) => intl.formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [intl]);
+    const translate = useCallback((returnQuestionName) => formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [formatMessage]);
     const inputValue = feedbackForReturnQuestion({ feedback, returnQuestion, translate }).join(" / ");
     const [deepestReturnQuestionWithFeedback, isLeaf] = deepestReturnQuestionWithFeedbackForReturnQuestion({
         feedback,

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/hostStackReturnQuestionItem/modal/HostStackReturnQuestionItem.js

@@ -3,13 +3,14 @@ import React, { useCallback, useMemo } from "react";
 import { View } from "react-native";
 import Animated, { useAnimatedStyle, useSharedValue, withTiming } from "react-native-reanimated";
 import { COLOR, Text } from "@lookiero/aurora";
-import { useIntl } from "@lookiero/i18n-react";
+import { useI18n } from "@lookiero/i18n-react";
 import { returnQuestionHasChildren } from "../../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
+import { DOMAIN } from "../../../../../../i18n/i18n";
 import ReturnQuestion from "../../../ReturnQuestion";
 import { useReturnQuestionFeedbackForReturnQuestion } from "../../../behaviors/useReturnQuestionFeedback";
 import { style } from "./HostStackReturnQuestionItem.style";
 const HostStackReturnQuestionItem = ({ returnQuestion, children, portalHostName, }) => {
-    const { formatMessage } = useIntl();
+    const { formatMessage } = useI18n({ domain: DOMAIN });
     const { feedback } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion });
     const feedbackReturnQuestion = feedback
         ? returnQuestion.children?.find((returnQuestion) => returnQuestion.id === feedback)

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/modalOptionReturnQuestionItems/ModalOptionReturnQuestionItems.js

@@ -1,13 +1,14 @@
 import React from "react";
 import { View } from "react-native";
 import { COLOR, Text } from "@lookiero/aurora";
-import { useIntl } from "@lookiero/i18n-react";
+import { useI18n } from "@lookiero/i18n-react";
 import { Modal } from "@lookiero/sty-psp-ui";
 import { returnQuestionHasChildren } from "../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import ReturnQuestion from "../../ReturnQuestion";
 import { style } from "./ModalOptionReturnQuestionItems.style";
 const ModalOptionReturnQuestionItems = ({ portalHostName, returnQuestion, visible, onClose, }) => {
-    const { formatMessage } = useIntl();
+    const { formatMessage } = useI18n({ domain: DOMAIN });
     const title = formatMessage({ id: returnQuestion.translationKey });
     return (React.createElement(Modal, { portalHostName: portalHostName, visible: visible, scroll: true, showCloseButton: true, onClose: onClose },
         React.createElement(View, { style: style.modalContent },

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem.js

@@ -3,11 +3,12 @@ import React, { useCallback } from "react";
 import { TouchableHighlight } from "react-native";
 import { Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedbackForReturnQuestion } from "../../behaviors/useReturnQuestionFeedback";
 import { containerUnderlayColor, style } from "./OptionReturnQuestionItem.style";
 const OptionReturnQuestionItem = ({ returnQuestion, returnQuestionParent, testID, }) => {
     const { onChange } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion: returnQuestionParent });
-    const optionText = useI18nMessage({ id: returnQuestion.translationKey });
+    const optionText = useI18nMessage({ domain: DOMAIN, id: returnQuestion.translationKey });
     const handleOnPress = useCallback(() => onChange({ returnQuestionId: returnQuestionParent.id, returnQuestionFeedback: returnQuestion.id }), [onChange, returnQuestion.id, returnQuestionParent.id]);
     return (React.createElement(TouchableHighlight, { accessibilityLabel: testID, style: style.container, testID: testID, underlayColor: containerUnderlayColor, onPress: handleOnPress },
         React.createElement(Text, { level: 3, style: style.text }, optionText)));

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/radioReturnQuestionItem/RadioReturnQuestionItem.js

@@ -1,19 +1,20 @@
 /* eslint-disable react/prop-types */
 import React, { useCallback, useEffect, useState } from "react";
 import { View, Option, OPTION_VARIANT, SIZE } from "@lookiero/aurora";
-import { useIntl } from "@lookiero/i18n-react";
+import { useI18n } from "@lookiero/i18n-react";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedback, useReturnQuestionFeedbackForReturnQuestion, } from "../../behaviors/useReturnQuestionFeedback";
 import { deepestReturnQuestionWithFeedbackForReturnQuestion, feedbackForReturnQuestion, } from "../../util/returnQuestionFeedback";
 import { ModalOptionReturnQuestionItems } from "../modalOptionReturnQuestionItems/ModalOptionReturnQuestionItems";
 import { style } from "./RadioReturnQuestionItem.style";
 const RadioReturnQuestionItem = ({ returnQuestion, returnQuestionParent, testID, portalHostName, }) => {
-    const intl = useIntl();
+    const { formatMessage } = useI18n({ domain: DOMAIN });
     const [modalVisible, setModalVisible] = useState(false);
     const { feedback: feedbackId, onChange, clear, } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion: returnQuestionParent });
     const feedback = useReturnQuestionFeedback();
-    const translate = useCallback((returnQuestionName) => intl.formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [intl]);
+    const translate = useCallback((returnQuestionName) => formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [formatMessage]);
     const inputValue = feedbackForReturnQuestion({ feedback, returnQuestion, translate }).join(" / ");
-    const optionText = intl.formatMessage({ id: returnQuestion.translationKey });
+    const optionText = formatMessage({ id: returnQuestion.translationKey });
     const hasChildren = Boolean(returnQuestion.children && returnQuestion.children.length > 0);
     const handleOnModalClose = useCallback(() => {
         // Uncomment if we want to clear current selection (and update callback's dependencies)

package/dist/src/infrastructure/ui/components/organisms/returnQuestions/components/returnQuestionFeedbackItem/ReturnQuestionFeedbackItem.js

@@ -2,17 +2,17 @@
 import React, { useCallback } from "react";
 import { View } from "react-native";
 import { Text } from "@lookiero/aurora";
-import { useI18nMessage, useIntl } from "@lookiero/i18n-react";
-import { I18nMessages } from "../../../../../i18n/i18n";
+import { useI18nMessage, useI18n } from "@lookiero/i18n-react";
+import { DOMAIN, I18nMessages } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedback } from "../../behaviors/useReturnQuestionFeedback";
 import { feedbackForReturnQuestion } from "../../util/returnQuestionFeedback";
 import { style } from "./ReturnQuestionFeedbackItem.style";
 const ReturnQuestionFeedbackItem = ({ returnQuestion }) => {
-    const titleText = useI18nMessage({ id: returnQuestion.translationKey });
-    const unansweredText = useI18nMessage({ id: I18nMessages.FEEDBACK_UNANSWERED });
+    const titleText = useI18nMessage({ domain: DOMAIN, id: returnQuestion.translationKey });
+    const unansweredText = useI18nMessage({ domain: DOMAIN, id: I18nMessages.FEEDBACK_UNANSWERED });
     const returnQuestionFeedback = useReturnQuestionFeedback();
-    const intl = useIntl();
-    const translate = useCallback((returnQuestionName) => intl.formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [intl]);
+    const { formatMessage } = useI18n({ domain: DOMAIN });
+    const translate = useCallback((returnQuestionName) => formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [formatMessage]);
     const feedback = feedbackForReturnQuestion({ feedback: returnQuestionFeedback, returnQuestion, translate }).join(" / ");
     return (React.createElement(View, { style: style.container },
         React.createElement(Text, { level: 2, style: style.title, detailBold: true }, titleText),

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

@@ -1,17 +1,18 @@
 /* eslint-disable react/prop-types */
 import React, { useCallback, useMemo } from "react";
 import { View } from "@lookiero/aurora";
-import { useIntl } from "@lookiero/i18n-react";
+import { useI18n } from "@lookiero/i18n-react";
 import { InputField, TextInput } from "@lookiero/sty-psp-ui";
+import { DOMAIN } from "../../../../../i18n/i18n";
 import { useReturnQuestionFeedbackForReturnQuestion } from "../../behaviors/useReturnQuestionFeedback";
 import { style } from "./TextareaReturnQuestionItem.style";
 const TextareaReturnQuestionItem = ({ returnQuestion, returnQuestionParent, testID, }) => {
-    const { formatMessage } = useIntl();
+    const { formatMessage } = useI18n({ domain: DOMAIN });
     const placeholderText = useMemo(() => (returnQuestion.metadata.placeholder ? formatMessage({ id: returnQuestion.metadata.placeholder }) : ""), [formatMessage, returnQuestion.metadata.placeholder]);
     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/components/templates/header/checkoutHeader/CheckoutHeader.js

@@ -1,12 +1,12 @@
 import React from "react";
 import { ButtonIcon, Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
-import { I18nMessages } from "../../../../i18n/i18n";
+import { DOMAIN, I18nMessages } from "../../../../i18n/i18n";
 import { Header } from "../Header";
 import { ButtonIconPlaceholder } from "../buttonIconPlaceholder/ButtonIconPlaceholder";
 import { style } from "./CheckoutHeader.style";
 const CheckoutHeader = ({ onBack }) => {
-    const title = useI18nMessage({ id: I18nMessages.HEADER_COMPLETE_CHECKOUT_TITLE });
+    const title = useI18nMessage({ domain: DOMAIN, id: I18nMessages.HEADER_COMPLETE_CHECKOUT_TITLE });
     return (React.createElement(Header, { testID: "checkout-header" },
         React.createElement(ButtonIcon, { name: "arrow_left", style: style.button, testID: "arrow-left-button-icon", onPress: onBack }),
         React.createElement(Text, { level: 3, action: true }, title),

package/dist/src/infrastructure/ui/components/templates/header/itemDetailHeader/ItemDetailHeader.js

@@ -1,12 +1,12 @@
 import React from "react";
 import { ButtonIcon, Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
-import { I18nMessages } from "../../../../i18n/i18n";
+import { DOMAIN, I18nMessages } from "../../../../i18n/i18n";
 import { Header } from "../Header";
 import { ButtonIconPlaceholder } from "../buttonIconPlaceholder/ButtonIconPlaceholder";
 import { style } from "./ItemDetailHeader.style";
 const ItemDetailHeader = ({ onBack }) => {
-    const title = useI18nMessage({ id: I18nMessages.HEADER_CHECKOUT_TITLE });
+    const title = useI18nMessage({ domain: DOMAIN, id: I18nMessages.HEADER_CHECKOUT_TITLE });
     return (React.createElement(Header, { testID: "item-detail-header" },
         React.createElement(ButtonIconPlaceholder, null),
         React.createElement(Text, { level: 3, action: true }, title),

package/dist/src/infrastructure/ui/components/templates/header/itemHeader/ItemHeader.js

@@ -3,13 +3,13 @@ import { generatePath, useNavigate } from "react-router-native";
 import { ButtonIcon, Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { useStaticInfo } from "../../../../hooks/useStaticInfo";
-import { I18nMessages } from "../../../../i18n/i18n";
+import { DOMAIN, I18nMessages } from "../../../../i18n/i18n";
 import { Routes } from "../../../../routing/routes";
 import { Header } from "../Header";
 import { ButtonIconPlaceholder } from "../buttonIconPlaceholder/ButtonIconPlaceholder";
 import style from "./ItemHeader.style";
 const ItemHeader = ({ items, item, onNext, onPrevious }) => {
-    const title = useI18nMessage({ id: I18nMessages.HEADER_CHECKOUT_TITLE });
+    const title = useI18nMessage({ domain: DOMAIN, id: I18nMessages.HEADER_CHECKOUT_TITLE });
     const itemIndex = items.indexOf(item);
     const isFirstItem = itemIndex === 0;
     const isLastItem = itemIndex === items.length - 1;

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

@@ -5,7 +5,7 @@ import { useLogger } from "@lookiero/sty-psp-logging";
 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 { useSubmitCheckout } from "../../domain/checkout/react/useSubmitCheckout";
 import { useBlockCheckoutBooking } from "../../domain/checkoutBooking/react/useBlockCheckoutBooking";
 import { useViewIsSizeChangeEnabledByCheckoutId } from "../../projection/checkout/react/useViewIsSizeChangeEnabledByCheckoutId";
 import { useViewPaymentFlowPayloadByCheckoutId } from "../../projection/payment/react/useViewPaymentFlowPayloadByCheckoutId";
@@ -29,7 +29,7 @@ const useCheckoutFlow = ({ checkout: checkoutProjection, order: orderProjection,
         checkoutId: checkoutProjection?.id,
         queryOptions: { refetchOnMount: true },
     });
-    const [submitCheckoutCommand, submitCheckoutCommandStatus] = useSubmitCheckoutCommand({
+    const [submitCheckout, submitCheckoutStatus] = useSubmitCheckout({
         checkoutId: checkoutProjection?.id,
         logger,
     });
@@ -72,7 +72,7 @@ const useCheckoutFlow = ({ checkout: checkoutProjection, order: orderProjection,
         paymentFlowRef.current?.startLegacyBoxCheckout({
             ...paymentFlowPayload,
             userInformation: { email, name },
-            returnUrl: `${basePath}/${Routes.CHECKOUT}?foo=bar`,
+            returnUrl: `${basePath}/${Routes.CHECKOUT}`,
         });
     }, [
         checkoutProjection?.checkoutBookingId,
@@ -86,14 +86,14 @@ const useCheckoutFlow = ({ checkout: checkoutProjection, order: orderProjection,
     ]);
     const onPaymentSuccess = useCallback(async () => {
         setStartLegacyBoxCheckoutStatus("success");
-        await submitCheckoutCommand();
+        await submitCheckout();
         createNotification({
             bodyI18nKey: I18nMessages.CHECKOUT_TOAST_PAYMENT_SUCCESS,
             level: NotificationLevel.SUCCESS,
         });
         trackCheckout();
         onSuccess();
-    }, [createNotification, onSuccess, submitCheckoutCommand, trackCheckout]);
+    }, [createNotification, onSuccess, submitCheckout, trackCheckout]);
     const onPaymentError = useCallback((payload) => {
         setStartLegacyBoxCheckoutStatus("error");
         createNotification({
@@ -105,22 +105,22 @@ const useCheckoutFlow = ({ checkout: checkoutProjection, order: orderProjection,
     const checkoutFlowStatus = useMemo(() => {
         if (blockCheckoutBookingStatus === CommandStatus.LOADING ||
             startLegacyBoxCheckoutStatus === "loading" ||
-            submitCheckoutCommandStatus === CommandStatus.LOADING) {
+            submitCheckoutStatus === CommandStatus.LOADING) {
             return "loading";
         }
         if (blockCheckoutBookingStatus === CommandStatus.SUCCESS &&
             startLegacyBoxCheckoutStatus === "success" &&
-            submitCheckoutCommandStatus === CommandStatus.SUCCESS) {
+            submitCheckoutStatus === CommandStatus.SUCCESS) {
             return "success";
         }
         if (blockCheckoutBookingStatus === CommandStatus.ERROR ||
             startLegacyBoxCheckoutStatus === "error" ||
-            submitCheckoutCommandStatus === CommandStatus.ERROR ||
+            submitCheckoutStatus === CommandStatus.ERROR ||
             checkoutBookingExpired) {
             return "error";
         }
         return "idle";
-    }, [blockCheckoutBookingStatus, startLegacyBoxCheckoutStatus, submitCheckoutCommandStatus, checkoutBookingExpired]);
+    }, [blockCheckoutBookingStatus, startLegacyBoxCheckoutStatus, submitCheckoutStatus, checkoutBookingExpired]);
     const paymentFlow = useMemo(() => (authToken ? React.createElement(PaymentFlow, { ref: paymentFlowRef, section: Section.BOX_CHECKOUT, token: authToken }) : null), [authToken]);
     return useMemo(() => [checkoutFlow, checkoutFlowStatus, paymentFlow], [checkoutFlow, paymentFlow, checkoutFlowStatus]);
 };

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 {