@lookiero/checkout 9.14.0 → 10.0.0-beta.1

package/src/projection/customer/customer.ts

@@ -5,6 +5,8 @@ interface Customer {
   readonly customerId: string;
   readonly country: Country;
   readonly segment: Segment;
+  readonly name: string;
+  readonly email: string;
 }
 
 export type { Customer };

package/src/projection/order/order.ts

@@ -4,4 +4,4 @@ interface Order {
   readonly coupon: string | null;
 }
 
-export type { Order };
+export type { Order as OrderProjection };

package/src/projection/subscription/subscription.ts

@@ -1,3 +1,3 @@
 type Subscription = "o" | "m" | "b" | "q";
 
-export type { Subscription };
+export type { Subscription as SubscriptionProjection };

package/src/infrastructure/ui/hooks/useSubmitCheckout.ts

@@ -1,169 +0,0 @@
-import { RefObject, useCallback, useMemo, useState } from "react";
-import { CommandStatus } from "@lookiero/messaging-react";
-import { PaymentFlowRef } from "@lookiero/payments-front";
-import { Logger } from "@lookiero/sty-psp-logging";
-import { NotificationLevel, useCreateToastNotification } from "@lookiero/sty-psp-notifications";
-import {
-  ViewCheckoutBookingById,
-  viewCheckoutBookingById,
-  ViewCheckoutBookingByIdResult,
-} from "../../../projection/checkoutBooking/viewCheckoutBookingById";
-import { PaymentFlowPayloadProjection } from "../../../projection/payment/paymentFlowPayload";
-import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
-import { useSubmitCheckout as useSubmitCheckoutCommand } from "../../domain/checkout/react/useSubmitCheckout";
-import { useBlockCheckoutBooking } from "../../domain/checkoutBooking/react/useBlockCheckoutBooking";
-import { I18nMessages } from "../i18n/i18n";
-import { useQueryBus } from "./useQueryBus";
-
-enum ChargeStatus {
-  EXECUTED = "EXECUTED",
-  REQUIRES_ACTION = "REQUIRES_ACTION",
-  REQUIRED_ACTION_CANCELLED = "REQUIRED_ACTION_CANCELLED",
-  REJECTED = "REJECTED",
-  CANCELLED = "CANCELLED",
-  TO_CONFIRM = "TO_CONFIRM",
-  ERROR = "ERROR",
-  UNKNOWN = "UNKNOWN",
-}
-interface LegacyBoxCheckout {
-  readonly status: ChargeStatus;
-  readonly toaster: {
-    id: string;
-  } | null;
-  readonly final: boolean;
-  readonly id?: string;
-  readonly translation?: string;
-}
-
-type Status = "idle" | "loading" | "success" | "error";
-
-interface SubmitCheckoutFunctionArgs {
-  readonly paymentFlowPayload: PaymentFlowPayloadProjection;
-  readonly sizeChangeEnabled: boolean;
-}
-
-interface SubmitCheckoutFunction {
-  (args: SubmitCheckoutFunctionArgs): Promise<void>;
-}
-
-type UseSubmitCheckoutResult = [submitCheckout: SubmitCheckoutFunction, status: Status];
-
-interface UseSubmitCheckoutFunctionArgs {
-  readonly checkoutId: string;
-  readonly checkoutBookingId: string;
-  readonly paymentFlowRef: RefObject<PaymentFlowRef>;
-  readonly onError: () => void;
-  readonly onSuccess?: () => void;
-  readonly logger: Logger;
-}
-
-interface UseSubmitCheckoutFunction {
-  (args: UseSubmitCheckoutFunctionArgs): UseSubmitCheckoutResult;
-}
-
-const useSubmitCheckout: UseSubmitCheckoutFunction = ({
-  checkoutId,
-  checkoutBookingId,
-  paymentFlowRef,
-  onError,
-  onSuccess,
-  logger,
-}) => {
-  const queryBus = useQueryBus();
-  const [submitCheckoutCommand, submitCheckoutCommandStatus] = useSubmitCheckoutCommand({ checkoutId, logger });
-  const [blockCheckoutBooking, blockCheckoutBookingStatus] = useBlockCheckoutBooking({ checkoutBookingId, logger });
-  const [createNotification] = useCreateToastNotification({ contextId: MESSAGING_CONTEXT_ID, logger });
-  const [checkoutBookingExpired, setCheckoutBookingExpired] = useState(false);
-
-  const [startLegacyBoxCheckoutStatus, setStartLegacyBoxCheckoutStatus] = useState<Status>("idle");
-
-  const submitCheckout: SubmitCheckoutFunction = useCallback(
-    async ({ paymentFlowPayload, sizeChangeEnabled }) => {
-      try {
-        sizeChangeEnabled && (await blockCheckoutBooking());
-      } catch (error) {
-        return;
-      }
-
-      const checkoutBooking = await queryBus<ViewCheckoutBookingById, ViewCheckoutBookingByIdResult>(
-        viewCheckoutBookingById({ checkoutBookingId }),
-      );
-
-      if (checkoutBooking?.isExpired) {
-        setCheckoutBookingExpired(true);
-        return;
-      }
-
-      paymentFlowRef.current?.startLegacyBoxCheckout(
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        paymentFlowPayload,
-        async ({ status, toaster, final }: LegacyBoxCheckout) => {
-          setStartLegacyBoxCheckoutStatus("loading");
-
-          if (final) {
-            if (status === ChargeStatus.EXECUTED) {
-              setStartLegacyBoxCheckoutStatus("success");
-              await submitCheckoutCommand();
-              onSuccess?.();
-            } else {
-              createNotification({
-                level: NotificationLevel.ERROR,
-                bodyI18nKey: toaster?.id || I18nMessages.CHECKOUT_TOAST_PAYMENT_ERROR,
-              });
-              setStartLegacyBoxCheckoutStatus("error");
-            }
-          }
-        },
-      );
-    },
-    [
-      queryBus,
-      checkoutBookingId,
-      paymentFlowRef,
-      blockCheckoutBooking,
-      submitCheckoutCommand,
-      onSuccess,
-      createNotification,
-    ],
-  );
-
-  const status: Status = useMemo(() => {
-    if (
-      blockCheckoutBookingStatus === CommandStatus.LOADING ||
-      startLegacyBoxCheckoutStatus === "loading" ||
-      submitCheckoutCommandStatus === CommandStatus.LOADING
-    ) {
-      return "loading";
-    }
-    if (
-      blockCheckoutBookingStatus === CommandStatus.SUCCESS &&
-      startLegacyBoxCheckoutStatus === "success" &&
-      submitCheckoutCommandStatus === CommandStatus.SUCCESS
-    ) {
-      return "success";
-    }
-    if (
-      blockCheckoutBookingStatus === CommandStatus.ERROR ||
-      startLegacyBoxCheckoutStatus === "error" ||
-      submitCheckoutCommandStatus === CommandStatus.ERROR ||
-      checkoutBookingExpired
-    ) {
-      onError();
-      return "error";
-    }
-
-    return "idle";
-  }, [
-    blockCheckoutBookingStatus,
-    startLegacyBoxCheckoutStatus,
-    submitCheckoutCommandStatus,
-    checkoutBookingExpired,
-    onError,
-  ]);
-
-  return [submitCheckout, status];
-};
-
-export type { Status, SubmitCheckoutFunction };
-export { useSubmitCheckout };

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

