@lookiero/checkout 6.5.1-beta.0 → 6.6.0

package/src/infrastructure/ui/hooks/useNewFeedbackExperiment.test.tsx

@@ -1,84 +0,0 @@
-import { renderHook, waitFor } from "@testing-library/react-native";
-import React, { FC } from "react";
-import { Variation, useAssignedVariationByExperimentId } from "@lookiero/sty-psp-ab-testing";
-import { Segment } from "@lookiero/sty-psp-segment";
-import { CheckoutProjection } from "../../../projection/checkout/checkout";
-import { Country } from "../../../projection/shared/country";
-import { KameleoonEnvironment } from "../../ab-testing/kameleoonEnvironment";
-import {
-  NewFeedbackExperimentProvider,
-  NewFeedbackExperimentVariation,
-  useNewFeedbackExperiment as sut,
-} from "./useNewFeedbackExperiment";
-
-const mockKameleoon: KameleoonEnvironment = {
-  siteCode: "aplm4v3ckn",
-  experiments: {
-    newFeedback: {
-      id: "245000",
-      variations: {
-        v1: "964072",
-      },
-    },
-  },
-};
-
-const country = Country.ES;
-const segment = Segment.WOMEN;
-const customerId = "1f410890-b3e1-49d2-9950-2ff89182cb79";
-const mockTrackAssignedVariation = jest.fn();
-// useStaticInfo
-
-jest.mock("../../tracking/useTrackAssignedVariationByExperiment", () => ({
-  useTrackAssignedVariationByExperiment: () => mockTrackAssignedVariation,
-}));
-
-jest.mock("@lookiero/sty-psp-ab-testing");
-
-jest.mock("./useStaticInfo", () => ({
-  useStaticInfo: () => ({ kameleoon: mockKameleoon, customer: { customerId, country, segment } }),
-}));
-
-jest.mock("../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId", () => ({
-  useViewFirstAvailableCheckoutByCustomerId: () => [
-    { id: "3db6984e-c8d2-4242-a795-ab5babb25e8c" } as CheckoutProjection,
-  ],
-}));
-
-interface WrapperProps {
-  readonly children: JSX.Element;
-}
-
-const Wrapper: FC<WrapperProps> = ({ children }) => (
-  <NewFeedbackExperimentProvider>{children}</NewFeedbackExperimentProvider>
-);
-
-beforeEach(() => {
-  mockTrackAssignedVariation.mockClear();
-});
-
-describe("useNewFeedbackExperiment hook", () => {
-  it("returns 'control' as variation", async () => {
-    const assignedVariation: Variation = { id: 0, name: "Control" };
-    (useAssignedVariationByExperimentId as jest.Mock).mockReturnValue({ assignedVariation });
-
-    const { result } = renderHook(() => sut(), { wrapper: Wrapper });
-
-    await waitFor(() => expect(result.current).toBe(NewFeedbackExperimentVariation.CONTROL));
-    await waitFor(() => {
-      expect(mockTrackAssignedVariation).toHaveBeenCalledWith({ assignedVariation });
-    });
-  });
-
-  it("returns 'return_page' as variation", async () => {
-    const assignedVariation: Variation = { id: 964072, name: "Variation 1" };
-    (useAssignedVariationByExperimentId as jest.Mock).mockReturnValue({ assignedVariation });
-
-    const { result } = renderHook(() => sut(), { wrapper: Wrapper });
-
-    await waitFor(() => expect(result.current).toBe(NewFeedbackExperimentVariation.RETURN_PAGE));
-    await waitFor(() => {
-      expect(mockTrackAssignedVariation).toHaveBeenCalledWith({ assignedVariation });
-    });
-  });
-});

package/src/infrastructure/ui/hooks/useNewFeedbackExperiment.tsx

