{translate("/scan-instruction.title")}
-
+
diff --git a/src/components/CompatibilityV2/pages/ScannedPhoto/index.tsx b/src/components/CompatibilityV2/pages/ScannedPhoto/index.tsx
index 132ea8e..2296915 100644
--- a/src/components/CompatibilityV2/pages/ScannedPhoto/index.tsx
+++ b/src/components/CompatibilityV2/pages/ScannedPhoto/index.tsx
@@ -17,6 +17,8 @@ import { ESourceAuthorization } from "@/api/resources/User";
import { getRandomArbitrary } from "@/services/random-value";
import { usePreloadImages } from "@/hooks/preload/images";
import metricService, { EGoals, EMetrics } from "@/services/metric/metricService";
+import {EUnleashFlags, useUnleash} from "@/hooks/ab/unleash/useUnleash.ts";
+import Loader, {LoaderColor} from "@/components/Loader";
const drawElementChangeDelay = 1500;
const startDelay = 500;
@@ -39,6 +41,10 @@ function ScannedPhoto() {
const fingers = useSelector(selectors.selectCompatibilityV2Fingers);
const lines = useSelector(selectors.selectCompatibilityV2Lines);
+ const { isReady, variant: v2CompatibilityScanResultNumbers } = useUnleash({
+ flag: EUnleashFlags.v2CompatibilityScanResultNumbers
+ });
+
const changeTitleTimeOut = useRef();
const [currentElementIndex, setCurrentElementIndex] = useState(0);
@@ -271,6 +277,10 @@ function ScannedPhoto() {
return Math.floor(progress / 100);
};
+ if (!isReady) return ;
+
+ const isShowLineScale = isReady && v2CompatibilityScanResultNumbers === "on";
+
return (
@@ -287,7 +297,7 @@ function ScannedPhoto() {
drawElements={drawElements}
className={classNameScannedPhoto}
isDecorationShown={isDecorationShown}
- isShowLineScale={true}
+ isShowLineScale={isShowLineScale}
/>
<h2
className={`palmistry-container__waiting-title ${styles.waitingTitle} ${!isDecorationShown ? styles.hidden : ""}`}
diff --git a/src/components/CompatibilityV2/pages/TrialChoice/abText.tsx b/src/components/CompatibilityV2/pages/TrialChoice/abText.tsx
deleted file mode 100644
index aaa1560..0000000
--- a/src/components/CompatibilityV2/pages/TrialChoice/abText.tsx
+++ /dev/null
@@ -1,80 +0,0 @@
-export const getLongText = (locale: string) => {
- if (locale === "es") {
- return (
- <>
- AURA es la única aplicación precisa con un análisis fiable de la línea
- del destino, verificado por profesionales y garantizado para
- proporcionar predicciones precisas.
- <br />
- <br />
- AURA ya ha ayudado a millones de personas a encontrar la felicidad y
- descubrir toda la verdad sobre sus relaciones.
- <br />
- <br />
- Tu análisis del destino, que cambiará tu vida por completo, ¡está casi
- listo! Antes de proporcionártelo, nos gustaría ofrecerte la oportunidad
- de elegir la cantidad que consideres razonable para probar AURA durante
- 7 días y que creas justa para los cambios que te sucederán:
- <br />
- <br />
- • Descubrirás todos los secretos más íntimos que las estrellas tienen
- preparados para ti y resolverás problemas de relación en solo un mes;
- <br />
- <br />
- • Pondrás fin, de una vez por todas, a asuntos pendientes y olvidarás
- los problemas que te han estado atormentando durante años (si no
- décadas);
- <br />
- <br />
- • Ahorrarás cientos de dólares en predicciones astrológicas falsas y
- adivinos no profesionales;
- <br />
- <br />
- • Recibirás no solo un análisis personal, sino también horóscopos
- diarios personalizados, aprenderás quién y cómo está drenando tu energía
- y obtendrás otras lecturas personalizadas.
- <br />
- <br />
- El período de prueba de 7 días nos cuesta $13.76, pero por favor elige
- la cantidad que más te convenga:
- </>
- );
- }
- return (
- <>
- AURA is the only accurate app with reliable fate line analysis, verified
- by professionals and guaranteed to provide precise predictions.
- <br />
- <br />
- AURA has already helped millions of people find happiness and discover the
- whole truth about their relationships.
- <br />
- <br />
- Your fate analysis, which will completely change your life, is almost
- ready! Before we provide it to you, we would like to offer you the
- opportunity to choose the amount you consider reasonable to try AURA for 7
- days and which you think is fair for the changes that will happen to you:
- <br />
- <br />
- You will discover all the most intimate secrets that the stars have
- prepared for you and solve relationship issues within just one month;
- <br />
- <br />
- You will once and for all put the finishing touches on unresolved issues
- and forget about problems that have been haunting you for years (if not
- decades);
- <br />
- <br />
- You will save hundreds of dollars on fake and unprofessional astrological
- predictions and fortune tellers;
- <br />
- <br />
- You will receive not only a personal analysis but also personalized daily
- horoscopes, learn who and how is draining your energy, and get other
- personalized readings.
- <br />
- <br />A 7-day trial period costs us $13.76, but please choose the amount
- that suits you best:
- </>
- );
-};
diff --git a/src/components/CompatibilityV2/pages/TrialChoice/index.tsx b/src/components/CompatibilityV2/pages/TrialChoice/index.tsx
index 7a4f17b..e50f114 100644
--- a/src/components/CompatibilityV2/pages/TrialChoice/index.tsx
+++ b/src/components/CompatibilityV2/pages/TrialChoice/index.tsx
@@ -6,32 +6,30 @@ import { actions, selectors } from "@/store";
import PriceList from "@/components/pages/ABDesign/v1/components/PriceList";
import { usePaywall } from "@/hooks/paywall/usePaywall";
import { EPlacementKeys } from "@/api/resources/Paywall";
-import {
- ELocalesPlacement,
- getDefaultLocaleByLanguage,
- language,
-} from "@/locales";
-import { useEffect, useState } from "react";
+import {addCurrency, ELocalesPlacement} from "@/locales";
+import {useEffect, useMemo, useState} from "react";
import Button from "../../components/Button";
import routes from "@/routes";
import { useNavigate } from "react-router-dom";
import Loader from "@/components/Loader";
import { useTranslations } from "@/hooks/translations";
// import { useMetricABFlags } from "@/services/metric/metricService";
-import { getLongText } from "./abText";
import metricService, { EGoals, EMetrics, useMetricABFlags } from "@/services/metric/metricService";
import TrialChoiceV1 from "./v1";
import { usePreloadImages } from "@/hooks/preload/images";
import { getZodiacSignByDate } from "@/services/zodiac-sign";
+import { EUnleashFlags, useUnleash } from "@/hooks/ab/unleash/useUnleash";
+import {getFormattedPrice} from "@/utils/price.utils.tsx";
function TrialChoice() {
const { translate } = useTranslations(ELocalesPlacement.CompatibilityV2);
const navigate = useNavigate();
const dispatch = useDispatch();
- const { products, isLoading, currency, getText } = usePaywall({
+ const { products, isLoading, currency } = usePaywall({
placementKey: EPlacementKeys["aura.placement.compatibility.v2"],
localesPlacement: ELocalesPlacement.CompatibilityV2,
});
+
const { gender, partnerGender, birthdate, partnerBirthdate } = useSelector(selectors.selectQuestionnaire)
const zodiacSign = getZodiacSignByDate(birthdate);
const zodiacSignPartner = getZodiacSignByDate(partnerBirthdate);
@@ -53,8 +51,6 @@ function TrialChoice() {
"/v2/compatibility/partners.png"
])
- const locale = getDefaultLocaleByLanguage(language);
-
const { flags, ready } = useMetricABFlags();
const trialChoicePageType = flags?.trialChoicePageType?.[0];
// const trialChoicePageType = "v1";
@@ -68,6 +64,28 @@ function TrialChoice() {
const email = useSelector(selectors.selectEmail);
const homeConfig = useSelector(selectors.selectHome);
+ const { variant: trialPriceVariant = 'v0', isReady: isReadyTrialPrice } = useUnleash({
+ flag: EUnleashFlags.compatibilityV2TrialTextPrice,
+ });
+
+ const maxProduct = useMemo(() => {
+ if (!products?.length) return null;
+ return products.reduce(
+ (max, product) => {
+ return Number(product.trialPrice || 0) > Number(max.trialPrice || 0) ? product : max
+ },
+ products[0]
+ );
+ }, [products]);
+
+ const maxTrialPrice = useMemo(() => {
+ if (!maxProduct) return "";
+ return addCurrency(
+ getFormattedPrice(maxProduct.trialPrice || 0),
+ currency
+ );
+ }, [maxProduct, currency]);
+
const handlePriceItem = () => {
metricService.reachGoal(EGoals.SELECT_TRIAL, [EMetrics.YANDEX, EMetrics.KLAVIYO]);
metricService.reachGoal(EGoals.AURA_SELECT_TRIAL, [EMetrics.KLAVIYO]);
@@ -91,7 +109,7 @@ function TrialChoice() {
metricService.reachGoal(EGoals.AURA_TRIAL_CHOICE_PAGE_VISIT, [EMetrics.KLAVIYO]);
}, []);
- if (!ready) {
+ if (!ready || !isReadyTrialPrice) {
return (
<div className={styles.container}>
<Loader className={styles.loader} />
@@ -102,10 +120,29 @@ function TrialChoice() {
if (trialChoicePageType === "v1") {
return <TrialChoiceV1 />;
}
+ let trialPriceTextVariant = 'v0';
+ switch (trialPriceVariant) {
+ case "v0":
+ trialPriceTextVariant = "v0";
+ break;
+ case "v1":
+ trialPriceTextVariant = "v1";
+ break;
+ case "v2":
+ trialPriceTextVariant = "v2";
+ break;
+ case "v3":
+ trialPriceTextVariant = "v3";
+ break;
+ default:
+ trialPriceTextVariant = "v0";
+ break;
+ }
+
return (
<div className={styles.container}>
- {!isLoading && (
+ {!(isLoading || !isReadyTrialPrice || !maxProduct) && (
<>
<EmailSubstrate className={styles["email-substrate"]} email={email} />
{/* {!isLongText && (
@@ -113,7 +150,13 @@ function TrialChoice() {
{getText("text.0")}
)} */}
-
);
}
diff --git a/src/components/CompatibilityV3/pages/TrialChoice/abText.tsx b/src/components/CompatibilityV3/pages/TrialChoice/abText.tsx
deleted file mode 100644
index aaa1560..0000000
--- a/src/components/CompatibilityV3/pages/TrialChoice/abText.tsx
+++ /dev/null
@@ -1,80 +0,0 @@
-export const getLongText = (locale: string) => {
- if (locale === "es") {
- return (
- <>
- AURA es la única aplicación precisa con un análisis fiable de la línea
- del destino, verificado por profesionales y garantizado para
- proporcionar predicciones precisas.
-
-
- AURA ya ha ayudado a millones de personas a encontrar la felicidad y
- descubrir toda la verdad sobre sus relaciones.
-
-
- Tu análisis del destino, que cambiará tu vida por completo, ¡está casi
- listo! Antes de proporcionártelo, nos gustaría ofrecerte la oportunidad
- de elegir la cantidad que consideres razonable para probar AURA durante
- 7 días y que creas justa para los cambios que te sucederán:
-
-
- • Descubrirás todos los secretos más íntimos que las estrellas tienen
- preparados para ti y resolverás problemas de relación en solo un mes;
-
-
- • Pondrás fin, de una vez por todas, a asuntos pendientes y olvidarás
- los problemas que te han estado atormentando durante años (si no
- décadas);
-
-
- • Ahorrarás cientos de dólares en predicciones astrológicas falsas y
- adivinos no profesionales;
-
-
- • Recibirás no solo un análisis personal, sino también horóscopos
- diarios personalizados, aprenderás quién y cómo está drenando tu energía
- y obtendrás otras lecturas personalizadas.
-
-
- El período de prueba de 7 días nos cuesta $13.76, pero por favor elige
- la cantidad que más te convenga:
-
- );
- }
- return (
- <>
- AURA is the only accurate app with reliable fate line analysis, verified
- by professionals and guaranteed to provide precise predictions.
-
-
- AURA has already helped millions of people find happiness and discover the
- whole truth about their relationships.
-
-
- Your fate analysis, which will completely change your life, is almost
- ready! Before we provide it to you, we would like to offer you the
- opportunity to choose the amount you consider reasonable to try AURA for 7
- days and which you think is fair for the changes that will happen to you:
-
-
- You will discover all the most intimate secrets that the stars have
- prepared for you and solve relationship issues within just one month;
-
-
- You will once and for all put the finishing touches on unresolved issues
- and forget about problems that have been haunting you for years (if not
- decades);
-
-
- You will save hundreds of dollars on fake and unprofessional astrological
- predictions and fortune tellers;
-
-
- You will receive not only a personal analysis but also personalized daily
- horoscopes, learn who and how is draining your energy, and get other
- personalized readings.
-
- A 7-day trial period costs us $13.76, but please choose the amount
- that suits you best:
-
- );
-};
diff --git a/src/components/CompatibilityV3/pages/TrialChoice/index.tsx b/src/components/CompatibilityV3/pages/TrialChoice/index.tsx
index 9c08876..b938abb 100644
--- a/src/components/CompatibilityV3/pages/TrialChoice/index.tsx
+++ b/src/components/CompatibilityV3/pages/TrialChoice/index.tsx
@@ -6,29 +6,26 @@ import { actions, selectors } from "@/store";
import PriceList from "@/components/pages/ABDesign/v1/components/PriceList";
import { usePaywall } from "@/hooks/paywall/usePaywall";
import { EPlacementKeys } from "@/api/resources/Paywall";
-import {
- ELocalesPlacement,
- getDefaultLocaleByLanguage,
- language,
-} from "@/locales";
-import { useEffect, useState } from "react";
+import {addCurrency, ELocalesPlacement} from "@/locales";
+import {useEffect, useMemo, useState} from "react";
import Button from "../../components/Button";
import routes from "@/routes";
import { useNavigate } from "react-router-dom";
import Loader from "@/components/Loader";
import { useTranslations } from "@/hooks/translations";
// import { useMetricABFlags } from "@/services/metric/metricService";
-import { getLongText } from "./abText";
import metricService, { EGoals, EMetrics } from "@/services/metric/metricService";
import { usePreloadImages } from "@/hooks/preload/images";
import { getZodiacSignByDate } from "@/services/zodiac-sign";
import { images } from "../../data";
+import { EUnleashFlags, useUnleash } from "@/hooks/ab/unleash/useUnleash";
+import {getFormattedPrice} from "@/utils/price.utils.tsx";
function TrialChoice() {
const { translate } = useTranslations(ELocalesPlacement.CompatibilityV3);
const navigate = useNavigate();
const dispatch = useDispatch();
- const { products, isLoading, currency, getText } = usePaywall({
+ const { products, isLoading, currency } = usePaywall({
placementKey: EPlacementKeys["aura.placement.compatibility.v3"],
localesPlacement: ELocalesPlacement.CompatibilityV3,
});
@@ -52,8 +49,6 @@ function TrialChoice() {
"/v3/compatibility/partners.png"
])
- const locale = getDefaultLocaleByLanguage(language);
-
// const { flags } = useMetricABFlags();
// const isLongText = flags?.text?.[0] === "on";
@@ -63,6 +58,28 @@ function TrialChoice() {
const email = useSelector(selectors.selectEmail);
const homeConfig = useSelector(selectors.selectHome);
+ const maxProduct = useMemo(() => {
+ if (!products?.length) return null;
+ return products.reduce(
+ (max, product) => {
+ return Number(product.trialPrice || 0) > Number(max.trialPrice || 0) ? product : max
+ },
+ products[0]
+ );
+ }, [products]);
+
+ const maxTrialPrice = useMemo(() => {
+ if (!maxProduct) return "";
+ return addCurrency(
+ getFormattedPrice(maxProduct.trialPrice || 0),
+ currency
+ );
+ }, [maxProduct, currency]);
+
+ const { variant: trialPriceVariant = 'v0', isReady: isReadyTrialPrice } = useUnleash({
+ flag: EUnleashFlags.compatibilityV3TrialTextPrice,
+ });
+
const handlePriceItem = () => {
metricService.reachGoal(EGoals.SELECT_TRIAL, [EMetrics.YANDEX, EMetrics.KLAVIYO]);
metricService.reachGoal(EGoals.AURA_SELECT_TRIAL, [EMetrics.KLAVIYO]);
@@ -86,9 +103,28 @@ function TrialChoice() {
metricService.reachGoal(EGoals.AURA_TRIAL_CHOICE_PAGE_VISIT, [EMetrics.KLAVIYO]);
}, []);
+ let trialPriceTextVariant = 'v0';
+ switch (trialPriceVariant) {
+ case "v0":
+ trialPriceTextVariant = "v0";
+ break;
+ case "v1":
+ trialPriceTextVariant = "v1";
+ break;
+ case "v2":
+ trialPriceTextVariant = "v2";
+ break;
+ case "v3":
+ trialPriceTextVariant = "v3";
+ break;
+ default:
+ trialPriceTextVariant = "v0";
+ break;
+ }
+
return (
{translate("/trial-payment.reading_ready.title")}
diff --git a/src/components/PalmistryV1/pages/TrialChoice/abText.tsx b/src/components/PalmistryV1/pages/TrialChoice/abText.tsx
deleted file mode 100644
index aaa1560..0000000
--- a/src/components/PalmistryV1/pages/TrialChoice/abText.tsx
+++ /dev/null
@@ -1,80 +0,0 @@
-export const getLongText = (locale: string) => {
- if (locale === "es") {
- return (
- <>
- AURA es la única aplicación precisa con un análisis fiable de la línea
- del destino, verificado por profesionales y garantizado para
- proporcionar predicciones precisas.
- <br />
- <br />
- AURA ya ha ayudado a millones de personas a encontrar la felicidad y
- descubrir toda la verdad sobre sus relaciones.
- <br />
- <br />
- Tu análisis del destino, que cambiará tu vida por completo, ¡está casi
- listo! Antes de proporcionártelo, nos gustaría ofrecerte la oportunidad
- de elegir la cantidad que consideres razonable para probar AURA durante
- 7 días y que creas justa para los cambios que te sucederán:
- <br />
- <br />
- • Descubrirás todos los secretos más íntimos que las estrellas tienen
- preparados para ti y resolverás problemas de relación en solo un mes;
- <br />
- <br />
- • Pondrás fin, de una vez por todas, a asuntos pendientes y olvidarás
- los problemas que te han estado atormentando durante años (si no
- décadas);
- <br />
- <br />
- • Ahorrarás cientos de dólares en predicciones astrológicas falsas y
- adivinos no profesionales;
- <br />
- <br />
- • Recibirás no solo un análisis personal, sino también horóscopos
- diarios personalizados, aprenderás quién y cómo está drenando tu energía
- y obtendrás otras lecturas personalizadas.
- <br />
- <br />
- El período de prueba de 7 días nos cuesta $13.76, pero por favor elige
- la cantidad que más te convenga:
- </>
- );
- }
- return (
- <>
- AURA is the only accurate app with reliable fate line analysis, verified
- by professionals and guaranteed to provide precise predictions.
- <br />
- <br />
- AURA has already helped millions of people find happiness and discover the
- whole truth about their relationships.
- <br />
- <br />
- Your fate analysis, which will completely change your life, is almost
- ready! Before we provide it to you, we would like to offer you the
- opportunity to choose the amount you consider reasonable to try AURA for 7
- days and which you think is fair for the changes that will happen to you:
- <br />
- <br />
- You will discover all the most intimate secrets that the stars have
- prepared for you and solve relationship issues within just one month;
- <br />
- <br />
- You will once and for all put the finishing touches on unresolved issues
- and forget about problems that have been haunting you for years (if not
- decades);
- <br />
- <br />
- You will save hundreds of dollars on fake and unprofessional astrological
- predictions and fortune tellers;
- <br />
- <br />
- You will receive not only a personal analysis but also personalized daily
- horoscopes, learn who and how is draining your energy, and get other
- personalized readings.
- <br />
- <br />A 7-day trial period costs us $13.76, but please choose the amount
- that suits you best:
- </>
- );
-};
diff --git a/src/components/PalmistryV1/pages/TrialChoice/index.tsx b/src/components/PalmistryV1/pages/TrialChoice/index.tsx
index c20c7b1..b3136d6 100644
--- a/src/components/PalmistryV1/pages/TrialChoice/index.tsx
+++ b/src/components/PalmistryV1/pages/TrialChoice/index.tsx
@@ -6,28 +6,25 @@ import { actions, selectors } from "@/store";
import PriceList from "@/components/pages/ABDesign/v1/components/PriceList";
import { usePaywall } from "@/hooks/paywall/usePaywall";
import { EPlacementKeys } from "@/api/resources/Paywall";
-import {
- ELocalesPlacement,
- getDefaultLocaleByLanguage,
- language,
-} from "@/locales";
-import { useEffect, useState } from "react";
+import {addCurrency, ELocalesPlacement} from "@/locales";
+import {useEffect, useMemo, useState} from "react";
import Button from "../../components/Button";
import routes from "@/routes";
import { useNavigate } from "react-router-dom";
import Loader from "@/components/Loader";
import { useTranslations } from "@/hooks/translations";
// import { useMetricABFlags } from "@/services/metric/metricService";
-import { getLongText } from "./abText";
import metricService, { EGoals, EMetrics, useMetricABFlags } from "@/services/metric/metricService";
import TrialChoiceV1 from "./v1";
import { usePreloadImages } from "@/hooks/preload/images";
+import { EUnleashFlags, useUnleash } from "@/hooks/ab/unleash/useUnleash";
+import {getFormattedPrice} from "@/utils/price.utils.tsx";
function TrialChoice() {
const { translate } = useTranslations(ELocalesPlacement.PalmistryV1);
const navigate = useNavigate();
const dispatch = useDispatch();
- const { products, isLoading, currency, getText } = usePaywall({
+ const { products, isLoading, currency } = usePaywall({
placementKey: EPlacementKeys["aura.placement.palmistry.redesign"],
localesPlacement: ELocalesPlacement.PalmistryV1,
});
@@ -46,8 +43,6 @@ function TrialChoice() {
"/v1/palmistry/partners.png"
])
- const locale = getDefaultLocaleByLanguage(language);
-
const { flags, ready } = useMetricABFlags();
const trialChoicePageType = flags?.trialChoicePageType?.[0];
// const trialChoicePageType = "v1";
@@ -58,6 +53,26 @@ function TrialChoice() {
const selectedPrice = useSelector(selectors.selectSelectedPrice);
const email = useSelector(selectors.selectEmail);
const homeConfig = useSelector(selectors.selectHome);
+ const maxProduct = useMemo(() => {
+ if (!products?.length) return null;
+ return products.reduce(
+ (max, product) => {
+ return Number(product.trialPrice || 0) > Number(max.trialPrice || 0) ? product : max
+ },
+ products[0]
+ );
+ }, [products]);
+
+ const maxTrialPrice = useMemo(() => {
+ if (!maxProduct) return "";
+ return addCurrency(
+ getFormattedPrice(maxProduct.trialPrice || 0),
+ currency
+ );
+ }, [maxProduct, currency]);
+ const { variant: trialPriceVariant = 'v0', isReady: isReadyTrialPrice } = useUnleash({
+ flag: EUnleashFlags.palmistryV1TrialTextPrice,
+ });
const handlePriceItem = () => {
metricService.reachGoal(EGoals.SELECT_TRIAL, [EMetrics.YANDEX, EMetrics.KLAVIYO]);
@@ -82,7 +97,7 @@ function TrialChoice() {
metricService.reachGoal(EGoals.AURA_TRIAL_CHOICE_PAGE_VISIT, [EMetrics.KLAVIYO]);
}, []);
- if (!ready) {
+ if (!ready || !isReadyTrialPrice) {
return (
<div className={styles.container}>
<Loader className={styles.loader} />
@@ -94,9 +109,28 @@ function TrialChoice() {
return <TrialChoiceV1 />;
}
+ let trialPriceTextVariant = 'v0';
+ switch (trialPriceVariant) {
+ case "v0":
+ trialPriceTextVariant = "v0";
+ break;
+ case "v1":
+ trialPriceTextVariant = "v1";
+ break;
+ case "v2":
+ trialPriceTextVariant = "v2";
+ break;
+ case "v3":
+ trialPriceTextVariant = "v3";
+ break;
+ default:
+ trialPriceTextVariant = "v0";
+ break;
+ }
+
return (
<div className={styles.container}>
- {!isLoading && (
+ {!(isLoading || !isReadyTrialPrice || !maxProduct) && (
<>
<EmailSubstrate className={styles["email-substrate"]} email={email} />
{/* {!isLongText && (
@@ -104,7 +138,13 @@ function TrialChoice() {
{getText("text.0")}
)} */}
-