@lookiero/checkout 0.4.4 → 0.4.5-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/infrastructure/domain/checkoutBooking/react/useBookCheckouBookingForCheckoutItem.d.ts +13 -0
- package/dist/infrastructure/domain/checkoutBooking/react/useBookCheckouBookingForCheckoutItem.js +14 -0
- package/dist/infrastructure/projection/bookedSizeChangeProductsVariants/httpBookedSizeChangeProductsVariantsForCheckoutItemView.d.ts +12 -0
- package/dist/infrastructure/projection/bookedSizeChangeProductsVariants/httpBookedSizeChangeProductsVariantsForCheckoutItemView.js +9 -0
- package/dist/infrastructure/projection/bookedSizeChangeProductsVariants/react/useViewBookedSizeChangeProductsVariantsForCheckoutItem.d.ts +10 -0
- package/dist/infrastructure/projection/bookedSizeChangeProductsVariants/react/useViewBookedSizeChangeProductsVariantsForCheckoutItem.js +12 -0
- package/dist/infrastructure/projection/checkoutFeedback/httpCheckoutFeedbackByCheckoutIdView.d.ts +12 -0
- package/dist/infrastructure/projection/checkoutFeedback/httpCheckoutFeedbackByCheckoutIdView.js +9 -0
- package/dist/infrastructure/ui/views/checkout/Checkout.js +2 -2
- package/dist/infrastructure/ui/views/feedback/Feedback.js +2 -1
- package/dist/infrastructure/ui/views/header/Header.js +13 -14
- package/dist/infrastructure/ui/views/header/Header.style.d.ts +10 -4
- package/dist/infrastructure/ui/views/header/Header.style.js +10 -4
- package/dist/infrastructure/ui/views/intro/Intro.js +2 -2
- package/dist/infrastructure/ui/views/item/Item.js +1 -1
- package/dist/infrastructure/ui/views/summary/Summary.js +6 -4
- package/dist/infrastructure/ui/views/summary/components/stickyPricing/StickyPricing.d.ts +2 -0
- package/dist/infrastructure/ui/views/summary/components/stickyPricing/StickyPricing.js +1 -1
- package/dist/projection/bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants.d.ts +10 -0
- package/dist/projection/bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants.js +1 -0
- package/dist/projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem.d.ts +25 -0
- package/dist/projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem.js +8 -0
- package/dist/projection/checkoutFeedback/viewCheckoutFeedbackByCheckoutId.d.ts +25 -0
- package/dist/projection/checkoutFeedback/viewCheckoutFeedbackByCheckoutId.js +8 -0
- package/package.json +1 -1
package/dist/infrastructure/domain/checkoutBooking/react/useBookCheckouBookingForCheckoutItem.d.ts
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { CommandStatus } from "@lookiero/messaging-react";
|
|
2
|
+
interface BookFunction {
|
|
3
|
+
(): Promise<void>;
|
|
4
|
+
}
|
|
5
|
+
type UseBookCheckouBookingForCheckoutItem = [book: BookFunction, status: CommandStatus];
|
|
6
|
+
interface UseBookCheckouBookingForCheckoutItemFunctionArgs {
|
|
7
|
+
readonly checkoutItemId: string;
|
|
8
|
+
}
|
|
9
|
+
interface UseBookCheckouBookingForCheckoutItemFunction {
|
|
10
|
+
(args: UseBookCheckouBookingForCheckoutItemFunctionArgs): UseBookCheckouBookingForCheckoutItem;
|
|
11
|
+
}
|
|
12
|
+
declare const useBookCheckouBookingForCheckoutItem: UseBookCheckouBookingForCheckoutItemFunction;
|
|
13
|
+
export { useBookCheckouBookingForCheckoutItem };
|
package/dist/infrastructure/domain/checkoutBooking/react/useBookCheckouBookingForCheckoutItem.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { useCommand } from "@lookiero/messaging-react";
|
|
2
|
+
import { useCallback } from "react";
|
|
3
|
+
import { v4 as uuid } from "uuid";
|
|
4
|
+
import { bookCheckoutBookingForCheckoutItem } from "../../../../domain/checkoutBooking/command/bookCheckoutBookingForCheckoutItem";
|
|
5
|
+
import { MESSAGING_CONTEXT_ID } from "../../../delivery/baseBootstrap";
|
|
6
|
+
const useBookCheckouBookingForCheckoutItem = ({ checkoutItemId }) => {
|
|
7
|
+
const [commandBus, status] = useCommand({ contextId: MESSAGING_CONTEXT_ID });
|
|
8
|
+
const book = useCallback(() => commandBus(bookCheckoutBookingForCheckoutItem({
|
|
9
|
+
aggregateId: uuid(),
|
|
10
|
+
checkoutItemId,
|
|
11
|
+
})), [checkoutItemId, commandBus]);
|
|
12
|
+
return [book, status];
|
|
13
|
+
};
|
|
14
|
+
export { useBookCheckouBookingForCheckoutItem };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { BookedSizeChangeProductsVariantsForCheckoutItemView } from "../../../projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem";
|
|
2
|
+
import { HttpPostFunction } from "../../delivery/http/httpClient";
|
|
3
|
+
interface HttpBookedSizeChangeProductsVariantsForCheckoutItemView extends BookedSizeChangeProductsVariantsForCheckoutItemView {
|
|
4
|
+
}
|
|
5
|
+
interface HttpBookedSizeChangeProductsVariantsForCheckoutItemViewFunctionArgs {
|
|
6
|
+
readonly httpPost: HttpPostFunction;
|
|
7
|
+
}
|
|
8
|
+
interface HttpBookedSizeChangeProductsVariantsForCheckoutItemViewFunction {
|
|
9
|
+
(args: HttpBookedSizeChangeProductsVariantsForCheckoutItemViewFunctionArgs): HttpBookedSizeChangeProductsVariantsForCheckoutItemView;
|
|
10
|
+
}
|
|
11
|
+
declare const httpBookedSizeChangeProductsVariantsForCheckoutItemView: HttpBookedSizeChangeProductsVariantsForCheckoutItemViewFunction;
|
|
12
|
+
export { httpBookedSizeChangeProductsVariantsForCheckoutItemView };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
const httpBookedSizeChangeProductsVariantsForCheckoutItemView = ({ httpPost }) => async ({ checkoutItemId, signal }) => {
|
|
2
|
+
const response = await httpPost({
|
|
3
|
+
endpoint: "/view-booked-size-change-product-variants-for-checkout-item",
|
|
4
|
+
body: { checkoutItemId },
|
|
5
|
+
signal,
|
|
6
|
+
});
|
|
7
|
+
return !response.ok || response.status === 404 ? null : (await response.json()).result;
|
|
8
|
+
};
|
|
9
|
+
export { httpBookedSizeChangeProductsVariantsForCheckoutItemView };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { UseQueryFunctionResult } from "@lookiero/messaging-react";
|
|
2
|
+
import { BookedSizeChangeProductsVariantsProjection } from "../../../../projection/bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants";
|
|
3
|
+
interface UseViewBookedSizeChangeProductsVariantsForCheckoutItemFunctionArgs {
|
|
4
|
+
readonly checkoutItemId: string;
|
|
5
|
+
}
|
|
6
|
+
interface UseViewBookedSizeChangeProductsVariantsForCheckoutItemFunction {
|
|
7
|
+
(args: UseViewBookedSizeChangeProductsVariantsForCheckoutItemFunctionArgs): UseQueryFunctionResult<BookedSizeChangeProductsVariantsProjection>;
|
|
8
|
+
}
|
|
9
|
+
declare const useViewBookedSizeChangeProductsVariantsForCheckoutItem: UseViewBookedSizeChangeProductsVariantsForCheckoutItemFunction;
|
|
10
|
+
export { useViewBookedSizeChangeProductsVariantsForCheckoutItem };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { useQuery } from "@lookiero/messaging-react";
|
|
2
|
+
import { CHECKOUT_BOOKING_BOOKED, } from "../../../../domain/checkoutBooking/model/checkoutBookingBooked";
|
|
3
|
+
import { viewBookedSizeChangeProductsVariantsForCheckoutItem } from "../../../../projection/bookedSizeChangeProductsVariants/viewBookedSizeChangeProductVariantsForCheckoutItem";
|
|
4
|
+
import { MESSAGING_CONTEXT_ID } from "../../../delivery/baseBootstrap";
|
|
5
|
+
const isCheckoutBookingBooked = (event) => event.name === CHECKOUT_BOOKING_BOOKED;
|
|
6
|
+
const useViewBookedSizeChangeProductsVariantsForCheckoutItem = ({ checkoutItemId }) => useQuery({
|
|
7
|
+
query: viewBookedSizeChangeProductsVariantsForCheckoutItem({ checkoutItemId }),
|
|
8
|
+
contextId: MESSAGING_CONTEXT_ID,
|
|
9
|
+
invalidation: isCheckoutBookingBooked,
|
|
10
|
+
options: { staleTime: Infinity, retry: false, refetchOnWindowFocus: false },
|
|
11
|
+
});
|
|
12
|
+
export { useViewBookedSizeChangeProductsVariantsForCheckoutItem };
|
package/dist/infrastructure/projection/checkoutFeedback/httpCheckoutFeedbackByCheckoutIdView.d.ts
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { CheckoutFeedbackByCheckoutIdView } from "../../../projection/checkoutFeedback/viewCheckoutFeedbackByCheckoutId";
|
|
2
|
+
import { HttpPostFunction } from "../../delivery/http/httpClient";
|
|
3
|
+
interface HttpCheckoutFeebackByCheckoutIdView extends CheckoutFeedbackByCheckoutIdView {
|
|
4
|
+
}
|
|
5
|
+
interface HttpCheckoutFeebackByCheckoutIdViewFunctionArgs {
|
|
6
|
+
readonly httpPost: HttpPostFunction;
|
|
7
|
+
}
|
|
8
|
+
interface HttpCheckoutFeebackByCheckoutIdViewFunction {
|
|
9
|
+
(args: HttpCheckoutFeebackByCheckoutIdViewFunctionArgs): HttpCheckoutFeebackByCheckoutIdView;
|
|
10
|
+
}
|
|
11
|
+
declare const httpCheckoutFeebackByCheckoutIdView: HttpCheckoutFeebackByCheckoutIdViewFunction;
|
|
12
|
+
export { httpCheckoutFeebackByCheckoutIdView };
|
package/dist/infrastructure/projection/checkoutFeedback/httpCheckoutFeedbackByCheckoutIdView.js
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
const httpCheckoutFeebackByCheckoutIdView = ({ httpPost }) => async ({ checkoutId, signal }) => {
|
|
2
|
+
const response = await httpPost({
|
|
3
|
+
endpoint: "/view-checkout-feedback-by-checkout-id",
|
|
4
|
+
body: { checkoutId },
|
|
5
|
+
signal,
|
|
6
|
+
});
|
|
7
|
+
return !response.ok || response.status === 404 ? null : (await response.json()).result;
|
|
8
|
+
};
|
|
9
|
+
export { httpCheckoutFeebackByCheckoutIdView };
|
|
@@ -3,7 +3,7 @@ import { useI18nMessage } from "@lookiero/i18n-react";
|
|
|
3
3
|
import { QueryStatus } from "@lookiero/messaging-react";
|
|
4
4
|
import { PaymentInstrumentSelect, PaymentMethod, Section } from "@lookiero/payments-front";
|
|
5
5
|
import React, { useCallback, useMemo, useRef } from "react";
|
|
6
|
-
import { View } from "react-native";
|
|
6
|
+
import { Platform, View } from "react-native";
|
|
7
7
|
import { useNavigate } from "react-router-native";
|
|
8
8
|
import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
|
|
9
9
|
import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
|
|
@@ -38,7 +38,7 @@ const Checkout = ({ children, customerId, useRedirect }) => {
|
|
|
38
38
|
if (!dependenciesLoaded)
|
|
39
39
|
return React.createElement(Spinner, null);
|
|
40
40
|
return (React.createElement(React.Fragment, null,
|
|
41
|
-
React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT },
|
|
41
|
+
React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" ? HEADER_HEIGHT : 0 },
|
|
42
42
|
React.createElement(Body, { style: { column: style.bodyColumn } },
|
|
43
43
|
hasReplacedCheckoutItem && (React.createElement(View, { style: style.deliveryBannerContainer },
|
|
44
44
|
React.createElement(DeliveryBanner, null))),
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
|
|
2
2
|
import React, { useCallback } from "react";
|
|
3
|
+
import { Platform } from "react-native";
|
|
3
4
|
import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
|
|
4
5
|
import { useGiveCheckoutFeedback } from "../../../domain/checkoutFeedback/react/useGiveCheckoutFeedback";
|
|
5
6
|
import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
|
|
@@ -29,7 +30,7 @@ const Feedback = ({ customerId }) => {
|
|
|
29
30
|
if (!dependenciesLoaded)
|
|
30
31
|
return React.createElement(Spinner, null);
|
|
31
32
|
return (React.createElement(CheckoutQuestionFeedbackProvider, { feedback: {} },
|
|
32
|
-
React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT },
|
|
33
|
+
React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" ? HEADER_HEIGHT : 0 },
|
|
33
34
|
React.createElement(Body, { style: { column: style.bodyColumn } },
|
|
34
35
|
React.createElement(CheckoutQuestionsForm, { checkoutQuestions: checkoutQuestions || [], submitButtonDisabled: giveCheckoutFeedbackStatus === CommandStatus.LOADING, onSubmit: handleOnSubmit })))));
|
|
35
36
|
};
|
|
@@ -2,7 +2,7 @@ import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Tex
|
|
|
2
2
|
import { useI18nMessage } from "@lookiero/i18n-react";
|
|
3
3
|
import React, { useCallback, useState } from "react";
|
|
4
4
|
import { View } from "react-native";
|
|
5
|
-
import { SafeAreaView
|
|
5
|
+
import { SafeAreaView } from "react-native-safe-area-context";
|
|
6
6
|
import { generatePath, useMatch, useNavigate, useParams } from "react-router-native";
|
|
7
7
|
import { ButtonIcon } from "../../../../shared/ui/components/molecules/buttonIcon/ButtonIcon";
|
|
8
8
|
import { useViewFirstAvailableCheckoutByCustomerId } from "../../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
|
|
@@ -12,11 +12,11 @@ import { useBasePath } from "../../routing/useBasePath";
|
|
|
12
12
|
import { style } from "./Header.style";
|
|
13
13
|
import { Logo } from "./components/Logo";
|
|
14
14
|
const ButtonIconPlaceholder = () => React.createElement(View, { style: style.buttonIconPlaceholder });
|
|
15
|
-
const DefaultHeader = ({ onOpenMenu
|
|
15
|
+
const DefaultHeader = ({ onOpenMenu }) => (React.createElement(View, { style: style.header, testID: "default-header" },
|
|
16
16
|
React.createElement(Logo, { style: style.logo }),
|
|
17
17
|
React.createElement(ButtonIconPlaceholder, null),
|
|
18
18
|
React.createElement(ButtonIcon, { name: "menu", onPress: onOpenMenu })));
|
|
19
|
-
const ItemHeader = ({ items, item
|
|
19
|
+
const ItemHeader = ({ items, item }) => {
|
|
20
20
|
const title = useI18nMessage({ id: I18nMessages.HEADER_CHECKOUT_TITLE });
|
|
21
21
|
const itemIndex = items.indexOf(item);
|
|
22
22
|
const isFirstItem = itemIndex === 0;
|
|
@@ -33,32 +33,31 @@ const ItemHeader = ({ items, item, style: customStyle }) => {
|
|
|
33
33
|
const nextItem = items[nextItemIndex];
|
|
34
34
|
navigate(generatePath(`${basePath}/${Routes.ITEM}`, { id: nextItem.id }));
|
|
35
35
|
}, [basePath, itemIndex, items, navigate]);
|
|
36
|
-
return (React.createElement(View, { style:
|
|
36
|
+
return (React.createElement(View, { style: style.header, testID: "item-header" },
|
|
37
37
|
!isFirstItem ? React.createElement(ButtonIcon, { name: "arrow-left", onPress: navigateToPreviousItem }) : React.createElement(ButtonIconPlaceholder, null),
|
|
38
38
|
React.createElement(Text, { level: 3, style: style.title, detail: true }, title),
|
|
39
39
|
!isLastItem ? React.createElement(ButtonIcon, { name: "arrow-right", onPress: navigateToNextItem }) : React.createElement(ButtonIconPlaceholder, null)));
|
|
40
40
|
};
|
|
41
|
-
const ItemDetailHeader = (
|
|
41
|
+
const ItemDetailHeader = () => {
|
|
42
42
|
const title = useI18nMessage({ id: I18nMessages.HEADER_CHECKOUT_TITLE });
|
|
43
43
|
const navigate = useNavigate();
|
|
44
44
|
const handleOnBack = useCallback(() => navigate(-1), [navigate]);
|
|
45
|
-
return (React.createElement(View, { style:
|
|
45
|
+
return (React.createElement(View, { style: style.header, testID: "item-detail-header" },
|
|
46
46
|
React.createElement(ButtonIconPlaceholder, null),
|
|
47
47
|
React.createElement(Text, { level: 3, style: style.title, detail: true }, title),
|
|
48
48
|
React.createElement(ButtonIcon, { name: "close", onPress: handleOnBack })));
|
|
49
49
|
};
|
|
50
|
-
const CheckoutHeader = (
|
|
50
|
+
const CheckoutHeader = () => {
|
|
51
51
|
const title = useI18nMessage({ id: I18nMessages.HEADER_COMPLETE_CHECKOUT_TITLE });
|
|
52
52
|
const basePath = useBasePath();
|
|
53
53
|
const navigate = useNavigate();
|
|
54
54
|
const handleOnBack = useCallback(() => navigate(`${basePath}/${Routes.SUMMARY}`), [basePath, navigate]);
|
|
55
|
-
return (React.createElement(View, { style:
|
|
55
|
+
return (React.createElement(View, { style: style.header, testID: "checkout-header" },
|
|
56
56
|
React.createElement(ButtonIcon, { name: "arrow-left", onPress: handleOnBack }),
|
|
57
57
|
React.createElement(Text, { level: 3, style: style.title, detail: true }, title),
|
|
58
58
|
React.createElement(ButtonIconPlaceholder, null)));
|
|
59
59
|
};
|
|
60
60
|
const Header = ({ customerId, menu: Menu, style: customStyle }) => {
|
|
61
|
-
const { top: safeAreaInsetTop } = useSafeAreaInsets();
|
|
62
61
|
const { id: itemId } = useParams();
|
|
63
62
|
const [checkout] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
|
|
64
63
|
const currentItem = checkout?.items.find((item) => item.id === itemId);
|
|
@@ -72,19 +71,19 @@ const Header = ({ customerId, menu: Menu, style: customStyle }) => {
|
|
|
72
71
|
let header;
|
|
73
72
|
if (checkout?.items && currentItem) {
|
|
74
73
|
if (itemRouteMatch) {
|
|
75
|
-
header = React.createElement(ItemHeader, { item: currentItem, items: checkout.items
|
|
74
|
+
header = React.createElement(ItemHeader, { item: currentItem, items: checkout.items });
|
|
76
75
|
}
|
|
77
76
|
else if (itemDetailRouteMatch) {
|
|
78
|
-
header = React.createElement(ItemDetailHeader,
|
|
77
|
+
header = React.createElement(ItemDetailHeader, null);
|
|
79
78
|
}
|
|
80
79
|
}
|
|
81
80
|
else if (checkoutRouteMatch) {
|
|
82
|
-
header = React.createElement(CheckoutHeader,
|
|
81
|
+
header = React.createElement(CheckoutHeader, null);
|
|
83
82
|
}
|
|
84
83
|
else {
|
|
85
|
-
header = React.createElement(DefaultHeader, {
|
|
84
|
+
header = React.createElement(DefaultHeader, { onOpenMenu: handleOnOpenMenu });
|
|
86
85
|
}
|
|
87
|
-
return (React.createElement(SafeAreaView, { edges: ["top"], style: [style.container,
|
|
86
|
+
return (React.createElement(SafeAreaView, { edges: ["top"], style: [style.container, customStyle] },
|
|
88
87
|
header,
|
|
89
88
|
React.createElement(Menu, { visible: menuVisible, onClose: handleOnCloseMenu })));
|
|
90
89
|
};
|
|
@@ -1,21 +1,27 @@
|
|
|
1
1
|
declare const HEADER_HEIGHT: number;
|
|
2
2
|
declare const style: {
|
|
3
3
|
buttonIconPlaceholder: {
|
|
4
|
+
flexGrow: number;
|
|
4
5
|
height: number;
|
|
5
6
|
width: number;
|
|
6
7
|
};
|
|
7
8
|
container: {
|
|
8
|
-
|
|
9
|
-
|
|
9
|
+
flexDirection: "row";
|
|
10
|
+
flexGrow: number;
|
|
10
11
|
height: number;
|
|
11
|
-
paddingHorizontal: number;
|
|
12
12
|
width: string;
|
|
13
13
|
};
|
|
14
14
|
header: {
|
|
15
15
|
alignItems: "center";
|
|
16
|
-
|
|
16
|
+
backgroundColor: string;
|
|
17
17
|
flexDirection: "row";
|
|
18
|
+
flexGrow: number;
|
|
19
|
+
flexWrap: "nowrap";
|
|
20
|
+
height: number;
|
|
18
21
|
justifyContent: "space-between";
|
|
22
|
+
overflow: "visible";
|
|
23
|
+
paddingHorizontal: number;
|
|
24
|
+
width: string;
|
|
19
25
|
};
|
|
20
26
|
logo: {
|
|
21
27
|
left: number;
|
|
@@ -4,21 +4,27 @@ const { colorBase, spaceXXL, spaceXXXL, spaceS } = theme();
|
|
|
4
4
|
const HEADER_HEIGHT = spaceXXXL;
|
|
5
5
|
const style = StyleSheet.create({
|
|
6
6
|
buttonIconPlaceholder: {
|
|
7
|
+
flexGrow: 0,
|
|
7
8
|
height: spaceXXL,
|
|
8
9
|
width: spaceXXL,
|
|
9
10
|
},
|
|
10
11
|
container: {
|
|
11
|
-
|
|
12
|
-
|
|
12
|
+
flexDirection: "row",
|
|
13
|
+
flexGrow: 0,
|
|
13
14
|
height: HEADER_HEIGHT,
|
|
14
|
-
paddingHorizontal: spaceS,
|
|
15
15
|
width: "100%",
|
|
16
16
|
},
|
|
17
17
|
header: {
|
|
18
18
|
alignItems: "center",
|
|
19
|
-
|
|
19
|
+
backgroundColor: colorBase,
|
|
20
20
|
flexDirection: "row",
|
|
21
|
+
flexGrow: 0,
|
|
22
|
+
flexWrap: "nowrap",
|
|
23
|
+
height: HEADER_HEIGHT,
|
|
21
24
|
justifyContent: "space-between",
|
|
25
|
+
overflow: "visible",
|
|
26
|
+
paddingHorizontal: spaceS,
|
|
27
|
+
width: "100%",
|
|
22
28
|
},
|
|
23
29
|
logo: {
|
|
24
30
|
left: 0,
|
|
@@ -4,7 +4,7 @@ import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Tex
|
|
|
4
4
|
import { useI18nMessage } from "@lookiero/i18n-react";
|
|
5
5
|
import { CommandStatus, QueryStatus } from "@lookiero/messaging-react";
|
|
6
6
|
import React from "react";
|
|
7
|
-
import { View } from "react-native";
|
|
7
|
+
import { Platform, View } from "react-native";
|
|
8
8
|
import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
|
|
9
9
|
import { useIncrementIntroShownCount } from "../../../domain/uiSetting/react/useIncrementIntroShownCount";
|
|
10
10
|
import { useViewFiveItemsDiscountByCustomerId } from "../../../projection/checkout/react/useViewFiveItemsDiscountByCustomerId";
|
|
@@ -30,7 +30,7 @@ const Intro = ({ customerId }) => {
|
|
|
30
30
|
const [incrementIntroShownCount, incrementIntroShownCountStatus] = useIncrementIntroShownCount();
|
|
31
31
|
if (fiveItemsDiscountStatus === QueryStatus.LOADING)
|
|
32
32
|
return React.createElement(Spinner, null);
|
|
33
|
-
return (React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT },
|
|
33
|
+
return (React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" ? HEADER_HEIGHT : 0 },
|
|
34
34
|
React.createElement(Body, { style: { column: style.bodyColumn } },
|
|
35
35
|
React.createElement(View, { style: style.container },
|
|
36
36
|
React.createElement(View, { style: style.content },
|
|
@@ -136,7 +136,7 @@ const Item = ({ customerId }) => {
|
|
|
136
136
|
return (React.createElement(ReturnQuestionFeedbackProvider, { feedback: checkoutItem.feedbacks || {} },
|
|
137
137
|
React.createElement(SizeWithoutStockModal, { visible: sizeWithoutStockModalVisible, onDismiss: handleOnHideSizeWithoutStockModal }),
|
|
138
138
|
React.createElement(SizeChangeModal, { visible: sizeChangeModalVisible, onDismiss: handleOnHideSizeChangeModal }),
|
|
139
|
-
React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT },
|
|
139
|
+
React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" ? HEADER_HEIGHT : 0 },
|
|
140
140
|
React.createElement(Body, null,
|
|
141
141
|
customerDecissionMade && (React.createElement(CustomerDecissionBanner, { checkoutItemStatus: checkoutItem.status, onPress: handleOnBannerPress })),
|
|
142
142
|
React.createElement(View, { style: [style.container, { paddingBottom: Platform.OS === "web" ? spaceXL : stickyHeight }] },
|
|
@@ -2,7 +2,7 @@ import { Text } from "@lookiero/aurora-next/build/components/primitives/Text/Tex
|
|
|
2
2
|
import { useI18nMessage } from "@lookiero/i18n-react";
|
|
3
3
|
import { QueryStatus } from "@lookiero/messaging-react";
|
|
4
4
|
import React, { useCallback, useMemo, useState } from "react";
|
|
5
|
-
import { View } from "react-native";
|
|
5
|
+
import { Platform, View } from "react-native";
|
|
6
6
|
import { generatePath, useNavigate } from "react-router-native";
|
|
7
7
|
import { CheckoutItemStatus } from "../../../../domain/checkoutItem/model/checkoutItem";
|
|
8
8
|
import { Spinner } from "../../../../shared/ui/components/atoms/spinner/Spinner";
|
|
@@ -24,6 +24,8 @@ const { spaceXL } = theme();
|
|
|
24
24
|
const Summary = ({ customerId }) => {
|
|
25
25
|
const titleText = useI18nMessage({ id: I18nMessages.SUMMARY_TITLE });
|
|
26
26
|
const descriptionText = useI18nMessage({ id: I18nMessages.SUMMARY_DESCRIPTION });
|
|
27
|
+
const [pricingHeight, setPricingHeight] = useState(0);
|
|
28
|
+
const handleOnPricingLayout = useCallback(({ height }) => setPricingHeight(height), []);
|
|
27
29
|
const [checkout, checkoutStatus] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
|
|
28
30
|
const [pricing, pricingStatus] = useViewPricingByCheckoutId({ checkoutId: checkout?.id });
|
|
29
31
|
const [fiveItemsDiscount = 0, fiveItemsDiscountStatus] = useViewFiveItemsDiscountByCustomerId({ customerId });
|
|
@@ -42,13 +44,13 @@ const Summary = ({ customerId }) => {
|
|
|
42
44
|
if (!dependenciesLoaded)
|
|
43
45
|
return React.createElement(Spinner, null);
|
|
44
46
|
return (React.createElement(React.Fragment, null,
|
|
45
|
-
React.createElement(SafeAreaScrollView, { scrollerPaddingTop: HEADER_HEIGHT, style: { safeAreaView: style.container } },
|
|
46
|
-
React.createElement(Body, { style: { row: { paddingBottom: spaceXL } } },
|
|
47
|
+
React.createElement(SafeAreaScrollView, { scrollerPaddingTop: Platform.OS === "web" ? HEADER_HEIGHT : 0, style: { safeAreaView: style.container } },
|
|
48
|
+
React.createElement(Body, { style: { row: { paddingBottom: pricingHeight || spaceXL } } },
|
|
47
49
|
fiveItemsDiscount !== 0 && React.createElement(FiveItemsDiscountBanner, { fiveItemsDiscount: fiveItemsDiscount }),
|
|
48
50
|
React.createElement(View, { style: style.content },
|
|
49
51
|
React.createElement(Text, { level: 3, style: style.title, heading: true }, titleText),
|
|
50
52
|
React.createElement(Text, { level: 3, style: style.description, body: true }, descriptionText)),
|
|
51
53
|
React.createElement(CheckoutItemsTabs, { checkoutItemsKept: checkoutItemsKept || [], checkoutItemsReturned: checkoutItemsReturned || [], onPressItem: handleOnPressItem }))),
|
|
52
|
-
pricing && (React.createElement(StickyPricing, { collapsed: pricingCollapsed, pricing: pricing, totalCheckoutItemsKept: checkoutItemsKept?.length || 0, onPress: handleOnPressPricing, onSubmit: handleOnSubmit }))));
|
|
54
|
+
pricing && (React.createElement(StickyPricing, { collapsed: pricingCollapsed, pricing: pricing, totalCheckoutItemsKept: checkoutItemsKept?.length || 0, onLayout: Platform.OS !== "web" ? handleOnPricingLayout : undefined, onPress: handleOnPressPricing, onSubmit: handleOnSubmit }))));
|
|
53
55
|
};
|
|
54
56
|
export { Summary };
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import { FC } from "react";
|
|
2
2
|
import { PricingProjection } from "../../../../../../projection/pricing/pricing";
|
|
3
|
+
import { Layout } from "../../../../../../shared/ui/components/layouts/sticky/Sticky";
|
|
3
4
|
interface StickyPricingProps {
|
|
4
5
|
readonly pricing: PricingProjection;
|
|
5
6
|
readonly totalCheckoutItemsKept: number;
|
|
6
7
|
readonly collapsed: boolean;
|
|
7
8
|
readonly onPress: () => void;
|
|
8
9
|
readonly onSubmit: () => void;
|
|
10
|
+
readonly onLayout?: ({ width, height }: Layout) => void;
|
|
9
11
|
}
|
|
10
12
|
declare const StickyPricing: FC<StickyPricingProps>;
|
|
11
13
|
export { StickyPricing };
|
|
@@ -3,7 +3,7 @@ import { Sticky } from "../../../../../../shared/ui/components/layouts/sticky/St
|
|
|
3
3
|
import { Body } from "../../../../components/layouts/body/Body";
|
|
4
4
|
import { Pricing } from "../pricing/Pricing";
|
|
5
5
|
import { style } from "./StickyPricing.style";
|
|
6
|
-
const StickyPricing = ({ pricing, totalCheckoutItemsKept, collapsed, onPress, onSubmit }) => (React.createElement(Sticky,
|
|
6
|
+
const StickyPricing = ({ pricing, totalCheckoutItemsKept, collapsed, onPress, onSubmit, onLayout, }) => (React.createElement(Sticky, { onLayout: onLayout },
|
|
7
7
|
React.createElement(Body, { style: { column: style.container } },
|
|
8
8
|
React.createElement(Pricing, { balanceDiscount: pricing.balanceDiscount, collapsed: collapsed, discount: pricing.discount, discountPercentage: pricing.discountPercentage, orderTotal: pricing.orderTotal, service: pricing.service, subtotal: pricing.subtotal, totalCheckoutItemsKept: totalCheckoutItemsKept, onPress: onPress, onSubmit: onSubmit }))));
|
|
9
9
|
export { StickyPricing };
|
package/dist/projection/bookedSizeChangeProductsVariants/bookedSizeChangeProductsVariants.d.ts
ADDED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { SizeProjection } from "../shared/size";
|
|
2
|
+
interface ProductVariantProjection {
|
|
3
|
+
readonly id: string;
|
|
4
|
+
readonly size: SizeProjection;
|
|
5
|
+
}
|
|
6
|
+
interface BookedSizeChangeProductsVariantsProjection {
|
|
7
|
+
readonly bookingId: string;
|
|
8
|
+
readonly productVariants: ProductVariantProjection[];
|
|
9
|
+
}
|
|
10
|
+
export type { BookedSizeChangeProductsVariantsProjection, ProductVariantProjection };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { CancelableQueryViewArgs, Query, QueryHandlerFunction, QueryHandlerFunctionArgs } from "@lookiero/messaging";
|
|
2
|
+
import { BookedSizeChangeProductsVariantsProjection } from "./bookedSizeChangeProductsVariants";
|
|
3
|
+
declare const VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM = "view_booked_size_change_product_variants_for_checkout_item";
|
|
4
|
+
interface ViewBookedSizeChangeProductsVariantsForCheckoutItemPayload {
|
|
5
|
+
readonly checkoutItemId: string;
|
|
6
|
+
}
|
|
7
|
+
interface ViewBookedSizeChangeProductsVariantsForCheckoutItem extends Query<typeof VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM>, ViewBookedSizeChangeProductsVariantsForCheckoutItemPayload {
|
|
8
|
+
}
|
|
9
|
+
interface ViewBookedSizeChangeProductsVariantsForCheckoutItemFunction {
|
|
10
|
+
(payload: ViewBookedSizeChangeProductsVariantsForCheckoutItemPayload): ViewBookedSizeChangeProductsVariantsForCheckoutItem;
|
|
11
|
+
}
|
|
12
|
+
declare const viewBookedSizeChangeProductsVariantsForCheckoutItem: ViewBookedSizeChangeProductsVariantsForCheckoutItemFunction;
|
|
13
|
+
type ViewBookedSizeChangeProductsVariantsForCheckoutItemResult = BookedSizeChangeProductsVariantsProjection | null;
|
|
14
|
+
interface BookedSizeChangeProductsVariantsForCheckoutItemViewArgs extends CancelableQueryViewArgs {
|
|
15
|
+
readonly checkoutItemId: string;
|
|
16
|
+
}
|
|
17
|
+
interface BookedSizeChangeProductsVariantsForCheckoutItemView {
|
|
18
|
+
(args: BookedSizeChangeProductsVariantsForCheckoutItemViewArgs): Promise<ViewBookedSizeChangeProductsVariantsForCheckoutItemResult>;
|
|
19
|
+
}
|
|
20
|
+
interface ViewBookedSizeChangeProductsVariantsForCheckoutItemHandlerFunctionArgs extends QueryHandlerFunctionArgs {
|
|
21
|
+
readonly view: BookedSizeChangeProductsVariantsForCheckoutItemView;
|
|
22
|
+
}
|
|
23
|
+
declare const viewBookedSizeChangeProductsVariantsForCheckoutItemHandler: QueryHandlerFunction<ViewBookedSizeChangeProductsVariantsForCheckoutItem, ViewBookedSizeChangeProductsVariantsForCheckoutItemResult, ViewBookedSizeChangeProductsVariantsForCheckoutItemHandlerFunctionArgs>;
|
|
24
|
+
export type { ViewBookedSizeChangeProductsVariantsForCheckoutItem, BookedSizeChangeProductsVariantsForCheckoutItemView, ViewBookedSizeChangeProductsVariantsForCheckoutItemResult, };
|
|
25
|
+
export { VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, viewBookedSizeChangeProductsVariantsForCheckoutItem, viewBookedSizeChangeProductsVariantsForCheckoutItemHandler, };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { query, } from "@lookiero/messaging";
|
|
2
|
+
const VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM = "view_booked_size_change_product_variants_for_checkout_item";
|
|
3
|
+
const viewBookedSizeChangeProductsVariantsForCheckoutItem = (payload) => ({
|
|
4
|
+
...query({ name: VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM }),
|
|
5
|
+
...payload,
|
|
6
|
+
});
|
|
7
|
+
const viewBookedSizeChangeProductsVariantsForCheckoutItemHandler = ({ view, signal }) => async ({ checkoutItemId }) => view({ checkoutItemId, signal });
|
|
8
|
+
export { VIEW_BOOKED_SIZE_CHANGE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM, viewBookedSizeChangeProductsVariantsForCheckoutItem, viewBookedSizeChangeProductsVariantsForCheckoutItemHandler, };
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { CancelableQueryViewArgs, Query, QueryHandlerFunction, QueryHandlerFunctionArgs } from "@lookiero/messaging";
|
|
2
|
+
import { CheckoutFeedbackProjection } from "./checkoutFeedback";
|
|
3
|
+
declare const VIEW_CHECKOUT_FEEDBACK_BY_CHECKOUT_ID = "view_checkout_feedback_by_checkout_id";
|
|
4
|
+
interface ViewCheckoutFeedbackByCheckoutIdPayload {
|
|
5
|
+
readonly checkoutId: string;
|
|
6
|
+
}
|
|
7
|
+
interface ViewCheckoutFeedbackByCheckoutId extends Query<typeof VIEW_CHECKOUT_FEEDBACK_BY_CHECKOUT_ID>, ViewCheckoutFeedbackByCheckoutIdPayload {
|
|
8
|
+
}
|
|
9
|
+
interface ViewCheckoutFeedbackByCheckoutIdFunction {
|
|
10
|
+
(payload: ViewCheckoutFeedbackByCheckoutIdPayload): ViewCheckoutFeedbackByCheckoutId;
|
|
11
|
+
}
|
|
12
|
+
declare const viewCheckoutFeedbackByCheckoutId: ViewCheckoutFeedbackByCheckoutIdFunction;
|
|
13
|
+
type ViewCheckoutFeedbackByCheckoutIdResult = CheckoutFeedbackProjection | null;
|
|
14
|
+
interface CheckoutFeedbackByCheckoutIdViewArgs extends CancelableQueryViewArgs {
|
|
15
|
+
readonly checkoutId: string;
|
|
16
|
+
}
|
|
17
|
+
interface CheckoutFeedbackByCheckoutIdView {
|
|
18
|
+
(args: CheckoutFeedbackByCheckoutIdViewArgs): Promise<ViewCheckoutFeedbackByCheckoutIdResult>;
|
|
19
|
+
}
|
|
20
|
+
interface ViewCheckoutFeedbackByCheckoutIdHandlerFunctionArgs extends QueryHandlerFunctionArgs {
|
|
21
|
+
readonly view: CheckoutFeedbackByCheckoutIdView;
|
|
22
|
+
}
|
|
23
|
+
declare const viewCheckoutFeedbackByCheckoutIdHandler: QueryHandlerFunction<ViewCheckoutFeedbackByCheckoutId, ViewCheckoutFeedbackByCheckoutIdResult, ViewCheckoutFeedbackByCheckoutIdHandlerFunctionArgs>;
|
|
24
|
+
export type { ViewCheckoutFeedbackByCheckoutId, CheckoutFeedbackByCheckoutIdView, ViewCheckoutFeedbackByCheckoutIdResult, };
|
|
25
|
+
export { VIEW_CHECKOUT_FEEDBACK_BY_CHECKOUT_ID, viewCheckoutFeedbackByCheckoutId, viewCheckoutFeedbackByCheckoutIdHandler, };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { query, } from "@lookiero/messaging";
|
|
2
|
+
const VIEW_CHECKOUT_FEEDBACK_BY_CHECKOUT_ID = "view_checkout_feedback_by_checkout_id";
|
|
3
|
+
const viewCheckoutFeedbackByCheckoutId = (payload) => ({
|
|
4
|
+
...query({ name: VIEW_CHECKOUT_FEEDBACK_BY_CHECKOUT_ID }),
|
|
5
|
+
...payload,
|
|
6
|
+
});
|
|
7
|
+
const viewCheckoutFeedbackByCheckoutIdHandler = ({ view, signal }) => async ({ checkoutId }) => view({ checkoutId, signal });
|
|
8
|
+
export { VIEW_CHECKOUT_FEEDBACK_BY_CHECKOUT_ID, viewCheckoutFeedbackByCheckoutId, viewCheckoutFeedbackByCheckoutIdHandler, };
|