@@ -1,82 +0,0 @@
-import React, { createContext, FC, ReactNode, useContext, useEffect, useMemo, useRef } from "react";
-import invariant from "tiny-invariant";
-import { Spinner } from "@lookiero/aurora";
-import { useAssignedVariationByExperimentId } from "@lookiero/sty-psp-ab-testing";
-import { useViewFirstAvailableCheckoutByCustomerId } from "../../projection/checkout/react/useViewFirstAvailableCheckoutByCustomerId";
-import { useTrackAssignedVariationByExperiment } from "../../tracking/useTrackAssignedVariationByExperiment";
-import { useStaticInfo } from "./useStaticInfo";
-
-enum NewFeedbackExperimentVariation {
-  CONTROL = "control",
-  RETURN_PAGE = "return_page",
-}
-
-interface NewFeedbackExperiment {
-  readonly variation: NewFeedbackExperimentVariation;
-}
-
-const NewFeedbackExperimentContext = createContext<NewFeedbackExperiment>(null as unknown as NewFeedbackExperiment);
-
-interface NewFeedbackExperimentProviderProps {
-  readonly children: ReactNode;
-}
-
-const NewFeedbackExperimentProvider: FC<NewFeedbackExperimentProviderProps> = ({ children }) => {
-  const {
-    kameleoon: {
-      experiments: {
-        newFeedback: { id: newFeedbackId, variations },
-      },
-    },
-    customer: { customerId, country, segment },
-  } = useStaticInfo();
-  const [checkout] = useViewFirstAvailableCheckoutByCustomerId({ customerId });
-  const { assignedVariation: newFeedbackVariation } = useAssignedVariationByExperimentId({
-    experimentId: newFeedbackId,
-  });
-  const trackAssignedVariation = useTrackAssignedVariationByExperiment({
-    checkoutId: checkout?.id,
-    country,
-    segment,
-    experimentId: newFeedbackId,
-  });
-
-  const value = useMemo(
-    () => ({
-      variation:
-        newFeedbackVariation?.id === Number(variations.v1)
-          ? NewFeedbackExperimentVariation.RETURN_PAGE
-          : NewFeedbackExperimentVariation.CONTROL,
-    }),
-    [newFeedbackVariation?.id, variations.v1],
-  );
-
-  const assignedVariantTracked = useRef(false);
-  useEffect(() => {
-    if (assignedVariantTracked.current || !newFeedbackVariation || !checkout?.id) {
-      return;
-    }
-
-    trackAssignedVariation({ assignedVariation: newFeedbackVariation });
-    assignedVariantTracked.current = true;
-  }, [checkout?.id, newFeedbackVariation, trackAssignedVariation]);
-
-  if (!checkout) {
-    return <Spinner />;
-  }
-
-  return <NewFeedbackExperimentContext.Provider value={value}>{children}</NewFeedbackExperimentContext.Provider>;
-};
-
-const useNewFeedbackExperiment = () => {
-  const newFeedbackExperiment = useContext(NewFeedbackExperimentContext);
-
-  invariant(
-    newFeedbackExperiment,
-    "Your are trying to use the useNewFeedbackExperiment hook without wrapping your app with the <NewFeedbackExperimentProvider>.",
-  );
-
-  return newFeedbackExperiment.variation;
-};
-
-export { useNewFeedbackExperiment, NewFeedbackExperimentProvider, NewFeedbackExperimentVariation };

package/src/infrastructure/ui/views/item/components/returnQuestionsForm/ReturnQuestionsForm.style.ts

@@ -1,18 +0,0 @@
-import { StyleSheet } from "react-native";
-import { theme } from "@lookiero/sty-psp-ui";
-
-const { space6, space8 } = theme();
-
-const style = StyleSheet.create({
-  modalContent: {
-    paddingHorizontal: space6,
-  },
-  submit: {
-    marginTop: space8,
-  },
-  title: {
-    marginBottom: space6,
-  },
-});
-
-export { style };

package/src/infrastructure/ui/views/item/components/returnQuestionsForm/ReturnQuestionsForm.tsx

