@lookiero/checkout 0.5.6 → 0.5.7

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

@@ -0,0 +1,9 @@
+declare const PROJECT = "checkout";
+declare enum TrackingPage {
+    ITEM = "item",
+    CHECKOUT = "checkout",
+    SUMMARY = "summary",
+    FEEDBACK = "feedback",
+    NOT_FOUND = "not_found"
+}
+export { PROJECT, TrackingPage };

package/dist/infrastructure/tracking/tracking.js

@@ -0,0 +1,10 @@
+const PROJECT = "checkout";
+var TrackingPage;
+(function (TrackingPage) {
+    TrackingPage["ITEM"] = "item";
+    TrackingPage["CHECKOUT"] = "checkout";
+    TrackingPage["SUMMARY"] = "summary";
+    TrackingPage["FEEDBACK"] = "feedback";
+    TrackingPage["NOT_FOUND"] = "not_found";
+})(TrackingPage || (TrackingPage = {}));
+export { PROJECT, TrackingPage };

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

@@ -61,12 +61,12 @@ const Routing = ({ basePath = "", customer, locale, I18n, menu, tabBar, getAuthT
                 {
                     path: Routes.FEEDBACK,
                     element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                        React.createElement(Feedback, { customerId: customer?.customerId }))),
+                        React.createElement(Feedback, { country: customer?.country, customerId: customer?.customerId }))),
                 },
                 {
                     path: Routes.NOT_FOUND,
                     element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                        React.createElement(NotFound, null))),
+                        React.createElement(NotFound, { country: customer?.country, customerId: customer?.customerId }))),
                 },
                 {
                     path: "*",

package/dist/infrastructure/ui/views/checkout/Checkout.js

@@ -6,9 +6,11 @@ import React, { useCallback, useMemo, useRef } from "react";
 import { Platform, View } from "react-native";
 import { useNavigate } from "react-router-native";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
+import { usePageView } from "../../../../shared/tracking/infrastructure/usePageView";
 import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useViewPricingByCheckoutId } from "../../../projection/pricing/react/useViewPricingByCheckoutId";
+import { TrackingPage } from "../../../tracking/tracking";
 import { Body } from "../../components/layouts/body/Body";
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
 import { I18nMessages } from "../../i18n/i18n";
@@ -24,6 +26,11 @@ const Checkout = ({ children, customerId, country, useRedirect }) => {
     const paymentInstrumentSelectRef = useRef(null);
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const [pricing, pricingStatus] = useViewPricingByCheckoutId({ checkoutId: checkout?.id });
+    usePageView({
+        page: TrackingPage.CHECKOUT,
+        country,
+        checkoutId: checkout?.id,
+    });
     const navigate = useNavigate();
     const basePath = useBasePath();
     const { returnUrl } = useRedirect();

package/dist/infrastructure/ui/views/feedback/Feedback.d.ts

@@ -1,6 +1,8 @@
 import { FC } from "react";
+import { Country } from "../../../../projection/shared/country";
 interface FeedbackProps {
     readonly customerId: string;
+    readonly country: Country;
 }
 declare const Feedback: FC<FeedbackProps>;
 export { Feedback };

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

@@ -1,17 +1,19 @@
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import React, { useCallback } from "react";
 import { Platform } from "react-native";
+import { usePageView } from "../../../../shared/tracking/infrastructure/usePageView";
 import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
 import { useGiveCheckoutFeedback } from "../../../domain/checkoutFeedback/react/useGiveCheckoutFeedback";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useListCheckoutQuestionsByCheckoutId } from "../../../projection/checkoutQuestion/react/useListCheckoutQuestionsByCheckoutId";
+import { TrackingPage } from "../../../tracking/tracking";
 import { Body } from "../../components/layouts/body/Body";
 import { CheckoutQuestionFeedbackProvider } from "../../components/organisms/checkoutQuestions/behaviors/useCheckoutQuestionFeedback";
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
 import { HEADER_HEIGHT } from "../navigation/components/header/Header.style";
 import { style } from "./Feedback.style";
 import { CheckoutQuestionsForm } from "./components/checkoutQuestionsForm/CheckoutQuestionsForm";
