@lookiero/checkout 0.2.52 → 0.3.1

package/README.md

@@ -33,3 +33,18 @@ Once we can replace the build of Jenkins for NPM one, we are going to be able to
   }
 }
 ```
+
+We are hiding the node compatibility deprecation warnings in order to obtain a success message from
+the terminal. Remove it once we drop Yarn compatibility.
+
+```json
+{
+  (...)
+  "scripts": {
+    (...)
+    "build:app": "tsc -p ./tsconfig.build-app.json --noemit && ENTRY_POINT='./src/Expo.tsx' NODE_ENV=production expo export:web --clear 2> /dev/null"
+    (...)
+  }
+  (...)
+}
+```

package/dist/domain/checkoutItem/model/checkoutItem.js

@@ -20,19 +20,19 @@ const keepCheckoutItemHandler = () => async ({ aggregateRoot, command }) => {
     };
 };
 const returnCheckoutItemHandler = () => async ({ aggregateRoot, command }) => {
-    const { aggregateId } = command;
-    invariant(aggregateRoot.status !== CheckoutItemStatus.RETURNED, "CheckoutItem is already returned");
+    const { aggregateId, feedbacks } = command;
     return {
         ...aggregateRoot,
+        feedbacks,
         status: CheckoutItemStatus.RETURNED,
         domainEvents: [checkoutItemReturned({ aggregateId })],
     };
 };
 const replaceCheckoutItemHandler = () => async ({ aggregateRoot, command }) => {
-    const { aggregateId } = command;
-    invariant(aggregateRoot.status !== CheckoutItemStatus.REPLACED, "CheckoutItem is already replaced");
+    const { aggregateId, replacedFor } = command;
     return {
         ...aggregateRoot,
+        replacedFor,
         status: CheckoutItemStatus.REPLACED,
         domainEvents: [checkoutItemReplaced({ aggregateId })],
     };

package/dist/infrastructure/delivery/mock/dataSourceCheckoutBookings.js

@@ -3,9 +3,8 @@ import { viewBookedSizeChangeProductsVariantsForCheckoutItem, } from "../../../p
 const toCheckoutBookingDomain = (checkoutBooking) => {
     invariant(checkoutBooking, "No checkoutBooking found!");
     return {
-        aggregateId: checkoutBooking.id,
-        checkoutId: checkoutBooking.checkoutId,
-        checkoutItemIds: [checkoutBooking.checkoutItemId],
+        aggregateId: checkoutBooking.bookingId,
+        checkoutItemIds: checkoutBooking.productVariants.map((productVariant) => productVariant.id),
         domainEvents: [],
     };
 };

package/dist/infrastructure/delivery/mock/dataSourceCheckoutItems.js

@@ -4,7 +4,7 @@ const toCheckoutItemProjection = (checkoutItem) => ({
     id: checkoutItem.aggregateId,
     status: checkoutItem.status,
     productVariant: {},
-    feedback: {},
+    feedbacks: {},
     price: checkoutItem.price,
 });
 const toCheckoutItemDomain = (checkoutItem) => {
@@ -14,7 +14,7 @@ const toCheckoutItemDomain = (checkoutItem) => {
         id: checkoutItem.id,
         status: checkoutItem.status,
         price: checkoutItem.price,
-        feedbacks: checkoutItem.feedback,
+        feedbacks: checkoutItem.feedbacks,
         domainEvents: [],
     };
 };

package/dist/infrastructure/domain/checkoutBooking/react/useBookCheckouBookingForCheckoutItem.d.ts

@@ -5,7 +5,6 @@ interface BookFunction {
 declare type UseBookCheckouBookingForCheckoutItem = [book: BookFunction, status: CommandStatus];
 interface UseBookCheckouBookingForCheckoutItemFunctionArgs {
     readonly checkoutItemId: string;
-    readonly checkoutBookingId: string | undefined;
 }
 interface UseBookCheckouBookingForCheckoutItemFunction {
     (args: UseBookCheckouBookingForCheckoutItemFunctionArgs): UseBookCheckouBookingForCheckoutItem;

package/dist/infrastructure/domain/checkoutBooking/react/useBookCheckouBookingForCheckoutItem.js

@@ -3,12 +3,12 @@ import { useCallback } from "react";
 import { v4 as uuid } from "uuid";
 import { bookCheckoutBookingForCheckoutItem } from "../../../../domain/checkoutBooking/command/bookCheckoutBookingForCheckoutItem";
 import { MESSAGING_CONTEXT_ID } from "../../../delivery/baseBootstrap";
-const useBookCheckouBookingForCheckoutItem = ({ checkoutItemId, checkoutBookingId, }) => {
+const useBookCheckouBookingForCheckoutItem = ({ checkoutItemId }) => {
     const [commandBus, status] = useCommand({ contextId: MESSAGING_CONTEXT_ID });
     const book = useCallback(() => commandBus(bookCheckoutBookingForCheckoutItem({
-        aggregateId: checkoutBookingId || uuid(),
+        aggregateId: uuid(),
         checkoutItemId,
-    })), [checkoutBookingId, checkoutItemId, commandBus]);
+    })), [checkoutItemId, commandBus]);
     return [book, status];
 };
 export { useBookCheckouBookingForCheckoutItem };

package/dist/infrastructure/domain/checkoutItem/model/httpCheckoutItems.js

@@ -9,7 +9,7 @@ const toDomain = (checkoutItem) => {
         id: checkoutItem.id,
         status: checkoutItem.status,
         price: checkoutItem.price,
-        feedbacks: checkoutItem.feedback,
+        feedbacks: checkoutItem.feedbacks,
         replacedFor: checkoutItem.replacedFor,
         aggregateId: checkoutItem.id,
         domainEvents: [],

package/dist/infrastructure/projection/bookedSizeChangeProductsVariants/react/useViewBookedSizeChangeProductsVariantsForCheckoutItem.js

@@ -1,9 +1,12 @@
 import { useQuery } from "@lookiero/messaging-react";
+import { CHECKOUT_BOOKING_BOOKED, } from "../../../../domain/checkoutBooking/model/checkoutBookingBooked";
 import { viewBookedSizeChangeProductsVariantsForCheckoutItem } from "../../../../projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem";
 import { MESSAGING_CONTEXT_ID } from "../../../delivery/baseBootstrap";
+const isCheckoutBookingBooked = (event) => event.name === CHECKOUT_BOOKING_BOOKED;
 const useViewBookedSizeChangeProductsVariantsForCheckoutItem = ({ checkoutItemId }) => useQuery({
     query: viewBookedSizeChangeProductsVariantsForCheckoutItem({ checkoutItemId }),
     contextId: MESSAGING_CONTEXT_ID,
+    invalidation: isCheckoutBookingBooked,
     options: { staleTime: Infinity, retry: false, refetchOnWindowFocus: false },
 });
 export { useViewBookedSizeChangeProductsVariantsForCheckoutItem };

package/dist/infrastructure/projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId.js

@@ -1,14 +1,17 @@
 import { useQuery } from "@lookiero/messaging-react";
 import { CHECKOUT_ITEM_KEPT } from "../../../../domain/checkoutItem/model/checkoutItemKept";
+import { CHECKOUT_ITEM_REPLACED, } from "../../../../domain/checkoutItem/model/checkoutItemReplaced";
 import { CHECKOUT_ITEM_RETURNED, } from "../../../../domain/checkoutItem/model/checkoutItemReturned";
 import { viewFirstAvailableCheckoutByCustomerId } from "../../../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
 import { MESSAGING_CONTEXT_ID } from "../../../delivery/baseBootstrap";
 const isCheckoutItemKept = (event) => event.name === CHECKOUT_ITEM_KEPT;
 const isCheckoutItemReturned = (event) => event.name === CHECKOUT_ITEM_RETURNED;
+const isCheckoutItemReplaced = (event) => event.name === CHECKOUT_ITEM_REPLACED;
+const shouldInvalidate = (event) => isCheckoutItemKept(event) || isCheckoutItemReplaced(event) || isCheckoutItemReturned(event);
 const useViewFirstAvailableCheckoutByCustomerId = ({ customerId }) => useQuery({
     query: viewFirstAvailableCheckoutByCustomerId({ customerId }),
     contextId: MESSAGING_CONTEXT_ID,
-    invalidation: isCheckoutItemKept || isCheckoutItemReturned,
+    invalidation: shouldInvalidate,
     options: { staleTime: Infinity, retry: false, refetchOnWindowFocus: false },
 });
 export { useViewFirstAvailableCheckoutByCustomerId };

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

@@ -10,6 +10,7 @@ interface RootFunction {
     (args: RootFunctionArgs): FC<RootProps>;
 }
 interface RootProps {
+    readonly basePath: string;
     readonly locale?: string;
     readonly customerId: string | undefined;
     readonly onNotAccessible: () => void;

package/dist/infrastructure/ui/Root.js

@@ -1,13 +1,11 @@
 import React, { useCallback } from "react";
 import { Platform } from "react-native";
 import { Routing } from "./routing/Routing";
-import { Router } from "./routing/router/Router";
 const root = ({ Messaging, I18n, development }) => 
 // eslint-disable-next-line react/display-name, react/prop-types
-({ locale = "en", customerId, onNotAccessible }) => {
+({ basePath, locale = "en", customerId, onNotAccessible }) => {
     const handleOnI18nError = useCallback(() => void 0, []);
     return (React.createElement(Messaging, { includeReactQueryDevTools: Platform.OS === "web" },
-        React.createElement(Router, null,
-            React.createElement(Routing, { I18n: I18n, customerId: customerId, locale: locale, onI18nError: development ? undefined : handleOnI18nError, onNotAccessible: onNotAccessible }))));
+        React.createElement(Routing, { I18n: I18n, basePath: basePath, customerId: customerId, locale: locale, onI18nError: development ? undefined : handleOnI18nError, onNotAccessible: onNotAccessible })));
 };
 export { root };

package/dist/infrastructure/ui/components/organisms/returnQuestions/behaviors/useReturnQuestionFeedback.js

@@ -1,4 +1,4 @@
-import React, { createContext, useCallback, useContext, useMemo, useState } from "react";
+import React, { createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
 import invariant from "tiny-invariant";
 const ReturnQuestionFeedbackContext = createContext(null);
 const ReturnQuestionFeedbackProvider = ({ feedback = {}, children, }) => {
@@ -6,6 +6,7 @@ const ReturnQuestionFeedbackProvider = ({ feedback = {}, children, }) => {
     const onChange = useCallback(({ returnQuestionId, returnQuestionFeedback }) => setContextFeedback((feedback) => returnQuestionFeedback
         ? { ...feedback, [returnQuestionId]: returnQuestionFeedback }
         : Object.entries(feedback).reduce((acc, [id, feedback]) => (id !== returnQuestionId ? { ...acc, [id]: feedback } : acc), {})), []);
+    useEffect(() => setContextFeedback(feedback), [feedback]);
     const value = useMemo(() => ({
         feedback: contextFeedback,
         onChange,

package/dist/infrastructure/ui/routing/CheckoutAccessibilityMiddleware.d.ts

@@ -3,6 +3,7 @@ interface CheckoutAccessibilityMiddlewareProps {
     readonly customerId: string | undefined;
     readonly onNotAccessible: () => void;
     readonly loader?: JSX.Element;
+    readonly children: JSX.Element;
 }
 declare const CheckoutAccessibilityMiddleware: FC<CheckoutAccessibilityMiddlewareProps>;
 export { CheckoutAccessibilityMiddleware };

package/dist/infrastructure/ui/routing/CheckoutAccessibilityMiddleware.js

@@ -1,9 +1,8 @@
 import { QueryStatus } from "@lookiero/messaging-react";
 import React, { useEffect, useRef } from "react";
-import { Outlet } from "react-router-native";
 import { useViewIsCheckoutAccessibleByCustomerId } from "../../projection/checkout/react/useViewIsCheckoutAccessibleByCustomerId";
 import { Spinner } from "../shared/components/atoms/spinner/Spinner";
-const CheckoutAccessibilityMiddleware = ({ customerId, onNotAccessible, loader = React.createElement(Spinner, null), }) => {
+const CheckoutAccessibilityMiddleware = ({ customerId, onNotAccessible, loader = React.createElement(Spinner, null), children, }) => {
     const [accessible, status] = useViewIsCheckoutAccessibleByCustomerId({ customerId });
     const onNotAccessibleRef = useRef(onNotAccessible);
     onNotAccessibleRef.current = onNotAccessible;
@@ -13,6 +12,10 @@ const CheckoutAccessibilityMiddleware = ({ customerId, onNotAccessible, loader =
             onNotAccessibleRef.current();
         }
     }, [notAccessible, onNotAccessible]);
-    return accessible === undefined && [QueryStatus.IDLE, QueryStatus.LOADING].includes(status) ? (loader) : accessible ? (React.createElement(Outlet, null)) : null;
+    return accessible === undefined && [QueryStatus.IDLE, QueryStatus.LOADING].includes(status)
+        ? loader
+        : accessible
+            ? children
+            : null;
 };
 export { CheckoutAccessibilityMiddleware };

package/dist/infrastructure/ui/routing/CheckoutMiddleware.d.ts

@@ -1,7 +1,9 @@
 import { FC } from "react";
 interface CheckoutMiddlewareProps {
+    readonly basePath: string;
     readonly customerId: string;
     readonly loader?: JSX.Element;
+    readonly children: JSX.Element;
 }
 declare const CheckoutMiddleware: FC<CheckoutMiddlewareProps>;
 export { CheckoutMiddleware };

package/dist/infrastructure/ui/routing/CheckoutMiddleware.js

@@ -1,19 +1,19 @@
 import { QueryStatus } from "@lookiero/messaging-react";
 import React, { useRef } from "react";
-import { generatePath, Navigate, Outlet, useMatch } from "react-router-native";
+import { generatePath, Navigate, useMatch } from "react-router-native";
 import { CheckoutItemStatus } from "../../../domain/checkoutItem/model/checkoutItem";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useShouldIntroBeShown } from "../../projection/uiSetting/react/useShouldIntroBeShown";
 import { Spinner } from "../shared/components/atoms/spinner/Spinner";
 import { Routes } from "./routes";
-const CheckoutMiddleware = ({ customerId, loader = React.createElement(Spinner, null) }) => {
+const CheckoutMiddleware = ({ basePath, customerId, loader = React.createElement(Spinner, null), children }) => {
     const introShown = useRef(false);
     const [shouldIntroBeShown, shouldIntroBeShownStatus] = useShouldIntroBeShown();
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const firstItemWithoutCustomerDecision = checkout?.items.find((item) => [CheckoutItemStatus.EXPIRED, CheckoutItemStatus.INITIAL].includes(item.status));
-    const introRouteMatch = useMatch(Routes.INTRO);
-    const itemRouteMatch = useMatch(Routes.ITEM);
-    const summaryRouteMatch = useMatch(Routes.SUMMARY);
+    const introRouteMatch = useMatch(`${basePath}/${Routes.INTRO}`);
+    const itemRouteMatch = useMatch(`${basePath}/${Routes.ITEM}`);
+    const summaryRouteMatch = useMatch(`${basePath}/${Routes.SUMMARY}`);
     const dependenciesLoadedStatuses = [QueryStatus.ERROR, QueryStatus.SUCCESS];
     const dependenciesLoaded = dependenciesLoadedStatuses.includes(shouldIntroBeShownStatus) &&
         dependenciesLoadedStatuses.includes(checkoutStatus);
@@ -25,23 +25,23 @@ const CheckoutMiddleware = ({ customerId, loader = React.createElement(Spinner,
             introShown.current = true;
         }
         else {
-            return React.createElement(Navigate, { to: Routes.INTRO, replace: true });
+            return React.createElement(Navigate, { to: `${basePath}/${Routes.INTRO}`, replace: true });
         }
     }
     else {
         if (itemRouteMatch) {
             const checkoutItem = checkout?.items.find((item) => item.id === itemRouteMatch.params.id);
             if (!checkoutItem) {
-                return React.createElement(Navigate, { to: Routes.CHECKOUT, replace: true });
+                return React.createElement(Navigate, { to: `${basePath}/${Routes.HOME}`, replace: true });
             }
         }
         if (firstItemWithoutCustomerDecision && !itemRouteMatch) {
-            return React.createElement(Navigate, { to: generatePath(Routes.ITEM, { id: firstItemWithoutCustomerDecision.id }), replace: true });
+            return (React.createElement(Navigate, { to: generatePath(`${basePath}/${Routes.ITEM}`, { id: firstItemWithoutCustomerDecision.id }), replace: true }));
         }
         if (firstItemWithoutCustomerDecision === undefined && !summaryRouteMatch) {
-            return React.createElement(Navigate, { to: Routes.SUMMARY, replace: true });
+            return React.createElement(Navigate, { to: `${basePath}/${Routes.SUMMARY}`, replace: true });
         }
     }
-    return React.createElement(Outlet, null);
+    return children;
 };
 export { CheckoutMiddleware };

package/dist/infrastructure/ui/routing/Routing.d.ts

@@ -5,6 +5,7 @@ interface RoutingProps {
     readonly customerId: string | undefined;
     readonly locale: string;
     readonly I18n: I18n;
+    readonly basePath?: string;
     readonly onI18nError?: (err: Error) => void;
 }
 declare const Routing: FC<RoutingProps>;

package/dist/infrastructure/ui/routing/Routing.js

@@ -8,52 +8,37 @@ import { Routes } from "./routes";
 const Intro = lazy(() => import("../views/intro/Intro").then((module) => ({ default: module.Intro })));
 const Item = lazy(() => import("../views/item/Item").then((module) => ({ default: module.Item })));
 const Summary = lazy(() => import("../views/summary/Summary").then((module) => ({ default: module.Summary })));
-const Routing = ({ onNotAccessible, customerId, locale, I18n, onI18nError }) => {
+const Routing = ({ basePath = "", onNotAccessible, customerId, locale, I18n, onI18nError }) => {
     const routes = useRoutes([
         {
-            path: Routes.CHECKOUT,
-            element: React.createElement(CheckoutAccessibilityMiddleware, { customerId: customerId, onNotAccessible: onNotAccessible }),
+            path: "",
+            element: (React.createElement(CheckoutAccessibilityMiddleware, { customerId: customerId, onNotAccessible: onNotAccessible },
+                React.createElement(I18n, { loader: React.createElement(Spinner, null), locale: locale, onError: onI18nError },
+                    React.createElement(CheckoutMiddleware, { basePath: basePath, customerId: customerId },
+                        React.createElement(App, null,
+                            React.createElement(Outlet, null)))))),
             children: [
                 {
-                    path: "",
-                    element: (React.createElement(I18n, { loader: React.createElement(Spinner, null), locale: locale, onError: onI18nError },
-                        React.createElement(Outlet, null))),
-                    children: [
-                        {
-                            path: "",
-                            element: React.createElement(CheckoutMiddleware, { customerId: customerId }),
-                            children: [
-                                {
-                                    path: "",
-                                    element: React.createElement(App, null),
-                                    children: [
-                                        {
-                                            path: Routes.INTRO,
-                                            element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                                                React.createElement(Intro, { customerId: customerId }))),
-                                        },
-                                        {
-                                            path: Routes.ITEM,
-                                            element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                                                React.createElement(Item, { customerId: customerId }))),
-                                        },
-                                        {
-                                            path: Routes.SUMMARY,
-                                            element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                                                React.createElement(Summary, { customerId: customerId }))),
-                                        },
-                                    ],
-                                },
-                            ],
-                        },
-                    ],
+                    path: Routes.INTRO,
+                    element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
+                        React.createElement(Intro, { customerId: customerId }))),
+                },
+                {
+                    path: Routes.ITEM,
+                    element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
+                        React.createElement(Item, { customerId: customerId }))),
+                },
+                {
+                    path: Routes.SUMMARY,
+                    element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
+                        React.createElement(Summary, { customerId: customerId }))),
+                },
+                {
+                    path: "*",
+                    element: React.createElement(Navigate, { to: `${Routes.HOME}`, replace: true }),
                 },
             ],
         },
-        {
-            path: "*",
-            element: React.createElement(Navigate, { to: Routes.CHECKOUT, replace: true }),
-        },
     ]);
     return routes;
 };

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

@@ -1,6 +1,6 @@
 export declare enum Routes {
-    CHECKOUT = "/checkout",
-    INTRO = "/checkout/intro",
-    ITEM = "/checkout/item/:id",
-    SUMMARY = "/checkout/summary"
+    HOME = "",
+    INTRO = "intro",
+    ITEM = "item/:id",
+    SUMMARY = "summary"
 }

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

@@ -1,7 +1,7 @@
 export var Routes;
 (function (Routes) {
-    Routes["CHECKOUT"] = "/checkout";
-    Routes["INTRO"] = "/checkout/intro";
-    Routes["ITEM"] = "/checkout/item/:id";
-    Routes["SUMMARY"] = "/checkout/summary";
+    Routes["HOME"] = "";
+    Routes["INTRO"] = "intro";
+    Routes["ITEM"] = "item/:id";
+    Routes["SUMMARY"] = "summary";
 })(Routes || (Routes = {}));

package/dist/infrastructure/ui/views/App.d.ts

@@ -1,3 +1,6 @@
 import { FC } from "react";
-declare const App: FC;
+interface AppProps {
+    readonly children: JSX.Element;
+}
+declare const App: FC<AppProps>;
 export { App };

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

@@ -1,8 +1,6 @@
 import { PortalProvider } from "@gorhom/portal";
 import React from "react";
 import { SafeAreaProvider } from "react-native-safe-area-context";
-import { Outlet } from "react-router-native";
-const App = () => (React.createElement(SafeAreaProvider, null,
-    React.createElement(PortalProvider, null,
-        React.createElement(Outlet, null))));
+const App = ({ children }) => (React.createElement(SafeAreaProvider, null,
+    React.createElement(PortalProvider, null, children)));
 export { App };

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

@@ -1,5 +1,5 @@
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { View } from "react-native";
 import { useParams } from "react-router-native";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
@@ -12,6 +12,7 @@ import { useViewBookedSizeChangeProductsVariantsForCheckoutItem } from "../../..
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useListReturnQuestionsByCheckoutItemId } from "../../../projection/returnQuestion/react/useListReturnQuestionsByCheckoutItemId";
 import { Body } from "../../components/layouts/body/Body";
+import { ReturnQuestionFeedbackProvider } from "../../components/organisms/returnQuestions/behaviors/useReturnQuestionFeedback";
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
 import { Spinner } from "../../shared/components/atoms/spinner/Spinner";
 import { style } from "./Item.style";
@@ -39,7 +40,6 @@ const Item = ({ customerId }) => {
         checkoutItemId: checkoutItem.id,
     });
     const [bookCheckouBooking] = useBookCheckouBookingForCheckoutItem({
-        checkoutBookingId: bookedSizeChangeProductsVariants?.id,
         checkoutItemId: checkoutItem.id,
     });
     const [returnQuestions, returnQuestionsStatus] = useListReturnQuestionsByCheckoutItemId({
@@ -55,21 +55,29 @@ const Item = ({ customerId }) => {
     const [stickyHeight, setStickyHeight] = useState(0);
     const handleOnStickyLayout = useCallback(({ height }) => setStickyHeight(height), []);
     useEffect(() => {
-        checkout?.bookingId === undefined && bookCheckouBooking();
-    }, [bookCheckouBooking, checkout?.bookingId]);
+        bookedSizeChangeProductsVariants === null && bookCheckouBooking();
+    }, [bookCheckouBooking, bookedSizeChangeProductsVariants, bookedSizeChangeProductsVariants?.bookingId]);
     const [returnQuestionsVisible, setReturnQuestionsVisible] = useState(false);
     const handleOnShowReturnQuestions = useCallback(() => setReturnQuestionsVisible(true), []);
     const handleOnHideReturnQuestions = useCallback(() => setReturnQuestionsVisible(false), []);
     const handleOnEditFeedback = useCallback(() => handleOnShowReturnQuestions(), [handleOnShowReturnQuestions]);
-    const handleOnSubmit = useCallback((feedback) => {
+    const handleOnSubmit = useCallback((feedbacks) => {
         handleOnHideReturnQuestions();
-        returnCheckoutItem({ feedbacks: feedback });
+        returnCheckoutItem({ feedbacks });
     }, [handleOnHideReturnQuestions, returnCheckoutItem]);
     const handleOnReplace = useCallback((replacedFor) => {
         handleOnShowSizeChangeModal();
         replaceCheckoutItem({ replacedFor });
     }, [handleOnShowSizeChangeModal, replaceCheckoutItem]);
     const handleOnReturn = useCallback(() => handleOnShowReturnQuestions(), [handleOnShowReturnQuestions]);
+    const productVariantSelected = useMemo(() => checkoutItem.replacedFor
+        ? bookedSizeChangeProductsVariants?.productVariants.find((productVariant) => productVariant.id === checkoutItem.replacedFor)
+        : { id: checkoutItem.productVariant.id, size: checkoutItem.productVariant.size }, [
+        bookedSizeChangeProductsVariants?.productVariants,
+        checkoutItem.productVariant.id,
+        checkoutItem.productVariant.size,
+        checkoutItem.replacedFor,
+    ]);
     const dependenciesLoadedStatuses = [QueryStatus.ERROR, QueryStatus.SUCCESS];
     const dependenciesLoaded = dependenciesLoadedStatuses.includes(returnQuestionsStatus) &&
         dependenciesLoadedStatuses.includes(checkoutStatus) &&
@@ -77,8 +85,8 @@ const Item = ({ customerId }) => {
     if (!dependenciesLoaded)
         return React.createElement(Spinner, null);
     const { price } = checkoutItem;
-    const { media, brand, name, size, color } = checkoutItem.productVariant;
-    return (React.createElement(React.Fragment, null,
+    const { media, brand, name, color } = checkoutItem.productVariant;
+    return (React.createElement(ReturnQuestionFeedbackProvider, { feedback: checkoutItem.feedbacks || {} },
         React.createElement(SizeWithoutStockModal, { visible: sizeWithoutStockModalVisible, onDismiss: handleOnHideSizeWithoutStockModal }),
         React.createElement(SizeChangeModal, { visible: sizeChangeModalVisible, onDismiss: handleOnHideSizeChangeModal }),
         React.createElement(SafeAreaScrollView, null,
@@ -87,10 +95,10 @@ const Item = ({ customerId }) => {
                 React.createElement(View, { style: [style.container, { paddingBottom: stickyHeight }] },
                     React.createElement(View, { style: style.sliderContainer },
                         React.createElement(ProductVariantSlider, { producVariantMedia: media })),
-                    React.createElement(ProductVariantDescription, { brand: brand, color: color, name: name, price: price, size: size }),
-                    checkoutItem.feedback && (React.createElement(View, { style: style.feedbackContainer },
-                        React.createElement(ReturnQuestionsFeedback, { feedback: checkoutItem.feedback || {}, returnQuestions: returnQuestions || [], onEditFeedback: handleOnEditFeedback })))))),
-        customerDecissionMade && (React.createElement(ItemActions, { keepButtonLoading: keepCheckoutItemStatus === CommandStatus.LOADING, productVariantSelected: checkoutItem.productVariant, productVariants: bookedSizeChangeProductsVariants?.productVariants || [], returnButtonLoading: returnCheckoutItemStatus === CommandStatus.LOADING, sizeSelectorDisabled: replaceCheckoutItemStatus === CommandStatus.LOADING, onKeep: keepCheckoutItem, onLayout: handleOnStickyLayout, onReplace: handleOnReplace, onReturn: handleOnReturn, onSizeSelectorPress: handleOnShowSizeWithoutStockModal })),
-        React.createElement(ReturnQuestionsForm, { checkoutItemPrice: checkoutItem.price, feedback: checkoutItem.feedback || {}, productVariant: checkoutItem.productVariant, returnQuestions: returnQuestions || [], visible: returnQuestionsVisible, onClose: handleOnHideReturnQuestions, onSubmit: handleOnSubmit })));
+                    React.createElement(ProductVariantDescription, { brand: brand, color: color, name: name, price: price, size: productVariantSelected.size }),
+                    checkoutItem.status === CheckoutItemStatus.RETURNED && (React.createElement(View, { style: style.feedbackContainer },
+                        React.createElement(ReturnQuestionsFeedback, { returnQuestions: returnQuestions || [], onEditFeedback: handleOnEditFeedback })))))),
+        customerDecissionMade && (React.createElement(ItemActions, { keepButtonLoading: keepCheckoutItemStatus === CommandStatus.LOADING, productVariantSelected: productVariantSelected, productVariants: bookedSizeChangeProductsVariants?.productVariants || [], returnButtonLoading: returnCheckoutItemStatus === CommandStatus.LOADING, sizeSelectorDisabled: replaceCheckoutItemStatus === CommandStatus.LOADING, onKeep: keepCheckoutItem, onLayout: handleOnStickyLayout, onReplace: handleOnReplace, onReturn: handleOnReturn, onSizeSelectorPress: handleOnShowSizeWithoutStockModal })),
+        React.createElement(ReturnQuestionsForm, { checkoutItemPrice: checkoutItem.price, productVariant: checkoutItem.productVariant, returnQuestions: returnQuestions || [], visible: returnQuestionsVisible, onClose: handleOnHideReturnQuestions, onSubmit: handleOnSubmit })));
 };
 export { Item };

package/dist/infrastructure/ui/views/item/components/itemActions/ItemActions.d.ts

@@ -1,10 +1,9 @@
 import { FC } from "react";
 import { ProductVariantProjection } from "../../../../../../projection/bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants";
-import { CheckoutItemProductVariantProjection } from "../../../../../../projection/checkoutItem/checkoutItem";
 import { Layout } from "../../../../shared/components/layouts/sticky/Sticky";
 interface ItemActionsProps {
     readonly productVariants: ProductVariantProjection[];
-    readonly productVariantSelected: CheckoutItemProductVariantProjection;
+    readonly productVariantSelected: ProductVariantProjection;
     readonly keepButtonLoading?: boolean;
     readonly returnButtonLoading?: boolean;
     readonly sizeSelectorDisabled?: boolean;

package/dist/infrastructure/ui/views/item/components/itemActions/ItemActions.js

@@ -12,9 +12,7 @@ const ItemActions = ({ productVariants, productVariantSelected, keepButtonLoadin
     const sizeSelectorLabelText = useI18nMessage({ id: I18nMessages.ITEM_SIZES_LABEL });
     const keepButtonText = useI18nMessage({ id: I18nMessages.ITEM_KEEP_BUTTON });
     const returnButtonText = useI18nMessage({ id: I18nMessages.ITEM_RETURN_BUTTON });
-    const sizeSelectorOptions = useMemo(() => productVariants
-        .map((productVariant) => ({ label: productVariant.size.lookiero, value: productVariant.id }))
-        .concat({ label: productVariantSelected.size.lookiero, value: productVariantSelected.id }), [productVariantSelected.id, productVariantSelected.size.lookiero, productVariants]);
+    const sizeSelectorOptions = useMemo(() => productVariants.map((productVariant) => ({ label: productVariant.size.lookiero, value: productVariant.id })), [productVariants]);
     const disabledSizeSelector = useMemo(() => sizeSelectorOptions.length === 1 && sizeSelectorOptions[0]?.value === productVariantSelected.id, [sizeSelectorOptions, productVariantSelected.id]);
     const handleOnPressSizeSelector = useCallback(() => onSizeSelectorPress(), [onSizeSelectorPress]);
     return (React.createElement(Sticky, { onLayout: onLayout },

package/dist/infrastructure/ui/views/item/components/returnQuestionsFeedback/ReturnQuestionsFeedback.d.ts

@@ -1,8 +1,6 @@
 import { FC } from "react";
-import { FeedbackProjection } from "../../../../../../projection/feedback/feedback";
 import { ReturnQuestionProjection } from "../../../../../../projection/returnQuestion/returnQuestion";
 interface ReturnQuestionsFeedbackProps {
-    readonly feedback: FeedbackProjection;
     readonly returnQuestions: ReturnQuestionProjection[];
     readonly onEditFeedback: () => void;
 }

package/dist/infrastructure/ui/views/item/components/returnQuestionsFeedback/ReturnQuestionsFeedback.js

@@ -4,7 +4,6 @@ import React from "react";
 import { View } from "react-native";
 import { ReturnQuestionType, } from "../../../../../../projection/returnQuestion/returnQuestion";
 import { ReturnQuestions } from "../../../../components/organisms/returnQuestions/ReturnQuestions";
-import { ReturnQuestionFeedbackProvider } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionFeedback";
 import { ReturnQuestionItemProvider, } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionItem";
 import { HostDefaultReturnQuestionFeedbackItem } from "../../../../components/organisms/returnQuestions/components/hostDefaultReturnQuestionFeedbackItem/HostDefaultReturnQuestionFeedbackItem";
 import { ReturnQuestionFeedbackItem } from "../../../../components/organisms/returnQuestions/components/returnQuestionFeedbackItem/ReturnQuestionFeedbackItem";
@@ -13,20 +12,19 @@ import { ButtonIcon } from "../../../../shared/components/molecules/buttonIcon/B
 import { style } from "./ReturnQuestionsFeedback.style";
 const returnQuestionItems = {
     [ReturnQuestionType.HOST_DEFAULT]: HostDefaultReturnQuestionFeedbackItem,
-    [ReturnQuestionType.HOST_TEXTAREA]: HostDefaultReturnQuestionFeedbackItem,
+    [ReturnQuestionType.HOST_TEXTAREA]: ReturnQuestionFeedbackItem,
     [ReturnQuestionType.HOST_SELECT]: ReturnQuestionFeedbackItem,
     [ReturnQuestionType.HOST_STACK]: ReturnQuestionFeedbackItem,
     [ReturnQuestionType.TEXTAREA]: ReturnQuestionFeedbackItem,
     [ReturnQuestionType.OPTION]: ReturnQuestionFeedbackItem,
 };
-const ReturnQuestionsFeedback = ({ feedback, returnQuestions, onEditFeedback }) => {
+const ReturnQuestionsFeedback = ({ returnQuestions, onEditFeedback }) => {
     const titleText = useI18nMessage({ id: I18nMessages.FEEDBACK_TITLE, prefix: RETURN_QUESTIONS_FEEDBACK_PREFIX });
     return (React.createElement(View, null,
         React.createElement(View, { style: style.titleContainer },
             React.createElement(Text, { level: 2, style: style.title }, titleText),
             React.createElement(ButtonIcon, { name: "pencil", onPress: onEditFeedback })),
-        React.createElement(ReturnQuestionFeedbackProvider, { feedback: feedback },
-            React.createElement(ReturnQuestionItemProvider, { returnQuestionItems: returnQuestionItems },
-                React.createElement(ReturnQuestions, { returnQuestions: returnQuestions })))));
+        React.createElement(ReturnQuestionItemProvider, { returnQuestionItems: returnQuestionItems },
+            React.createElement(ReturnQuestions, { returnQuestions: returnQuestions }))));
 };
 export { ReturnQuestionsFeedback };

package/dist/infrastructure/ui/views/item/components/returnQuestionsForm/ReturnQuestionsForm.d.ts

@@ -5,7 +5,6 @@ import { ReturnQuestionProjection } from "../../../../../../projection/returnQue
 import { PriceProjection } from "../../../../../../projection/shared/price";
 interface ReturnQuestionsFormProps {
     readonly visible: boolean;
-    readonly feedback: FeedbackProjection;
     readonly returnQuestions: ReturnQuestionProjection[];
     readonly checkoutItemPrice: PriceProjection;
     readonly productVariant: CheckoutItemProductVariantProjection;

package/dist/infrastructure/ui/views/item/components/returnQuestionsForm/ReturnQuestionsForm.js

@@ -6,7 +6,7 @@ import React, { useCallback } from "react";
 import { View } from "react-native";
 import { ReturnQuestionType, } from "../../../../../../projection/returnQuestion/returnQuestion";
 import { ReturnQuestions } from "../../../../components/organisms/returnQuestions/ReturnQuestions";
-import { ReturnQuestionFeedbackProvider } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionFeedback";
+import { useReturnQuestionFeedback } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionFeedback";
 import { ReturnQuestionItemProvider, } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionItem";
 import { HostDefaultReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem";
 import { HostSelectReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem";
@@ -26,21 +26,21 @@ const returnQuestionItems = {
     [ReturnQuestionType.TEXTAREA]: TextareaReturnQuestionItem,
     [ReturnQuestionType.OPTION]: OptionReturnQuestionItem,
 };
-const ReturnQuestionsForm = ({ feedback, returnQuestions, checkoutItemPrice, productVariant, visible, onSubmit, onClose, }) => {
+const ReturnQuestionsForm = ({ returnQuestions, checkoutItemPrice, productVariant, visible, onSubmit, onClose, }) => {
     const titleText = useI18nMessage({ id: I18nMessages.RETURN_QUESTIONS_TITLE, prefix: RETURN_QUESTIONS_PREFIX });
     const submitButtonText = useI18nMessage({
         id: I18nMessages.RETURN_QUESTIONS_SUBMIT_BUTTON,
         prefix: RETURN_QUESTIONS_PREFIX,
     });
     const { media, brand, name, size, color } = productVariant;
+    const feedback = useReturnQuestionFeedback();
     const handleOnSubmit = useCallback(() => onSubmit(feedback), [feedback, onSubmit]);
-    return (React.createElement(ReturnQuestionFeedbackProvider, { feedback: feedback },
-        React.createElement(ReturnQuestionItemProvider, { returnQuestionItems: returnQuestionItems },
-            React.createElement(PortalHost, { name: RETURN_QUESTION_FORM_PORTAL_HOST_NAME }),
-            React.createElement(Modal, { footer: React.createElement(Button, { onPress: handleOnSubmit }, submitButtonText), portalHostName: RETURN_QUESTION_FORM_PORTAL_HOST_NAME, visible: visible, scroll: true, showCloseButton: true, onClose: onClose },
-                React.createElement(View, { style: style.returnQuestionsContainer },
-                    React.createElement(Text, { level: 2, style: style.title }, titleText),
-                    React.createElement(ProductVariant, { brand: brand, color: color, media: media, name: name, price: checkoutItemPrice, size: size }),
-                    React.createElement(ReturnQuestions, { portalHostName: RETURN_QUESTION_FORM_PORTAL_HOST_NAME, returnQuestions: returnQuestions }))))));
+    return (React.createElement(ReturnQuestionItemProvider, { returnQuestionItems: returnQuestionItems },
+        React.createElement(PortalHost, { name: RETURN_QUESTION_FORM_PORTAL_HOST_NAME }),
+        React.createElement(Modal, { footer: React.createElement(Button, { onPress: handleOnSubmit }, submitButtonText), portalHostName: RETURN_QUESTION_FORM_PORTAL_HOST_NAME, visible: visible, scroll: true, showCloseButton: true, onClose: onClose },
+            React.createElement(View, { style: style.returnQuestionsContainer },
+                React.createElement(Text, { level: 2, style: style.title }, titleText),
+                React.createElement(ProductVariant, { brand: brand, color: color, media: media, name: name, price: checkoutItemPrice, size: size }),
+                React.createElement(ReturnQuestions, { portalHostName: RETURN_QUESTION_FORM_PORTAL_HOST_NAME, returnQuestions: returnQuestions })))));
 };
 export { ReturnQuestionsForm };

package/dist/projection/bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants.d.ts

@@ -4,10 +4,7 @@ interface ProductVariantProjection {
     readonly size: SizeProjection;
 }
 interface BookedSizeChangeProductsVariantsProjection {
-    readonly id: string;
-    readonly checkoutId: string;
-    readonly checkoutItemId: string;
-    readonly booking: string | null;
+    readonly bookingId: string;
     readonly productVariants: ProductVariantProjection[];
 }
 export type { BookedSizeChangeProductsVariantsProjection, ProductVariantProjection };

package/dist/projection/checkoutItem/checkoutItem.d.ts

@@ -39,7 +39,7 @@ interface CheckoutItemProjection {
     readonly price: PriceProjection;
     readonly replacedFor?: string;
     readonly productVariant: CheckoutItemProductVariantProjection;
-    readonly feedback: FeedbackProjection;
+    readonly feedbacks: FeedbackProjection;
 }
 export type { CheckoutItemProjection, CheckoutItemProductVariantProjection, ColorProjection, MediaProjection };
 export { MediaPerspective };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "0.2.52",
+  "version": "0.3.1",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
@@ -16,7 +16,7 @@
     "web": "expo start --web",
     "export-analyze-web": "BUNDLE_ANALYZE=true NODE_ENV=production expo export:web",
     "build": "tsc -b tsconfig.build.json",
-    "build:app": "tsc -p ./tsconfig.build-app.json --noemit && ENTRY_POINT='./src/Expo.tsx' NODE_ENV=production expo export:web --clear",
+    "build:app": "tsc -p ./tsconfig.build-app.json --noemit && ENTRY_POINT='./src/Expo.tsx' NODE_ENV=production expo export:web --clear 2> /dev/null",
     "lint": "eslint --fix --cache --cache-location ./node_modules/.cache/.eslintcache --ext ts,tsx .",
     "format": "prettier --write \"**/*.+(json|css|ts|tsx|md)\"",
     "test": "tsc -p ./tsconfig.test.json --noemit && jest",