@@ -1,79 +0,0 @@
-import { PortalHost } from "@gorhom/portal";
-import React, { FC, useCallback } from "react";
-import { View } from "react-native";
-import { Button, Text } from "@lookiero/aurora";
-import { useI18nMessage } from "@lookiero/i18n-react";
-import { Modal } from "@lookiero/sty-psp-ui";
-import { FeedbackProjection } from "../../../../../../projection/feedback/feedback";
-import {
-  ReturnQuestionProjection,
-  ReturnQuestionType,
-} from "../../../../../../projection/returnQuestion/returnQuestion";
-import { ReturnQuestions } from "../../../../components/organisms/returnQuestions/ReturnQuestions";
-import { useReturnQuestionFeedback } from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionFeedback";
-import {
-  ReturnQuestionItemProvider,
-  ReturnQuestionItems,
-} from "../../../../components/organisms/returnQuestions/behaviors/useReturnQuestionItem";
-import { HostDefaultReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem";
-import { HostSelectReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem";
-import { HostStackReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/hostStackReturnQuestionItem/modal/HostStackReturnQuestionItem";
-import { OptionReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem";
-import { TextareaReturnQuestionItem } from "../../../../components/organisms/returnQuestions/components/textareaReturnQuestionItem/TextareaReturnQuestionItem";
-import { I18nMessages } from "../../../../i18n/i18n";
-import { style } from "./ReturnQuestionsForm.style";
-
-const RETURN_QUESTION_FORM_PORTAL_HOST_NAME = "return-question-form-portal";
-
-const returnQuestionItems: ReturnQuestionItems = {
-  [ReturnQuestionType.HOST_DEFAULT]: HostDefaultReturnQuestionItem,
-  [ReturnQuestionType.HOST_TEXTAREA]: HostDefaultReturnQuestionItem,
-  [ReturnQuestionType.HOST_SELECT]: HostSelectReturnQuestionItem,
-  [ReturnQuestionType.HOST_STACK]: HostStackReturnQuestionItem,
-  [ReturnQuestionType.TEXTAREA]: TextareaReturnQuestionItem,
-  [ReturnQuestionType.OPTION]: OptionReturnQuestionItem,
-};
-
-interface ReturnQuestionsFormProps {
-  readonly visible: boolean;
-  readonly returnQuestions: ReturnQuestionProjection[];
-  readonly onSubmit: (feedback: FeedbackProjection) => void;
-  readonly onClose: () => void;
-}
-
-const ReturnQuestionsForm: FC<ReturnQuestionsFormProps> = ({ returnQuestions, visible, onSubmit, onClose }) => {
-  const titleText = useI18nMessage({ id: I18nMessages.RETURN_QUESTIONS_TITLE });
-  const submitButtonText = useI18nMessage({ id: I18nMessages.RETURN_QUESTIONS_SUBMIT_BUTTON });
-
-  const feedback = useReturnQuestionFeedback();
-
-  const handleOnSubmit = useCallback(() => onSubmit(feedback), [feedback, onSubmit]);
-
-  return (
-    <ReturnQuestionItemProvider returnQuestionItems={returnQuestionItems}>
-      <PortalHost name={RETURN_QUESTION_FORM_PORTAL_HOST_NAME} />
-      <Modal
-        portalHostName={RETURN_QUESTION_FORM_PORTAL_HOST_NAME}
-        testID="return-questions-form-modal"
-        visible={visible}
-        scroll
-        showCloseButton
-        onClose={onClose}
-      >
-        <View style={style.modalContent}>
-          <Text level={3} style={style.title} heading>
-            {titleText}
-          </Text>
-
-          <ReturnQuestions portalHostName={RETURN_QUESTION_FORM_PORTAL_HOST_NAME} returnQuestions={returnQuestions} />
-
-          <Button style={style.submit} testID="return-questions-button" onPress={handleOnSubmit}>
-            {submitButtonText}
-          </Button>
-        </View>
-      </Modal>
-    </ReturnQuestionItemProvider>
-  );
-};
-
-export { ReturnQuestionsForm };