@@ -1,19 +0,0 @@
-import { renderHook, waitFor } from "@testing-library/react-native";
-import React, { FC } from "react";
-import { BasePathProvider, useBasePath as sut } from "./useBasePath";
-
-const basePath = "/checkout";
-
-interface WrapperProps {
-  readonly children: JSX.Element;
-}
-
-const Wrapper: FC<WrapperProps> = ({ children }) => <BasePathProvider basePath={basePath}>{children}</BasePathProvider>;
-
-describe("useBasePath hook", () => {
-  it("returns the BasePathProvider provided basePath", async () => {
-    const { result } = renderHook(() => sut(), { wrapper: Wrapper });
-
-    await waitFor(() => expect(result.current).toStrictEqual(basePath));
-  });
-});

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

@@ -1,24 +0,0 @@
-import React, { createContext, FC, useContext } from "react";
-import invariant from "tiny-invariant";
-
-const BasePathContext = createContext<string>(null as unknown as string);
-
-interface BasePathProviderProps {
-  readonly children: JSX.Element;
-  readonly basePath: string;
-}
-
-export const BasePathProvider: FC<BasePathProviderProps> = ({ basePath, children }) => (
-  <BasePathContext.Provider value={basePath}>{children}</BasePathContext.Provider>
-);
-
-export const useBasePath = () => {
-  const basePath = useContext(BasePathContext);
-
-  invariant(
-    basePath !== null,
-    "Your are trying to use the useBasePath hook without wrapping your app with the <BasePathProvider>.",
-  );
-
-  return basePath;
-};

package/src/infrastructure/ui/views/checkout/components/checkoutPaymentModal/CheckoutPaymentModal.tsx

