From 576ecf22732806a367cf6cd0b125dd99cc20cf67 Mon Sep 17 00:00:00 2001 From: Daniil Chemerkin Date: Sat, 10 Aug 2024 18:15:03 +0000 Subject: [PATCH] Develop --- src/components/PaymentModal/index.tsx | 30 +- src/components/PaymentModal/styles.module.css | 1 + .../PaymentPage/results/ErrorPage/index.tsx | 8 +- .../PaymentPage/results/SuccessPage/index.tsx | 8 +- .../results/SuccessPage/styles.module.css | 1 + src/components/PlacePicker/index.tsx | 7 +- src/components/WallpaperPage/index.tsx | 2 +- .../LoadingProfileModalChild/index.tsx | 6 +- .../v1/components/PrivacyPolicy/index.tsx | 40 +- .../CustomAnswers/BirthPlace/index.tsx | 2 +- .../v1/components/Questionnaire/index.tsx | 8 +- .../v1/data/currentlyAffectingAnswers.ts | 20 +- .../pages/ABDesign/v1/data/onboarding.ts | 12 +- .../ABDesign/v1/data/stepsQuestionary.tsx | 431 ++++++----- .../pages/ABDesign/v1/data/textVariables.tsx | 22 +- .../pages/ABDesign/v1/pages/AboutUs/index.tsx | 4 +- .../v1/pages/AdditionalDiscount/index.tsx | 23 +- .../ABDesign/v1/pages/AllRight/index.tsx | 19 +- .../ABDesign/v1/pages/AlmostThere/index.tsx | 21 +- .../pages/ABDesign/v1/pages/Both/index.tsx | 28 +- .../ABDesign/v1/pages/Both/styles.module.css | 1 + .../ABDesign/v1/pages/EmailConfirm/index.tsx | 21 +- .../v1/pages/EmailEnterPage/index.tsx | 16 +- .../pages/ABDesign/v1/pages/Gender/index.tsx | 12 +- .../ABDesign/v1/pages/GoalSetup/index.tsx | 12 +- .../HyperPersonalizedAstrologyPage/index.tsx | 26 +- .../v1/pages/LoadingInRelationship/index.tsx | 30 +- .../LoadingInRelationship/styles.module.css | 1 + .../v1/pages/LoadingProfile/index.tsx | 11 +- .../ABDesign/v1/pages/NoBirthtime/index.tsx | 26 +- .../v1/pages/NoBirthtime/styles.module.css | 1 + .../ABDesign/v1/pages/NotAlone/index.tsx | 15 +- .../ABDesign/v1/pages/Onboarding/index.tsx | 6 +- .../v1/pages/PartnerRightPlace/index.tsx | 19 +- .../ABDesign/v1/pages/PartnerThing/index.tsx | 16 +- .../v1/pages/PartnerThing/styles.module.css | 1 + .../v1/pages/PartnerTotallyNormal/index.tsx | 20 +- .../PartnerTotallyNormal/styles.module.css | 1 + .../ABDesign/v1/pages/Problems/index.tsx | 25 +- .../WorksForUsDescription/index.tsx | 13 +- .../WorksTraitsDescription/index.tsx | 12 +- .../pages/QuestionnaireIntermediate/index.tsx | 18 +- .../styles.module.css | 1 + .../pages/RelationshipAlmostThere/index.tsx | 25 +- .../v1/pages/RelationshipZodiacInfo/index.tsx | 49 +- .../ABDesign/v1/pages/Satisfied/index.tsx | 28 +- .../v1/pages/SingleZodiacInfo/index.tsx | 10 +- .../components/DiscountExpires/index.tsx | 8 +- .../TrialPayment/components/Goal/index.tsx | 9 +- .../components/GuardPayments/index.tsx | 4 +- .../components/OftenAsk/Question.tsx | 7 +- .../components/OftenAsk/index.tsx | 5 +- .../components/PaymentTable/index.tsx | 44 +- .../components/PersonalInformation/index.tsx | 15 +- .../components/PointsList/index.tsx | 5 +- .../components/Reviews/Review.tsx | 5 +- .../WithPartnerInformation/index.tsx | 38 +- .../components/YourReading/index.tsx | 13 +- .../ABDesign/v1/pages/TrialPayment/index.tsx | 15 +- .../PaymentDiscountTable/index.tsx | 20 +- .../pages/TrialPaymentWithDiscount/index.tsx | 19 +- .../ABDesign/v1/pages/WithHead/index.tsx | 21 +- .../ABDesign/v1/pages/WithHeart/index.tsx | 21 +- .../pages/ABDesign/v1/ui/Answer/index.tsx | 4 +- .../AdditionalPurchasesSteps/index.tsx | 4 +- .../components/ConsultationTable/index.tsx | 24 +- .../components/FirstSlide/index.tsx | 5 +- .../components/FooterButton/index.tsx | 5 +- .../components/PaymentAddress/index.tsx | 11 +- .../components/SignUpOffer/index.tsx | 48 +- .../components/ThankYouBanner/index.tsx | 7 +- .../pages/AddConsultation/index.tsx | 19 +- .../pages/AddConsultation/styles.module.css | 1 + .../pages/AddReport/index.tsx | 19 +- .../pages/UnlimitedReadings/index.tsx | 23 +- .../pages/GetInformationPartner/index.tsx | 14 +- .../components/SecurityPayments/index.tsx | 13 +- .../CreditCard/index.tsx | 16 +- src/data.tsx | 64 +- src/data/additionalPurchases.ts | 30 +- src/data/loadingProfile.ts | 30 +- src/data/oftenAsk.ts | 13 +- src/data/onboarding.ts | 11 +- src/data/pointsLists.ts | 10 +- src/data/reviews.ts | 6 +- src/data/yourReading.ts | 12 +- src/hooks/paywall/usePaywall.tsx | 50 +- src/init.tsx | 9 +- src/locales/de/v1-de.ts | 671 +++++++++++++++++ src/locales/en/v1-en.ts | 674 ++++++++++++++++++ src/locales/es/v1-es.ts | 671 +++++++++++++++++ src/locales/fr/v1-fr.ts | 671 +++++++++++++++++ src/locales/index.ts | 31 +- src/locales/locales.ts | 16 + src/locales/pt-br/v1-pt-br.ts | 671 +++++++++++++++++ src/locales/pt-pt/v1-pt-pt.ts | 671 +++++++++++++++++ 96 files changed, 5107 insertions(+), 775 deletions(-) create mode 100644 src/locales/de/v1-de.ts create mode 100644 src/locales/en/v1-en.ts create mode 100644 src/locales/es/v1-es.ts create mode 100644 src/locales/fr/v1-fr.ts create mode 100644 src/locales/locales.ts create mode 100644 src/locales/pt-br/v1-pt-br.ts create mode 100644 src/locales/pt-pt/v1-pt-pt.ts diff --git a/src/components/PaymentModal/index.tsx b/src/components/PaymentModal/index.tsx index f60246e..e7ea0d2 100644 --- a/src/components/PaymentModal/index.tsx +++ b/src/components/PaymentModal/index.tsx @@ -16,6 +16,7 @@ import { useMakePayment } from "@/hooks/payment/useMakePayment"; import ExpressCheckoutStripe from "@/components/PaymentPage/methods/ExpressCheckoutStripe"; import routes from "@/routes"; import { useNavigate } from "react-router-dom"; +import { useTranslation } from "react-i18next"; interface IPaymentModalProps { activeProduct?: IPaywallProduct; @@ -37,6 +38,7 @@ function PaymentModal({ returnUrl, placementKey, }: IPaymentModalProps) { + const { t } = useTranslation(); const navigate = useNavigate(); const [stripePromise, setStripePromise] = useState | null>(null); @@ -136,7 +138,7 @@ function PaymentModal({ className={`${styles["payment-modal"]} ${isLoading ? styles.hide : ""}`} > - Choose payment method + {t("payment_modal.title")}

- You will be charged only{" "} - - ${getPrice(_activeProduct)} for your{" "} - {_activeProduct?.trialDuration}-day trial. - -

-

- We`ll email you a reminder before your trial period - ends. + {t("payment_modal.description", { + priceForDays: ( + + {t("payment_modal.price_for_days", { + trialPrice: getPrice(_activeProduct), + trialDuration: _activeProduct?.trialDuration, + })} + + ), + emailReminder: {t("payment_modal.email_reminder")}, + })}

)} - -

- Cancel anytime. The charge will appear on your bill as witapps. -

)}
@@ -196,7 +196,7 @@ function PaymentModal({ )}
-

1123 Rimer Dr Moraga, California 94556

+

{t("payment_modal.address")}

); diff --git a/src/components/PaymentModal/styles.module.css b/src/components/PaymentModal/styles.module.css index 5bc386a..8f81e65 100644 --- a/src/components/PaymentModal/styles.module.css +++ b/src/components/PaymentModal/styles.module.css @@ -26,6 +26,7 @@ font-size: 12px; text-align: center; line-height: 150%; + white-space: pre-wrap; } .payment-method-container { diff --git a/src/components/PaymentPage/results/ErrorPage/index.tsx b/src/components/PaymentPage/results/ErrorPage/index.tsx index 2374628..e66bd61 100644 --- a/src/components/PaymentPage/results/ErrorPage/index.tsx +++ b/src/components/PaymentPage/results/ErrorPage/index.tsx @@ -18,13 +18,13 @@ function PaymentFailPage(): JSX.Element { style={{ minHeight: "180px" }} />
- {t("auweb.pay_bad.title")} -

{t("auweb.pay_bad.text1")}

+ {t("/payment/fail.title")} +

{t("/payment/fail.description1")}

-

{t("auweb.pay_bad.text2")}

+

{t("/payment/fail.description2")}

- {t("auweb.pay_bad.button")} + {t("/payment/fail.button")}
diff --git a/src/components/PaymentPage/results/SuccessPage/index.tsx b/src/components/PaymentPage/results/SuccessPage/index.tsx index 6db0172..f26efd0 100644 --- a/src/components/PaymentPage/results/SuccessPage/index.tsx +++ b/src/components/PaymentPage/results/SuccessPage/index.tsx @@ -39,17 +39,15 @@ function PaymentSuccessPage(): JSX.Element { style={{ minHeight: "98px" }} />
- The information has been sent to your email -

{t("auweb.pay_good.title")}

-
-

{t("auweb.pay_good.text1")}

+ {t("/payment/success.title")} +

{t("/payment/success.description")}

- {t("auweb.pay_good.button")} + {t("next")} ); diff --git a/src/components/PaymentPage/results/SuccessPage/styles.module.css b/src/components/PaymentPage/results/SuccessPage/styles.module.css index 0c0efb9..c34ce31 100644 --- a/src/components/PaymentPage/results/SuccessPage/styles.module.css +++ b/src/components/PaymentPage/results/SuccessPage/styles.module.css @@ -15,6 +15,7 @@ .text > p { text-align: center; font-weight: 500; + white-space: pre-wrap; } .button { diff --git a/src/components/PlacePicker/index.tsx b/src/components/PlacePicker/index.tsx index 692f162..db8315a 100755 --- a/src/components/PlacePicker/index.tsx +++ b/src/components/PlacePicker/index.tsx @@ -1,3 +1,4 @@ +import { useTranslation } from "react-i18next"; import styles from "./styles.module.css"; interface IPlacePickerProps { @@ -17,6 +18,8 @@ function PlacePicker({ classNameInput = "", onChange, }: IPlacePickerProps) { + const { t } = useTranslation(); + const handleChange = (e: React.ChangeEvent) => { const place = e.target.value; onChange(place); @@ -28,7 +31,9 @@ function PlacePicker({ className={`${styles["full-address"]} ${classNameInput}`} name={name} type="text" - placeholder="Enter city of birth" + placeholder={ + t("/questionnaire/profile/birthPlace.placeholder") as string + } disabled={isDisabled} maxLength={maxLength} value={value} diff --git a/src/components/WallpaperPage/index.tsx b/src/components/WallpaperPage/index.tsx index 7dd060a..ce2d88c 100644 --- a/src/components/WallpaperPage/index.tsx +++ b/src/components/WallpaperPage/index.tsx @@ -74,7 +74,7 @@ function WallpaperPage(): JSX.Element { const { asset_categories } = await api.getAssetCategories({ locale }); const categoryId = getCategoryIdByZodiacSign(zodiacSign, asset_categories); return Promise.all([ - api.getZodiacs({ zodiac: zodiacSign.toLowerCase(), token }), + api.getZodiacs({ zodiac: zodiacSign?.toLowerCase(), token }), api.getAssets({ category: String(categoryId || "1") }), api.getDailyForecasts({ token }), ]).then(([{ zodiac }, { assets }, { user_daily_forecast }]) => ({ diff --git a/src/components/pages/ABDesign/v1/components/LoadingProfileModalChild/index.tsx b/src/components/pages/ABDesign/v1/components/LoadingProfileModalChild/index.tsx index e34523e..b6ff070 100644 --- a/src/components/pages/ABDesign/v1/components/LoadingProfileModalChild/index.tsx +++ b/src/components/pages/ABDesign/v1/components/LoadingProfileModalChild/index.tsx @@ -1,6 +1,7 @@ import Title from "@/components/Title"; import styles from "./styles.module.css"; import MainButton from "@/components/MainButton"; +import { useTranslation } from "react-i18next"; interface ILoadingProfileModalChildProps { title: string; @@ -11,6 +12,7 @@ function LoadingProfileModalChild({ title, handleClick, }: ILoadingProfileModalChildProps) { + const { t } = useTranslation(); return (
- No + {t("no")} - Yes + {t("yes")}
diff --git a/src/components/pages/ABDesign/v1/components/PrivacyPolicy/index.tsx b/src/components/pages/ABDesign/v1/components/PrivacyPolicy/index.tsx index e69cf58..e9efb63 100644 --- a/src/components/pages/ABDesign/v1/components/PrivacyPolicy/index.tsx +++ b/src/components/pages/ABDesign/v1/components/PrivacyPolicy/index.tsx @@ -2,6 +2,7 @@ import Checkbox from "../Checkbox"; import styles from "./styles.module.css"; import { useDispatch, useSelector } from "react-redux"; import { actions, selectors } from "@/store"; +import { useTranslation } from "react-i18next"; interface IPrivacyPolicyProps { containerClassName?: string; @@ -9,6 +10,7 @@ interface IPrivacyPolicyProps { function PrivacyPolicy({ containerClassName = "" }: IPrivacyPolicyProps) { const dispatch = useDispatch(); + const { t } = useTranslation(); const { checked } = useSelector(selectors.selectPrivacyPolicy); const handleChange = () => { @@ -19,24 +21,26 @@ function PrivacyPolicy({ containerClassName = "" }: IPrivacyPolicyProps) {

- I agree to the{" "} - - Privacy Policy - - ,{" "} - - Terms of use - {" "} - and to the use of cookies and tracking technologies, that require your - consent + {t("policy", { + privacyPolicy: ( + + {t("privacy_policy")} + + ), + termsOfUse: ( + + {t("terms_of_use")} + + ), + })}

); diff --git a/src/components/pages/ABDesign/v1/components/Questionnaire/CustomAnswers/BirthPlace/index.tsx b/src/components/pages/ABDesign/v1/components/Questionnaire/CustomAnswers/BirthPlace/index.tsx index 6a79b7f..1833d5a 100644 --- a/src/components/pages/ABDesign/v1/components/Questionnaire/CustomAnswers/BirthPlace/index.tsx +++ b/src/components/pages/ABDesign/v1/components/Questionnaire/CustomAnswers/BirthPlace/index.tsx @@ -61,7 +61,7 @@ function BirthPlaceCustomAnswer({ checked={!isKnownPartnerBirthPlace} onChange={() => setIsKnownPartnerBirthPlace((prev) => !prev)} /> - I don`t know where my partner was born + {t("/questionnaire/partnerProfile/partnerBirthPlace.checkbox")} )}
diff --git a/src/components/pages/ABDesign/v1/components/Questionnaire/index.tsx b/src/components/pages/ABDesign/v1/components/Questionnaire/index.tsx index b703abe..d11f3da 100644 --- a/src/components/pages/ABDesign/v1/components/Questionnaire/index.tsx +++ b/src/components/pages/ABDesign/v1/components/Questionnaire/index.tsx @@ -17,11 +17,13 @@ import { useLottie } from "@/hooks/lottie/useLottie"; import { useMetricABFlags } from "@/services/metric/metricService.ts"; import { preloadImages } from "@/hooks/preload/images"; import { useTouchAction } from "@/hooks/touchAction/useTouchAction"; +import { useTranslation } from "react-i18next"; function QuestionnairePage(): JSX.Element { const { question, stepId } = useParams(); const navigate = useNavigate(); const dispatch = useDispatch(); + const { t } = useTranslation(); const [currentStep, setCurrentStep] = useState(); const [currentQuestion, setCurrentQuestion] = useState(); const [selectedAnswer, setSelectedAnswer] = useState(null); @@ -198,14 +200,14 @@ function QuestionnairePage(): JSX.Element { className={styles["current-step"]} style={{ color: steps[currentStep].color }} > - {steps[currentStep].label} + {t(steps[currentStep].label)} - {currentQuestion.question} + {t(currentQuestion.question)} {!!currentQuestion.description && (

- {currentQuestion.description} + {t(currentQuestion.description)}

)}
diff --git a/src/components/pages/ABDesign/v1/data/currentlyAffectingAnswers.ts b/src/components/pages/ABDesign/v1/data/currentlyAffectingAnswers.ts index c10d7f9..25824ce 100644 --- a/src/components/pages/ABDesign/v1/data/currentlyAffectingAnswers.ts +++ b/src/components/pages/ABDesign/v1/data/currentlyAffectingAnswers.ts @@ -3,52 +3,52 @@ import { IAnswer } from "@/data"; export const currentlyAffectingAnswers: IAnswer[] = [ { id: "infidelity", - answer: "Infidelity", + answer: "/questionnaire/relationships/currentlyAffecting.infidelity", icon: "/broken_heart.webp", }, { id: "depression", - answer: "Depression", + answer: "/questionnaire/relationships/currentlyAffecting.depression", icon: "/cloud.webp", }, { id: "low_sexual", - answer: "Low sexual desire", + answer: "/questionnaire/relationships/currentlyAffecting.low_sexual_desire", icon: "/down_arrow.webp", }, { id: "poor_body", - answer: "Poor body image", + answer: "/questionnaire/relationships/currentlyAffecting.poor_body_image", icon: "/neutral_face.webp", }, { id: "postpartum", - answer: "Postpartum depression", + answer: "/questionnaire/relationships/currentlyAffecting.postpartum_depression", icon: "/woman_feeding_baby.webp", }, { id: "anxiety", - answer: "Anxiety", + answer: "/questionnaire/relationships/currentlyAffecting.anxiety", icon: "/anxious_face_with_sweat.webp", }, { id: "parenting_issues", - answer: "Parenting issues", + answer: "/questionnaire/relationships/currentlyAffecting.parenting_issues", icon: "/family.webp", }, { id: "blended_family", - answer: "Blended family issues", + answer: "/questionnaire/relationships/currentlyAffecting.blended_family_issues", icon: "/jigsaw.webp", }, { id: "divorce", - answer: "Divorce is on the table", + answer: "/questionnaire/relationships/currentlyAffecting.divorce", icon: "/hourglass.webp", }, { id: "none_of_these", - answer: "None of these", + answer: "/questionnaire/relationships/currentlyAffecting.none", icon: "/cross_mark.webp", }, ]; \ No newline at end of file diff --git a/src/components/pages/ABDesign/v1/data/onboarding.ts b/src/components/pages/ABDesign/v1/data/onboarding.ts index 95e3912..e6b77e1 100644 --- a/src/components/pages/ABDesign/v1/data/onboarding.ts +++ b/src/components/pages/ABDesign/v1/data/onboarding.ts @@ -1,8 +1,8 @@ export const onboardingTitles = [ - "Welcome\nto AURA", - "Based on your answers", - "We’ve created your astrological blueprint and guidance plan", - "To help you find your perfect partner", - "And to improve your relationship – for good.", - "Let’s get started.", + "/onboarding.title1", + "/onboarding.title2", + "/onboarding.title3", + "/onboarding.title4", + "/onboarding.title5", + "/onboarding.title6", ]; diff --git a/src/components/pages/ABDesign/v1/data/stepsQuestionary.tsx b/src/components/pages/ABDesign/v1/data/stepsQuestionary.tsx index 22093f8..3dbf139 100644 --- a/src/components/pages/ABDesign/v1/data/stepsQuestionary.tsx +++ b/src/components/pages/ABDesign/v1/data/stepsQuestionary.tsx @@ -11,13 +11,12 @@ import { ELottieKeys } from "@/hooks/lottie/useLottie"; export const stepsQuestionary: IStep[] = [ { id: "profile", - label: "Profile", + label: "profile", color: "#7337A8", questions: [ { id: "flowChoice", - question: - "So we can get to know you better, tell us about your relationship status.", + question: "/questionnaire/profile/flowChoice.title", lottie: { preloadKey: ELottieKeys.goal, }, @@ -35,87 +34,88 @@ export const stepsQuestionary: IStep[] = [ answers: [ { id: "single", - answer: "Single", + answer: "/questionnaire/profile/flowChoice.single", icon: "/heart.webp", }, { id: "relationship", - answer: "In a relationship", + answer: "/questionnaire/profile/flowChoice.relationship", icon: "https://d2ecldjic51fgm.cloudfront.net/pub/assets/aura/emoji/twohearts-bc5e3e37.png", }, { id: "married", - answer: "Married", + answer: "/questionnaire/profile/flowChoice.married", icon: "https://d2ecldjic51fgm.cloudfront.net/pub/assets/aura/emoji/ring-26f6592d.png", }, { id: "complicated", - answer: "Complicated", + answer: "/questionnaire/profile/flowChoice.complicated", icon: "https://d2ecldjic51fgm.cloudfront.net/pub/assets/aura/emoji/brokenheart-9e2ba6fb.png", }, { id: "other", - answer: "Unsure / Other", + answer: "/questionnaire/profile/flowChoice.other", icon: "https://d2ecldjic51fgm.cloudfront.net/pub/assets/aura/emoji/thinkingface-aa0f3a72.png", }, ], }, { id: "goal", - question: "What is your goal?", + question: "/questionnaire/profile/goal.title", navigateToUrl: routes.client.goalSetupV1(), answers: [ { id: "perfect_partner", - answer: "Find my perfect partner", + answer: "/questionnaire/profile/goal.perfect_partner", icon: "/kiss.webp", conditionalValues: ["single", "complicated", "other"], }, { id: "get_married", - answer: "To get married", + answer: "/questionnaire/profile/goal.to_get_married", icon: "/ring.webp", conditionalValues: ["single", "complicated", "other"], }, { id: "understand_myself", - answer: "Understand myself better", + answer: "/questionnaire/profile/goal.understand_myself", icon: "/thinking_face.webp", conditionalValues: ["single", "complicated", "other"], }, { id: "achieve_happiness", - answer: "Achieve happiness", + answer: "/questionnaire/profile/goal.achieve_happiness", icon: "/star_struck.webp", conditionalValues: ["single", "complicated", "other"], }, { id: "personal_growth", - answer: "Personal growth", + answer: "/questionnaire/profile/goal.personal_growth", icon: "/sparkles.webp", conditionalValues: ["single", "complicated", "other"], }, { id: "increase_realtionship", - answer: "Increase relationship satisfaction", + answer: + "/questionnaire/profile/goal.increase_relationship_satisfaction", icon: "/two-hearts.webp", conditionalValues: ["relationship", "married"], }, { id: "fix_realtionship", - answer: "Fix relationship problems", + answer: "/questionnaire/profile/goal.fix_relationship_problems", icon: "/broken_heart.webp", conditionalValues: ["relationship", "married"], }, { id: "build_strong", - answer: "Build a strong marriage", + answer: "/questionnaire/profile/goal.build_strong_marriage", icon: "/kiss.webp", conditionalValues: ["relationship", "married"], }, { id: "check_compatibility", - answer: "Check compatibility", + answer: "/questionnaire/profile/goal.check_compatibility", icon: "/woman-heart-man.webp", conditionalValues: [ "single", @@ -127,7 +127,7 @@ export const stepsQuestionary: IStep[] = [ }, { id: "all_above", - answer: "All above", + answer: "/questionnaire/profile/goal.all_above", icon: "/hands_heart.webp", conditionalValues: [ "single", @@ -141,7 +141,7 @@ export const stepsQuestionary: IStep[] = [ }, { id: "parent", - question: "Are you a parent?", + question: "/questionnaire/profile/parent.title", preloadImages: [ "/hyperPersonalizedAstrology.webp", "/birthdate-image-male.svg", @@ -150,43 +150,42 @@ export const stepsQuestionary: IStep[] = [ answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/check_mark_button.webp", }, { id: "no", - answer: "No", + answer: "no", icon: "/cross_mark.webp", }, ], }, { id: "astrologyKnowledge", - question: "What’s your level of knowledge in astrology?", - description: - "So we can tailor the insights to suit your knowledge level", + question: "/questionnaire/profile/astrologyKnowledge.title", + description: "/questionnaire/profile/astrologyKnowledge.description", navigateToUrl: routes.client.hyperPersonalizedAstrologyV1(), answers: [ { id: "expert", - answer: "An expert", + answer: "/questionnaire/profile/astrologyKnowledge.an_expert", icon: "/man_student.webp", }, { id: "curious", - answer: "Curious", + answer: "/questionnaire/profile/astrologyKnowledge.curious", icon: "/face_with_monocle.webp", }, { id: "beginner", - answer: "A beginner", + answer: "/questionnaire/profile/astrologyKnowledge.beginner", icon: "/slightly_smiling_face.webp", }, ], }, { id: "birthdate", - question: "What's your date of birth?", + question: "/questionnaire/profile/birthdate.title", preloadImages: ["/single-zodiac-info.webp"], touchAction: "none", answersElement: , @@ -194,17 +193,17 @@ export const stepsQuestionary: IStep[] = [ }, { id: "isBirthTime", - question: "Do you know your time of birth?", + question: "/questionnaire/profile/isBirthTime.title", preloadImages: ["/hourglassV1.webp", "/birthPlace.webp"], answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/check_mark_button.webp", }, { id: "no", - answer: "No", + answer: "no", icon: "/cross_mark.webp", navigateToUrl: routes.client.noTimeV1(), }, @@ -212,9 +211,8 @@ export const stepsQuestionary: IStep[] = [ }, { id: "birthtime", - question: "What time were you born?", - description: - "We use NASA data to identify the exact position of the planets in the sky at the time of your birth.", + question: "/questionnaire/profile/birthtime.title", + description: "/questionnaire/profile/birthtime.description", answersElement: , backgroundColor: "#80A2A5", textColor: { @@ -224,9 +222,8 @@ export const stepsQuestionary: IStep[] = [ }, { id: "birthPlace", - question: "Where were you born?", - description: - "This determines the time zone at the place of your birth.", + question: "/questionnaire/profile/birthPlace.title", + description: "/questionnaire/profile/birthPlace.description", touchAction: "none", answersElement: , backgroundImage: "/birthPlace.webp", @@ -251,88 +248,88 @@ export const stepsQuestionary: IStep[] = [ }, { id: "personalityTraits", - label: "Personality traits", + label: "personality_traits", color: "#56ccf2", questions: [ { id: "relateToStatement", - question: "Do you relate to the statement below?", + question: "/questionnaire/personalityTraits/relateToStatement.title", description: - "“I really dislike being alone as much as I hate to admit it.”", + "/questionnaire/personalityTraits/relateToStatement.description", preloadImages: ["/DeWatermark3.webp"], answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/check_mark_button.webp", }, { id: "no", - answer: "No", + answer: "no", icon: "/cross_mark.webp", }, ], }, { id: "notice", - question: "Do you tend to notice what’s wrong more than what’s right?", + question: "/questionnaire/personalityTraits/notice.title", answers: [ { id: "very_frequently", - answer: "Very frequently", + answer: "very_frequently", icon: "/thumbs_up.webp", }, { id: "frequently", - answer: "Frequently", + answer: "frequently", icon: "/thumbs_more_up.webp", }, { id: "occasionally", - answer: "Occasionally", + answer: "occasionally", icon: "/thumbs_middle.webp", }, { id: "rarely", - answer: "Rarely", + answer: "rarely", icon: "/thumbs_more_down.webp", }, { id: "never", - answer: "Never", + answer: "never", icon: "/thumbs_down.webp", }, ], }, { id: "sensitive", - question: "Are you sensitive to criticism?", + question: "/questionnaire/personalityTraits/sensitive.title", answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/thumbs_up.webp", }, { id: "sometimes", - answer: "Sometimes", + answer: "sometimes", icon: "/thumbs_more_up.webp", }, { id: "rarely", - answer: "Rarely", + answer: "rarely", icon: "/thumbs_more_down.webp", }, { id: "not_all", - answer: "Not at all", + answer: "not_all", icon: "/thumbs_down.webp", }, ], }, { id: "tendToOverthink", - question: "Do you tend to overthink?", + question: "/questionnaire/personalityTraits/tendToOverthink.title", backgroundImage: "/DeWatermark3.webp", preloadImages: [ "/bar_chart.webp", @@ -344,12 +341,12 @@ export const stepsQuestionary: IStep[] = [ answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/check_mark_button.webp", }, { id: "no", - answer: "No", + answer: "no", icon: "/cross_mark.webp", }, ], @@ -359,49 +356,49 @@ export const stepsQuestionary: IStep[] = [ }, { id: "mostImportant", - question: "What is most important to you?", + question: "/questionnaire/personalityTraits/mostImportant.title", preloadImages: ["/DeWatermark2.webp"], answers: [ { id: "success", - answer: "Success", + answer: "success", icon: "/bar_chart.webp", }, { id: "romance", - answer: "Romance", + answer: "romance", icon: "/two-hearts.webp", }, { id: "stability", - answer: "Stability", + answer: "stability", icon: "/scales.webp", }, { id: "freedom", - answer: "Freedom", + answer: "freedom", icon: "/airplane.webp", }, { id: "happiness", - answer: "Happiness", + answer: "happiness", icon: "/star_struck.webp", }, { id: "health", - answer: "Health", + answer: "health", icon: "/flexed_biceps.webp", }, { id: "all", - answer: "All above", + answer: "all_above", icon: "/check_mark_button.webp", }, ], }, { id: "emotionalControl", - question: "Is emotional control tricky for you?", + question: "/questionnaire/personalityTraits/emotionalControl.title", preloadImages: [ "/smiling_face_with_heart_eyes.webp", "/pleading_face.webp", @@ -412,25 +409,25 @@ export const stepsQuestionary: IStep[] = [ answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/thumbs_up.webp", navigateToUrl: routes.client.notAloneV1(), }, { id: "sometimes", - answer: "Sometimes", + answer: "sometimes", icon: "/thumbs_more_up.webp", navigateToUrl: routes.client.notAloneV1(), }, { id: "rarely", - answer: "Rarely", + answer: "rarely", icon: "/thumbs_more_down.webp", navigateToUrl: routes.client.allRightV1(), }, { id: "not_all", - answer: "Not at all", + answer: "not_all", icon: "/thumbs_down.webp", navigateToUrl: routes.client.allRightV1(), }, @@ -438,84 +435,84 @@ export const stepsQuestionary: IStep[] = [ }, { id: "attitude", - question: "Do you love your job?", + question: "/questionnaire/personalityTraits/attitude.title", answers: [ { id: "yes", - answer: "Yes! I do something I love", + answer: "/questionnaire/personalityTraits/attitude.answer1", icon: "/smiling_face_with_heart_eyes.webp", }, { id: "not_working", - answer: "I’m not working", + answer: "/questionnaire/personalityTraits/attitude.answer2", icon: "/smiling_face_with_heart_eyes.webp", }, { id: "hate", - answer: "I hate my job", + answer: "/questionnaire/personalityTraits/attitude.answer3", icon: "/pleading_face.webp", }, { id: "okay", - answer: "It’s okay, it pays the bills", + answer: "/questionnaire/personalityTraits/attitude.answer4", icon: "/slightly_smiling_face.webp", }, { id: "underpaid", - answer: "I’m underpaid", + answer: "/questionnaire/personalityTraits/attitude.answer5", icon: "/face_with_raised_eyebrow.webp", }, { id: "stopped_growing", - answer: "I have stopped growing professionally", + answer: "/questionnaire/personalityTraits/attitude.answer6", icon: "/neutral_face.webp", }, ], }, { id: "want", - question: "Do you always know exactly what you want?", + question: "/questionnaire/personalityTraits/want.title", answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/slightly_smiling_face.webp", }, { id: "no", - answer: "No", + answer: "no", icon: "/confused.webp", }, { id: "not_shure", - answer: "Not shure", + answer: "not_sure", icon: "/neutral_face.webp", }, ], }, { id: "relaxing", - question: "Do you have trouble relaxing?", + question: "/questionnaire/personalityTraits/relaxing.title", navigateToUrl: routes.client.almostThereV1(), answers: [ { id: "not_all", - answer: "Not at all", + answer: "not_all", icon: "/smiling_face_with_smiling_eyes.webp", }, { id: "yes", - answer: "Yes", + answer: "yes", icon: "/confused.webp", }, { id: "sometimes", - answer: "Sometimes", + answer: "sometimes", icon: "/neutral_face.webp", }, { id: "rarely", - answer: "Rarely", + answer: "rarely", icon: "/slightly_smiling_face.webp", }, ], @@ -524,44 +521,44 @@ export const stepsQuestionary: IStep[] = [ }, { id: "partnerProfile", - label: "Your partner`s profile", + label: "partner_profile", color: "#56ccf2", questions: [ { id: "partnerGender", - question: "What’s your partner’s gender?", + question: "/questionnaire/partnerProfile/partnerGender.title", answers: [ { id: "male", - answer: "Male", + answer: "male", icon: "/man.webp", }, { id: "female", - answer: "Female", + answer: "female", icon: "/woman.webp", }, ], }, { id: "partnerBirthdate", - question: "What’s your partner’s date of birth?", + question: "/questionnaire/partnerProfile/partnerBirthdate.title", touchAction: "none", answersElement: , }, // TODO: add compatibility page { id: "partnerIsBirthTime", - question: "Do you know your partner’s time of birth?", + question: "/questionnaire/partnerProfile/partnerIsBirthTime.title", answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/check_mark_button.webp", }, { id: "no", - answer: "No", + answer: "no", icon: "/cross_mark.webp", navigateToUrl: `${routes.client.noTimeV1()}?affiliation=partner`, }, @@ -569,18 +566,18 @@ export const stepsQuestionary: IStep[] = [ }, { id: "partnerBirthtime", - question: "At what time was your partner born?", + question: "/questionnaire/partnerProfile/partnerBirthtime.title", description: - "We use NASA data to identify the exactposition of the planets in the sky at the time of your partner's birth.", + "/questionnaire/partnerProfile/partnerBirthtime.description", answersElement: , backgroundColor: "#80A2A5", }, { id: "partnerBirthPlace", - question: "Where was your partner born?", + question: "/questionnaire/partnerProfile/partnerBirthPlace.title", touchAction: "none", description: - "If you don’t know the exact place of birth just type in the country of birth.", + "/questionnaire/partnerProfile/partnerBirthPlace.description", answersElement: , backgroundImage: "/birthPlace.webp", textColor: { @@ -592,13 +589,13 @@ export const stepsQuestionary: IStep[] = [ }, { id: "relationships", - label: "Relationship & Personality Patterns", + label: "relationships", color: "#08D7BA", questions: [ { id: "issueTogether", - question: "Do you agree with the statement below?", - description: "“My partner and I can talk about any issue together“", + question: "/questionnaire/relationships/issueTogether.title", + description: "/questionnaire/relationships/issueTogether.description", backgroundImage: "/lovely_bedroom.webp", preloadImages: [ "/cloud.webp", @@ -617,75 +614,72 @@ export const stepsQuestionary: IStep[] = [ answers: [ { id: "strongly_agree", - answer: "Strongly agree", + answer: "strongly_agree", icon: "/raising_hands.webp", }, { id: "agree", - answer: "Agree", + answer: "agree", icon: "/thumbs_up.webp", }, { id: "neutral", - answer: "Neutral", + answer: "neutral", icon: "/thumbs_middle.webp", }, { id: "disagree", - answer: "Disagree", + answer: "disagree", icon: "/thumbs_more_down.webp", }, { id: "strongly_disagree", - answer: "Strongly disagree", + answer: "strongly_disagree", icon: "/thumbs_down.webp", }, ], }, { id: "currentlyAffecting", - question: - "Are any of these factors currently affecting your relationship?", + question: "/questionnaire/relationships/currentlyAffecting.title", preloadImages: ["/satisfied-yes.webp", "/satisfied-no.webp"], answersElement: , }, { id: "partnerPriority", - question: "Do you agree with the statement below?", - description: - "“My partner and I make sex a priority in our relationship”", + question: "/questionnaire/relationships/partnerPriority.title", + description: "/questionnaire/relationships/partnerPriority.description", answers: [ { id: "strongly_agree", - answer: "Strongly agree", + answer: "strongly_agree", icon: "/raising_hands.webp", }, { id: "agree", - answer: "Agree", + answer: "agree", icon: "/thumbs_up.webp", }, { id: "neutral", - answer: "Neutral", + answer: "neutral", icon: "/thumbs_middle.webp", }, { id: "disagree", - answer: "Disagree", + answer: "disagree", icon: "/thumbs_more_down.webp", }, { id: "strongly_disagree", - answer: "Strongly disagree", + answer: "strongly_disagree", icon: "/thumbs_down.webp", }, ], }, { id: "satisfied", - question: - "Are you satisfied with how you and your partner communicate?", + question: "/questionnaire/relationships/satisfied.title", preloadImages: [ "/microscope.webp", "/mountain.webp", @@ -700,13 +694,13 @@ export const stepsQuestionary: IStep[] = [ answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/check_mark_button.webp", navigateToUrl: routes.client.satisfiedResultV1(), }, { id: "no", - answer: "No", + answer: "no", icon: "/cross_mark.webp", navigateToUrl: routes.client.satisfiedResultV1(), }, @@ -714,142 +708,140 @@ export const stepsQuestionary: IStep[] = [ }, { id: "emotionalConnection", - question: "Do you agree with the statement below?", + question: "/questionnaire/relationships/emotionalConnection.title", description: - "“Strengthening our emotional connection is a priority for both my partner and me”", + "/questionnaire/relationships/emotionalConnection.description", answers: [ { id: "strongly_agree", - answer: "Strongly agree", + answer: "strongly_agree", icon: "/raising_hands.webp", }, { id: "agree", - answer: "Agree", + answer: "agree", icon: "/thumbs_up.webp", }, { id: "neutral", - answer: "Neutral", + answer: "neutral", icon: "/thumbs_middle.webp", }, { id: "disagree", - answer: "Disagree", + answer: "disagree", icon: "/thumbs_more_down.webp", }, { id: "strongly_disagree", - answer: "Strongly disagree", + answer: "strongly_disagree", icon: "/thumbs_down.webp", }, ], }, { id: "bigPicture", - question: - "Would you describe your partner as a detail-oriented or big-picture person?", + question: "/questionnaire/relationships/bigPicture.title", answers: [ { id: "detailed", - answer: "Detail-oriented", + answer: "/questionnaire/relationships/bigPicture.answer1", icon: "/microscope.webp", }, { id: "big_picture", - answer: "Big-picture", + answer: "/questionnaire/relationships/bigPicture.answer2", icon: "/mountain.webp", }, { id: "both", - answer: "A bit of both", + answer: "/questionnaire/relationships/bigPicture.answer3", icon: "/paperclip.webp", }, ], }, { id: "introvertOrExtravert", - question: "Is your partner an introvert or extrovert?", + question: "/questionnaire/relationships/introvertOrExtravert.title", answers: [ { id: "introvert", - answer: "Introvert", + answer: "/questionnaire/relationships/introvertOrExtravert.answer1", icon: "/blue_book.webp", }, { id: "extravert", - answer: "Extravert", + answer: "/questionnaire/relationships/introvertOrExtravert.answer2", icon: "/party_popper.webp", }, { id: "both", - answer: "A bit of both", + answer: "/questionnaire/relationships/introvertOrExtravert.answer3", icon: "/scales.webp", }, ], }, { id: "irritated", - question: "Does your partner get angry or irritated easily?", + question: "/questionnaire/relationships/irritated.title", lottie: { preloadKey: ELottieKeys.cloudAndStars, }, answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/face_with_raised_eyebrow.webp", }, { id: "sometimes", - answer: "Sometimes", + answer: "sometimes", icon: "/thinking_face.webp", }, { id: "rarely", - answer: "Rarely", + answer: "rarely", icon: "/neutral_face.webp", }, { id: "not_all", - answer: "Not at all", + answer: "not_all", icon: "/slightly_smiling_face.webp", }, ], }, { id: "conflict", - question: - "Are you satisfied with the way you and your partner deal with conflict?", + question: "/questionnaire/relationships/conflict.title", lottie: { preloadKey: ELottieKeys.compass, }, answers: [ { id: "yes", - answer: "Yes, I prefer to be honest and direct", + answer: "/questionnaire/relationships/conflict.answer1", icon: "/loudspeaker.webp", }, { id: "depends", - answer: "Depends on the situation and the person", + answer: "/questionnaire/relationships/conflict.answer2", icon: "/scales.webp", }, { id: "no", - answer: "No, I don’t want to get hurt or hurt another person", + answer: "/questionnaire/relationships/conflict.answer3", icon: "/shield.webp", }, { id: "no2", - answer: "No, it makes me nervous", + answer: "/questionnaire/relationships/conflict.answer4", icon: "/fearful_face.webp", }, ], }, { id: "aboutGoals", - question: "When you think about your relationship goals, you feel...?", + question: "/questionnaire/relationships/aboutGoals.title", answerClassName: styles["small-font-size-answer"], lottie: { preloadKey: ELottieKeys.darts, @@ -857,25 +849,25 @@ export const stepsQuestionary: IStep[] = [ answers: [ { id: "optimistic", - answer: "Optimistic! They are totally doable, with some guidance.", + answer: "/questionnaire/relationships/aboutGoals.answer1", icon: "/slightly_smiling_face.webp", navigateToUrl: routes.client.partnerRightPlaceV1(), }, { id: "cautious", - answer: "Cautious. I’ve struggled before, but I’m hopeful.", + answer: "/questionnaire/relationships/aboutGoals.answer2", icon: "/unamused.webp", navigateToUrl: routes.client.partnerThingV1(), }, { id: "feeling", - answer: "I’m feeling a little anxious, honestly.", + answer: "/questionnaire/relationships/aboutGoals.answer3", icon: "/anxious_face_with_sweat.webp", navigateToUrl: routes.client.partnerTotallyNormalV1(), }, { id: "not_shure", - answer: "Not sure / Don’t know", + answer: "/questionnaire/relationships/aboutGoals.answer4", icon: "/thinking_face.webp", navigateToUrl: routes.client.partnerTotallyNormalV1(), }, @@ -883,58 +875,58 @@ export const stepsQuestionary: IStep[] = [ }, { id: "appreciated", - question: "Do you agree with the statement below?", - description: "“My partner makes me feel really appreciated.”", + question: "/questionnaire/relationships/appreciated.title", + description: "/questionnaire/relationships/appreciated.description", lottie: { preloadKey: ELottieKeys.scalesNeutral, }, answers: [ { id: "strongly_agree", - answer: "Strongly agree", + answer: "strongly_agree", icon: "/raising_hands.webp", }, { id: "agree", - answer: "Agree", + answer: "agree", icon: "/thumbs_up.webp", }, { id: "neutral", - answer: "Neutral", + answer: "neutral", icon: "/thumbs_middle.webp", }, { id: "disagree", - answer: "Disagree", + answer: "disagree", icon: "/thumbs_more_down.webp", }, { id: "strongly_disagree", - answer: "Strongly disagree", + answer: "strongly_disagree", icon: "/thumbs_down.webp", }, ], }, { id: "decisions", - question: "Do you make decisions with your head or your heart?", + question: "/questionnaire/relationships/decisions.title", answers: [ { id: "heart", - answer: "Heart", + answer: "/questionnaire/relationships/decisions.heart", icon: "/red-heart.webp", navigateToUrl: routes.client.withHeartV1(), }, { id: "head", - answer: "Head", + answer: "/questionnaire/relationships/decisions.head", icon: "/brain.webp", navigateToUrl: routes.client.withHeadV1(), }, { id: "both", - answer: "Both", + answer: "/questionnaire/relationships/decisions.both", icon: "/paperclip.webp", navigateToUrl: routes.client.bothV1(), }, @@ -944,281 +936,284 @@ export const stepsQuestionary: IStep[] = [ }, { id: "relationship_pattern", - label: "Relationship Pattern", + label: "relationship_pattern", color: "#08D7BA", questions: [ { id: "priority", - question: "Do you agree with the statement below?", - description: "“When I am in a relationship, sex is a priority.“", + question: "/questionnaire/relationship_pattern/priority.title", + description: "/questionnaire/relationship_pattern/priority.description", // backgroundImage: "/couple_in_bad_1.webp", answers: [ { id: "strongly_agree", - answer: "Strongly agree", + answer: "strongly_agree", icon: "/raising_hands.webp", }, { id: "agree", - answer: "Agree", + answer: "agree", icon: "/thumbs_up.webp", }, { id: "neutral", - answer: "Neutral", + answer: "neutral", icon: "/thumbs_middle.webp", }, { id: "disagree", - answer: "Disagree", + answer: "disagree", icon: "/thumbs_more_down.webp", }, { id: "strongly_disagree", - answer: "Strongly disagree", + answer: "strongly_disagree", icon: "/thumbs_down.webp", }, ], }, { id: "comfortable", - question: "Do you agree with the statement below?", - description: "“I feel comfortable around people I barely know.“", + question: "/questionnaire/relationship_pattern/comfortable.title", + description: + "/questionnaire/relationship_pattern/comfortable.description", answers: [ { id: "strongly_agree", - answer: "Strongly agree", + answer: "strongly_agree", icon: "/raising_hands.webp", }, { id: "agree", - answer: "Agree", + answer: "agree", icon: "/thumbs_up.webp", }, { id: "neutral", - answer: "Neutral", + answer: "neutral", icon: "/thumbs_middle.webp", }, { id: "disagree", - answer: "Disagree", + answer: "disagree", icon: "/thumbs_more_down.webp", }, { id: "strongly_disagree", - answer: "Strongly disagree", + answer: "strongly_disagree", icon: "/thumbs_down.webp", }, ], }, { id: "goodEnough", - question: "Do you often worry that you’re not good enough?", + question: "/questionnaire/relationship_pattern/goodEnough.title", answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/thumbs_up.webp", }, { id: "sometimes", - answer: "Sometimes", + answer: "sometimes", icon: "/thumbs_middle.webp", }, { id: "rarely", - answer: "Rarely", + answer: "rarely", icon: "/thumbs_more_down.webp", }, { id: "not_all", - answer: "Not at all", + answer: "not_all", icon: "/thumbs_down.webp", }, ], }, { id: "angry", - question: "Do you easily get angry or irritated?", + question: "/questionnaire/relationship_pattern/angry.title", // backgroundImage: "/woman_gets_angry.webp", answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/face_with_raised_eyebrow.webp", }, { id: "sometimes", - answer: "Sometimes", + answer: "sometimes", icon: "/thinking_face.webp", }, { id: "rarely", - answer: "Rarely", + answer: "rarely", icon: "/neutral_face.webp", }, { id: "not_all", - answer: "Not at all", + answer: "not_all", icon: "/slightly_smiling_face.webp", }, ], }, { id: "innerSelf", - question: "Do you share your inner self with people you like?", + question: "/questionnaire/relationship_pattern/innerSelf.title", answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/thumbs_up.webp", }, { id: "no", - answer: "No", + answer: "no", icon: "/thumbs_down.webp", }, { id: "not_sure", - answer: "Not sure", + answer: "not_sure", icon: "/neutral_face.webp", }, ], }, { id: "aboutPeople", - question: - "Do you remember small details about the people who are important to you?", + question: "/questionnaire/relationship_pattern/aboutPeople.title", answers: [ { id: "yes", - answer: "Yes", + answer: "yes", icon: "/raising_hands.webp", }, { id: "sometimes", - answer: "Sometimes", + answer: "sometimes", icon: "/slightly_smiling_face.webp", }, { id: "rarely", - answer: "Rarely", + answer: "rarely", icon: "/thinking_face.webp", }, { id: "not_all", - answer: "Not at all", + answer: "not_all", icon: "/thumbs_down.webp", }, ], }, { id: "idealDate", - question: "What is your ideal date?", + question: "/questionnaire/relationship_pattern/idealDate.title", answers: [ { id: "dinner", - answer: "Dinner at a fancy restaurant", + answer: "/questionnaire/relationship_pattern/idealDate.answer1", icon: "/fork_and_knife_with_plate.webp", }, { id: "nature", - answer: "A hike in nature", + answer: "/questionnaire/relationship_pattern/idealDate.answer2", icon: "/mountain.webp", }, { id: "talking", - answer: "Talking under the stars", + answer: "/questionnaire/relationship_pattern/idealDate.answer3", icon: "/cityscape_at_dusk.webp", }, { id: "walk", - answer: "A walk in the park", + answer: "/questionnaire/relationship_pattern/idealDate.answer4", icon: "/national_park.webp", }, { id: "skydiving", - answer: "Skydiving", + answer: "/questionnaire/relationship_pattern/idealDate.answer5", icon: "/parachute.webp", }, ], }, { id: "futurePartner", - question: - "Would you describe your future partner as detail-oriented or a big-picture person?", + question: "/questionnaire/relationship_pattern/futurePartner.title", lottie: { preloadKey: ELottieKeys.cloudAndStars, }, answers: [ { id: "detail", - answer: "Detail-oriented", + answer: "/questionnaire/relationship_pattern/futurePartner.answer1", icon: "/microscope.webp", }, { id: "big_picture", - answer: "Big picture", + answer: "/questionnaire/relationship_pattern/futurePartner.answer2", icon: "/mountain.webp", }, { id: "both", - answer: "A bit of both", + answer: "/questionnaire/relationship_pattern/futurePartner.answer3", icon: "/paperclip.webp", }, ], }, { id: "idealPartner", - question: "Is your ideal partner an introvert or extrovert?", + question: "/questionnaire/relationship_pattern/idealPartner.title", lottie: { preloadKey: ELottieKeys.compass, }, answers: [ { id: "introvert", - answer: "Introvert", + answer: "/questionnaire/relationship_pattern/idealPartner.answer1", icon: "/blue_book.webp", }, { id: "extrovert", - answer: "Extrovert", + answer: "/questionnaire/relationship_pattern/idealPartner.answer2", icon: "/party_popper.webp", }, { id: "both", - answer: "A bit of both", + answer: "/questionnaire/relationship_pattern/idealPartner.answer3", icon: "/scales.webp", }, ], }, { id: "relationshipGoal", - question: "When you think about your relationship goals, you feel...?", + question: "/questionnaire/relationship_pattern/relationshipGoal.title", answerClassName: styles["small-font-size-answer"], answers: [ { id: "optimistic", - answer: "Optimistic! They are totally doable, with some guidance.", + answer: + "/questionnaire/relationship_pattern/relationshipGoal.answer1", icon: "/slightly_smiling_face.webp", navigateToUrl: routes.client.partnerRightPlaceV1(), }, { id: "cautious", - answer: "Cautious. I’ve struggled before, but I’m hopeful.", + answer: + "/questionnaire/relationship_pattern/relationshipGoal.answer2", icon: "/unamused.webp", navigateToUrl: routes.client.partnerThingV1(), }, { id: "anxious", - answer: "I’m feeling a little anxious, honestly.", + answer: + "/questionnaire/relationship_pattern/relationshipGoal.answer3", icon: "/anxious_face_with_sweat.webp", navigateToUrl: routes.client.partnerTotallyNormalV1(), }, { id: "not_sure", - answer: "Not sure / Don’t know", + answer: + "/questionnaire/relationship_pattern/relationshipGoal.answer4", icon: "/thinking_face.webp", navigateToUrl: routes.client.partnerTotallyNormalV1(), }, diff --git a/src/components/pages/ABDesign/v1/data/textVariables.tsx b/src/components/pages/ABDesign/v1/data/textVariables.tsx index 96b35d4..779cba6 100644 --- a/src/components/pages/ABDesign/v1/data/textVariables.tsx +++ b/src/components/pages/ABDesign/v1/data/textVariables.tsx @@ -5,13 +5,9 @@ import WorksTraitsDescription from "../pages/QuestionnaireIntermediate/WorksTrai export const textVariables: ITextVariables = { "works-for-us": { titles: { - very_unhappy: - "We’ve got you covered! We’ll start with small, personalized insights into you and your partner’s personality traits.", - unhappy: - "You’re probably doing better than you think! We’ll help you identify how to improve and stick with it.", - happy: `Wonderful! - Let's find out what's working (and what isn’t) and go from - there.`, + very_unhappy: "/works-for-us-1.title", + unhappy: "/works-for-us-2.title", + happy: "/works-for-us-3.title", }, backgroundImages: { very_unhappy: "/works-for-us-very-unhappy.webp", @@ -22,14 +18,10 @@ export const textVariables: ITextVariables = { }, "works-traits": { titles: { - very_unhappy: - "To find out what works for us, we often need to understand what doesn't. We’ll give you insights on how to build a happy and lasting relationship with your new partner.", - unhappy: - "To find out what works for us, we often need to understand what doesn't. We’ll give you insights on how to build a happy and lasting relationship with your new partner.", - happy: - "Sometimes that happens and you need to move on! We'll give you insights on how to build a long lasting relationship with your next partner.", - never_been: - "Well, exciting times ahead! We'll give you insights about your most compatible partner.", + very_unhappy: "/works-traits-1.title", + unhappy: "/works-traits-1.title", + happy: "/works-traits-2.title", + never_been: "/works-traits-3.title", }, backgroundImages: { very_unhappy: "/works-traits-unhappy.webp", diff --git a/src/components/pages/ABDesign/v1/pages/AboutUs/index.tsx b/src/components/pages/ABDesign/v1/pages/AboutUs/index.tsx index 92f2f0d..d80aa30 100644 --- a/src/components/pages/ABDesign/v1/pages/AboutUs/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/AboutUs/index.tsx @@ -8,9 +8,11 @@ import routes from "@/routes"; import Header from "../../components/Header"; import Answer from "../../ui/Answer"; import { useRef, useState } from "react"; +import { useTranslation } from "react-i18next"; function AboutUsPage() { const navigate = useNavigate(); + const { t } = useTranslation(); const dispatch = useDispatch(); const { gender } = useSelector(selectors.selectQuestionnaire); const [selectedAnswer, setSelectedAnswer] = useState(null); @@ -41,7 +43,7 @@ function AboutUsPage() { >
- Where did you hear about us? + {t("/about-us.title")}
diff --git a/src/components/pages/ABDesign/v1/pages/AdditionalDiscount/index.tsx b/src/components/pages/ABDesign/v1/pages/AdditionalDiscount/index.tsx index 3010dab..da2fd5b 100644 --- a/src/components/pages/ABDesign/v1/pages/AdditionalDiscount/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/AdditionalDiscount/index.tsx @@ -8,8 +8,10 @@ import { EPlacementKeys } from "@/api/resources/Paywall"; import { actions, selectors } from "@/store"; import { useDispatch, useSelector } from "react-redux"; import { useEffect } from "react"; +import { useTranslation } from "react-i18next"; function AdditionalDiscount() { + const { t } = useTranslation(); const navigate = useNavigate(); const dispatch = useDispatch(); const activeProduct = useSelector(selectors.selectActiveProduct); @@ -38,28 +40,35 @@ function AdditionalDiscount() { return (
- Save {(getText("discount.1") as string).replace("-", "")} off! + {t("/additional-discount.title", { + discount: (getText("discount.1") as string).replace("-", ""), + })} Friends
Fire

- {(getText("discount.1") as string).replace("-", "")} off on your - personalized plan + {t("/additional-discount.description1", { + discount: (getText("discount.1") as string).replace("-", ""), + })}

Present

- {activeProduct?.trialDuration}-day trial + {t("/additional-discount.description2", { + trialDuration: activeProduct?.trialDuration, + })}

- ${(activeProduct?.price || 0) / 100} instead of $ - {Number(getText("full.price")) / 100} + {t("/additional-discount.price", { + price: ${(activeProduct?.price || 0) / 100}, + fullPrice: Number(getText("full.price")) / 100, + })}

- Get secret discount! + {t("/additional-discount.button")}
); diff --git a/src/components/pages/ABDesign/v1/pages/AllRight/index.tsx b/src/components/pages/ABDesign/v1/pages/AllRight/index.tsx index 0e82152..52d582a 100644 --- a/src/components/pages/ABDesign/v1/pages/AllRight/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/AllRight/index.tsx @@ -9,9 +9,11 @@ import { getZodiacSignByDate } from "@/services/zodiac-sign"; import Header from "../../components/Header"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; import { DotLottieReact } from "@lottiefiles/dotlottie-react"; +import { useTranslation } from "react-i18next"; function AllRightPage() { const navigate = useNavigate(); + const { t } = useTranslation(); const { birthdate } = useSelector(selectors.selectQuestionnaire); const zodiacSign = getZodiacSignByDate(birthdate); @@ -46,13 +48,16 @@ function AllRightPage() {
- All right! + {t("/all-right.title")}

- You keep your emotions in check{" "} - {zodiacSign}, but sometimes - people might want you to show more passion. We can give you some - insights about that! + {t("/all-right.description", { + zodiacSign: ( + + {t(`zodiac_signs.${zodiacSign?.toLowerCase()}`)} + + ), + })}

@@ -60,13 +65,13 @@ function AllRightPage() { className={`${styles.button} ${styles["back-button"]}`} onClick={handleBack} > - Back + {t("back")} - Next + {t("next")}
diff --git a/src/components/pages/ABDesign/v1/pages/AlmostThere/index.tsx b/src/components/pages/ABDesign/v1/pages/AlmostThere/index.tsx index 893aa75..505f146 100644 --- a/src/components/pages/ABDesign/v1/pages/AlmostThere/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/AlmostThere/index.tsx @@ -7,9 +7,11 @@ import Header from "../../components/Header"; import { DotLottieReact } from "@lottiefiles/dotlottie-react"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; import { usePreloadImages } from "@/hooks/preload/images"; +import { useTranslation } from "react-i18next"; function AlmostTherePage() { const navigate = useNavigate(); + const { t } = useTranslation(); usePreloadImages([ "/raising_hands.webp", "/fork_and_knife_with_plate.webp", @@ -49,29 +51,30 @@ function AlmostTherePage() { )}
-
- Almost there! <br /> Now let's tailor your plan by understanding the{" "} - <span className={styles.gradient}>Relationship Pattern</span>. + {t("/almost-there.title", { + gradient: ( + <span className={styles.gradient}> + {t("/almost-there.title_gradient")} + </span> + ), + })} -

- Please take your time when answering. Each response is used to craft - your guidance plan. -

+

{t("/almost-there.description")}

- Back + {t("back")} - Next + {t("next")}
diff --git a/src/components/pages/ABDesign/v1/pages/Both/index.tsx b/src/components/pages/ABDesign/v1/pages/Both/index.tsx index 75ab4db..4842b27 100644 --- a/src/components/pages/ABDesign/v1/pages/Both/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/Both/index.tsx @@ -11,21 +11,21 @@ import Header from "../../components/Header"; import BackgroundTopBlob from "../../ui/BackgroundTopBlob"; import { DotLottieReact } from "@lottiefiles/dotlottie-react"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; -import {useMetricABFlags} from "@/services/metric/metricService.ts"; +import { useMetricABFlags } from "@/services/metric/metricService.ts"; +import { useTranslation } from "react-i18next"; function BothPage() { const navigate = useNavigate(); + const { t } = useTranslation(); const birthdate = useSelector(selectors.selectBirthdate); const zodiacSign = getZodiacSignByDate(birthdate); const { width: pageWidth, elementRef: pageRef } = useDynamicSize({}); const { flags } = useMetricABFlags(); - const aboutUsAnswersKey = flags?.aboutUsAnswers?.[0] + const aboutUsAnswersKey = flags?.aboutUsAnswers?.[0]; const { animationData } = useLottie({ loadKey: ELottieKeys.scalesNeutral, }); - - const handleBack = () => { navigate(-1); }; @@ -54,12 +54,16 @@ function BothPage() {
- <span style={{ color: "#A6FD18" }}>Wonderful!</span> <br /> - <br /> - Based on our data, only the top 17% of{" "} - <span style={{ color: "#A6FD18" }}>{zodiacSign}</span> people make - decisions with their heart and head. Using both in equal measure is - the key to feeling harmonious in your relationships. + {t("/both.title", { + wonderful: ( + <span style={{ color: "#A6FD18" }}>{t("/both.wonderful")}</span> + ), + zodiacSign: ( + <span style={{ color: "#A6FD18" }}> + {t(`zodiac_signs.${zodiacSign?.toLowerCase()}`)} + </span> + ), + })}
@@ -67,13 +71,13 @@ function BothPage() { className={`${styles.button} ${styles["back-button"]}`} onClick={handleBack} > - Back + {t("back")} - Next + {t("next")}
diff --git a/src/components/pages/ABDesign/v1/pages/Both/styles.module.css b/src/components/pages/ABDesign/v1/pages/Both/styles.module.css index a4f57fc..c77d17f 100644 --- a/src/components/pages/ABDesign/v1/pages/Both/styles.module.css +++ b/src/components/pages/ABDesign/v1/pages/Both/styles.module.css @@ -44,6 +44,7 @@ font-weight: normal; width: 100%; margin-top: 288px; + white-space: pre-wrap; } .text { diff --git a/src/components/pages/ABDesign/v1/pages/EmailConfirm/index.tsx b/src/components/pages/ABDesign/v1/pages/EmailConfirm/index.tsx index 7133ce2..54a8292 100644 --- a/src/components/pages/ABDesign/v1/pages/EmailConfirm/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/EmailConfirm/index.tsx @@ -9,8 +9,10 @@ import QuestionnaireGreenButton from "../../ui/GreenButton"; import { DotLottieReact } from "@lottiefiles/dotlottie-react"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; import { useEffect } from "react"; +import { useTranslation } from "react-i18next"; function EmailConfirmPage() { + const { t } = useTranslation(); const navigate = useNavigate(); const { width: pageWidth, elementRef: pageRef } = useDynamicSize({}); @@ -44,24 +46,25 @@ function EmailConfirmPage() { )} - Get access to your{" "} - <span className={styles.gradient}>exclusive reading</span>, special - offers, updates, astrology & relationship tips, recipes, and free - gifts. + {t("/email-confirm.title", { + gradient: ( + <span className={styles.gradient}> + {t("/email-confirm.title_gradient")} + </span> + ), + })} -

- Get it all! Confirm receiving emails so you don't miss anything -

+

{t("/email-confirm.description1")}

- Continue + {t("continue")}

- I know everything about astrology & relationship + {t("/email-confirm.description2")}

diff --git a/src/components/pages/ABDesign/v1/pages/EmailEnterPage/index.tsx b/src/components/pages/ABDesign/v1/pages/EmailEnterPage/index.tsx index fead4fd..8f07219 100644 --- a/src/components/pages/ABDesign/v1/pages/EmailEnterPage/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/EmailEnterPage/index.tsx @@ -152,19 +152,19 @@ function EmailEnterPage({ />
- Enter your email + {t("/email.title")} -

{t("we_dont_share")}

+

{t("/email.description")}

setIsValidEmail(false)} /> setIsValidName(!isRequiredName)} /> @@ -176,7 +176,7 @@ function EmailEnterPage({ {isLoading && } {!isLoading && !(!error?.length && !isLoading && isAuth) && - t("_continue")} + t("continue")} {!error?.length && !isLoading && isAuth && ( - {t("_continue_agree", { + {t("/email.policy", { eulaLink: ( - {t("eula")} + {t("/email.policy_eula")} ), - privacyLink: ( + privacyPolicy: ( - Understand Yourself and Improve Relationships With Astrology + {t("/gender.title")} - 1-Minute Personal Assessment + {t("/gender.description")} - Select your gender: + {t("/gender.select_your_gender")}
{genders.map((gender, index) => ( @@ -152,7 +154,7 @@ function GenderPage({ productKey }: IGenderPageProps): JSX.Element { selectGender(gender); }} > - {gender.name} + {t(gender.id)}
- Great! You just set your first goal! + {t("/goal-setup.title")} -

- Let's keep going so we can get to know you better. -

+

{t("/goal-setup.description")}

- Back + {t("back")} - Next + {t("next")}
diff --git a/src/components/pages/ABDesign/v1/pages/HyperPersonalizedAstrologyPage/index.tsx b/src/components/pages/ABDesign/v1/pages/HyperPersonalizedAstrologyPage/index.tsx index 6d3318e..0cf04ba 100644 --- a/src/components/pages/ABDesign/v1/pages/HyperPersonalizedAstrologyPage/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/HyperPersonalizedAstrologyPage/index.tsx @@ -5,9 +5,11 @@ import routes from "@/routes"; import Header from "../../components/Header"; import QuestionnaireGreenButton from "../../ui/GreenButton"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; +import { useTranslation } from "react-i18next"; function HyperPersonalizedAstrologyPage() { const navigate = useNavigate(); + const { t } = useTranslation(); useLottie({ preloadKey: ELottieKeys.lightBulb, }); @@ -31,31 +33,29 @@ function HyperPersonalizedAstrologyPage() { className={styles.title} style={{ marginTop: "82px" }} > - What is{" "} - hyper-personalized astrology,{" "} - anyway? + {t("/hyper-personalized-astrology.title1", { + gradient: ( + + {t("/hyper-personalized-astrology.gradient")} + + ), + })}

- Personalized astrology is based on the understanding that everyone has a - unique astrological blueprint. The position of the stars in the sky on - your date of birth, place of birth and time of birth are unique and only - happen in one lifetime. You are more than just your zodiac sign! + {t("/hyper-personalized-astrology.description1")}

- So how does it work? + {t("/hyper-personalized-astrology.title2")}

- We analyze hundreds of data points to create your unique astrological - blueprint. This is combined with AI to tailor-make your astrological - insights, based on your answers. We’re going to change your relationship - with astrology. + {t("/hyper-personalized-astrology.description2")}

- Next + {t("next")} ); diff --git a/src/components/pages/ABDesign/v1/pages/LoadingInRelationship/index.tsx b/src/components/pages/ABDesign/v1/pages/LoadingInRelationship/index.tsx index a9b5e98..76fe8c7 100644 --- a/src/components/pages/ABDesign/v1/pages/LoadingInRelationship/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/LoadingInRelationship/index.tsx @@ -14,9 +14,11 @@ import Header from "../../components/Header"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; import { usePreloadImages } from "@/hooks/preload/images"; import { useTouchAction } from "@/hooks/touchAction/useTouchAction"; +import { useTranslation } from "react-i18next"; function LoadingInRelationshipPage() { const navigate = useNavigate(); + const { t } = useTranslation(); const { birthdate, gender } = useSelector(selectors.selectQuestionnaire); const [loadingProgress, setLoadingProgress] = useState(100); const intervalRef = useRef(); @@ -102,19 +104,21 @@ function LoadingInRelationshipPage() { strokeWidth={8} />
-

Connecting database...

-
- - We've helped {randomValue[0]},{`${randomValue[1]}`.padStart(3, "0")}{" "} - other {gender}s with their Sun in{" "} - <span className={styles.yellow}> - {getZodiacSignByDate(birthdate)} - </span>{" "} - to increase relationship satisfaction and we can't wait to help you - too! - -

*as of 24 February 2024

-
+

+ {t("/loading-in-relationship.connecting")} +

+
+ + {t("/loading-in-relationship.description", { + peopleCount: `${randomValue[0]},${randomValue[1]}`.padStart(3, "0"), + gender: t(gender?.toLowerCase()), + zodiacSign: t( + `zodiac_signs.${getZodiacSignByDate(birthdate).toLowerCase()}` + ), + })} + +

{t("/loading-in-relationship.date")}

+
); } diff --git a/src/components/pages/ABDesign/v1/pages/LoadingInRelationship/styles.module.css b/src/components/pages/ABDesign/v1/pages/LoadingInRelationship/styles.module.css index d33f6ab..ee48198 100644 --- a/src/components/pages/ABDesign/v1/pages/LoadingInRelationship/styles.module.css +++ b/src/components/pages/ABDesign/v1/pages/LoadingInRelationship/styles.module.css @@ -39,6 +39,7 @@ text-align: center; line-height: 125%; max-width: 322px; + margin: 0 auto; } .buttons-container { diff --git a/src/components/pages/ABDesign/v1/pages/LoadingProfile/index.tsx b/src/components/pages/ABDesign/v1/pages/LoadingProfile/index.tsx index 37ad44c..c461e53 100644 --- a/src/components/pages/ABDesign/v1/pages/LoadingProfile/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/LoadingProfile/index.tsx @@ -18,6 +18,7 @@ import { useDynamicSize } from "@/hooks/useDynamicSize"; import BackgroundTopBlob from "../../ui/BackgroundTopBlob"; import LoadingProfileModalChild from "../../components/LoadingProfileModalChild"; import ProgressBarSubstrate from "./ProgressBarSubstrate"; +import { useTranslation } from "react-i18next"; function LoadingProfilePage() { const userDeviceType = useSelector(selectors.selectUserDeviceType); @@ -25,6 +26,7 @@ function LoadingProfilePage() { const { width: pageWidth, elementRef: pageElement } = useDynamicSize({}); const navigate = useNavigate(); + const { t } = useTranslation(); const [progress, setProgress] = useState(0); const [isPause, setIsPause] = useState(false); const interval = useRef(); @@ -87,7 +89,7 @@ function LoadingProfilePage() { containerClassName={styles["modal-container"]} > setIsPause(false)} /> @@ -100,7 +102,7 @@ function LoadingProfilePage() {
- {titlesLoadingProfile[Math.floor(progress / 34)]} + {t(titlesLoadingProfile[Math.floor(progress / 34)])}
{loadingProfilePoints.map(({ title, color }, index) => ( @@ -113,7 +115,7 @@ function LoadingProfilePage() { >
- {title} + {t(title)}

- Sit tight! We`re building your perfect guidance plane based on your - unique astrological blueprint and data of millions users. + {t("/loading-profile.description")}

); diff --git a/src/components/pages/ABDesign/v1/pages/NoBirthtime/index.tsx b/src/components/pages/ABDesign/v1/pages/NoBirthtime/index.tsx index 6659778..62be15a 100644 --- a/src/components/pages/ABDesign/v1/pages/NoBirthtime/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/NoBirthtime/index.tsx @@ -8,11 +8,13 @@ import BackgroundTopBlob from "../../ui/BackgroundTopBlob"; import Header from "../../components/Header"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; import { DotLottieReact } from "@lottiefiles/dotlottie-react"; +import { useTranslation } from "react-i18next"; function NoBirthtimePage() { const [searchParams] = useSearchParams(); const affiliation = searchParams.get("affiliation") || "self"; const navigate = useNavigate(); + const { t } = useTranslation(); const { width: pageWidth, elementRef: pageRef } = useDynamicSize({}); const { animationData } = useLottie({ @@ -54,16 +56,20 @@ function NoBirthtimePage() {
- No problem! You can still find plenty of great insights without - knowing - {affiliation === "self" && " your exact birth time."} - {affiliation === "partner" && - " the exact birth time of your partner."} + {t("/no-time.title", { + exactBirthTime: + affiliation === "partner" + ? t("/no-time.title_partner") + : t("/no-time.title_self"), + })}

- Tip: If you find out later, you can adjust this in your - {affiliation === "self" && " profile settings."} - {affiliation === "partner" && " partner’s profile."} + {t("/no-time.description", { + settings: + affiliation === "partner" + ? t("/no-time.description_partner") + : t("/no-time.description_self"), + })}

@@ -71,13 +77,13 @@ function NoBirthtimePage() { className={`${styles.button} ${styles["back-button"]}`} onClick={handleBack} > - Back + {t("back")} - Next + {t("next")}
diff --git a/src/components/pages/ABDesign/v1/pages/NoBirthtime/styles.module.css b/src/components/pages/ABDesign/v1/pages/NoBirthtime/styles.module.css index 9e274ed..99634d8 100644 --- a/src/components/pages/ABDesign/v1/pages/NoBirthtime/styles.module.css +++ b/src/components/pages/ABDesign/v1/pages/NoBirthtime/styles.module.css @@ -43,6 +43,7 @@ text-align: center; line-height: 140%; max-width: 322px; + margin: 0 auto; } .buttons-container { diff --git a/src/components/pages/ABDesign/v1/pages/NotAlone/index.tsx b/src/components/pages/ABDesign/v1/pages/NotAlone/index.tsx index ac002e2..6f7abb8 100644 --- a/src/components/pages/ABDesign/v1/pages/NotAlone/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/NotAlone/index.tsx @@ -9,9 +9,11 @@ import { getZodiacSignByDate } from "@/services/zodiac-sign"; import Header from "../../components/Header"; import { DotLottieReact } from "@lottiefiles/dotlottie-react"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; +import { useTranslation } from "react-i18next"; function NotAlonePage() { const navigate = useNavigate(); + const { t } = useTranslation(); const { birthdate } = useSelector(selectors.selectQuestionnaire); const zodiacSign = getZodiacSignByDate(birthdate); @@ -41,9 +43,16 @@ function NotAlonePage() {
- You’re not alone. + {t("/not-alone.title")}

+ {t("/not-alone.description", { + zodiacSign: ( + + {t(`zodiac_signs.${zodiacSign?.toLowerCase()}`)} + + ), + })} A lot of {zodiacSign} people find it difficult to control emotions due to their zodiac sign traits. Don’t worry, we know how to address that! @@ -54,13 +63,13 @@ function NotAlonePage() { className={`${styles.button} ${styles["back-button"]}`} onClick={handleBack} > - Back + {t("back")} - Next + {t("next")}

diff --git a/src/components/pages/ABDesign/v1/pages/Onboarding/index.tsx b/src/components/pages/ABDesign/v1/pages/Onboarding/index.tsx index e5d93c2..604f2c5 100644 --- a/src/components/pages/ABDesign/v1/pages/Onboarding/index.tsx +++ b/src/components/pages/ABDesign/v1/pages/Onboarding/index.tsx @@ -11,8 +11,10 @@ import { usePersonalVideo } from "@/hooks/personalVideo/usePersonalVideo"; import { useSelector } from "react-redux"; import { selectors } from "@/store"; import metricService, { EGoals } from "@/services/metric/metricService"; +import { useTranslation } from "react-i18next"; function OnboardingPage() { + const { t } = useTranslation(); const navigate = useNavigate(); const [activeIndexTitle, setIndexTitle] = useState(0); const [periodClassName, setPeriodClassName] = useState(""); @@ -97,13 +99,13 @@ function OnboardingPage() { /> {onboardingTitles[activeIndexTitle] && ( - {onboardingTitles[activeIndexTitle]} + {t(onboardingTitles[activeIndexTitle])} )}