@lookiero/checkout 0.8.26 → 0.8.28

package/dist/infrastructure/ui/components/organisms/checkoutQuestions/behaviors/useCheckoutQuestionFeedback.d.ts

@@ -3,12 +3,14 @@ import { CheckoutFeedbackProjection } from "../../../../../../projection/checkou
 interface OnChangeCheckoutQuestionFeedbackFunctionArgs {
     readonly checkoutQuestionId: string;
     readonly checkoutQuestionFeedback: string | undefined;
+    readonly hasFeedback?: boolean;
 }
 interface OnChangeCheckoutQuestionFeedbackFunction {
     (args: OnChangeCheckoutQuestionFeedbackFunctionArgs): void;
 }
 interface CheckoutQuestionFeedbackContextProviderProps {
     readonly feedback: CheckoutFeedbackProjection | undefined;
+    readonly onChanged?: OnChangeCheckoutQuestionFeedbackFunction;
     readonly children: ReactNode;
 }
 declare const CheckoutQuestionFeedbackProvider: FC<CheckoutQuestionFeedbackContextProviderProps>;

package/dist/infrastructure/ui/components/organisms/checkoutQuestions/behaviors/useCheckoutQuestionFeedback.js

@@ -1,11 +1,18 @@
 import React, { createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
 import invariant from "tiny-invariant";
 const CheckoutQuestionFeedbackContext = createContext(null);
-const CheckoutQuestionFeedbackProvider = ({ feedback = {}, children, }) => {
+const CheckoutQuestionFeedbackProvider = ({ feedback = {}, onChanged, children, }) => {
     const [contextFeedback, setContextFeedback] = useState(feedback);
-    const onChange = useCallback(({ checkoutQuestionId, checkoutQuestionFeedback }) => setContextFeedback((feedback) => checkoutQuestionFeedback
-        ? { ...feedback, [checkoutQuestionId]: checkoutQuestionFeedback }
-        : Object.entries(feedback).reduce((acc, [id, feedback]) => (id !== checkoutQuestionId ? { ...acc, [id]: feedback } : acc), {})), []);
+    const onChange = useCallback(({ checkoutQuestionId, checkoutQuestionFeedback }) => {
+        setContextFeedback((feedback) => checkoutQuestionFeedback
+            ? { ...feedback, [checkoutQuestionId]: checkoutQuestionFeedback }
+            : Object.entries(feedback).reduce((acc, [id, feedback]) => (id !== checkoutQuestionId ? { ...acc, [id]: feedback } : acc), {}));
+        onChanged?.({
+            checkoutQuestionId,
+            checkoutQuestionFeedback,
+            hasFeedback: Boolean(contextFeedback[checkoutQuestionId]),
+        });
+    }, [contextFeedback, onChanged]);
     useEffect(() => setContextFeedback(feedback), [feedback]);
     const value = useMemo(() => ({
         feedback: contextFeedback,

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

@@ -19,7 +19,7 @@ const Routing = ({ basePath = "", customer, locale, I18n, menu, tabBar, getAuthT
                 React.createElement(CheckoutAccessibilityMiddleware, { customerId: customer?.customerId, onNotAccessible: onNotAccessible },
                     React.createElement(I18n, { loader: React.createElement(Spinner, null), locale: locale, onError: onI18nError },
                         React.createElement(CheckoutMiddleware, { customerId: customer?.customerId },
-                            React.createElement(App, { customerId: customer?.customerId, menu: menu, tabBar: tabBar },
+                            React.createElement(App, { country: customer?.country, customerId: customer?.customerId, menu: menu, tabBar: tabBar },
                                 React.createElement(Outlet, null))))))),
             children: [
                 {

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

@@ -1,7 +1,9 @@
 import { FC } from "react";
+import { Country } from "../../../projection/shared/country";
 import { Menu, TabBar } from "./navigation/Navigation";
 interface AppProps {
     readonly customerId: string;
+    readonly country: Country;
     readonly menu: Menu;
     readonly tabBar: TabBar;
     readonly children: JSX.Element;

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

@@ -7,9 +7,9 @@ import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
 import { theme } from "../theme/theme";
 import { Navigation } from "./navigation/Navigation";
 const { colorBase } = theme();
-const App = ({ customerId, menu, tabBar, children }) => (React.createElement(SafeAreaProvider, null,
+const App = ({ customerId, country, menu, tabBar, children }) => (React.createElement(SafeAreaProvider, null,
     React.createElement(PortalProvider, null,
         React.createElement(StatusBar, { backgroundColor: colorBase, barStyle: "dark-content", translucent: true }),
         React.createElement(Notifications, { contextId: MESSAGING_CONTEXT_ID }),
-        React.createElement(Navigation, { customerId: customerId, menu: menu, tabBar: tabBar }, children))));
+        React.createElement(Navigation, { country: country, customerId: customerId, menu: menu, tabBar: tabBar }, children))));
 export { App };

package/dist/infrastructure/ui/views/feedback/Feedback.js

@@ -1,8 +1,11 @@
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import React, { useCallback, useEffect, useRef } from "react";
 import { Platform } from "react-native";
+import { CheckoutQuestionType } from "../../../../projection/checkoutQuestion/checkoutQuestion";
 import { useLogger } from "../../../../shared/logging/useLogger";
+import { useTrackChangeFeedback } from "../../../../shared/tracking/infrastructure/useTrackChangeFeedback";
 import { useTrackPageView } from "../../../../shared/tracking/infrastructure/useTrackPageView";
+import { useTrackPressContinue } from "../../../../shared/tracking/infrastructure/useTrackPressContinue";
 import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
 import { useGiveCheckoutFeedback } from "../../../domain/checkoutFeedback/react/useGiveCheckoutFeedback";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
@@ -20,23 +23,45 @@ const Feedback = ({ customerId, country }) => {
     const [checkoutQuestions, checkoutQuestionsStatus] = useListCheckoutQuestionsByCheckoutId({
         checkoutId: checkout?.id,
     });
+    useTrackPageView({
+        page: TrackingPage.FEEDBACK,
+        country,
+        checkoutId: checkout?.id,
+    });
+    const trackChangeFeedback = useTrackChangeFeedback({
+        page: TrackingPage.FEEDBACK,
+        country,
+        checkoutId: checkout?.id,
+    });
+    const handleOnChangedFeedback = useCallback(({ checkoutQuestionId, checkoutQuestionFeedback, hasFeedback }) => {
+        const question = checkoutQuestions?.find((question) => question.id === checkoutQuestionId);
+        if (question?.type === CheckoutQuestionType.HOST_TEXTAREA && hasFeedback) {
+            return;
+        }
+        trackChangeFeedback({
+            questionId: checkoutQuestionId,
+            questionName: question?.name,
+            feedback: checkoutQuestionFeedback,
+        });
+    }, [checkoutQuestions, trackChangeFeedback]);
     const [giveCheckoutFeedback, giveCheckoutFeedbackStatus] = useGiveCheckoutFeedback({
         checkoutId: checkout?.id,
         logger,
     });
     const checkoutFeedbackGivenRef = useRef(false);
+    const trackPressContinue = useTrackPressContinue({
+        page: TrackingPage.FEEDBACK,
+        country,
+        checkoutId: checkout?.id,
+    });
     const handleOnSubmit = useCallback(async (feedbacks) => {
         try {
+            trackPressContinue();
             await giveCheckoutFeedback({ feedbacks });
             checkoutFeedbackGivenRef.current = true;
         }
         catch (e) { }
-    }, [giveCheckoutFeedback]);
-    useTrackPageView({
-        page: TrackingPage.FEEDBACK,
-        country,
-        checkoutId: checkout?.id,
-    });
+    }, [giveCheckoutFeedback, trackPressContinue]);
     /**
      * Give empty feedback when this view is unmounted
      * (if feedback has not already been given)
@@ -50,7 +75,7 @@ const Feedback = ({ customerId, country }) => {
     const dependenciesLoaded = dependenciesLoadedStatuses.includes(checkoutStatus) && dependenciesLoadedStatuses.includes(checkoutQuestionsStatus);
     if (!dependenciesLoaded)
         return React.createElement(Spinner, null);
-    return (React.createElement(CheckoutQuestionFeedbackProvider, { feedback: {} },
+    return (React.createElement(CheckoutQuestionFeedbackProvider, { feedback: {}, onChanged: handleOnChangedFeedback },
         React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0 },
             React.createElement(Body, { style: { column: style.bodyColumn } },
                 React.createElement(CheckoutQuestionsForm, { checkoutQuestions: checkoutQuestions || [], submitButtonDisabled: giveCheckoutFeedbackStatus === CommandStatus.LOADING, onSubmit: handleOnSubmit })))));

package/dist/infrastructure/ui/views/navigation/Navigation.d.ts

@@ -1,4 +1,5 @@
 import { FC, ReactNode } from "react";
+import { Country } from "../../../../projection/shared/country";
 interface MenuProps {
     readonly isVisible: boolean;
     readonly onClose: () => void;
@@ -11,6 +12,7 @@ interface TabBarProps {
 type TabBar = FC<TabBarProps>;
 interface NavigationProps {
     readonly customerId: string;
+    readonly country: Country;
     readonly menu: Menu;
     readonly tabBar: TabBar;
     readonly children: ReactNode;

package/dist/infrastructure/ui/views/navigation/Navigation.js

@@ -1,15 +1,58 @@
 import { usePortal } from "@lookiero/aurora-next/build/contexts/Portal/Portal";
 import React, { useCallback, useState } from "react";
 import { Platform } from "react-native";
+import { useTrackPressBack } from "../../../../shared/tracking/infrastructure/useTrackPressBack";
+import { useTrackPressMenu } from "../../../../shared/tracking/infrastructure/useTrackPressMenu";
+import { useTrackPressNext } from "../../../../shared/tracking/infrastructure/useTrackPressNext";
+import { useTrackPressPrevious } from "../../../../shared/tracking/infrastructure/useTrackPressPrevious";
 import { style } from "./Navigation.style";
 import { Header } from "./components/header/Header";
-const Navigation = ({ customerId, menu, tabBar: TabBar, children }) => {
+const Navigation = ({ customerId, country, menu, tabBar: TabBar, children }) => {
     const [menuVisible, setMenuVisible] = useState(false);
-    const handleOnOpenMenu = useCallback(() => setMenuVisible(true), []);
-    const handleOnCloseMenu = useCallback(() => setMenuVisible(false), []);
+    const trackPressMenu = useTrackPressMenu();
+    const handleOnOpenMenu = useCallback(({ page, checkoutId, open }) => {
+        setMenuVisible(true);
+        trackPressMenu({
+            page,
+            country,
+            checkoutId,
+            open,
+        });
+    }, [country, trackPressMenu]);
+    const handleOnCloseMenu = useCallback(({ page, checkoutId, open }) => {
+        setMenuVisible(false);
+        trackPressMenu({
+            page,
+            country,
+            checkoutId,
+            open,
+        });
+    }, [country, trackPressMenu]);
+    const trackPressBack = useTrackPressBack();
+    const handleOnBack = useCallback(({ page, checkoutId }) => trackPressBack({
+        page,
+        country,
+        checkoutId,
+    }), [country, trackPressBack]);
+    const trackPressNext = useTrackPressNext();
+    const handleOnNext = useCallback(({ page, checkoutId, from, to }) => trackPressNext({
+        page,
+        country,
+        checkoutId,
+        from,
+        to,
+    }), [country, trackPressNext]);
+    const trackPressPrevious = useTrackPressPrevious();
+    const handleOnPrevious = useCallback(({ page, checkoutId, from, to }) => trackPressPrevious({
+        page,
+        country,
+        checkoutId,
+        from,
+        to,
+    }), [country, trackPressPrevious]);
     const { busy } = usePortal();
     return (React.createElement(React.Fragment, null,
-        React.createElement(Header, { customerId: customerId, menu: menu, menuVisible: menuVisible, style: style.header, onCloseMenu: handleOnCloseMenu, onOpenMenu: handleOnOpenMenu }),
+        React.createElement(Header, { customerId: customerId, menu: menu, menuVisible: menuVisible, style: style.header, onBack: handleOnBack, onCloseMenu: handleOnCloseMenu, onNext: handleOnNext, onOpenMenu: handleOnOpenMenu, onPrevious: handleOnPrevious }),
         children,
         Platform.OS !== "web" && React.createElement(TabBar, { isPortalBusy: busy, panel: menuVisible })));
 };

package/dist/infrastructure/ui/views/navigation/components/header/Header.d.ts

@@ -1,12 +1,57 @@
 import { FC } from "react";
 import { StyleProp, ViewStyle } from "react-native";
+import { TrackingPage } from "../../../../../tracking/tracking";
 import { Menu } from "../../Navigation";
+interface OnOpenMenuFunctionArgs {
+    readonly page: TrackingPage;
+    readonly checkoutId: string | undefined;
+    readonly open: boolean;
+}
+interface OnOpenMenuFunction {
+    (args: OnOpenMenuFunctionArgs): void;
+}
+interface OnCloseMenuFunctionArgs {
+    readonly page: TrackingPage;
+    readonly checkoutId: string | undefined;
+    readonly open: boolean;
+}
+interface OnCloseMenuFunction {
+    (args: OnCloseMenuFunctionArgs): void;
+}
+interface OnBackFunctionArgs {
+    readonly page: TrackingPage;
+    readonly checkoutId: string | undefined;
+}
+interface OnBackFunction {
+    (args: OnBackFunctionArgs): void;
+}
+interface OnNextFunctionArgs {
+    readonly page: TrackingPage;
+    readonly checkoutId: string | undefined;
+    readonly from: string;
+    readonly to: string;
+}
+interface OnNextFunction {
+    (args: OnNextFunctionArgs): void;
+}
+interface OnPreviousFunctionArgs {
+    readonly page: TrackingPage;
+    readonly checkoutId: string | undefined;
+    readonly from: string;
+    readonly to: string;
+}
+interface OnPreviousFunction {
+    (args: OnPreviousFunctionArgs): void;
+}
 interface HeaderProps {
     readonly customerId: string;
     readonly menu: Menu;
     readonly menuVisible: boolean;
-    readonly onOpenMenu: () => void;
-    readonly onCloseMenu: () => void;
+    readonly onOpenMenu: OnOpenMenuFunction;
+    readonly onCloseMenu: OnCloseMenuFunction;
+    readonly onBack?: OnBackFunction;
+    readonly onNext?: OnNextFunction;
+    readonly onPrevious?: OnPreviousFunction;
     readonly style?: StyleProp<ViewStyle>;
 }
 declare const Header: FC<HeaderProps>;

package/dist/infrastructure/ui/views/navigation/components/header/Header.js

@@ -6,6 +6,7 @@ import { SafeAreaView, useSafeAreaInsets } from "react-native-safe-area-context"
 import { generatePath, useMatch, useNavigate, useParams } from "react-router-native";
 import { ButtonIcon } from "../../../../../../shared/ui/components/molecules/buttonIcon/ButtonIcon";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
+import { TrackingPage } from "../../../../../tracking/tracking";
 import { I18nMessages } from "../../../../i18n/i18n";
 import { Routes } from "../../../../routing/routes";
 import { useBasePath } from "../../../../routing/useBasePath";
@@ -15,8 +16,8 @@ const ButtonIconPlaceholder = () => React.createElement(View, { style: style.but
 const DefaultHeader = ({ onOpenMenu }) => (React.createElement(View, { style: style.header, testID: "default-header" },
     React.createElement(Logo, { style: style.logo }),
     React.createElement(ButtonIconPlaceholder, null),
-    React.createElement(ButtonIcon, { name: "menu", onPress: onOpenMenu })));
-const ItemHeader = ({ items, item }) => {
+    React.createElement(ButtonIcon, { name: "menu", testID: "menu-button-icon", onPress: onOpenMenu })));
+const ItemHeader = ({ items, item, onNext, onPrevious }) => {
     const title = useI18nMessage({ id: I18nMessages.HEADER_CHECKOUT_TITLE });
     const itemIndex = items.indexOf(item);
     const isFirstItem = itemIndex === 0;
@@ -26,64 +27,97 @@ const ItemHeader = ({ items, item }) => {
     const navigateToPreviousItem = useCallback(() => {
         const previousItemIndex = itemIndex === 0 ? items.length - 1 : itemIndex - 1;
         const previousItem = items[previousItemIndex];
+        onPrevious?.({ from: item.id, to: previousItem.id });
         navigate(generatePath(`${basePath}/${Routes.ITEM}`, { id: previousItem.id }));
-    }, [basePath, itemIndex, items, navigate]);
+    }, [basePath, item.id, itemIndex, items, navigate, onPrevious]);
     const navigateToNextItem = useCallback(() => {
         const nextItemIndex = itemIndex === items.length - 1 ? 0 : itemIndex + 1;
         const nextItem = items[nextItemIndex];
+        onNext?.({ from: item.id, to: nextItem.id });
         navigate(generatePath(`${basePath}/${Routes.ITEM}`, { id: nextItem.id }));
-    }, [basePath, itemIndex, items, navigate]);
+    }, [basePath, item.id, itemIndex, items, navigate, onNext]);
     return (React.createElement(View, { style: style.header, testID: "item-header" },
-        !isFirstItem ? React.createElement(ButtonIcon, { name: "arrow-left", onPress: navigateToPreviousItem }) : React.createElement(ButtonIconPlaceholder, null),
+        !isFirstItem ? (React.createElement(ButtonIcon, { name: "arrow-left", testID: "arrow-left-button-icon", onPress: navigateToPreviousItem })) : (React.createElement(ButtonIconPlaceholder, null)),
         React.createElement(Text, { level: 3, style: style.title, detail: true }, title),
-        !isLastItem ? React.createElement(ButtonIcon, { name: "arrow-right", onPress: navigateToNextItem }) : React.createElement(ButtonIconPlaceholder, null)));
+        !isLastItem ? (React.createElement(ButtonIcon, { name: "arrow-right", testID: "arrow-right-button-icon", onPress: navigateToNextItem })) : (React.createElement(ButtonIconPlaceholder, null))));
 };
-const ItemDetailHeader = () => {
+const ItemDetailHeader = ({ onBack }) => {
     const title = useI18nMessage({ id: I18nMessages.HEADER_CHECKOUT_TITLE });
     const navigate = useNavigate();
-    const handleOnBack = useCallback(() => navigate(-1), [navigate]);
+    const handleOnBack = useCallback(() => {
+        onBack?.();
+        navigate(-1);
+    }, [navigate, onBack]);
     return (React.createElement(View, { style: style.header, testID: "item-detail-header" },
         React.createElement(ButtonIconPlaceholder, null),
         React.createElement(Text, { level: 3, style: style.title, detail: true }, title),
-        React.createElement(ButtonIcon, { name: "close", onPress: handleOnBack })));
+        React.createElement(ButtonIcon, { name: "close", testID: "close-button-icon", onPress: handleOnBack })));
 };
-const CheckoutHeader = () => {
+const CheckoutHeader = ({ onBack }) => {
     const title = useI18nMessage({ id: I18nMessages.HEADER_COMPLETE_CHECKOUT_TITLE });
     const basePath = useBasePath();
     const navigate = useNavigate();
-    const handleOnBack = useCallback(() => navigate(`${basePath}/${Routes.SUMMARY}`), [basePath, navigate]);
+    const handleOnBack = useCallback(() => {
+        onBack?.();
+        navigate(`${basePath}/${Routes.SUMMARY}`);
+    }, [basePath, navigate, onBack]);
     return (React.createElement(View, { style: style.header, testID: "checkout-header" },
-        React.createElement(ButtonIcon, { name: "arrow-left", onPress: handleOnBack }),
+        React.createElement(ButtonIcon, { name: "arrow-left", testID: "arrow-left-button-icon", onPress: handleOnBack }),
         React.createElement(Text, { level: 3, style: style.title, detail: true }, title),
         React.createElement(ButtonIconPlaceholder, null)));
 };
-const Header = ({ customerId, menu: Menu, menuVisible, onOpenMenu, onCloseMenu, style: customStyle, }) => {
+const Header = ({ customerId, menu: Menu, menuVisible, onOpenMenu, onCloseMenu, onBack, onNext, onPrevious, style: customStyle, }) => {
     const { id: itemId } = useParams();
     const [checkout] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const currentItem = checkout?.items.find((item) => item.id === itemId);
     const basePath = useBasePath();
     const itemRouteMatch = useMatch(`${basePath}/${Routes.ITEM}`);
     const itemDetailRouteMatch = useMatch(`${basePath}/${Routes.ITEM_DETAIL}`);
+    const summaryRouteMatch = useMatch(`${basePath}/${Routes.SUMMARY}`);
     const checkoutRouteMatch = useMatch(`${basePath}/${Routes.CHECKOUT}`);
     const checkoutPaymentRouteMatch = useMatch(`${basePath}/${Routes.CHECKOUT}/${Routes.CHECKOUT_PAYMENT}`);
+    const feedbackRouteMatch = useMatch(`${basePath}/${Routes.FEEDBACK}`);
+    const trackingPage = useCallback(() => {
+        if (itemRouteMatch || itemDetailRouteMatch)
+            return TrackingPage.ITEM;
+        if (checkoutRouteMatch || checkoutPaymentRouteMatch)
+            return TrackingPage.CHECKOUT;
+        if (summaryRouteMatch)
+            return TrackingPage.SUMMARY;
+        if (feedbackRouteMatch)
+            return TrackingPage.FEEDBACK;
+        return TrackingPage.NOT_FOUND;
+    }, [
+        checkoutPaymentRouteMatch,
+        checkoutRouteMatch,
+        feedbackRouteMatch,
+        itemDetailRouteMatch,
+        itemRouteMatch,
+        summaryRouteMatch,
+    ]);
     const { top: safeAreaInsetTop } = useSafeAreaInsets();
+    const handleOnOpenMenu = useCallback(() => onOpenMenu({ page: trackingPage(), checkoutId: checkout?.id, open: true }), [checkout?.id, onOpenMenu, trackingPage]);
+    const handleOnCloseMenu = useCallback(() => onCloseMenu({ page: trackingPage(), checkoutId: checkout?.id, open: false }), [checkout?.id, onCloseMenu, trackingPage]);
+    const handleOnBack = useCallback(() => onBack?.({ page: trackingPage(), checkoutId: checkout?.id }), [checkout?.id, onBack, trackingPage]);
+    const handleOnNext = useCallback(({ from, to }) => onNext?.({ page: trackingPage(), checkoutId: checkout?.id, from, to }), [checkout?.id, onNext, trackingPage]);
+    const handleOnPrevious = useCallback(({ from, to }) => onPrevious?.({ page: trackingPage(), checkoutId: checkout?.id, from, to }), [checkout?.id, onPrevious, trackingPage]);
     let header;
     if (checkout?.items && currentItem) {
         if (itemRouteMatch) {
-            header = React.createElement(ItemHeader, { item: currentItem, items: checkout.items });
+            header = (React.createElement(ItemHeader, { item: currentItem, items: checkout.items, onNext: handleOnNext, onPrevious: handleOnPrevious }));
         }
         else if (itemDetailRouteMatch) {
-            header = React.createElement(ItemDetailHeader, null);
+            header = React.createElement(ItemDetailHeader, { onBack: handleOnBack });
         }
     }
     else if (checkoutRouteMatch || checkoutPaymentRouteMatch) {
-        header = React.createElement(CheckoutHeader, null);
+        header = React.createElement(CheckoutHeader, { onBack: handleOnBack });
     }
     else {
-        header = React.createElement(DefaultHeader, { onOpenMenu: onOpenMenu });
+        header = React.createElement(DefaultHeader, { onOpenMenu: handleOnOpenMenu });
     }
     return (React.createElement(React.Fragment, null,
         React.createElement(SafeAreaView, { edges: ["top"], style: [style.container, { height: HEADER_HEIGHT + safeAreaInsetTop }, customStyle] }, header),
-        React.createElement(Menu, { isVisible: menuVisible, onClose: onCloseMenu })));
+        React.createElement(Menu, { isVisible: menuVisible, onClose: handleOnCloseMenu })));
 };
 export { Header };

package/dist/shared/tracking/infrastructure/useTrackChangeFeedback.d.ts

@@ -0,0 +1,20 @@
+import { TrackingPage } from "../../../infrastructure/tracking/tracking";
+import { Country } from "../../../projection/shared/country";
+interface ChangeFeedbackFunctionArgs {
+    readonly questionId: string;
+    readonly questionName: string;
+    readonly feedback: string | undefined;
+}
+interface ChangeFeedbackFunction {
+    (args: ChangeFeedbackFunctionArgs): void;
+}
+interface UseTrackChangeFeedbackArgs {
+    readonly page: TrackingPage;
+    readonly country: Country;
+    readonly checkoutId?: string;
+}
+interface UseTrackChangeFeedback {
+    (agrs: UseTrackChangeFeedbackArgs): ChangeFeedbackFunction;
+}
+declare const useTrackChangeFeedback: UseTrackChangeFeedback;
+export { useTrackChangeFeedback };

package/dist/shared/tracking/infrastructure/useTrackChangeFeedback.js

@@ -0,0 +1,25 @@
+import { useCallback } from "react";
+import { PROJECT } from "../../../infrastructure/tracking/tracking";
+import { TrackingEvent, TrackingEventCategory } from "../tracking";
+import { useEmitUserEvent } from "./useEmitUserEvent";
+const useTrackChangeFeedback = ({ page, country, checkoutId }) => {
+    const emitUserEvent = useEmitUserEvent();
+    const changeFeedback = useCallback(({ questionId, questionName, feedback }) => {
+        if (!checkoutId) {
+            return;
+        }
+        const changeFeedbackTrackingEvent = {
+            event: TrackingEvent.CHANGE_FEEDBACK,
+            eventCategory: TrackingEventCategory.NAVIGATION,
+            section: `${PROJECT}_${page}`,
+            store: country,
+            checkoutId,
+            questionId,
+            questionName,
+            feedback,
+        };
+        emitUserEvent(changeFeedbackTrackingEvent);
+    }, [checkoutId, country, emitUserEvent, page]);
+    return changeFeedback;
+};
+export { useTrackChangeFeedback };

package/dist/shared/tracking/infrastructure/useTrackPressBack.d.ts

@@ -0,0 +1,15 @@
+import { TrackingPage } from "../../../infrastructure/tracking/tracking";
+import { Country } from "../../../projection/shared/country";
+interface PressBackFunctionArgs {
+    readonly page: TrackingPage;
+    readonly country: Country;
+    readonly checkoutId: string | undefined;
+}
+interface PressBackFunction {
+    (args: PressBackFunctionArgs): void;
+}
+interface UseTrackPressBackFunction {
+    (): PressBackFunction;
+}
+declare const useTrackPressBack: UseTrackPressBackFunction;
+export { useTrackPressBack };

package/dist/shared/tracking/infrastructure/useTrackPressBack.js

@@ -0,0 +1,22 @@
+import { useCallback } from "react";
+import { PROJECT } from "../../../infrastructure/tracking/tracking";
+import { TrackingEvent, TrackingEventCategory } from "../tracking";
+import { useEmitUserEvent } from "./useEmitUserEvent";
+const useTrackPressBack = () => {
+    const emitUserEvent = useEmitUserEvent();
+    const pressBack = useCallback(({ page, country, checkoutId }) => {
+        if (!checkoutId) {
+            return;
+        }
+        const pressBackTrackingEvent = {
+            event: TrackingEvent.PRESS_BACK,
+            eventCategory: TrackingEventCategory.NAVIGATION,
+            section: `${PROJECT}_${page}`,
+            store: country,
+            checkoutId,
+        };
+        emitUserEvent(pressBackTrackingEvent);
+    }, [emitUserEvent]);
+    return pressBack;
+};
+export { useTrackPressBack };

package/dist/shared/tracking/infrastructure/useTrackPressMenu.d.ts

@@ -0,0 +1,16 @@
+import { TrackingPage } from "../../../infrastructure/tracking/tracking";
+import { Country } from "../../../projection/shared/country";
+interface PressMenuFunctionArgs {
+    readonly page: TrackingPage;
+    readonly country: Country;
+    readonly checkoutId: string | undefined;
+    readonly open: boolean;
+}
+interface PressMenuFunction {
+    (args: PressMenuFunctionArgs): void;
+}
+interface UseTrackPressMenuFunction {
+    (): PressMenuFunction;
+}
+declare const useTrackPressMenu: UseTrackPressMenuFunction;
+export { useTrackPressMenu };

package/dist/shared/tracking/infrastructure/useTrackPressMenu.js

@@ -0,0 +1,23 @@
+import { useCallback } from "react";
+import { PROJECT } from "../../../infrastructure/tracking/tracking";
+import { TrackingEvent, TrackingEventCategory } from "../tracking";
+import { useEmitUserEvent } from "./useEmitUserEvent";
+const useTrackPressMenu = () => {
+    const emitUserEvent = useEmitUserEvent();
+    const pressMenu = useCallback(({ page, country, checkoutId, open }) => {
+        if (!checkoutId) {
+            return;
+        }
+        const pressMenuTrackingEvent = {
+            event: TrackingEvent.PRESS_MENU,
+            eventCategory: TrackingEventCategory.NAVIGATION,
+            section: `${PROJECT}_${page}`,
+            store: country,
+            checkoutId,
+            open,
+        };
+        emitUserEvent(pressMenuTrackingEvent);
+    }, [emitUserEvent]);
+    return pressMenu;
+};
+export { useTrackPressMenu };

package/dist/shared/tracking/infrastructure/useTrackPressNext.d.ts

@@ -0,0 +1,17 @@
+import { TrackingPage } from "../../../infrastructure/tracking/tracking";
+import { Country } from "../../../projection/shared/country";
+interface PressNextFunctionArgs {
+    readonly page: TrackingPage;
+    readonly country: Country;
+    readonly checkoutId: string | undefined;
+    readonly from: string;
+    readonly to: string;
+}
+interface PressNextFunction {
+    (args: PressNextFunctionArgs): void;
+}
+interface UseTrackPressNextFunction {
+    (): PressNextFunction;
+}
+declare const useTrackPressNext: UseTrackPressNextFunction;
+export { useTrackPressNext };

package/dist/shared/tracking/infrastructure/useTrackPressNext.js

@@ -0,0 +1,24 @@
+import { useCallback } from "react";
+import { PROJECT } from "../../../infrastructure/tracking/tracking";
+import { TrackingEvent, TrackingEventCategory } from "../tracking";
+import { useEmitUserEvent } from "./useEmitUserEvent";
+const useTrackPressNext = () => {
+    const emitUserEvent = useEmitUserEvent();
+    const pressNext = useCallback(({ page, country, checkoutId, from, to }) => {
+        if (!checkoutId) {
+            return;
+        }
+        const pressNextTrackingEvent = {
+            event: TrackingEvent.PRESS_NEXT,
+            eventCategory: TrackingEventCategory.NAVIGATION,
+            section: `${PROJECT}_${page}`,
+            store: country,
+            checkoutId,
+            from,
+            to,
+        };
+        emitUserEvent(pressNextTrackingEvent);
+    }, [emitUserEvent]);
+    return pressNext;
+};
+export { useTrackPressNext };

package/dist/shared/tracking/infrastructure/useTrackPressPrevious.d.ts

@@ -0,0 +1,17 @@
+import { TrackingPage } from "../../../infrastructure/tracking/tracking";
+import { Country } from "../../../projection/shared/country";
+interface PressPreviousFunctionArgs {
+    readonly page: TrackingPage;
+    readonly country: Country;
+    readonly checkoutId: string | undefined;
+    readonly from: string;
+    readonly to: string;
+}
+interface PressPreviousFunction {
+    (args: PressPreviousFunctionArgs): void;
+}
+interface UseTrackPressPreviousFunction {
+    (): PressPreviousFunction;
+}
+declare const useTrackPressPrevious: UseTrackPressPreviousFunction;
+export { useTrackPressPrevious };

package/dist/shared/tracking/infrastructure/useTrackPressPrevious.js

@@ -0,0 +1,24 @@
+import { useCallback } from "react";
+import { PROJECT } from "../../../infrastructure/tracking/tracking";
+import { TrackingEvent, TrackingEventCategory } from "../tracking";
+import { useEmitUserEvent } from "./useEmitUserEvent";
+const useTrackPressPrevious = () => {
+    const emitUserEvent = useEmitUserEvent();
+    const pressPrevious = useCallback(({ page, country, checkoutId, from, to }) => {
+        if (!checkoutId) {
+            return;
+        }
+        const pressPreviousTrackingEvent = {
+            event: TrackingEvent.PRESS_PREVIOUS,
+            eventCategory: TrackingEventCategory.NAVIGATION,
+            section: `${PROJECT}_${page}`,
+            store: country,
+            checkoutId,
+            from,
+            to,
+        };
+        emitUserEvent(pressPreviousTrackingEvent);
+    }, [emitUserEvent]);
+    return pressPrevious;
+};
+export { useTrackPressPrevious };

package/dist/shared/tracking/tracking.d.ts

@@ -10,7 +10,12 @@ declare enum TrackingEvent {
     PRESS_PRICING = "press-pricing",
     PRESS_ITEM = "press-item",
     PRESS_CONTINUE = "press-continue",
-    TAB_VIEW = "tab-view"
+    TAB_VIEW = "tab-view",
+    CHANGE_FEEDBACK = "change-feedback",
+    PRESS_MENU = "press-menu",
+    PRESS_BACK = "press-back",
+    PRESS_NEXT = "press-next",
+    PRESS_PREVIOUS = "press-previous"
 }
 declare enum TrackingEventCategory {
     NAVIGATION = "navigation"
@@ -58,5 +63,22 @@ type PressContinueTrackingEvent = BaseTrackingEvent;
 interface TabViewTrackingEvent<T> extends BaseTrackingEvent {
     readonly tab: T;
 }
-export type { BaseTrackingEvent, ImageViewTrackingEvent, ItemPageViewTrackingEvent, KeepItemTrackingEvent, PageViewTrackingEvent, PressContinueTrackingEvent, PressItemTrackingEvent, PressPricingTrackingEvent, ReplaceItemTrackingEvent, ResetItemTrackingEvent, ReturnItemTrackingEvent, TabViewTrackingEvent, };
+interface ChangeFeedbackTrackingEvent extends BaseTrackingEvent {
+    readonly questionId: string;
+    readonly questionName: string;
+    readonly feedback: string | undefined;
+}
+interface PressMenuTrackingEvent extends BaseTrackingEvent {
+    readonly open: boolean;
+}
+type PressBackTrackingEvent = BaseTrackingEvent;
+interface PressNextTrackingEvent extends BaseTrackingEvent {
+    readonly from: string;
+    readonly to: string;
+}
+interface PressPreviousTrackingEvent extends BaseTrackingEvent {
+    readonly from: string;
+    readonly to: string;
+}
+export type { BaseTrackingEvent, ChangeFeedbackTrackingEvent, ImageViewTrackingEvent, ItemPageViewTrackingEvent, KeepItemTrackingEvent, PageViewTrackingEvent, PressContinueTrackingEvent, PressItemTrackingEvent, PressPricingTrackingEvent, ReplaceItemTrackingEvent, ResetItemTrackingEvent, ReturnItemTrackingEvent, TabViewTrackingEvent, PressMenuTrackingEvent, PressBackTrackingEvent, PressNextTrackingEvent, PressPreviousTrackingEvent, };
 export { TrackingEvent, TrackingEventCategory };

package/dist/shared/tracking/tracking.js

@@ -10,6 +10,11 @@ var TrackingEvent;
     TrackingEvent["PRESS_ITEM"] = "press-item";
     TrackingEvent["PRESS_CONTINUE"] = "press-continue";
     TrackingEvent["TAB_VIEW"] = "tab-view";
+    TrackingEvent["CHANGE_FEEDBACK"] = "change-feedback";
+    TrackingEvent["PRESS_MENU"] = "press-menu";
+    TrackingEvent["PRESS_BACK"] = "press-back";
+    TrackingEvent["PRESS_NEXT"] = "press-next";
+    TrackingEvent["PRESS_PREVIOUS"] = "press-previous";
 })(TrackingEvent || (TrackingEvent = {}));
 var TrackingEventCategory;
 (function (TrackingEventCategory) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookiero/checkout",
-  "version": "0.8.26",
+  "version": "0.8.28",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [