@lookiero/checkout 0.4.0-beta.2 → 0.4.0-beta.3

package/dist/index.d.ts

@@ -18,7 +18,7 @@ interface BootstrapFunctionReturn {
     readonly isCheckoutAccessible: IsCheckoutAccessibleFunction;
 }
 interface BootstrapFunction {
-    (args: BootstrapFunctionArgs): Promise<BootstrapFunctionReturn>;
+    (args: BootstrapFunctionArgs): BootstrapFunctionReturn;
 }
 declare const bootstrap: BootstrapFunction;
 export { bootstrap };

package/dist/index.js

@@ -4,15 +4,14 @@ import { bootstrap as checkoutBootstrap } from "./infrastructure/delivery/bootst
 import { root } from "./infrastructure/ui/Root";
 import { viewIsCheckoutAccessibleByCustomerId, } from "./projection/checkout/viewIsCheckoutAccessibleByCustomerId";
 import { notificationsRoot } from "./shared/notifications";
-const bootstrap = async ({ apiUrl, getAuthToken, translations }) => {
-    const authToken = await getAuthToken();
-    const { Component: Messaging, queryBus } = checkoutBootstrap({ apiUrl, authToken });
+const bootstrap = ({ apiUrl, getAuthToken, translations }) => {
+    const { Component: Messaging, queryBus } = checkoutBootstrap({ apiUrl, getAuthToken });
     const I18n = i18n({
         fetchTranslation: fetchFetchTranslation({ endpoint: translations }),
         contextId: "CheckoutI18n",
     });
     const Notifications = notificationsRoot();
-    const Root = root({ Messaging, I18n, Notifications, authToken });
+    const Root = root({ Messaging, I18n, Notifications, getAuthToken });
     const isCheckoutAccessible = ({ customerId }) => queryBus(viewIsCheckoutAccessibleByCustomerId({ customerId }));
     return {
         Root,

package/dist/infrastructure/delivery/bootstrap.d.ts

@@ -1,6 +1,6 @@
 import { BuildBootstrapFunctionReturn } from "@lookiero/messaging-react";
 interface BootstrapFunctionArgs {
-    readonly authToken: string;
+    readonly getAuthToken: () => Promise<string>;
     readonly apiUrl: string;
 }
 interface BootstrapFunction {

package/dist/infrastructure/delivery/bootstrap.js

@@ -17,9 +17,9 @@ import { httpReturnQuestionsByCheckoutItemIdView } from "../projection/returnQue
 import { storageUiSettingByKeyView } from "../projection/uiSetting/storageUiSettingByKeyView";
 import { baseBootstrap } from "./baseBootstrap";
 import { fetchHttpGet, fetchHttpPost } from "./http/fetchHttpClient";
-const bootstrap = ({ apiUrl, authToken }) => {
-    const httpGet = fetchHttpGet({ apiUrl, authToken });
-    const httpPost = fetchHttpPost({ apiUrl, authToken });
+const bootstrap = ({ apiUrl, getAuthToken }) => {
+    const httpGet = fetchHttpGet({ apiUrl, getAuthToken });
+    const httpPost = fetchHttpPost({ apiUrl, getAuthToken });
     return baseBootstrap({
         checkoutByIdView: httpCheckoutByIdView({ httpPost }),
         firstAvailableCheckoutByCustomerIdView: httpFirstAvailableCheckoutByCustomerIdView({ httpPost }),

package/dist/infrastructure/delivery/http/fetchHttpClient.d.ts

@@ -1,7 +1,7 @@
 import { HttpGetFunction, HttpPostFunction } from "./httpClient";
 interface FetchHttpFunctionArgs {
     readonly apiUrl: string;
-    readonly authToken: string;
+    readonly getAuthToken: () => Promise<string>;
 }
 interface FetchHttpPostFunction {
     (args: FetchHttpFunctionArgs): HttpPostFunction;

package/dist/infrastructure/delivery/http/fetchHttpClient.js

@@ -1,17 +1,17 @@
-const fetchHttpPost = ({ apiUrl, authToken }) => async ({ endpoint, body, signal }) => fetch(`${apiUrl}${endpoint}`, {
+const fetchHttpPost = ({ apiUrl, getAuthToken }) => async ({ endpoint, body, signal }) => fetch(`${apiUrl}${endpoint}`, {
     method: "POST",
     headers: {
         ["Content-Type"]: "application/json",
-        authorization: `Bearer ${authToken}`,
+        authorization: `Bearer ${await getAuthToken()}`,
     },
     body: JSON.stringify(body),
     signal,
 });
-const fetchHttpGet = ({ apiUrl, authToken }) => async ({ endpoint, signal }) => fetch(`${apiUrl}${endpoint}`, {
+const fetchHttpGet = ({ apiUrl, getAuthToken }) => async ({ endpoint, signal }) => fetch(`${apiUrl}${endpoint}`, {
     method: "GET",
     credentials: "include",
     headers: {
-        Authorization: `Bearer ${authToken}`,
+        Authorization: `Bearer ${await getAuthToken()}`,
         ["Content-Type"]: "application/json",
     },
     referrer: "",

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

@@ -8,7 +8,7 @@ interface RootFunctionArgs {
     readonly Notifications: NotificationsRoot;
     readonly I18n: I18n;
     readonly development?: boolean;
-    readonly authToken: string;
+    readonly getAuthToken: () => Promise<string>;
 }
 interface RootFunction {
     (args: RootFunctionArgs): FC<RootProps>;

package/dist/infrastructure/ui/Root.js

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

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

@@ -6,7 +6,7 @@ interface RoutingProps {
     readonly customerId: string | undefined;
     readonly locale: string;
     readonly I18n: I18n;
-    readonly authToken: string;
+    readonly getAuthToken: () => Promise<string>;
     readonly menu: Menu;
     readonly onNotAccessible: () => void;
     readonly onI18nError?: (err: Error) => void;

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

@@ -11,7 +11,7 @@ const Item = lazy(() => import("../views/item/Item").then((module) => ({ default
 const Summary = lazy(() => import("../views/summary/Summary").then((module) => ({ default: module.Summary })));
 const Checkout = lazy(() => import("../views/checkout/Checkout").then((module) => ({ default: module.Checkout })));
 const Feedback = lazy(() => import("../views/feedback/Feedback").then((module) => ({ default: module.Feedback })));
-const Routing = ({ basePath = "", customerId, locale, I18n, authToken, menu, onI18nError, onNotAccessible, useRedirect, }) => {
+const Routing = ({ basePath = "", customerId, locale, I18n, getAuthToken, menu, onI18nError, onNotAccessible, useRedirect, }) => {
     const routes = useRoutes([
         {
             path: "",
@@ -45,7 +45,7 @@ const Routing = ({ basePath = "", customerId, locale, I18n, authToken, menu, onI
                 {
                     path: Routes.CHECKOUT,
                     element: (React.createElement(Suspense, { fallback: React.createElement(Spinner, null) },
-                        React.createElement(Checkout, { authToken: authToken, customerId: customerId, useRedirect: useRedirect }))),
+                        React.createElement(Checkout, { customerId: customerId, getAuthToken: getAuthToken, useRedirect: useRedirect }))),
                 },
                 {
                     path: Routes.FEEDBACK,

package/dist/infrastructure/ui/views/checkout/Checkout.d.ts

@@ -1,7 +1,7 @@
 import { FC } from "react";
 interface CheckoutProps {
     readonly customerId: string;
-    readonly authToken: string;
+    readonly getAuthToken: () => Promise<string>;
     readonly useRedirect: () => Record<string, string>;
 }
 declare const Checkout: FC<CheckoutProps>;

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

@@ -3,7 +3,7 @@ import { useI18nMessage } from "@lookiero/i18n-react";
 import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
 import { PaymentFlow, PaymentInstrumentSelect, PaymentMethod, Section } from "@lookiero/payments-front";
 import { ChargeStatus } from "@lookiero/payments-front/build/infrastructure/CheckoutAPI";
-import React, { useCallback, useMemo, useRef, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { View } from "react-native";
 import { useNavigate } from "react-router-native";
 import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
@@ -24,10 +24,15 @@ import { Pricing } from "../summary/components/pricing/Pricing";
 import { style } from "./Checkout.style";
 import { CheckoutSuccessModal } from "./components/checkoutSuccessModal/CheckoutSuccessModal";
 import { DeliveryBanner } from "./components/deliveryBanner/DeliveryBanner";
-const Checkout = ({ customerId, authToken, useRedirect }) => {
+const Checkout = ({ customerId, getAuthToken, useRedirect }) => {
     const titleText = useI18nMessage({ id: I18nMessages.CHECKOUT_TITLE });
     const paymentInstrumentSelectRef = useRef(null);
     const paymentFlowRef = useRef(null);
+    const [authToken, setAuthToken] = useState();
+    useEffect(() => {
+        const loadAuthToken = async () => setAuthToken(await getAuthToken());
+        loadAuthToken();
+    }, [getAuthToken]);
     const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
     const [pricing, pricingStatus] = useViewPricingByCheckoutId({ checkoutId: checkout?.id });
     const [paymentFlowPayload] = useViewPaymentFlowPayloadByCheckoutId({
@@ -83,6 +88,6 @@ const Checkout = ({ customerId, authToken, useRedirect }) => {
                     React.createElement(ProductVariant, { brand: checkoutItem.productVariant.brand, color: checkoutItem.productVariant.color, media: checkoutItem.productVariant.media, name: checkoutItem.productVariant.name, price: checkoutItem.price, size: checkoutItem.productVariant.size, status: checkoutItem.status })))),
                 pricing && (React.createElement(View, { style: style.pricingContainer },
                     React.createElement(Pricing, { balanceDiscount: pricing.balanceDiscount, busy: processingCheckout || markAsPaidStatus === CommandStatus.LOADING, collapsible: false, discount: pricing.discount, discountPercentage: pricing.discountPercentage, orderTotal: pricing.orderTotal, service: pricing.service, subtotal: pricing.subtotal, totalCheckoutItemsKept: checkoutItemsKept?.length || 0, onSubmit: handleOnSubmitCheckout }))))),
-        React.createElement(PaymentFlow, { ref: paymentFlowRef, token: authToken })));
+        authToken && React.createElement(PaymentFlow, { ref: paymentFlowRef, token: authToken })));
 };
 export { Checkout };

package/package.json

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