@lookiero/checkout 8.14.0 → 8.15.0

package/src/infrastructure/ui/components/organisms/returnQuestions/components/ReturnQuestionItem.ts

@@ -1,15 +1,14 @@
 import { FC, ReactNode } from "react";
 import { ReturnQuestionProjection } from "../../../../../../projection/returnQuestion/returnQuestion";
-import { ReturnQuestionType } from "../../../../../../projection/returnQuestion/returnQuestion.constants";
 
-interface ReturnQuestionItemProps<RQT extends ReturnQuestionType> {
+interface ReturnQuestionItemProps {
   readonly returnQuestionParent: ReturnQuestionProjection;
-  readonly returnQuestion: ReturnQuestionProjection<RQT>;
+  readonly returnQuestion: ReturnQuestionProjection;
   readonly children?: ReactNode;
   readonly portalHostName?: string;
   readonly testID?: string;
 }
 
-type ReturnQuestionItem<QT extends ReturnQuestionType> = FC<ReturnQuestionItemProps<QT>>;
+type ReturnQuestionItem = FC<ReturnQuestionItemProps>;
 
 export type { ReturnQuestionItem, ReturnQuestionItemProps };

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionFeedbackItem/HostDefaultReturnQuestionFeedbackItem.test.tsx

@@ -1,28 +1,34 @@
 import React from "react";
 import { Text } from "react-native";
-import { ReturnQuestionProjection } from "../../../../../../../projection/returnQuestion/returnQuestion";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
+import {
+  ReturnQuestionProjection,
+  ReturnQuestionType,
+} from "../../../../../../../projection/returnQuestion/returnQuestion";
 import { render } from "../../../../../test/render";
 import { HostDefaultReturnQuestionFeedbackItem } from "./HostDefaultReturnQuestionFeedbackItem";
 
 const returnQuestion: ReturnQuestionProjection = {
   id: "9251dc2c-d76a-484d-9299-346929af932f",
-  translationKey: "size_large",
-  type: ReturnQuestionType.HOST_DEFAULT,
+  name: "size_large",
+  placeholder: "",
+  type: ReturnQuestionType.OPTION,
   children: [
     {
       id: "68c0bb98-b00a-4b86-af43-528fe903cb69",
-      translationKey: "size_overall",
+      name: "size_overall",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
     {
       id: "85e84a77-461c-41e6-8544-95b5294d0b80",
-      translationKey: "size_trousers_too_long",
+      name: "size_trousers_too_long",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
     {
       id: "29441d25-8d9f-471e-a13e-a03f61c88091",
-      translationKey: "size_fit_cut_does_not_fit",
+      name: "size_fit_cut_does_not_fit",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
   ],

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionFeedbackItem/HostDefaultReturnQuestionFeedbackItem.tsx

@@ -1,9 +1,7 @@
-/* eslint-disable react/prop-types */
 import React from "react";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
-import { ReturnQuestionItem } from "../ReturnQuestionItem";
+import { ReturnQuestionItem, ReturnQuestionItemProps } from "../ReturnQuestionItem";
 
-const HostDefaultReturnQuestionFeedbackItem: ReturnQuestionItem<ReturnQuestionType.HOST_DEFAULT> = ({ children }) => (
+const HostDefaultReturnQuestionFeedbackItem: ReturnQuestionItem = ({ children }: ReturnQuestionItemProps) => (
   <>{children}</>
 );
 

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem.test.tsx

@@ -1,7 +1,9 @@
 import React from "react";
 import { Text } from "react-native";
-import { ReturnQuestionProjection } from "../../../../../../../projection/returnQuestion/returnQuestion";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
+import {
+  ReturnQuestionProjection,
+  ReturnQuestionType,
+} from "../../../../../../../projection/returnQuestion/returnQuestion";
 import { render } from "../../../../../test/render";
 import { HostDefaultReturnQuestionItem } from "./HostDefaultReturnQuestionItem";
 
@@ -12,22 +14,26 @@ jest.mock("../../behaviors/useReturnQuestionFeedback", () => ({
 
 const returnQuestion: ReturnQuestionProjection = {
   id: "9251dc2c-d76a-484d-9299-346929af932f",
-  translationKey: "size_large",
-  type: ReturnQuestionType.HOST_DEFAULT,
+  name: "size_large",
+  placeholder: "",
+  type: ReturnQuestionType.OPTION,
   children: [
     {
       id: "68c0bb98-b00a-4b86-af43-528fe903cb69",
-      translationKey: "size_overall",
+      name: "size_overall",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
     {
       id: "85e84a77-461c-41e6-8544-95b5294d0b80",
-      translationKey: "size_trousers_too_long",
+      name: "size_trousers_too_long",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
     {
       id: "29441d25-8d9f-471e-a13e-a03f61c88091",
-      translationKey: "size_fit_cut_does_not_fit",
+      name: "size_fit_cut_does_not_fit",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
   ],
@@ -44,7 +50,7 @@ describe("HostDefaultReturnQuestionItem component (ReturnQuestions organism)", (
       </HostDefaultReturnQuestionItem>,
     );
 
-    expect(getByText(returnQuestion.translationKey)).toBeTruthy();
+    expect(getByText(returnQuestion.name)).toBeTruthy();
     expect(getByText("HostDefaultReturnQuestionItem children")).toBeTruthy();
   });
 });

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostDefaultReturnQuestionItem/HostDefaultReturnQuestionItem.tsx

@@ -1,26 +1,20 @@
-/* eslint-disable react/prop-types */
 import React from "react";
 import { Text, View } from "@lookiero/aurora";
-import { useIntl } from "@lookiero/i18n-react";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
-import { returnQuestionWithTranslationKey } from "../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
+import { useI18nMessage } from "@lookiero/i18n-react";
 import { I18nMessages } from "../../../../../i18n/i18n";
-import { ReturnQuestionItem } from "../ReturnQuestionItem";
+import { ReturnQuestionItem, ReturnQuestionItemProps } from "../ReturnQuestionItem";
 import { style } from "./HostDefaultReturnQuestionItem.style";
 
-const HostDefaultReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_DEFAULT> = ({
-  returnQuestion,
-  children,
-}) => {
-  const { formatMessage } = useIntl();
-  const isAllOptions = returnQuestion.translationKey === I18nMessages.RETURN_QUESTION_MAIN_ALL_OPINION;
+const HostDefaultReturnQuestionItem: ReturnQuestionItem = ({ returnQuestion, children }: ReturnQuestionItemProps) => {
+  const titleText = useI18nMessage({ id: returnQuestion.name });
+  const isAllOptions = returnQuestion.name === I18nMessages.RETURN_QUESTION_MAIN_ALL_OPINION;
 
   return (
     <>
-      {returnQuestionWithTranslationKey(returnQuestion) && returnQuestion.translationKey !== " " && !isAllOptions ? (
+      {titleText && titleText !== " " && !isAllOptions ? (
         <View style={style.title}>
           <Text level={3} action>
-            {formatMessage({ id: returnQuestion.translationKey })}
+            {titleText}
           </Text>
         </View>
       ) : null}

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostRadioGroupReturnQuestionItem/HostRadioGroupReturnQuestionItem.tsx

@@ -1,21 +1,19 @@
-/* eslint-disable react/prop-types */
 import React, { useMemo } from "react";
 import { View } from "react-native";
 import { Text } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
-import { ReturnQuestionItem } from "../ReturnQuestionItem";
+import { ReturnQuestionItem, ReturnQuestionItemProps } from "../ReturnQuestionItem";
 import { style } from "./HostRadioGroupReturnQuestionItem.style";
 
-const HostRadioGroupReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_SELECT> = ({
+const HostRadioGroupReturnQuestionItem: ReturnQuestionItem = ({
   returnQuestion,
   children,
   testID,
-}) => {
+}: ReturnQuestionItemProps) => {
   const { formatMessage } = useIntl();
   const placeholderText = useMemo(
-    () => (returnQuestion.metadata.placeholder ? formatMessage({ id: returnQuestion.metadata.placeholder }) : ""),
-    [formatMessage, returnQuestion.metadata.placeholder],
+    () => (returnQuestion.placeholder ? formatMessage({ id: returnQuestion.placeholder }) : ""),
+    [formatMessage, returnQuestion.placeholder],
   );
 
   return (

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem.test.tsx

@@ -1,8 +1,10 @@
 import { fireEvent, within } from "@testing-library/react-native";
 import React from "react";
 import { Text } from "react-native";
-import { ReturnQuestionProjection } from "../../../../../../../projection/returnQuestion/returnQuestion";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
+import {
+  ReturnQuestionProjection,
+  ReturnQuestionType,
+} from "../../../../../../../projection/returnQuestion/returnQuestion";
 import { render } from "../../../../../test/render";
 import { HostSelectReturnQuestionItem } from "./HostSelectReturnQuestionItem";
 
@@ -16,30 +18,32 @@ jest.mock("../../behaviors/useReturnQuestionFeedback", () => ({
 
 const returnQuestion: ReturnQuestionProjection = {
   id: "9251dc2c-d76a-484d-9299-346929af932f",
-  translationKey: "size_large",
+  name: "size_large",
+  placeholder: "",
   type: ReturnQuestionType.HOST_SELECT,
-  metadata: {
-    placeholder: "",
-  },
   children: [
     {
       id: "542c4d24-e1da-484f-8c3a-7d89ee135adc",
-      translationKey: "",
+      name: "",
+      placeholder: "",
       type: ReturnQuestionType.HOST_STACK,
       children: [
         {
           id: "68c0bb98-b00a-4b86-af43-528fe903cb69",
-          translationKey: "size_overall",
+          name: "size_overall",
+          placeholder: "",
           type: ReturnQuestionType.OPTION,
         },
         {
           id: "85e84a77-461c-41e6-8544-95b5294d0b80",
-          translationKey: "size_trousers_too_long",
+          name: "size_trousers_too_long",
+          placeholder: "",
           type: ReturnQuestionType.OPTION,
         },
         {
           id: "29441d25-8d9f-471e-a13e-a03f61c88091",
-          translationKey: "size_fit_cut_does_not_fit",
+          name: "size_fit_cut_does_not_fit",
+          placeholder: "",
           type: ReturnQuestionType.OPTION,
         },
       ],

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostSelectReturnQuestionItem/HostSelectReturnQuestionItem.tsx

@@ -1,10 +1,8 @@
-/* eslint-disable react/prop-types */
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { TouchableHighlight, View } from "react-native";
 import { ButtonIcon } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
 import { Modal } from "@lookiero/sty-psp-ui";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { InputField } from "../../../../../../../shared/ui/components/molecules/inputField/InputField";
 import {
   useReturnQuestionFeedback,
@@ -14,19 +12,19 @@ import {
   deepestReturnQuestionWithFeedbackForReturnQuestion,
   feedbackForReturnQuestion,
 } from "../../util/returnQuestionFeedback";
-import { ReturnQuestionItem } from "../ReturnQuestionItem";
+import { ReturnQuestionItem, ReturnQuestionItemProps } from "../ReturnQuestionItem";
 import { style, containerUnderlayColor } from "./HostSelectReturnQuestionItem.style";
 
-const HostSelectReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_SELECT> = ({
+const HostSelectReturnQuestionItem: ReturnQuestionItem = ({
   returnQuestion,
   children,
   portalHostName,
   testID,
-}) => {
+}: ReturnQuestionItemProps) => {
   const { formatMessage } = useIntl();
   const placeholderText = useMemo(
-    () => (returnQuestion.metadata.placeholder ? formatMessage({ id: returnQuestion.metadata.placeholder }) : ""),
-    [formatMessage, returnQuestion.metadata.placeholder],
+    () => (returnQuestion.placeholder ? formatMessage({ id: returnQuestion.placeholder }) : ""),
+    [formatMessage, returnQuestion.placeholder],
   );
 
   const [modalVisible, setModalVisible] = useState(false);

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostStackReturnQuestionItem/form/HostStackReturnQuestionItem.tsx

@@ -1,13 +1,11 @@
-/* eslint-disable react/prop-types */
 import React from "react";
-import { ReturnQuestionType } from "../../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import ReturnQuestion from "../../../ReturnQuestion";
-import { ReturnQuestionItem } from "../../ReturnQuestionItem";
+import { ReturnQuestionItem, ReturnQuestionItemProps } from "../../ReturnQuestionItem";
 
-const HostStackReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_STACK> = ({
+const HostStackReturnQuestionItem: ReturnQuestionItem = ({
   returnQuestion,
   portalHostName,
-}) => (
+}: ReturnQuestionItemProps) => (
   <>
     {returnQuestion.children?.map((childReturnQuestion) => (
       <ReturnQuestion

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostStackReturnQuestionItem/modal/HostStackReturnQuestionItem.test.tsx

@@ -1,7 +1,9 @@
 import React from "react";
 import { Text } from "react-native";
-import { ReturnQuestionProjection } from "../../../../../../../../projection/returnQuestion/returnQuestion";
-import { ReturnQuestionType } from "../../../../../../../../projection/returnQuestion/returnQuestion.constants";
+import {
+  ReturnQuestionProjection,
+  ReturnQuestionType,
+} from "../../../../../../../../projection/returnQuestion/returnQuestion";
 import { render } from "../../../../../../test/render";
 import * as useReturnQuestionFeedback from "../../../behaviors/useReturnQuestionFeedback";
 import { HostStackReturnQuestionItem } from "./HostStackReturnQuestionItem";
@@ -13,54 +15,45 @@ const mockedUseReturnQuestionFeedbackForReturnQuestion = (
   useReturnQuestionFeedback as jest.Mocked<typeof useReturnQuestionFeedback>
 ).useReturnQuestionFeedbackForReturnQuestion;
 
-const withTitle: ReturnQuestionProjection<ReturnQuestionType.HOST_STACK> = {
+const returnQuestionChildren: ReturnQuestionProjection[] = [
+  {
+    id: "68c0bb98-b00a-4b86-af43-528fe903cb69",
+    name: "size_overall",
+    placeholder: "",
+    type: ReturnQuestionType.OPTION,
+  },
+  {
+    id: "85e84a77-461c-41e6-8544-95b5294d0b80",
+    name: "size_trousers_too_long",
+    placeholder: "",
+    type: ReturnQuestionType.OPTION,
+  },
+  {
+    id: "29441d25-8d9f-471e-a13e-a03f61c88091",
+    name: "size_fit_cut_does_not_fit",
+    placeholder: "",
+    type: ReturnQuestionType.OPTION,
+  },
+];
+
+const withTitle: ReturnQuestionProjection = {
   id: "542c4d24-e1da-484f-8c3a-7d89ee135adc",
-  translationKey: "return question title",
+  name: "return question title",
+  placeholder: "",
   type: ReturnQuestionType.HOST_STACK,
-  children: [
-    {
-      id: "68c0bb98-b00a-4b86-af43-528fe903cb69",
-      translationKey: "size_overall",
-      type: ReturnQuestionType.OPTION,
-    },
-    {
-      id: "85e84a77-461c-41e6-8544-95b5294d0b80",
-      translationKey: "size_trousers_too_long",
-      type: ReturnQuestionType.OPTION,
-    },
-    {
-      id: "29441d25-8d9f-471e-a13e-a03f61c88091",
-      translationKey: "size_fit_cut_does_not_fit",
-      type: ReturnQuestionType.OPTION,
-    },
-  ],
+  children: returnQuestionChildren,
 };
 
-const withoutTitle: ReturnQuestionProjection<ReturnQuestionType.HOST_STACK> = {
+const withoutTitle: ReturnQuestionProjection = {
   id: "542c4d24-e1da-484f-8c3a-7d89ee135adc",
-  translationKey: "",
+  name: "",
+  placeholder: "",
   type: ReturnQuestionType.HOST_STACK,
-  children: [
-    {
-      id: "68c0bb98-b00a-4b86-af43-528fe903cb69",
-      translationKey: "size_overall",
-      type: ReturnQuestionType.OPTION,
-    },
-    {
-      id: "85e84a77-461c-41e6-8544-95b5294d0b80",
-      translationKey: "size_trousers_too_long",
-      type: ReturnQuestionType.OPTION,
-    },
-    {
-      id: "29441d25-8d9f-471e-a13e-a03f61c88091",
-      translationKey: "size_fit_cut_does_not_fit",
-      type: ReturnQuestionType.OPTION,
-    },
-  ],
+  children: returnQuestionChildren,
 };
 
 interface RenderHostStackReturnQuestionItemParameters {
-  readonly returnQuestion: ReturnQuestionProjection<ReturnQuestionType.HOST_STACK>;
+  readonly returnQuestion: ReturnQuestionProjection;
 }
 
 const renderHostStackReturnQuestionItem = ({ returnQuestion }: RenderHostStackReturnQuestionItemParameters) =>
@@ -79,7 +72,7 @@ describe("HostStackReturnQuestionItem component (ReturnQuestions organism)", ()
     });
     const { findByText } = renderHostStackReturnQuestionItem({ returnQuestion: withTitle });
 
-    expect(await findByText(withTitle.translationKey as string)).toBeDefined();
+    expect(await findByText(withTitle.name)).toBeDefined();
   });
 
   it("does not render a title for the returnQuestion (when returnQuestion's name is not provided)", async () => {
@@ -90,7 +83,7 @@ describe("HostStackReturnQuestionItem component (ReturnQuestions organism)", ()
     });
     const { queryByText } = renderHostStackReturnQuestionItem({ returnQuestion: withoutTitle });
 
-    expect(await queryByText(withTitle.translationKey as string)).toBeNull();
+    expect(await queryByText(withTitle.name)).toBeNull();
   });
 
   it("renders the feedback and a ReturnQuestion for its returnQuestion.children when there is feedback", async () => {

package/src/infrastructure/ui/components/organisms/returnQuestions/components/hostStackReturnQuestionItem/modal/HostStackReturnQuestionItem.tsx

@@ -1,21 +1,18 @@
-/* eslint-disable react/prop-types */
 import { animated, useSpring } from "@react-spring/native";
 import React, { useCallback, useMemo, useState } from "react";
 import { LayoutChangeEvent, View } from "react-native";
 import { COLOR, Text } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
-import { ReturnQuestionType } from "../../../../../../../../projection/returnQuestion/returnQuestion.constants";
-import { returnQuestionHasChildren } from "../../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
 import ReturnQuestion from "../../../ReturnQuestion";
 import { useReturnQuestionFeedbackForReturnQuestion } from "../../../behaviors/useReturnQuestionFeedback";
-import { ReturnQuestionItem } from "../../ReturnQuestionItem";
+import { ReturnQuestionItem, ReturnQuestionItemProps } from "../../ReturnQuestionItem";
 import { style } from "./HostStackReturnQuestionItem.style";
 
-const HostStackReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_STACK> = ({
+const HostStackReturnQuestionItem: ReturnQuestionItem = ({
   returnQuestion,
   children,
   portalHostName,
-}) => {
+}: ReturnQuestionItemProps) => {
   const { formatMessage } = useIntl();
   const { feedback } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion });
   const feedbackReturnQuestion = feedback
@@ -23,11 +20,11 @@ const HostStackReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_ST
     : undefined;
 
   const titleText = useMemo(
-    () => (returnQuestion.translationKey ? formatMessage({ id: returnQuestion.translationKey }) : undefined),
-    [formatMessage, returnQuestion.translationKey],
+    () => (returnQuestion.name ? formatMessage({ id: returnQuestion.name }) : undefined),
+    [formatMessage, returnQuestion.name],
   );
   const feedbackText = useMemo(
-    () => (feedbackReturnQuestion ? formatMessage({ id: feedbackReturnQuestion.translationKey }) : undefined),
+    () => (feedbackReturnQuestion ? formatMessage({ id: feedbackReturnQuestion.name }) : undefined),
     [feedbackReturnQuestion, formatMessage],
   );
 
@@ -51,7 +48,7 @@ const HostStackReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.HOST_ST
             {titleText}
           </Text>
         )}
-        {feedbackReturnQuestion && returnQuestionHasChildren(feedbackReturnQuestion) ? (
+        {feedbackReturnQuestion ? (
           <>
             <Text color={COLOR.TEXT_MEDIUM} level={3}>
               {feedbackText}

package/src/infrastructure/ui/components/organisms/returnQuestions/components/modalOptionReturnQuestionItems/ModalOptionReturnQuestionItems.tsx

@@ -4,7 +4,6 @@ import { COLOR, Text } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
 import { Modal } from "@lookiero/sty-psp-ui";
 import { ReturnQuestionProjection } from "../../../../../../../projection/returnQuestion/returnQuestion";
-import { returnQuestionHasChildren } from "../../../../../../../projection/returnQuestion/returnQuestion.typeguard";
 import ReturnQuestion from "../../ReturnQuestion";
 import { style } from "./ModalOptionReturnQuestionItems.style";
 
@@ -23,7 +22,7 @@ const ModalOptionReturnQuestionItems = ({
   onClose,
 }: ModalOptionReturnQuestionItemsProps) => {
   const { formatMessage } = useIntl();
-  const title = formatMessage({ id: returnQuestion.translationKey });
+  const title = formatMessage({ id: returnQuestion.name });
 
   return (
     <Modal portalHostName={portalHostName} visible={visible} scroll showCloseButton onClose={onClose}>
@@ -32,15 +31,14 @@ const ModalOptionReturnQuestionItems = ({
           {title}
         </Text>
         <>
-          {returnQuestionHasChildren(returnQuestion) &&
-            returnQuestion.children?.map((childReturnQuestion) => (
-              <ReturnQuestion
-                key={childReturnQuestion.id}
-                portalHostName=""
-                returnQuestion={childReturnQuestion}
-                returnQuestionParent={returnQuestion}
-              />
-            ))}
+          {returnQuestion.children?.map((childReturnQuestion) => (
+            <ReturnQuestion
+              key={childReturnQuestion.id}
+              portalHostName=""
+              returnQuestion={childReturnQuestion}
+              returnQuestionParent={returnQuestion}
+            />
+          ))}
         </>
       </View>
     </Modal>

package/src/infrastructure/ui/components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem.test.tsx

@@ -1,7 +1,9 @@
 import { fireEvent } from "@testing-library/react-native";
 import React from "react";
-import { ReturnQuestionProjection } from "../../../../../../../projection/returnQuestion/returnQuestion";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
+import {
+  ReturnQuestionProjection,
+  ReturnQuestionType,
+} from "../../../../../../../projection/returnQuestion/returnQuestion";
 import { render } from "../../../../../test/render";
 import { OptionReturnQuestionItem } from "./OptionReturnQuestionItem";
 
@@ -15,22 +17,26 @@ const returnQuestionParent = {
 } as ReturnQuestionProjection;
 const returnQuestion: ReturnQuestionProjection = {
   id: "9251dc2c-d76a-484d-9299-346929af932f",
-  translationKey: "size_large",
+  name: "size_large",
+  placeholder: "",
   type: ReturnQuestionType.OPTION,
   children: [
     {
       id: "68c0bb98-b00a-4b86-af43-528fe903cb69",
-      translationKey: "size_overall",
+      name: "size_overall",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
     {
       id: "85e84a77-461c-41e6-8544-95b5294d0b80",
-      translationKey: "size_trousers_too_long",
+      name: "size_trousers_too_long",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
     {
       id: "29441d25-8d9f-471e-a13e-a03f61c88091",
-      translationKey: "size_fit_cut_does_not_fit",
+      name: "size_fit_cut_does_not_fit",
+      placeholder: "",
       type: ReturnQuestionType.OPTION,
     },
   ],
@@ -42,9 +48,9 @@ describe("OptionReturnQuestionItem component (ReturnQuestions organism)", () =>
       <OptionReturnQuestionItem returnQuestion={returnQuestion} returnQuestionParent={returnQuestionParent} />,
     );
 
-    expect(getByText(returnQuestion.translationKey)).toBeTruthy();
+    expect(getByText(returnQuestion.name)).toBeTruthy();
 
-    fireEvent.press(getByText(returnQuestion.translationKey));
+    fireEvent.press(getByText(returnQuestion.name));
 
     expect(mockOnChange).toHaveBeenCalledWith({
       returnQuestionId: returnQuestionParent.id,

package/src/infrastructure/ui/components/organisms/returnQuestions/components/optionReturnQuestionItem/OptionReturnQuestionItem.tsx

@@ -1,21 +1,19 @@
-/* eslint-disable react/prop-types */
 import React, { useCallback } from "react";
 import { TouchableHighlight, ViewStyle } from "react-native";
 import { Text } from "@lookiero/aurora";
 import { useI18nMessage } from "@lookiero/i18n-react";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import { useReturnQuestionFeedbackForReturnQuestion } from "../../behaviors/useReturnQuestionFeedback";
-import { ReturnQuestionItem } from "../ReturnQuestionItem";
+import { ReturnQuestionItem, ReturnQuestionItemProps } from "../ReturnQuestionItem";
 import { containerUnderlayColor, style } from "./OptionReturnQuestionItem.style";
 
-const OptionReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.OPTION> = ({
+const OptionReturnQuestionItem: ReturnQuestionItem = ({
   returnQuestion,
   returnQuestionParent,
   testID,
-}) => {
+}: ReturnQuestionItemProps) => {
   const { onChange } = useReturnQuestionFeedbackForReturnQuestion({ returnQuestion: returnQuestionParent });
 
-  const optionText = useI18nMessage({ id: returnQuestion.translationKey });
+  const optionText = useI18nMessage({ id: returnQuestion.name });
   const handleOnPress = useCallback(
     () => onChange({ returnQuestionId: returnQuestionParent.id, returnQuestionFeedback: returnQuestion.id }),
     [onChange, returnQuestion.id, returnQuestionParent.id],

package/src/infrastructure/ui/components/organisms/returnQuestions/components/radioReturnQuestionItem/RadioReturnQuestionItem.tsx

@@ -1,8 +1,6 @@
-/* eslint-disable react/prop-types */
 import React, { useCallback, useEffect, useState } from "react";
 import { View, Option, OPTION_VARIANT, SIZE } from "@lookiero/aurora";
 import { useIntl } from "@lookiero/i18n-react";
-import { ReturnQuestionType } from "../../../../../../../projection/returnQuestion/returnQuestion.constants";
 import {
   useReturnQuestionFeedback,
   useReturnQuestionFeedbackForReturnQuestion,
@@ -11,16 +9,16 @@ import {
   deepestReturnQuestionWithFeedbackForReturnQuestion,
   feedbackForReturnQuestion,
 } from "../../util/returnQuestionFeedback";
-import { ReturnQuestionItem } from "../ReturnQuestionItem";
+import { ReturnQuestionItem, ReturnQuestionItemProps } from "../ReturnQuestionItem";
 import { ModalOptionReturnQuestionItems } from "../modalOptionReturnQuestionItems/ModalOptionReturnQuestionItems";
 import { style } from "./RadioReturnQuestionItem.style";
 
-const RadioReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.OPTION> = ({
+const RadioReturnQuestionItem: ReturnQuestionItem = ({
   returnQuestion,
   returnQuestionParent,
   testID,
   portalHostName,
-}) => {
+}: ReturnQuestionItemProps) => {
   const intl = useIntl();
   const [modalVisible, setModalVisible] = useState(false);
   const {
@@ -35,7 +33,7 @@ const RadioReturnQuestionItem: ReturnQuestionItem<ReturnQuestionType.OPTION> = (
   );
 
   const inputValue = feedbackForReturnQuestion({ feedback, returnQuestion, translate }).join(" / ");
-  const optionText = intl.formatMessage({ id: returnQuestion.translationKey });
+  const optionText = intl.formatMessage({ id: returnQuestion.name });
 
   const hasChildren = Boolean(returnQuestion.children && returnQuestion.children.length > 0);