@lookiero/checkout 0.8.28 → 1.1.0

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

@@ -1,5 +1,5 @@
 import { useI18nMessage, useIntl } from "@lookiero/i18n-react";
-import React, { useCallback, useState } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import { TouchableHighlight, View } from "react-native";
 import { Modal } from "../../../../../../../shared/ui/components/layouts/modal/Modal";
 import { ButtonIcon } from "../../../../../../../shared/ui/components/molecules/buttonIcon/ButtonIcon";
@@ -17,12 +17,18 @@ const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName
     const intl = useIntl();
     const translate = useCallback((returnQuestionName) => intl.formatMessage({ id: returnQuestionName, defaultMessage: returnQuestionName }), [intl]);
     const inputValue = feedbackForReturnQuestion({ feedback, returnQuestion, translate }).join(" / ");
-    const deepestReturnQuestionWithFeedback = deepestReturnQuestionWithFeedbackForReturnQuestion({
+    const [deepestReturnQuestionWithFeedback, isLeaf] = deepestReturnQuestionWithFeedbackForReturnQuestion({
         feedback,
         returnQuestion,
     });
     const handleOnBackButtonPress = useCallback(() => deepestReturnQuestionWithFeedback &&
         onChange({ returnQuestionId: deepestReturnQuestionWithFeedback.id, returnQuestionFeedback: undefined }), [deepestReturnQuestionWithFeedback, onChange]);
+    useEffect(() => {
+        if (isLeaf) {
+            handleOnModalClose();
+        }
+        // deepestReturnQuestionWithFeedback needs to be as a dependency in order to be re-evaluated whenever it changes
+    }, [handleOnModalClose, deepestReturnQuestionWithFeedback, isLeaf]);
     return (React.createElement(React.Fragment, null,
         React.createElement(TouchableHighlight, { style: style.container, underlayColor: containerUnderlayColor, onPress: handleOnPress },
             React.createElement(View, { pointerEvents: "none" },

package/dist/infrastructure/ui/components/organisms/returnQuestions/util/returnQuestionFeedback.d.ts

@@ -1,7 +1,7 @@
 import { FeedbackProjection } from "../../../../../../projection/feedback/feedback";
 import { ReturnQuestionProjection } from "../../../../../../projection/returnQuestion/returnQuestion";
 interface RecursiveFeedbackForReturnQuestionFunctionArgs {
-    readonly feedback: FeedbackProjection | undefined;
+    readonly feedback: FeedbackProjection;
     readonly returnQuestion: ReturnQuestionProjection;
     readonly translate: (i18nString: string) => string;
     readonly acc?: string[];
@@ -11,12 +11,15 @@ interface RecursiveFeedbackForReturnQuestionFunction {
 }
 declare const feedbackForReturnQuestion: RecursiveFeedbackForReturnQuestionFunction;
 interface RecursiveDeepestReturnQuestionWithFeedbackFunctionArgs {
-    readonly feedback: FeedbackProjection | undefined;
+    readonly feedback: FeedbackProjection;
     readonly returnQuestion: ReturnQuestionProjection;
     readonly deepestReturnQuestion?: ReturnQuestionProjection;
 }
 interface RecursiveDeepestReturnQuestionWithFeedbackFunction {
-    (args: RecursiveDeepestReturnQuestionWithFeedbackFunctionArgs): ReturnQuestionProjection | undefined;
+    (args: RecursiveDeepestReturnQuestionWithFeedbackFunctionArgs): [
+        question: ReturnQuestionProjection | undefined,
+        isLeaf: boolean
+    ];
 }
 declare const deepestReturnQuestionWithFeedbackForReturnQuestion: RecursiveDeepestReturnQuestionWithFeedbackFunction;
 export { feedbackForReturnQuestion, deepestReturnQuestionWithFeedbackForReturnQuestion };

package/dist/infrastructure/ui/components/organisms/returnQuestions/util/returnQuestionFeedback.js

@@ -1,9 +1,6 @@
 import { validate } from "uuid";
 const isUuid = (value) => validate(value);
 const feedbackForReturnQuestion = ({ feedback, returnQuestion, translate, acc = [], }) => {
-    if (!feedback) {
-        return [];
-    }
     const returnQuestionId = Object.keys(feedback).find((id) => id === returnQuestion.id);
     if (returnQuestionId) {
         const returnQuestionFeedback = feedback[returnQuestionId];
@@ -26,9 +23,6 @@ const feedbackForReturnQuestion = ({ feedback, returnQuestion, translate, acc =
     ], []) || []);
 };
 const deepestReturnQuestionWithFeedbackForReturnQuestion = ({ feedback, returnQuestion, deepestReturnQuestion, }) => {
-    if (!feedback) {
-        return;
-    }
     const returnQuestionId = Object.keys(feedback).find((id) => id === returnQuestion.id);
     if (returnQuestionId) {
         const returnQuestionFeedback = feedback[returnQuestionId];
@@ -41,9 +35,9 @@ const deepestReturnQuestionWithFeedbackForReturnQuestion = ({ feedback, returnQu
                     deepestReturnQuestion: returnQuestion,
                 });
             }
-            return returnQuestion;
+            return [returnQuestion, false];
         }
-        return returnQuestion;
+        return [returnQuestion, false];
     }
     const feebackReturnQuestionChild = returnQuestion.children?.find((childReturnQuestion) => Object.keys(feedback).find((id) => id === childReturnQuestion.id));
     if (feebackReturnQuestionChild) {
@@ -53,6 +47,6 @@ const deepestReturnQuestionWithFeedbackForReturnQuestion = ({ feedback, returnQu
             deepestReturnQuestion: feebackReturnQuestionChild,
         });
     }
-    return deepestReturnQuestion;
+    return [deepestReturnQuestion, !returnQuestion.children || returnQuestion.children.length === 0];
 };
 export { feedbackForReturnQuestion, deepestReturnQuestionWithFeedbackForReturnQuestion };

package/dist/infrastructure/ui/views/item/Item.js

@@ -160,7 +160,8 @@ const Item = ({ customerId, country }) => {
         dependenciesLoadedStatuses.includes(sizeChangeEnabledStatus) &&
         // This will ensure that the view is not shown until bookCheckoutBooking use-case is dispatched (if required)
         (isBookingRequired ? checkout?.checkoutBookingId && bookedProductsVariants : true) &&
-        (dependenciesLoadedStatuses.includes(checkoutStatus) || checkout);
+        (dependenciesLoadedStatuses.includes(checkoutStatus) || checkout) &&
+        resetCheckoutItemStatus !== CommandStatus.LOADING;
     if (!dependenciesLoaded)
         return React.createElement(Spinner, null);
     const { price } = checkoutItem;
@@ -169,7 +170,7 @@ const Item = ({ customerId, country }) => {
         React.createElement(SizeWithoutStockModal, { visible: sizeWithoutStockModalVisible, onDismiss: handleOnHideSizeWithoutStockModal }),
         React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0, footer: !customerDecissionMade && (React.createElement(ItemActions, { country: country, keepButtonLoading: keepCheckoutItemStatus === CommandStatus.LOADING, productVariantSelected: productVariantSelected, productVariants: bookedProductsVariants?.productVariants, returnButtonLoading: returnCheckoutItemStatus === CommandStatus.LOADING, sizeSelectorDisabled: replaceCheckoutItemStatus === CommandStatus.LOADING, onKeep: handleOnKeep, onLayout: handleOnStickyLayout, onReplace: handleOnReplace, onReturn: handleOnReturn, onSizeSelectorPress: handleOnShowSizeWithoutStockModal })) },
             React.createElement(Body, null,
-                customerDecissionMade && (React.createElement(CustomerDecissionBanner, { changingDecission: resetCheckoutItemStatus === CommandStatus.LOADING, checkoutItemStatus: checkoutItem.status, onPress: handleOnPressCustomerDecissionBanner })),
+                customerDecissionMade && (React.createElement(CustomerDecissionBanner, { checkoutItemStatus: checkoutItem.status, onPress: handleOnPressCustomerDecissionBanner })),
                 React.createElement(View, { style: [style.content, { paddingBottom: Platform.OS === "web" ? spaceXL : stickyHeight }] },
                     React.createElement(View, { style: style.sliderContainer },
                         React.createElement(ProductVariantSlider, { producVariantMedia: media, onChanged: handleOnChangedProductVariantSlider })),

package/dist/infrastructure/ui/views/item/components/banner/CustomerDecissionBanner.d.ts

@@ -4,7 +4,6 @@ type CustomerDecissionBannerStatus = Exclude<CheckoutItemStatus, CheckoutItemSta
 interface CustomerDecissionBannerProps {
     readonly checkoutItemStatus: CustomerDecissionBannerStatus;
     readonly onPress: () => void;
-    readonly changingDecission: boolean;
 }
 declare const CustomerDecissionBanner: FC<CustomerDecissionBannerProps>;
 export type { CustomerDecissionBannerStatus };

package/dist/infrastructure/ui/views/item/components/banner/CustomerDecissionBanner.js

@@ -1,27 +1,21 @@
 import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Text";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import React from "react";
-import { Pressable, View } from "react-native";
+import { Pressable } from "react-native";
 import { CheckoutItemStatus } from "../../../../../../domain/checkoutItem/model/checkoutItem";
-import { Spinner } from "../../../../../../shared/ui/components/atoms/spinner/Spinner";
 import { Banner } from "../../../../components/layouts/banner/Banner";
 import { I18nMessages } from "../../../../i18n/i18n";
-import { theme } from "../../../../theme/theme";
 import { style } from "./CustomerDecissionBanner.style";
-const { colorContent } = theme();
 const i18nMessageForCheckoutItemStatus = {
     [CheckoutItemStatus.KEPT]: I18nMessages.ITEM_BANNER_CUSTOMER_KEPT_DECISSION,
     [CheckoutItemStatus.REPLACED]: I18nMessages.ITEM_BANNER_CUSTOMER_REPLACED_DECISSION,
     [CheckoutItemStatus.RETURNED]: I18nMessages.ITEM_BANNER_CUSTOMER_RETURNED_DECISSION,
 };
-const CustomerDecissionBanner = ({ checkoutItemStatus, onPress, changingDecission, }) => {
+const CustomerDecissionBanner = ({ checkoutItemStatus, onPress }) => {
     const decissionText = useI18nMessage({ id: i18nMessageForCheckoutItemStatus[checkoutItemStatus] }) || "";
     const bannerButtonText = useI18nMessage({ id: I18nMessages.ITEM_BANNER_BUTTON });
     return (React.createElement(Banner, { text: decissionText },
-        React.createElement(View, { style: style.actions },
-            React.createElement(View, { style: style.placeholder }),
-            React.createElement(Pressable, { onPress: changingDecission ? undefined : onPress },
-                React.createElement(Text, { level: 2, style: style.buttonText, detail: true }, bannerButtonText)),
-            React.createElement(View, { style: style.placeholder }, changingDecission && React.createElement(Spinner, { color: colorContent, size: 20 })))));
+        React.createElement(Pressable, { style: style.button, onPress: onPress },
+            React.createElement(Text, { level: 2, style: style.buttonText, detail: true }, bannerButtonText))));
 };
 export { CustomerDecissionBanner };

package/dist/infrastructure/ui/views/item/components/banner/CustomerDecissionBanner.style.d.ts

@@ -1,16 +1,10 @@
 declare const style: {
-    actions: {
-        flexDirection: "row";
-        justifyContent: "space-between";
+    button: {
+        alignItems: "center";
         marginTop: number;
-        minHeight: number;
-        width: string;
     };
     buttonText: {
         textDecorationLine: "underline";
     };
-    placeholder: {
-        width: number;
-    };
 };
 export { style };

package/dist/infrastructure/ui/views/item/components/banner/CustomerDecissionBanner.style.js

@@ -2,18 +2,12 @@ import { StyleSheet } from "react-native";
 import { theme } from "../../../../theme/theme";
 const { spaceM } = theme();
 const style = StyleSheet.create({
-    actions: {
-        flexDirection: "row",
-        justifyContent: "space-between",
+    button: {
+        alignItems: "center",
         marginTop: spaceM,
-        minHeight: 20,
-        width: "100%",
     },
     buttonText: {
         textDecorationLine: "underline",
     },
-    placeholder: {
-        width: 20,
-    },
 });
 export { style };

package/dist/shared/ui/components/atoms/spinner/Spinner.d.ts

@@ -1,8 +1,3 @@
 import { FC } from "react";
-import { ColorValue } from "react-native";
-interface SpinnerProps {
-    readonly color?: ColorValue;
-    readonly size?: number | "large" | "small";
-}
-declare const Spinner: FC<SpinnerProps>;
+declare const Spinner: FC;
 export { Spinner };

package/dist/shared/ui/components/atoms/spinner/Spinner.js

@@ -1,8 +1,7 @@
+import { Spinner as AuroraSpinner } from "@lookiero/aurora-next/build/components/atoms/Spinner/Spinner";
 import React from "react";
-import { ActivityIndicator, View } from "react-native";
-import { theme } from "../../../../../infrastructure/ui/theme/theme";
+import { View } from "react-native";
 import { style } from "./Spinner.style";
-const { colorPrimary } = theme();
-const Spinner = ({ color = colorPrimary, size = "large" }) => (React.createElement(View, { style: style.container },
-    React.createElement(ActivityIndicator, { color: color, size: size })));
+const Spinner = () => (React.createElement(View, { style: style.container },
+    React.createElement(AuroraSpinner, null)));
 export { Spinner };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "0.8.28",
+  "version": "1.1.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
@@ -45,7 +45,7 @@
   "peerDependencies": {
     "@lookiero/aurora-fonts": "^1.0.6",
     "@lookiero/aurora-iconfont": "^2.0.37",
-    "@lookiero/aurora-next": "^3.0.185",
+    "@lookiero/aurora-next": "^3.0.191",
     "@lookiero/data-sources": "^0.3",
     "@lookiero/event": "^0.3",
     "@lookiero/locale": "^0.3",
@@ -67,7 +67,7 @@
     "@expo/webpack-config": "^0.17.2",
     "@lookiero/aurora-fonts": "^1.0.6",
     "@lookiero/aurora-iconfont": "^2.0.37",
-    "@lookiero/aurora-next": "^3.0.185",
+    "@lookiero/aurora-next": "^3.0.191",
     "@lookiero/data-sources": "^0.3",
     "@lookiero/event": "^0.3",
     "@lookiero/locale": "^0.3",