@@ -1,125 +0,0 @@
-import React, { FC, useCallback, useEffect, useRef, useState } from "react";
-import { useNavigate } from "react-router-native";
-import { QueryStatus } from "@lookiero/messaging-react";
-import { PaymentFlow, PaymentFlowRef } from "@lookiero/payments-front";
-import { useLogger } from "@lookiero/sty-psp-logging";
-import { CheckoutItemStatus } from "../../../../../../domain/checkoutItem/model/checkoutItem";
-import { Currency } from "../../../../../../domain/checkoutItem/model/currency";
-import { Subscription } from "../../../../../../projection/subscription/subscription";
-import { useViewFirstAvailableCheckoutByCustomerId } from "../../../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
-import { useViewIsSizeChangeEnabledByCheckoutId } from "../../../../../projection/checkout/react/useViewIsSizeChangeEnabledByCheckoutId";
-import { useViewPaymentFlowPayloadByCheckoutId } from "../../../../../projection/payment/react/useViewPaymentFlowPayloadByCheckoutId";
-import { useViewPricingByCheckoutId } from "../../../../../projection/pricing/react/useViewPricingByCheckoutId";
-import { TrackingPage } from "../../../../../tracking/tracking";
-import { useTrackCheckout } from "../../../../../tracking/useTrackCheckout";
-import { useStaticInfo } from "../../../../hooks/useStaticInfo";
-import { useSubmitCheckout } from "../../../../hooks/useSubmitCheckout";
-import { Routes } from "../../../../routing/routes";
-import { useBasePath } from "../../../../routing/useBasePath";
-
-interface CheckoutPaymentModalProps {
-  readonly coupon: string | null;
-  readonly orderNumber: number;
-  readonly isFirstOrder: boolean;
-  readonly subscription: Subscription;
-  readonly getAuthToken: () => Promise<string>;
-  readonly onCheckoutSubmitted?: () => void;
-}
-
-const CheckoutPaymentModal: FC<CheckoutPaymentModalProps> = ({
-  coupon,
-  isFirstOrder,
-  subscription,
-  orderNumber,
-  getAuthToken,
-  onCheckoutSubmitted,
-}) => {
-  const paymentFlowRef = useRef<PaymentFlowRef>(null);
-  const logger = useLogger();
-  const {
-    customer: { customerId, country, segment },
-  } = useStaticInfo();
-
-  const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
-  const [paymentFlowPayload] = useViewPaymentFlowPayloadByCheckoutId({
-    checkoutId: checkout?.id as string,
-  });
-  const [sizeChangeEnabled] = useViewIsSizeChangeEnabledByCheckoutId({ checkoutId: checkout?.id as string });
-  const [pricing] = useViewPricingByCheckoutId({
-    checkoutId: checkout?.id as string,
-    queryOptions: { refetchOnMount: true },
-  });
-
-  const [authToken, setAuthToken] = useState<string>();
-  useEffect(() => {
-    const loadAuthToken = async () => setAuthToken(await getAuthToken());
-    loadAuthToken();
-  }, [getAuthToken]);
-
-  const basePath = useBasePath();
-  const navigate = useNavigate();
-  const trackCheckout = useTrackCheckout({
-    page: TrackingPage.CHECKOUT,
-    checkoutId: checkout?.id as string,
-    country,
-    segment,
-  });
-
-  const handleOnSubmitCheckoutError = useCallback(
-    () => navigate(`${basePath}/${Routes.CHECKOUT}`, { replace: true }),
-    [basePath, navigate],
-  );
-  const handleOnSubmitCheckoutSuccess = useCallback(() => {
-    const checkoutItemsKept = checkout?.items.filter(
-      (checkoutItem) =>
-        checkoutItem.status === CheckoutItemStatus.KEPT || checkoutItem.status === CheckoutItemStatus.REPLACED,
-    );
-    const totalReplacedFor = checkoutItemsKept?.filter(({ replacedFor }) => Boolean(replacedFor)).length || 0;
-
-    trackCheckout({
-      totalCheckoutItemsKept: checkoutItemsKept?.length || 0,
-      pendingToPay: (pricing?.pendingToPay.amount as number) / 100,
-      coupon,
-      currencyCode: pricing?.pendingToPay.currency as Currency,
-      isFirstOrder,
-      orderNumber,
-      totalReplacedFor,
-      subscription,
-      userId: customerId,
-    });
-    onCheckoutSubmitted?.();
-  }, [
-    checkout?.items,
-    coupon,
-    customerId,
-    isFirstOrder,
-    onCheckoutSubmitted,
-    orderNumber,
-    pricing?.pendingToPay.amount,
-    pricing?.pendingToPay.currency,
-    subscription,
-    trackCheckout,
-  ]);
-  const [submitCheckout] = useSubmitCheckout({
-    checkoutId: checkout?.id as string,
-    checkoutBookingId: checkout?.checkoutBookingId as string,
-    paymentFlowRef,
-    onError: handleOnSubmitCheckoutError,
-    onSuccess: handleOnSubmitCheckoutSuccess,
-    logger,
-  });
-  useEffect(() => {
-    if (paymentFlowPayload && sizeChangeEnabled !== undefined && pricing !== undefined) {
-      submitCheckout({ paymentFlowPayload, sizeChangeEnabled });
-    }
-  }, [paymentFlowPayload, pricing, sizeChangeEnabled, submitCheckout]);
-
-  const dependenciesLoadedStatuses = [QueryStatus.ERROR, QueryStatus.SUCCESS];
-  const dependenciesLoaded = (dependenciesLoadedStatuses.includes(checkoutStatus) || checkout) && authToken;
-
-  if (!dependenciesLoaded) return null;
-
-  return <PaymentFlow ref={paymentFlowRef} token={authToken} />;
-};
-
-export { CheckoutPaymentModal };