@lookiero/checkout 3.6.0-beta.11 → 3.6.0-beta.13
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/ui/components/organisms/checkoutQuestions/CheckoutQuestion.js +1 -1
- package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/CheckoutQuestionItem.d.ts +1 -0
- package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/buttonCheckoutQuestionItem/ButtonCheckoutQuestionItem.js +2 -2
- package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/iconCheckoutQuestionItem/IconCheckoutQuestionItem.js +2 -2
- package/dist/infrastructure/ui/components/organisms/checkoutQuestions/components/textareaCheckoutQuestionItem/TextareaCheckoutQuestionItem.js +2 -2
- package/dist/infrastructure/ui/components/organisms/returnQuestions/ReturnQuestion.js +1 -1
- package/dist/infrastructure/ui/components/organisms/returnQuestions/components/ReturnQuestionItem.d.ts +1 -0
- package/dist/infrastructure/ui/components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem.js +2 -2
- package/dist/infrastructure/ui/components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem.js +2 -2
- package/dist/infrastructure/ui/components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem.js +2 -2
- package/dist/infrastructure/ui/views/summary/components/pricing/Pricing.js +1 -1
- package/package.json +1 -1
|
@@ -2,7 +2,7 @@ import React, { memo } from "react";
|
|
|
2
2
|
import { useCheckoutQuestionItem } from "./behaviors/useCheckoutQuestionItem";
|
|
3
3
|
const CheckoutQuestion = ({ checkoutQuestion, checkoutQuestionParentId, }) => {
|
|
4
4
|
const Item = useCheckoutQuestionItem({ type: checkoutQuestion.type });
|
|
5
|
-
return (React.createElement(Item, { checkoutQuestion: checkoutQuestion, checkoutQuestionParentId: checkoutQuestionParentId },
|
|
5
|
+
return (React.createElement(Item, { checkoutQuestion: checkoutQuestion, checkoutQuestionParentId: checkoutQuestionParentId, testID: checkoutQuestion.name.replaceAll(".", "-").replaceAll("_", "-") },
|
|
6
6
|
React.createElement(React.Fragment, null, checkoutQuestion.children?.map((childCheckoutQuestion) => (React.createElement(CheckoutQuestion, { key: childCheckoutQuestion.id, checkoutQuestion: childCheckoutQuestion, checkoutQuestionParentId: checkoutQuestion.id }))))));
|
|
7
7
|
};
|
|
8
8
|
export default memo(CheckoutQuestion);
|
|
@@ -5,6 +5,7 @@ interface CheckoutQuestionItemProps {
|
|
|
5
5
|
readonly checkoutQuestionParentId: string;
|
|
6
6
|
readonly children?: ReactNode;
|
|
7
7
|
readonly portalHostName?: string;
|
|
8
|
+
readonly testID: string;
|
|
8
9
|
}
|
|
9
10
|
type CheckoutQuestionItem = FC<CheckoutQuestionItemProps>;
|
|
10
11
|
export type { CheckoutQuestionItem, CheckoutQuestionItemProps };
|
|
@@ -5,10 +5,10 @@ import { theme } from "../../../../../theme/theme";
|
|
|
5
5
|
import { useCheckoutQuestionFeedbackForId } from "../../behaviors/useCheckoutQuestionFeedback";
|
|
6
6
|
import { style } from "./ButtonCheckoutQuestionItem.style";
|
|
7
7
|
const { colorAccent, colorBase } = theme();
|
|
8
|
-
const ButtonCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, }) => {
|
|
8
|
+
const ButtonCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, testID, }) => {
|
|
9
9
|
const { feedback, onChange } = useCheckoutQuestionFeedbackForId({ id: checkoutQuestionParentId });
|
|
10
10
|
const optionText = useI18nMessage({ id: checkoutQuestion.name });
|
|
11
11
|
const handleOnPress = useCallback(() => onChange({ checkoutQuestionId: checkoutQuestionParentId, checkoutQuestionFeedback: checkoutQuestion.id }), [onChange, checkoutQuestion.id, checkoutQuestionParentId]);
|
|
12
|
-
return (React.createElement(Button, { style: [style.button, { backgroundColor: feedback === checkoutQuestion.id ? colorAccent : colorBase }], variant: BUTTON_VARIANT.SECONDARY, onPress: handleOnPress }, optionText));
|
|
12
|
+
return (React.createElement(Button, { style: [style.button, { backgroundColor: feedback === checkoutQuestion.id ? colorAccent : colorBase }], testID: testID, variant: BUTTON_VARIANT.SECONDARY, onPress: handleOnPress }, optionText));
|
|
13
13
|
};
|
|
14
14
|
export { ButtonCheckoutQuestionItem };
|
|
@@ -16,12 +16,12 @@ const ICON = {
|
|
|
16
16
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
17
17
|
"checkout_question.icon.good": Happy,
|
|
18
18
|
};
|
|
19
|
-
const IconCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, }) => {
|
|
19
|
+
const IconCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, testID, }) => {
|
|
20
20
|
const Icon = ICON[checkoutQuestion.name];
|
|
21
21
|
const { feedback, onChange } = useCheckoutQuestionFeedbackForId({ id: checkoutQuestionParentId });
|
|
22
22
|
const handleOnPress = useCallback(() => onChange({ checkoutQuestionId: checkoutQuestionParentId, checkoutQuestionFeedback: checkoutQuestion.id }), [onChange, checkoutQuestion.id, checkoutQuestionParentId]);
|
|
23
23
|
invariant(Icon, "CheckoutQuestion icon does not exist");
|
|
24
|
-
return (React.createElement(Pressable, { testID:
|
|
24
|
+
return (React.createElement(Pressable, { testID: testID, onPress: handleOnPress },
|
|
25
25
|
React.createElement(Icon, { fill: feedback === checkoutQuestion.id ? colorAccent : "none", style: style.icon })));
|
|
26
26
|
};
|
|
27
27
|
export { IconCheckoutQuestionItem };
|
|
@@ -3,11 +3,11 @@ import React, { useCallback, useMemo } from "react";
|
|
|
3
3
|
import { InputField } from "../../../../../../../shared/ui/components/molecules/inputField/InputField";
|
|
4
4
|
import { useCheckoutQuestionFeedbackForId } from "../../behaviors/useCheckoutQuestionFeedback";
|
|
5
5
|
const TEXTAREA_MIN_HEIGHT = 96;
|
|
6
|
-
const TextareaCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, }) => {
|
|
6
|
+
const TextareaCheckoutQuestionItem = ({ checkoutQuestion, checkoutQuestionParentId, testID, }) => {
|
|
7
7
|
const { formatMessage } = useIntl();
|
|
8
8
|
const placeholderText = useMemo(() => (checkoutQuestion.placeholder ? formatMessage({ id: checkoutQuestion.placeholder }) : ""), [formatMessage, checkoutQuestion.placeholder]);
|
|
9
9
|
const { feedback, onChange } = useCheckoutQuestionFeedbackForId({ id: checkoutQuestionParentId });
|
|
10
10
|
const handleOnChange = useCallback((value) => onChange({ checkoutQuestionId: checkoutQuestionParentId, checkoutQuestionFeedback: value }), [onChange, checkoutQuestionParentId]);
|
|
11
|
-
return (React.createElement(InputField, { label: placeholderText, minHeight: TEXTAREA_MIN_HEIGHT, placeholder: placeholderText, testID:
|
|
11
|
+
return (React.createElement(InputField, { label: placeholderText, minHeight: TEXTAREA_MIN_HEIGHT, placeholder: placeholderText, testID: testID, value: feedback, multiline: true, onChange: handleOnChange }));
|
|
12
12
|
};
|
|
13
13
|
export { TextareaCheckoutQuestionItem };
|
|
@@ -2,7 +2,7 @@ import React, { memo } from "react";
|
|
|
2
2
|
import { useReturnQuestionItem } from "./behaviors/useReturnQuestionItem";
|
|
3
3
|
const ReturnQuestion = ({ returnQuestion, returnQuestionParentId, portalHostName, }) => {
|
|
4
4
|
const Item = useReturnQuestionItem({ type: returnQuestion.type });
|
|
5
|
-
return (React.createElement(Item, { portalHostName: portalHostName, returnQuestion: returnQuestion, returnQuestionParentId: returnQuestionParentId },
|
|
5
|
+
return (React.createElement(Item, { portalHostName: portalHostName, returnQuestion: returnQuestion, returnQuestionParentId: returnQuestionParentId, testID: returnQuestion.name.replaceAll(".", "-").replaceAll("_", "-") },
|
|
6
6
|
React.createElement(React.Fragment, null, returnQuestion.children?.map((childReturnQuestion) => (React.createElement(ReturnQuestion, { key: childReturnQuestion.id, portalHostName: portalHostName, returnQuestion: childReturnQuestion, returnQuestionParentId: returnQuestion.id }))))));
|
|
7
7
|
};
|
|
8
8
|
export default memo(ReturnQuestion);
|
|
@@ -5,6 +5,7 @@ interface ReturnQuestionItemProps {
|
|
|
5
5
|
readonly returnQuestionParentId: string;
|
|
6
6
|
readonly children?: ReactNode;
|
|
7
7
|
readonly portalHostName?: string;
|
|
8
|
+
readonly testID: string;
|
|
8
9
|
}
|
|
9
10
|
type ReturnQuestionItem = FC<ReturnQuestionItemProps>;
|
|
10
11
|
export type { ReturnQuestionItem, ReturnQuestionItemProps };
|
|
@@ -7,7 +7,7 @@ import { InputField } from "../../../../../../../shared/ui/components/molecules/
|
|
|
7
7
|
import { useReturnQuestionFeedback, useReturnQuestionFeedbackForId } from "../../behaviors/useReturnQuestionFeedback";
|
|
8
8
|
import { deepestReturnQuestionWithFeedbackForReturnQuestion, feedbackForReturnQuestion, } from "../../util/returnQuestionFeedback";
|
|
9
9
|
import { style, containerUnderlayColor } from "./HostSelectReturnQuestionItem.style";
|
|
10
|
-
const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName, }) => {
|
|
10
|
+
const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName, testID, }) => {
|
|
11
11
|
const { formatMessage } = useIntl();
|
|
12
12
|
const placeholderText = useMemo(() => (returnQuestion.placeholder ? formatMessage({ id: returnQuestion.placeholder }) : ""), [formatMessage, returnQuestion.placeholder]);
|
|
13
13
|
const [modalVisible, setModalVisible] = useState(false);
|
|
@@ -31,7 +31,7 @@ const HostSelectReturnQuestionItem = ({ returnQuestion, children, portalHostName
|
|
|
31
31
|
// deepestReturnQuestionWithFeedback needs to be as a dependency in order to be re-evaluated whenever it changes
|
|
32
32
|
}, [handleOnModalClose, deepestReturnQuestionWithFeedback, isLeaf]);
|
|
33
33
|
return (React.createElement(React.Fragment, null,
|
|
34
|
-
React.createElement(TouchableHighlight, { style: style.container, testID:
|
|
34
|
+
React.createElement(TouchableHighlight, { style: style.container, testID: testID, underlayColor: containerUnderlayColor, onPress: handleOnPress },
|
|
35
35
|
React.createElement(View, { pointerEvents: "none" },
|
|
36
36
|
React.createElement(InputField, { editable: false, icon: "arrow-down", label: placeholderText, value: inputValue }))),
|
|
37
37
|
React.createElement(Modal, { portalHostName: portalHostName, visible: modalVisible, header: deepestReturnQuestionWithFeedback && (React.createElement(ButtonIcon, { name: "arrow-left", testID: "modal-back-button", onPress: handleOnBackButtonPress })), scroll: true, showCloseButton: true, onClose: handleOnModalClose },
|
|
@@ -4,11 +4,11 @@ import React, { useCallback } from "react";
|
|
|
4
4
|
import { TouchableHighlight } from "react-native";
|
|
5
5
|
import { useReturnQuestionFeedbackForId } from "../../behaviors/useReturnQuestionFeedback";
|
|
6
6
|
import { containerUnderlayColor, style } from "./OptionReturnQuestionItem.style";
|
|
7
|
-
const OptionReturnQuestionItem = ({ returnQuestion, returnQuestionParentId, }) => {
|
|
7
|
+
const OptionReturnQuestionItem = ({ returnQuestion, returnQuestionParentId, testID, }) => {
|
|
8
8
|
const { onChange } = useReturnQuestionFeedbackForId({ id: returnQuestionParentId });
|
|
9
9
|
const optionText = useI18nMessage({ id: returnQuestion.name });
|
|
10
10
|
const handleOnPress = useCallback(() => onChange({ returnQuestionId: returnQuestionParentId, returnQuestionFeedback: returnQuestion.id }), [onChange, returnQuestion.id, returnQuestionParentId]);
|
|
11
|
-
return (React.createElement(TouchableHighlight, { style: style.container, testID:
|
|
11
|
+
return (React.createElement(TouchableHighlight, { style: style.container, testID: testID, underlayColor: containerUnderlayColor, onPress: handleOnPress },
|
|
12
12
|
React.createElement(Text, { level: 3, style: style.text }, optionText)));
|
|
13
13
|
};
|
|
14
14
|
export { OptionReturnQuestionItem };
|
|
@@ -3,11 +3,11 @@ import React, { useCallback, useMemo } from "react";
|
|
|
3
3
|
import { InputField } from "../../../../../../../shared/ui/components/molecules/inputField/InputField";
|
|
4
4
|
import { useReturnQuestionFeedbackForId } from "../../behaviors/useReturnQuestionFeedback";
|
|
5
5
|
const TEXTAREA_MIN_HEIGHT = 96;
|
|
6
|
-
const TextareaReturnQuestionItem = ({ returnQuestion, returnQuestionParentId, }) => {
|
|
6
|
+
const TextareaReturnQuestionItem = ({ returnQuestion, returnQuestionParentId, testID, }) => {
|
|
7
7
|
const { formatMessage } = useIntl();
|
|
8
8
|
const placeholderText = useMemo(() => (returnQuestion.placeholder ? formatMessage({ id: returnQuestion.placeholder }) : ""), [formatMessage, returnQuestion.placeholder]);
|
|
9
9
|
const { feedback, onChange } = useReturnQuestionFeedbackForId({ id: returnQuestionParentId });
|
|
10
10
|
const handleOnChange = useCallback((value) => onChange({ returnQuestionId: returnQuestionParentId, returnQuestionFeedback: value }), [onChange, returnQuestionParentId]);
|
|
11
|
-
return (React.createElement(InputField, { label: placeholderText, minHeight: TEXTAREA_MIN_HEIGHT, placeholder: placeholderText, testID:
|
|
11
|
+
return (React.createElement(InputField, { label: placeholderText, minHeight: TEXTAREA_MIN_HEIGHT, placeholder: placeholderText, testID: testID, value: feedback, multiline: true, onChange: handleOnChange }));
|
|
12
12
|
};
|
|
13
13
|
export { TextareaReturnQuestionItem };
|
|
@@ -52,6 +52,6 @@ const Pricing = ({ pendingToPay, subtotal, balanceDiscount, discount, discountPe
|
|
|
52
52
|
React.createElement(View, { style: style.divider }),
|
|
53
53
|
React.createElement(Row, { level: 2, text: totalText },
|
|
54
54
|
React.createElement(Price, { price: pendingToPay, variant: "total" })),
|
|
55
|
-
React.createElement(Button, { busy: busy, testID: "
|
|
55
|
+
React.createElement(Button, { busy: busy, testID: "confirm-checkout-button", onPress: onSubmit }, submitButtonText)))));
|
|
56
56
|
};
|
|
57
57
|
export { Pricing };
|