@lookiero/checkout 7.0.0-beta.0 → 7.0.1-beta.0

package/dist/src/infrastructure/ui/views/return/components/returnQuestionsForm/ReturnQuestionsForm.style.d.ts

@@ -0,0 +1,40 @@
+declare const style: {
+    description: {
+        color: string;
+    };
+    desktopInfo: {
+        borderTopLeftRadius: number;
+        borderTopRightRadius: number;
+    };
+    desktopLayoutSpacing: {
+        paddingVertical: number;
+    };
+    headerWrapper: {
+        display: "flex";
+        flexDirection: "column";
+    };
+    info: {
+        backgroundColor: string;
+        paddingBottom: number;
+        paddingHorizontal: number;
+        paddingTop: number;
+    };
+    layout: {
+        flex: number;
+        justifyContent: "center";
+    };
+    safeAreaView: {
+        backgroundColor: string;
+        flex: number;
+    };
+    scrollView: {
+        flex: number;
+    };
+    submit: {
+        backgroundColor: string;
+        borderBottomLeftRadius: number;
+        borderBottomRightRadius: number;
+        padding: number;
+    };
+};
+export { style };

package/dist/src/infrastructure/ui/views/return/components/returnQuestionsForm/ReturnQuestionsForm.style.js

@@ -0,0 +1,43 @@
+import { StyleSheet } from "react-native";
+import { theme } from "@lookiero/sty-psp-ui";
+const { borderRadius5, colorBgPrimaryLight, colorBgBase, colorTextMedium, space4, space6, space8 } = theme();
+const style = StyleSheet.create({
+    description: {
+        color: colorTextMedium,
+    },
+    desktopInfo: {
+        borderTopLeftRadius: borderRadius5,
+        borderTopRightRadius: borderRadius5,
+    },
+    desktopLayoutSpacing: {
+        paddingVertical: space8,
+    },
+    headerWrapper: {
+        display: "flex",
+        flexDirection: "column",
+    },
+    info: {
+        backgroundColor: colorBgBase,
+        paddingBottom: space4,
+        paddingHorizontal: space6,
+        paddingTop: space8,
+    },
+    layout: {
+        flex: 1,
+        justifyContent: "center",
+    },
+    safeAreaView: {
+        backgroundColor: colorBgPrimaryLight,
+        flex: 1,
+    },
+    scrollView: {
+        flex: 1,
+    },
+    submit: {
+        backgroundColor: colorBgBase,
+        borderBottomLeftRadius: borderRadius5,
+        borderBottomRightRadius: borderRadius5,
+        padding: space6,
+    },
+});
+export { style };

package/dist/src/infrastructure/ui/views/summary/Summary.js

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { Platform, ScrollView, View } from "react-native";
 import { generatePath, useMatch, useNavigate } from "react-router-native";
-import { Box, Text, Layout, useDevice, Spinner } from "@lookiero/aurora";
+import { Box, Text, Layout as AuroraLayout, useDevice, Spinner } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { QueryStatus } from "@lookiero/messaging-react";
 import { Sticky } from "@lookiero/sty-psp-ui";
@@ -21,7 +21,7 @@ import { Routes } from "../../routing/routes";
 import { useBasePath } from "../../routing/useBasePath";
 import { style } from "./Summary.style";
 import { CollapsiblePricing } from "./components/collapsiblePricing/CollapsiblePricing";