-const Feedback = ({ customerId }) => {
+const Feedback = ({ customerId, country }) => {
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const [checkoutQuestions, checkoutQuestionsStatus] = useListCheckoutQuestionsByCheckoutId({
         checkoutId: checkout?.id,
@@ -25,6 +27,11 @@ const Feedback = ({ customerId }) => {
         }
         catch (e) { }
     }, [giveCheckoutFeedback]);
+    usePageView({
+        page: TrackingPage.FEEDBACK,
+        country,
+        checkoutId: checkout?.id,
+    });
     const dependenciesLoadedStatuses = [QueryStatus.ERROR, QueryStatus.SUCCESS];
     const dependenciesLoaded = dependenciesLoadedStatuses.includes(checkoutStatus) && dependenciesLoadedStatuses.includes(checkoutQuestionsStatus);
     if (!dependenciesLoaded)

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

@@ -4,6 +4,7 @@ import { Platform, View } from "react-native";
 import { generatePath, useMatch, useNavigate, useParams } from "react-router-native";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
 import "../../../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
+import { usePageView } from "../../../../shared/tracking/infrastructure/usePageView";
 import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
 import { useBookCheckoutBookingForCheckoutItem } from "../../../domain/checkoutBooking/react/useBookCheckoutBookingForCheckoutItem";
 import { useKeepCheckoutItem } from "../../../domain/checkoutItem/react/useKeepCheckoutItem";
@@ -12,6 +13,7 @@ import { useReturnCheckoutItem } from "../../../domain/checkoutItem/react/useRet
 import { useViewBookedProductsVariantsForCheckoutItem } from "../../../projection/bookedProductsVariants/react/useViewBookedProductsVariantsForCheckoutItem";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useListReturnQuestionsByCheckoutItemId } from "../../../projection/returnQuestion/react/useListReturnQuestionsByCheckoutItemId";
+import { TrackingPage } from "../../../tracking/tracking";
 import { Body } from "../../components/layouts/body/Body";
 import { ReturnQuestionFeedbackProvider } from "../../components/organisms/returnQuestions/behaviors/useReturnQuestionFeedback";
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
@@ -33,6 +35,12 @@ const Item = ({ customerId, country }) => {
     const { id } = useParams();
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const checkoutItem = checkout?.items.find((checkoutItem) => checkoutItem.id === id);
+    usePageView({
+        page: TrackingPage.ITEM,
+        country,
+        checkoutId: checkout?.id,
+        checkoutItemId: checkoutItem.id,
+    });
     const basePath = useBasePath();
     const itemRouteMatch = useMatch(`${basePath}/${Routes.ITEM}`);
     const itemDetailRouteMatch = useMatch(`${basePath}/${Routes.ITEM_DETAIL}`);

package/dist/infrastructure/ui/views/notFound/NotFound.d.ts

@@ -1,3 +1,8 @@
 import { FC } from "react";
-declare const NotFound: FC;
+import { Country } from "../../../../projection/shared/country";
+interface NotFoundProps {
+    readonly customerId: string;
+    readonly country: Country;
+}
+declare const NotFound: FC<NotFoundProps>;
 export { NotFound };

package/dist/infrastructure/ui/views/notFound/NotFound.js

@@ -1,10 +1,15 @@
 import { Button } from "@lookiero/aurora-next/build/components/atoms/Button/Button";
 import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Text";
 import { useI18nMessage } from "@lookiero/i18n-react";
+import { QueryStatus } from "@lookiero/messaging-react";
 import React, { useCallback } from "react";
 import { Image, Platform } from "react-native";
 import { useNavigate } from "react-router-native";
+import { usePageView } from "../../../../shared/tracking/infrastructure/usePageView";
 import { AspectRatioView } from "../../../../shared/ui/components/atoms/aspectRatioView/AspectRatioView";
+import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
+import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
+import { TrackingPage } from "../../../tracking/tracking";
 import { Body } from "../../components/layouts/body/Body";
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
 import { I18nMessages } from "../../i18n/i18n";
@@ -12,12 +17,22 @@ import { Routes } from "../../routing/routes";
 import { useBasePath } from "../../routing/useBasePath";
 import { HEADER_HEIGHT } from "../navigation/components/header/Header.style";
 import { style } from "./NotFound.style";
-const NotFound = () => {
+const NotFound = ({ customerId, country }) => {
     const descriptionText = useI18nMessage({ id: I18nMessages.NOT_FOUND_DESCRIPTION });
     const buttonText = useI18nMessage({ id: I18nMessages.NOT_FOUND_BUTTON });
+    const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
+    usePageView({
+        page: TrackingPage.NOT_FOUND,
+        country,
+        checkoutId: checkout?.id,
+    });
     const navigate = useNavigate();
     const basePath = useBasePath();
     const handleOnPress = useCallback(() => navigate(`${basePath}/${Routes.HOME}`), [basePath, navigate]);
+    const dependenciesLoadedStatuses = [QueryStatus.ERROR, QueryStatus.SUCCESS];
+    const dependenciesLoaded = dependenciesLoadedStatuses.includes(checkoutStatus);
+    if (!dependenciesLoaded)
+        return React.createElement(Spinner, null);
     return (React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" || Platform.OS === "android" ? HEADER_HEIGHT : 0, style: { scrollView: style.container } },
         React.createElement(Body, { style: { column: style.bodyColumn } },
             React.createElement(AspectRatioView, { aspectRatio: 1.25 },

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

@@ -5,10 +5,12 @@ import React, { useCallback, useMemo, useState } from "react";
 import { Platform, View } from "react-native";
 import { generatePath, useNavigate } from "react-router-native";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
+import { usePageView } from "../../../../shared/tracking/infrastructure/usePageView";
 import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
 import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
 import { useViewFiveItemsDiscountByCustomerId } from "../../../projection/checkout/react/useViewFiveItemsDiscountByCustomerId";
 import { useViewPricingByCheckoutId } from "../../../projection/pricing/react/useViewPricingByCheckoutId";
+import { TrackingPage } from "../../../tracking/tracking";
 import { Body } from "../../components/layouts/body/Body";
 import { SafeAreaScrollView } from "../../components/templates/SafeAreaScrollView";
 import { I18nMessages } from "../../i18n/i18n";
@@ -29,6 +31,11 @@ const Summary = ({ customerId, country }) => {
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const [pricing, pricingStatus] = useViewPricingByCheckoutId({ checkoutId: checkout?.id });
     const [fiveItemsDiscount = 0, fiveItemsDiscountStatus] = useViewFiveItemsDiscountByCustomerId({ customerId });
+    usePageView({
+        page: TrackingPage.SUMMARY,
+        country,
+        checkoutId: checkout?.id,
+    });
     const navigate = useNavigate();
     const basePath = useBasePath();
     const [pricingCollapsed, setPricingCollapsed] = useState(true);

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

@@ -1,5 +1,5 @@
+import { TrackingPage } from "../../../infrastructure/tracking/tracking";
 import { Country } from "../../../projection/shared/country";
-import { TrackingPage } from "../tracking";
 interface UsePageViewFunctionArgs {
     readonly page: TrackingPage;
     readonly country: Country;

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

@@ -1,5 +1,6 @@
 import { useLayoutEffect } from "react";
-import { PROJECT, TrackingEvent, TrackingEventCategory } from "../tracking";
+import { PROJECT } from "../../../infrastructure/tracking/tracking";
+import { TrackingEvent, TrackingEventCategory } from "../tracking";
 import { useEmitUserEvent } from "./useEmitUserEvent";
 const usePageView = ({ page, country, checkoutId, checkoutItemId }) => {
     const emitUserEvent = useEmitUserEvent();

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

@@ -1,14 +1,10 @@
 import { Country } from "../../projection/shared/country";
-declare const PROJECT = "checkout";
 declare enum TrackingEvent {
     PAGEVIEW = "pageview"
 }
 declare enum TrackingEventCategory {
     NAVIGATION = "navigation"
 }
-declare enum TrackingPage {
-    ITEM = "item"
-}
 interface BaseTrackingEvent {
     readonly event: TrackingEvent;
     readonly eventCategory: TrackingEventCategory;
@@ -20,4 +16,4 @@ interface PageViewTrackingEvent extends BaseTrackingEvent {
     readonly checkoutItemId?: string;
 }
 export type { BaseTrackingEvent, PageViewTrackingEvent };
-export { PROJECT, TrackingEvent, TrackingEventCategory, TrackingPage };
+export { TrackingEvent, TrackingEventCategory };

package/dist/shared/tracking/tracking.js

@@ -1,4 +1,3 @@
-const PROJECT = "checkout";
 var TrackingEvent;
 (function (TrackingEvent) {
     TrackingEvent["PAGEVIEW"] = "pageview";
@@ -7,8 +6,4 @@ var TrackingEventCategory;
 (function (TrackingEventCategory) {
     TrackingEventCategory["NAVIGATION"] = "navigation";
 })(TrackingEventCategory || (TrackingEventCategory = {}));
-var TrackingPage;
-(function (TrackingPage) {
-    TrackingPage["ITEM"] = "item";
-})(TrackingPage || (TrackingPage = {}));
-export { PROJECT, TrackingEvent, TrackingEventCategory, TrackingPage };
+export { TrackingEvent, TrackingEventCategory };

package/package.json

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