-const Summary = ({ layout: UiLayout, children }) => {
+const Summary = ({ layout: Layout, children }) => {
     const { customer: { customerId, country, segment }, } = useStaticInfo();
     const [pricingCollapsed, setPricingCollapsed] = useState(true);
     const [pricingHeight, setPricingHeight] = useState(0);
@@ -79,13 +79,13 @@ const Summary = ({ layout: UiLayout, children }) => {
     if (!dependenciesLoaded) {
         return React.createElement(Spinner, null);
     }
-    return (React.createElement(UiLayout, { scrollEnabled: false, style: {
+    return (React.createElement(Layout, { scrollEnabled: false, style: {
             header: style.header,
             scrollView: style.scrollView,
         } },
         React.createElement(ScrollView, { showsVerticalScrollIndicator: false },
             fiveItemsDiscount !== 0 && React.createElement(FiveItemsDiscountBanner, { fiveItemsDiscount: fiveItemsDiscount }),
-            React.createElement(Layout, { fullWidth: !screen.L, style: [screen.L && style.desktopLayoutSpacing, !screen.L && { paddingBottom: pricingHeight }] },
+            React.createElement(AuroraLayout, { fullWidth: !screen.L, style: [screen.L && style.desktopLayoutSpacing, !screen.L && { paddingBottom: pricingHeight }] },
                 React.createElement(Box, { size: { L: "2/3" }, style: screen.L && style.desktopListSpacing },
                     React.createElement(View, { style: [style.contentWrapper, screen.L && style.desktopContentWrapper] },
                         React.createElement(View, { style: !screen.L && style.mobileInfo },

package/dist/src/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "7.0.0-beta.0";
+export declare const VERSION = "7.0.1-beta.0";

package/dist/src/version.js

@@ -1 +1 @@
-export const VERSION = "7.0.0-beta.0";
+export const VERSION = "7.0.1-beta.0";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "7.0.0-beta.0",
+  "version": "7.0.1-beta.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "sideEffects": "false",

package/src/ExpoRoot.tsx

@@ -117,14 +117,7 @@ setPaymentsBridge({
 
 const kameleoonConfig: KameleoonEnvironment = {
   siteCode: "aplm4v3ckn",
-  experiments: {
-    newFeedback: {
-      id: "245000",
-      variations: {
-        v1: "964072",
-      },
-    },
-  },
+  experiments: {},
 };
 
 // const { Component: Messaging } = checkoutMockBootstrap();

package/src/infrastructure/ab-testing/kameleoonEnvironment.ts

@@ -1,13 +1,9 @@
-interface Experiment {
-  readonly id: string;
-  readonly variations: Record<string, string>;
-}
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+interface Experiments {}
 
 interface KameleoonEnvironment {
   readonly siteCode: string;
-  readonly experiments: {
-    readonly newFeedback: Experiment;
-  };
+  readonly experiments: Experiments;
 }
 
 export type { KameleoonEnvironment };

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem.style.ts

@@ -4,16 +4,10 @@ import { theme } from "@lookiero/sty-psp-ui";
 const { colorBgBase, space4, space6 } = theme();
 
 const style = StyleSheet.create({
-  allOptionsTitle: {
-    display: "none",
-  },
-  formTitle: {
-    paddingLeft: space6,
-  },
   title: {
     backgroundColor: colorBgBase,
     paddingBottom: space4,
-    paddingRight: space6,
+    paddingHorizontal: space6,
     paddingTop: space6,
   },
 });

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem.test.tsx

@@ -12,11 +12,6 @@ jest.mock("../../behaviors/useReturnQuestionFeedback", () => ({
   useReturnQuestionFeedbackForReturnQuestion: () => ({ feedback: "", onChange: mockOnChange }),
 }));
 
-jest.mock("../../../../../hooks/useNewFeedbackExperiment", () => ({
-  ...jest.requireActual("../../../../../hooks/useNewFeedbackExperiment"),
-  useNewFeedbackExperiment: () => "control",
-}));
-
 const returnQuestion: ReturnQuestionProjection = {
   id: "9251dc2c-d76a-484d-9299-346929af932f",
   name: "size_large",

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem.tsx

@@ -1,10 +1,6 @@
 import React from "react";
 import { Text, View } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
-import {
-  NewFeedbackExperimentVariation,
-  useNewFeedbackExperiment,
-} from "../../../../../hooks/useNewFeedbackExperiment";
 import { I18nMessages } from "../../../../../i18n/i18n";
 import { ReturnQuestionItem, ReturnQuestionItemProps } from "../ReturnQuestionItem";
 import { style } from "./HostDefaultReturnQuestionItem.style";
@@ -13,21 +9,10 @@ const HostDefaultReturnQuestionItem: ReturnQuestionItem = ({ returnQuestion, chi
   const titleText = useI18nMessage({ id: returnQuestion.name });
   const isAllOptions = returnQuestion.name === I18nMessages.RETURN_QUESTION_MAIN_ALL_OPINION;
 
-  /* Kameleoon experiment */
-  const newFeedbackVariation = useNewFeedbackExperiment();
-  const isReturnPage = newFeedbackVariation === NewFeedbackExperimentVariation.RETURN_PAGE;
-  /* Kameleoon experiment */
-
   return (
     <>
-      {titleText && titleText !== " " ? (
-        <View
-          style={[
-            style.title,
-            isAllOptions ? style.allOptionsTitle : undefined,
-            isReturnPage ? style.formTitle : undefined,
-          ]}
-        >
+      {titleText && titleText !== " " && !isAllOptions ? (
+        <View style={style.title}>
           <Text level={3} action>
             {titleText}
           </Text>

package/src/infrastructure/ui/components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem.test.tsx

@@ -12,11 +12,6 @@ jest.mock("../../behaviors/useReturnQuestionFeedback", () => ({
   useReturnQuestionFeedbackForReturnQuestion: () => ({ feedback: "", onChange: mockOnChange }),
 }));
 
-jest.mock("../../../../../hooks/useNewFeedbackExperiment", () => ({
-  ...jest.requireActual("../../../../../hooks/useNewFeedbackExperiment"),
-  useNewFeedbackExperiment: () => "control",
-}));
-
 const returnQuestionParent = {
   id: "0ad1dba8-b02c-4121-a1e3-981f1c30800d",
 } as ReturnQuestionProjection;

package/src/infrastructure/ui/components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem.tsx

@@ -2,10 +2,6 @@ import React, { useCallback, useMemo } from "react";
 import { View } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
 import { InputField } from "../../../../../../../shared/ui/components/molecules/inputField/InputField";
-import {
-  NewFeedbackExperimentVariation,
-  useNewFeedbackExperiment,
-} from "../../../../../hooks/useNewFeedbackExperiment";
 import { useReturnQuestionFeedbackForReturnQuestion } from "../../behaviors/useReturnQuestionFeedback";
 import { ReturnQuestionItem, ReturnQuestionItemProps } from "../ReturnQuestionItem";
 import { style } from "./TextareaReturnQuestionItem.style";
@@ -17,11 +13,6 @@ const TextareaReturnQuestionItem: ReturnQuestionItem = ({
 }: ReturnQuestionItemProps) => {
   const { formatMessage } = useIntl();
 
-  /* Kameleoon experiment */
-  const newFeedbackVariation = useNewFeedbackExperiment();
-  const isReturnPage = newFeedbackVariation === NewFeedbackExperimentVariation.RETURN_PAGE;
-  /* Kameleoon experiment */
-
   const placeholderText = useMemo(
     () => (returnQuestion.placeholder ? formatMessage({ id: returnQuestion.placeholder }) : ""),
     [formatMessage, returnQuestion.placeholder],
@@ -33,18 +24,18 @@ const TextareaReturnQuestionItem: ReturnQuestionItem = ({
     [onChange, returnQuestionParent.id],
   );
 
-  const fieldComponent = (
-    <InputField
-      label={placeholderText}
-      placeholder={placeholderText}
-      testID={testID}
-      value={feedback}
-      multiline
-      onChange={handleOnChange}
-    />
+  return (
+    <View style={style.wrapper}>
+      <InputField
+        label={placeholderText}
+        placeholder={placeholderText}
+        testID={testID}
+        value={feedback}
+        multiline
+        onChange={handleOnChange}
+      />
+    </View>
   );
-
-  return isReturnPage ? <View style={style.wrapper}>{fieldComponent}</View> : fieldComponent;
 };
 
 export { TextareaReturnQuestionItem };

package/src/infrastructure/ui/routing/CheckoutMiddleware.test.tsx

@@ -140,6 +140,16 @@ describe("CheckoutMiddleware component", () => {
     expect(mockStartCheckout).toHaveBeenCalled();
   });
 
+  it("should call onNotAccessible when no checkout is found", async () => {
+    (useViewFirstAvailableCheckoutByCustomerId as jest.Mock).mockReturnValue([null, QueryStatus.SUCCESS]);
+    (useStartCheckout as jest.Mock).mockReturnValue([mockStartCheckout, CommandStatus.SUCCESS]);
+
+    const onNotAccessible = jest.fn();
+    renderCheckoutMiddleware({ path: Routes.HOME, onNotAccessible });
+
+    expect(onNotAccessible).toHaveBeenCalled();
+  });
+
   it("payment route should not be directly accessible", async () => {
     const checkoutMock = checkout({ items: [{ status: CheckoutItemStatus.INITIAL }] });
     (useViewFirstAvailableCheckoutByCustomerId as jest.Mock).mockReturnValue([checkoutMock, QueryStatus.SUCCESS]);

package/src/infrastructure/ui/routing/CheckoutMiddleware.tsx

@@ -117,10 +117,16 @@ const CheckoutMiddleware: FC<CheckoutMiddlewareProps> = ({
     }
   }, [basePath, checkout?.status, checkout?.items]);
 
-  if (!checkout) {
+  if (checkout === undefined) {
     return loader;
   }
 
+  if (checkout === null) {
+    onNotAccessible();
+
+    return null;
+  }
+
   /* Prevent direct payment access */
   if (checkoutPaymentRouteMatch && !checkoutShown.current) {
     onNotAccessible();

package/src/infrastructure/ui/routing/Routing.tsx

@@ -8,7 +8,6 @@ import { Customer } from "../../../projection/shared/customer";
 import { Order } from "../../../projection/shared/order";
 import { Subscription } from "../../../projection/shared/subscription";
 import { KameleoonEnvironment } from "../../ab-testing/kameleoonEnvironment";
-import { NewFeedbackExperimentProvider } from "../hooks/useNewFeedbackExperiment";
 import { StaticInfoProvider } from "../hooks/useStaticInfo";
 import { App } from "../views/App";
 import { Checkout } from "../views/checkout/Checkout";
@@ -64,11 +63,9 @@ const Routing: FC<RoutingProps> = ({
             <I18n loader={<Spinner />} locale={locale} onError={onI18nError}>
               <Kameleoon loader={<Spinner />} siteCode={kameleoon.siteCode}>
                 <CheckoutMiddleware customerId={customer?.customerId as string} onNotAccessible={onNotAccessible}>
-                  <NewFeedbackExperimentProvider>
-                    <App>
-                      <Outlet />
-                    </App>
-                  </NewFeedbackExperimentProvider>
+                  <App>
+                    <Outlet />
+                  </App>
                 </CheckoutMiddleware>
               </Kameleoon>
             </I18n>

package/src/infrastructure/ui/views/checkout/Checkout.tsx

@@ -1,7 +1,7 @@
 import React, { FC, ReactNode, useCallback, useMemo, useState } from "react";
 import { LayoutRectangle, Platform, ScrollView, View } from "react-native";
 import { useNavigate } from "react-router-native";
-import { Box, Button, Layout, Spinner, Text, useDevice } from "@lookiero/aurora";
+import { Box, Button, Layout as AuroraLayout, Spinner, Text, useDevice } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
 import { QueryStatus } from "@lookiero/messaging-react";
 import { Layout as UiLayout, Sticky } from "@lookiero/sty-psp-ui";
@@ -30,7 +30,7 @@ interface CheckoutProps {
   readonly useRedirect: () => Record<string, string>;
 }
 
-const Checkout: FC<CheckoutProps> = ({ children, layout: UiLayout, useRedirect }) => {
+const Checkout: FC<CheckoutProps> = ({ children, layout: Layout, useRedirect }) => {
   const {
     customer: { customerId, country, segment },
   } = useStaticInfo();
@@ -99,7 +99,7 @@ const Checkout: FC<CheckoutProps> = ({ children, layout: UiLayout, useRedirect }
   }
 
   return (
-    <UiLayout
+    <Layout
       header={<CheckoutHeader onBack={handleOnBack} />}
       scrollEnabled={false}
       style={{
@@ -110,7 +110,7 @@ const Checkout: FC<CheckoutProps> = ({ children, layout: UiLayout, useRedirect }
       <ScrollView showsVerticalScrollIndicator={false}>
         {hasReplacedCheckoutItem && <DeliveryBanner />}
 
-        <Layout
+        <AuroraLayout
           fullWidth={!screen.L}
           style={[screen.L && style.desktopLayoutSpacing, !screen.L && { paddingBottom: pricingHeight }]}
         >
@@ -158,7 +158,7 @@ const Checkout: FC<CheckoutProps> = ({ children, layout: UiLayout, useRedirect }
               </View>
             ) : null}
           </Box>
-        </Layout>
+        </AuroraLayout>
       </ScrollView>
 
       {pricing && !screen.L ? (
@@ -172,7 +172,7 @@ const Checkout: FC<CheckoutProps> = ({ children, layout: UiLayout, useRedirect }
       ) : null}
 
       {children}
-    </UiLayout>
+    </Layout>
   );
 };
 

package/src/infrastructure/ui/views/feedback/Feedback.tsx

@@ -2,7 +2,7 @@ import React, { FC, useCallback, useEffect, useRef } from "react";
 import { Spinner } from "@lookiero/aurora";
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import { useLogger } from "@lookiero/sty-psp-logging";
-import { Layout, useScreenSize } from "@lookiero/sty-psp-ui";
+import { Layout as UiLayout, useScreenSize } from "@lookiero/sty-psp-ui";
 import { CheckoutFeedbackProjection } from "../../../../projection/checkoutFeedback/checkoutFeedback";
 import { CheckoutQuestionType } from "../../../../projection/checkoutQuestion/checkoutQuestion";
 import { useGiveCheckoutFeedback } from "../../../domain/checkoutFeedback/react/useGiveCheckoutFeedback";
@@ -28,7 +28,7 @@ interface HandleOnChangedFeedbackFunction {
 }
 
 interface FeedbackProps {
-  readonly layout: Layout;
+  readonly layout: UiLayout;
 }
 
 const Feedback: FC<FeedbackProps> = ({ layout: Layout }) => {

package/src/infrastructure/ui/views/item/Item.test.tsx

@@ -1,4 +1,4 @@
-import { fireEvent, RenderAPI, waitFor, screen, within } from "@testing-library/react-native";
+import { fireEvent, RenderAPI, waitFor, screen } from "@testing-library/react-native";
 import React from "react";
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import { Segment } from "@lookiero/sty-psp-segment";
@@ -9,7 +9,6 @@ import { useBookCheckoutBookingForCheckoutItem } from "../../../domain/checkoutB
 import { useKeepCheckoutItem } from "../../../domain/checkoutItem/react/useKeepCheckoutItem";
 import { useReplaceCheckoutItem } from "../../../domain/checkoutItem/react/useReplaceCheckoutItem";
 import { useResetCheckoutItem } from "../../../domain/checkoutItem/react/useResetCheckoutItem";
-import { useReturnCheckoutItem } from "../../../domain/checkoutItem/react/useReturnCheckoutItem";
 import { bookedProductsVariants as mockBookedProductsVariants } from "../../../projection/bookedProductsVariants/bookedProductsVariants.mock";
 import { useViewBookedProductsVariantsForCheckoutItem } from "../../../projection/bookedProductsVariants/react/useViewBookedProductsVariantsForCheckoutItem";
 import { checkout } from "../../../projection/checkout/checkout.mock";
@@ -32,10 +31,11 @@ jest.mock("../../hooks/useStaticInfo", () => ({
   useStaticInfo: () => ({ customer: { customerId, country, segment } }),
 }));
 
+const mockNavigate = jest.fn();
 jest.mock("react-router-native", () => ({
   ...jest.requireActual("react-router-native"),
   useLocation: () => jest.fn(),
-  useNavigate: () => jest.fn(),
+  useNavigate: () => mockNavigate,
   useMatch: () => false,
   useParams: () => ({ id: mockFirstCheckoutItemId }),
 }));
@@ -45,7 +45,6 @@ jest.mock("../../../projection/checkout/react/useViewIsSizeChangeEnabledByChecko
 jest.mock("../../../projection/returnQuestion/react/useListReturnQuestionsByCheckoutItemId");
 jest.mock("../../../projection/bookedProductsVariants/react/useViewBookedProductsVariantsForCheckoutItem");
 jest.mock("../../../domain/checkoutBooking/react/useBookCheckoutBookingForCheckoutItem");
-jest.mock("../../../domain/checkoutItem/react/useReturnCheckoutItem");
 jest.mock("../../../domain/checkoutItem/react/useKeepCheckoutItem");
 jest.mock("../../../domain/checkoutItem/react/useReplaceCheckoutItem");
 jest.mock("../../../domain/checkoutItem/react/useResetCheckoutItem");
@@ -60,17 +59,8 @@ jest.mock("../../../tracking/useTrackKeepItem", () => ({
 jest.mock("../../../tracking/useTrackReplaceItem", () => ({
   useTrackReplaceItem: () => jest.fn(),
 }));
-const mockTrackReturnItem = jest.fn();
-jest.mock("../../../tracking/useTrackReturnItem", () => ({
-  useTrackReturnItem: () => mockTrackReturnItem,
-}));
 jest.mock("../../../tracking/useTrackItemPageView");
 
-jest.mock("../../hooks/useNewFeedbackExperiment", () => ({
-  ...jest.requireActual("../../hooks/useNewFeedbackExperiment"),
-  useNewFeedbackExperiment: () => "control",
-}));
-
 const mockCheckout = checkout({
   items: [
     { id: mockFirstCheckoutItemId, status: CheckoutItemStatus.INITIAL },
@@ -87,8 +77,6 @@ interface RenderItemFunction {
 
 const renderItem: RenderItemFunction = () => render(<Item layout={DummyLayout} />);
 
-beforeEach(() => mockTrackReturnItem.mockClear());
-
 beforeAll(() => {
   jest.useFakeTimers();
 });
@@ -110,8 +98,6 @@ describe("Item view", () => {
     ]);
     const mockBookCheckoutBookingForCheckoutItem = jest.fn();
     (useBookCheckoutBookingForCheckoutItem as jest.Mock).mockReturnValue([mockBookCheckoutBookingForCheckoutItem]);
-    const mockReturnCheckoutItem = jest.fn();
-    (useReturnCheckoutItem as jest.Mock).mockReturnValue([mockReturnCheckoutItem, CommandStatus.IDLE]);
     (useKeepCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useReplaceCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useResetCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
@@ -133,8 +119,6 @@ describe("Item view", () => {
     ]);
     const mockBookCheckoutBookingForCheckoutItem = jest.fn();
     (useBookCheckoutBookingForCheckoutItem as jest.Mock).mockReturnValue([mockBookCheckoutBookingForCheckoutItem]);
-    const mockReturnCheckoutItem = jest.fn();
-    (useReturnCheckoutItem as jest.Mock).mockReturnValue([mockReturnCheckoutItem, CommandStatus.IDLE]);
     (useKeepCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useReplaceCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useResetCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
@@ -156,31 +140,6 @@ describe("Item view", () => {
     ]);
     const mockBookCheckoutBookingForCheckoutItem = jest.fn();
     (useBookCheckoutBookingForCheckoutItem as jest.Mock).mockReturnValue([mockBookCheckoutBookingForCheckoutItem]);
-    const mockReturnCheckoutItem = jest.fn();
-    (useReturnCheckoutItem as jest.Mock).mockReturnValue([mockReturnCheckoutItem, CommandStatus.IDLE]);
-    (useKeepCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
-    (useReplaceCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
-    (useResetCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
-
-    const { findByTestId } = renderItem();
-    const spinner = await findByTestId("spinner");
-
-    expect(spinner).toBeDefined();
-  });
-
-  it("renders a Spinner while 'returning' the item", async () => {
-    (useViewFiveItemsDiscountByCustomerId as jest.Mock).mockReturnValue([5, QueryStatus.SUCCESS]);
-    (useViewFirstAvailableCheckoutByCustomerId as jest.Mock).mockReturnValue([mockCheckout, QueryStatus.SUCCESS]);
-    (useViewIsSizeChangeEnabledByCheckoutId as jest.Mock).mockReturnValue([true, QueryStatus.SUCCESS]);
-    (useListReturnQuestionsByCheckoutItemId as jest.Mock).mockReturnValue([mockReturnQuestions, QueryStatus.SUCCESS]);
-    (useViewBookedProductsVariantsForCheckoutItem as jest.Mock).mockReturnValue([
-      mockBookedProductsVariants,
-      QueryStatus.SUCCESS,
-    ]);
-    const mockBookCheckoutBookingForCheckoutItem = jest.fn();
-    (useBookCheckoutBookingForCheckoutItem as jest.Mock).mockReturnValue([mockBookCheckoutBookingForCheckoutItem]);
-    const mockReturnCheckoutItem = jest.fn();
-    (useReturnCheckoutItem as jest.Mock).mockReturnValue([mockReturnCheckoutItem, CommandStatus.LOADING]);
     (useKeepCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useReplaceCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useResetCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
@@ -202,8 +161,6 @@ describe("Item view", () => {
     ]);
     const mockBookCheckoutBookingForCheckoutItem = jest.fn();
     (useBookCheckoutBookingForCheckoutItem as jest.Mock).mockReturnValue([mockBookCheckoutBookingForCheckoutItem]);
-    const mockReturnCheckoutItem = jest.fn();
-    (useReturnCheckoutItem as jest.Mock).mockReturnValue([mockReturnCheckoutItem, CommandStatus.IDLE]);
     (useKeepCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useReplaceCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useResetCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
@@ -225,8 +182,6 @@ describe("Item view", () => {
     (useViewBookedProductsVariantsForCheckoutItem as jest.Mock).mockReturnValue([null, QueryStatus.SUCCESS]);
     const mockBookCheckoutBookingForCheckoutItem = jest.fn();
     (useBookCheckoutBookingForCheckoutItem as jest.Mock).mockReturnValue([mockBookCheckoutBookingForCheckoutItem]);
-    const mockReturnCheckoutItem = jest.fn();
-    (useReturnCheckoutItem as jest.Mock).mockReturnValue([mockReturnCheckoutItem, CommandStatus.IDLE]);
     (useKeepCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useReplaceCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useResetCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
@@ -247,8 +202,6 @@ describe("Item view", () => {
     ]);
     const mockBookCheckoutBookingForCheckoutItem = jest.fn();
     (useBookCheckoutBookingForCheckoutItem as jest.Mock).mockReturnValue([mockBookCheckoutBookingForCheckoutItem]);
-    const mockReturnCheckoutItem = jest.fn();
-    (useReturnCheckoutItem as jest.Mock).mockReturnValue([mockReturnCheckoutItem, CommandStatus.IDLE]);
     (useKeepCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useReplaceCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useResetCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
@@ -258,7 +211,7 @@ describe("Item view", () => {
     expect(mockBookCheckoutBookingForCheckoutItem).not.toHaveBeenCalled();
   });
 
-  it("calls returnCheckoutItem and trackReturnCheckoutItem when pressing the return-button", async () => {
+  it("calls navigate to return page when pressing the return-button", async () => {
     (useViewFiveItemsDiscountByCustomerId as jest.Mock).mockReturnValue([5, QueryStatus.SUCCESS]);
     (useViewFirstAvailableCheckoutByCustomerId as jest.Mock).mockReturnValue([mockCheckout, QueryStatus.SUCCESS]);
     (useViewIsSizeChangeEnabledByCheckoutId as jest.Mock).mockReturnValue([true, QueryStatus.SUCCESS]);
@@ -269,26 +222,17 @@ describe("Item view", () => {
     ]);
     const mockBookCheckoutBookingForCheckoutItem = jest.fn();
     (useBookCheckoutBookingForCheckoutItem as jest.Mock).mockReturnValue([mockBookCheckoutBookingForCheckoutItem]);
-    const mockReturnCheckoutItem = jest.fn();
-    (useReturnCheckoutItem as jest.Mock).mockReturnValue([mockReturnCheckoutItem, CommandStatus.IDLE]);
     (useKeepCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useReplaceCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
     (useResetCheckoutItem as jest.Mock).mockReturnValue([jest.fn(), CommandStatus.IDLE]);
 
-    const { findByText, findByTestId } = renderItem();
+    const { findByText } = renderItem();
 
     const returnButton = await findByText(I18nMessages.ITEM_RETURN_BUTTON);
 
     fireEvent.press(returnButton);
 
-    const modal = await findByTestId("return-questions-form-modal");
-
-    const submitButton = await within(modal).findByText(I18nMessages.RETURN_QUESTIONS_SUBMIT_BUTTON);
-
-    fireEvent.press(submitButton);
-
-    expect(mockReturnCheckoutItem).toHaveBeenCalled();
-    expect(mockTrackReturnItem).toHaveBeenCalled();
+    expect(mockNavigate).toHaveBeenCalled();
   });
 
   it("shows discount banner when the user have purchased items", async () => {