gofnnp/w-aura
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'develop' into 'main'

Browse Source 
AW-483-484-485-fix-bugs

See merge request witapp/aura-webapp!789
This commit is contained in:
Daniil Chemerkin 2025-07-01 15:22:36 +00:00
commit 7b9f107814
11 changed files with 641 additions and 485 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

140
src/components/Anonymous/pages/Payment/index.tsx
View File

@ -12,81 +12,83 @@ import { ELocalesPlacement } from "@/locales";
import { useFunnel } from "@/hooks/funnel/useFunnel"; import { useFunnel } from "@/hooks/funnel/useFunnel";
function AnonymousPaymentPage() { function AnonymousPaymentPage() {
const dispatch = useDispatch(); const dispatch = useDispatch();
const navigate = useNavigate(); const navigate = useNavigate();
const { products } = useFunnel({ const { products } = useFunnel({
funnel: ELocalesPlacement.EmailGenerator, funnel: ELocalesPlacement.EmailGenerator,
paymentPlacement: "TODO:FUNNEL" paymentPlacement: "TODO:FUNNEL",
}); });
const activeProduct = products[0]; const activeProduct = products[0];
const activeProductFromStore = useSelector(selectors.selectActiveProduct) const activeProductFromStore = useSelector(selectors.selectActiveProduct);
const { session, createSession } = useSession(); const { session, createSession } = useSession();
const utm = useSelector(selectors.selectUTM); const utm = useSelector(selectors.selectUTM);
const feature = useSelector(selectors.selectFeature); const feature = useSelector(selectors.selectFeature);
const [isParametersInitialized, setIsParametersInitialized] = useState(false); const [isParametersInitialized, setIsParametersInitialized] = useState(false);
const location = useLocation(); const location = useLocation();
useEffect(() => { useEffect(() => {
const _feature = location.pathname.replace( const _feature = location.pathname.replace(
routes.client.anonymousPayment(), routes.client.anonymousPayment(),
"" ""
); );
dispatch( dispatch(
actions.userConfig.setFeature( actions.userConfig.setFeature(
_feature.includes("/v1/gender") ? "" : _feature _feature.includes("/v1/gender") ? "" : _feature
) )
); );
dispatch(actions.privacyPolicy.updateChecked(true)) dispatch(actions.privacyPolicy.updateChecked(true));
}, [dispatch, location.pathname]); }, [dispatch, location.pathname]);
useEffect(() => { useEffect(() => {
if (!isParametersInitialized) { if (!isParametersInitialized) {
return setIsParametersInitialized(true); return setIsParametersInitialized(true);
}
(async () => {
await createSession(ESourceAuthorization["aura.test.payment"])
})()
}, [utm, feature, isParametersInitialized])
useEffect(() => {
if (!!activeProduct) {
dispatch(actions.payment.update({
activeProduct
}))
}
}, [activeProduct]);
function onPaymentError(error?: string | undefined): void {
if (error === "Product not found") {
return navigate(routes.client.compatibilityV2TrialChoice());
}
} }
(async () => {
await createSession(ESourceAuthorization["aura.test.payment"]);
})();
}, [utm, feature, isParametersInitialized]);
function onPaymentSuccess(): void { useEffect(() => {
setTimeout(() => { if (!!activeProduct) {
navigate(routes.client.home()); dispatch(
}, 1500); actions.payment.update({
activeProduct,
})
);
} }
}, [activeProduct]);
return ( function onPaymentError(error?: string | null): void {
<div className={styles.container}> if (error === "Product not found") {
{!!activeProductFromStore && session?.["aura.test.payment"]?.length ? return navigate(routes.client.compatibilityV2TrialChoice());
<PaymentPage }
// placementKey={EPlacementKeys["aura.placement.payment"]} }
funnel={ELocalesPlacement.EmailGenerator}
paymentPlacement="TODO:FUNNEL" function onPaymentSuccess(): void {
onError={onPaymentError} setTimeout(() => {
onSuccess={onPaymentSuccess} navigate(routes.client.home());
isBackButtonVisible={false} }, 1500);
isAnonymous={true} }
sessionId={session?.["aura.test.payment"]}
/> return (
: <div className={styles.container}>
<Loader color={LoaderColor.Black} /> {!!activeProductFromStore && session?.["aura.test.payment"]?.length ? (
} <PaymentPage
</div> // placementKey={EPlacementKeys["aura.placement.payment"]}
) funnel={ELocalesPlacement.EmailGenerator}
paymentPlacement="TODO:FUNNEL"
onError={onPaymentError}
onSuccess={onPaymentSuccess}
isBackButtonVisible={false}
isAnonymous={true}
sessionId={session?.["aura.test.payment"]}
/>
) : (
<Loader color={LoaderColor.Black} />
)}
</div>
);
} }
export default AnonymousPaymentPage export default AnonymousPaymentPage;

17
src/components/Payment/nmi/CheckoutForm/index.tsx
View File

@ -22,7 +22,7 @@ interface ICheckoutFormProps {
funnel: ELocalesPlacement; funnel: ELocalesPlacement;
paymentPlacement: string; paymentPlacement: string;
onSuccess?: () => void; onSuccess?: () => void;
onError?: (error?: string) => void; onError?: (error?: string | null) => void;
onModalClosed?: () => void; onModalClosed?: () => void;
} }
@ -66,14 +66,15 @@ export default function CheckoutForm({
}); });
useEffect(() => { useEffect(() => {
if (error && onError) { // if (error) {
console.log(error); console.log(error);
if (error === "card_type_error") { if (error === "card_type_error") {
return setIsCardTypeError(true); return setIsCardTypeError(true);
} } else {
setIsCardTypeError(false);
onError(error);
} }
onError?.(error);
// }
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [error]); }, [error]);

184
src/components/Payment/nmi/PaymentForm/index.tsx
View File

@ -11,103 +11,109 @@ import { EPaymentMethod } from "@/data/paymentMethods";
import { IFunnelPaymentVariant } from "@/api/resources/Session"; import { IFunnelPaymentVariant } from "@/api/resources/Session";
const getPrice = (product: IFunnelPaymentVariant | null) => { const getPrice = (product: IFunnelPaymentVariant | null) => {
if (!product) { if (!product) {
return 0; return 0;
} }
return (product.trialPrice || 0) / 100; return (product.trialPrice || 0) / 100;
} };
interface IPaymentFormProps { interface IPaymentFormProps {
isSinglePayment?: boolean; isSinglePayment?: boolean;
className?: string; className?: string;
funnel: ELocalesPlacement; funnel: ELocalesPlacement;
paymentPlacement: string; paymentPlacement: string;
trialInterval: number; trialInterval: number;
onPaymentError?: (error?: string) => void; onPaymentError?: (error?: string | null) => void;
onPaymentSuccess?: () => void; onPaymentSuccess?: () => void;
onModalClosed?: () => void; onModalClosed?: () => void;
} }
function PaymentForm({ function PaymentForm({
isSinglePayment = false, isSinglePayment = false,
className, className,
funnel, funnel,
paymentPlacement, paymentPlacement,
trialInterval, trialInterval,
onPaymentError, onPaymentError,
onPaymentSuccess, onPaymentSuccess,
onModalClosed onModalClosed,
}: IPaymentFormProps) { }: IPaymentFormProps) {
const { translate } = useTranslations(ELocalesPlacement.V1); const { translate } = useTranslations(ELocalesPlacement.V1);
const currency = useSelector(selectors.selectCurrency); const currency = useSelector(selectors.selectCurrency);
const activeProduct = useSelector(selectors.selectActiveProduct); const activeProduct = useSelector(selectors.selectActiveProduct);
const isLoading = false; const isLoading = false;
const paymentMethodsButtons = [ const paymentMethodsButtons = [
{ {
id: EPaymentMethod.CREDIT_CARD, id: EPaymentMethod.CREDIT_CARD,
icon: "/payment-form/credit-card.svg", icon: "/payment-form/credit-card.svg",
title: translate("payment_modal.credit_card") title: translate("payment_modal.credit_card"),
} },
] ];
return ( return (
<> <>
{isLoading && ( {isLoading && (
<div className={styles["payment-modal"]}> <div className={styles["payment-modal"]}>
<div className={styles["payment-loader"]}> <div className={styles["payment-loader"]}>
<Loader /> <Loader />
</div> </div>
</div> </div>
)} )}
<div <div
className={`${styles["payment-modal"]} ${isLoading ? styles.hide : ""} ${className}`} className={`${styles["payment-modal"]} ${
> isLoading ? styles.hide : ""
{!isSinglePayment && <Title variant="h3" className={styles.title}> } ${className}`}
{translate("payment_modal.title")} >
</Title>} {!isSinglePayment && (
<PaymentMethodsChoice <Title variant="h3" className={styles.title}>
paymentMethods={paymentMethodsButtons} {translate("payment_modal.title")}
selectedPaymentMethod={paymentMethodsButtons[0].id} </Title>
onSelectPaymentMethod={() => { }} )}
/> <PaymentMethodsChoice
{!isSinglePayment && activeProduct && ( paymentMethods={paymentMethodsButtons}
<div> selectedPaymentMethod={paymentMethodsButtons[0].id}
<p className={styles["sub-plan-description"]}> onSelectPaymentMethod={() => {}}
{translate("payment_modal.description", { />
priceForDays: ( {!isSinglePayment && activeProduct && (
<b> <div>
{translate("payment_modal.price_for_days", { <p className={styles["sub-plan-description"]}>
trialPrice: addCurrency( {translate("payment_modal.description", {
getPrice(activeProduct), priceForDays: (
currency <b>
), {translate("payment_modal.price_for_days", {
trialDuration: trialInterval, trialPrice: addCurrency(
})} getPrice(activeProduct),
</b> currency
), ),
emailReminder: ( trialDuration: trialInterval,
<b>{translate("payment_modal.email_reminder")}</b> })}
), </b>
})} ),
</p> emailReminder: (
</div> <b>{translate("payment_modal.email_reminder")}</b>
)} ),
<div className={styles["payment-method-container"]}> })}
{!!activeProduct && <CheckoutForm </p>
funnel={funnel} </div>
paymentPlacement={paymentPlacement} )}
activeProduct={activeProduct} <div className={styles["payment-method-container"]}>
onError={onPaymentError} {!!activeProduct && (
onSuccess={onPaymentSuccess} <CheckoutForm
onModalClosed={onModalClosed} funnel={funnel}
/>} paymentPlacement={paymentPlacement}
</div> activeProduct={activeProduct}
<p className={styles.address}>{translate("payment_modal.address")}</p> onError={onPaymentError}
</div> onSuccess={onPaymentSuccess}
</> onModalClosed={onModalClosed}
) />
)}
</div>
<p className={styles.address}>{translate("payment_modal.address")}</p>
</div>
</>
);
} }
export default PaymentForm export default PaymentForm;

20
src/components/Payment/nmi/PaymentPage/index.tsx
View File

@ -28,7 +28,7 @@ interface IPaymentPageProps {
sessionId?: string; sessionId?: string;
funnel: ELocalesPlacement; funnel: ELocalesPlacement;
paymentPlacement: string; paymentPlacement: string;
onError?: (error?: string) => void; onError?: (error?: string | null) => void;
onSuccess?: () => void; onSuccess?: () => void;
onBack?: () => void; onBack?: () => void;
onPopState?: () => void; onPopState?: () => void;
@ -89,13 +89,17 @@ function PaymentPage({
}, },
]; ];
function onPaymentError(error?: string | undefined): void { function onPaymentError(error?: string | null): void {
setIsPaymentError(true); if (error) {
if (error !== "Product not found") { setIsPaymentError(true);
metricService.reachGoal(EGoals.PAYMENT_ERROR, [ if (error !== "Product not found") {
EMetrics.YANDEX, metricService.reachGoal(EGoals.PAYMENT_ERROR, [
EMetrics.KLAVIYO, EMetrics.YANDEX,
]); EMetrics.KLAVIYO,
]);
}
} else {
setIsPaymentError(false);
} }
onError?.(error); onError?.(error);
} }

1
src/hooks/payment/nmi/usePayment.ts
View File

@ -263,6 +263,7 @@ export const usePayment = ({
}; };
const submitInlineForm = (address?: AddressFields) => { const submitInlineForm = (address?: AddressFields) => {
setError(null);
if (address) { if (address) {
addressRef.current = address; addressRef.current = address;
} }

128
src/routerComponents/Compatibility/v2/index.tsx
View File

@ -59,12 +59,12 @@ function CompatibilityV2Routes() {
const { setTheme } = useTheme(); const { setTheme } = useTheme();
const { isReady, variant: darkThemeCompatibilityV2Variant } = useUnleash({ const { isReady, variant: darkThemeCompatibilityV2Variant } = useUnleash({
flag: EUnleashFlags.darkThemeCompatibilityV2 flag: EUnleashFlags.darkThemeCompatibilityV2,
}) });
const { funnelData } = useFunnel({ const { funnelData } = useFunnel({
funnel: ELocalesPlacement.CompatibilityV2, funnel: ELocalesPlacement.CompatibilityV2,
paymentPlacement: "" paymentPlacement: "",
}); });
const availablePaths = useMemo(() => { const availablePaths = useMemo(() => {
@ -95,7 +95,7 @@ function CompatibilityV2Routes() {
dispatch(actions.compatibilityV2.update({ fromRedesign: true })); dispatch(actions.compatibilityV2.update({ fromRedesign: true }));
}, [dispatch]); }, [dispatch]);
function onPaymentError(error?: string | undefined): void { function onPaymentError(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.compatibilityV2TrialChoice()); return navigate(routes.client.compatibilityV2TrialChoice());
} }
@ -115,14 +115,18 @@ function CompatibilityV2Routes() {
function onPopState(): void { function onPopState(): void {
if (!availablePaths.main_secret_discount) return; if (!availablePaths.main_secret_discount) return;
if ( if (
document.location.toString() === `${window.location.origin}${routes.client.compatibilityV2Payment()}` || document.location.toString() ===
document.location.toString() === `${window.location.origin}${routes.client.compatibilityV2TrialPayment()}` `${window.location.origin}${routes.client.compatibilityV2Payment()}` ||
document.location.toString() ===
`${
window.location.origin
}${routes.client.compatibilityV2TrialPayment()}`
) { ) {
navigate(routes.client.compatibilityV2SaveOff()); navigate(routes.client.compatibilityV2SaveOff());
} }
} }
function onPaymentErrorDiscount(error?: string | undefined): void { function onPaymentErrorDiscount(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.compatibilityV2SecretDiscount()); return navigate(routes.client.compatibilityV2SecretDiscount());
} }
@ -140,20 +144,22 @@ function CompatibilityV2Routes() {
} }
return () => { return () => {
setTheme(ESiteTheme.Light); setTheme(ESiteTheme.Light);
} };
}, [darkThemeCompatibilityV2Variant]) }, [darkThemeCompatibilityV2Variant]);
if (!isReady) { if (!isReady) {
return <div return (
style={{ <div
display: "flex", style={{
justifyContent: "center", display: "flex",
alignItems: "center", justifyContent: "center",
height: "100dvh" alignItems: "center",
}} height: "100dvh",
> }}
<Loader color={LoaderColor.Black} /> >
</div> <Loader color={LoaderColor.Black} />
</div>
);
} }
return ( return (
@ -171,19 +177,21 @@ function CompatibilityV2Routes() {
funnel={ELocalesPlacement.CompatibilityV2} funnel={ELocalesPlacement.CompatibilityV2}
paymentPlacement="add_consultant" paymentPlacement="add_consultant"
nextRoute={ nextRoute={
availablePaths.add_guides ? availablePaths.add_guides
routes.client.compatibilityV2AddGuides() : ? routes.client.compatibilityV2AddGuides()
`${routes.client.getInformationPartner()}?path=back` : `${routes.client.getInformationPartner()}?path=back`
} }
/> />
} }
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2AddGuides())} path={removePrefix(routes.client.compatibilityV2AddGuides())}
element={<AddGuides element={
funnel={ELocalesPlacement.CompatibilityV2} <AddGuides
paymentPlacement="add_guides" funnel={ELocalesPlacement.CompatibilityV2}
/>} paymentPlacement="add_guides"
/>
}
/> />
</Route> </Route>
</Route> </Route>
@ -196,23 +204,29 @@ function CompatibilityV2Routes() {
> >
<Route <Route
path={removePrefix(routes.client.compatibilityV2PaymentModal())} path={removePrefix(routes.client.compatibilityV2PaymentModal())}
element={<PaymentPage element={
funnel={ELocalesPlacement.CompatibilityV2} <PaymentPage
paymentPlacement="main" funnel={ELocalesPlacement.CompatibilityV2}
onError={onPaymentError} paymentPlacement="main"
onSuccess={onPaymentSuccess} onError={onPaymentError}
onBack={onBack} onSuccess={onPaymentSuccess}
onPopState={onPopState} onBack={onBack}
/>} onPopState={onPopState}
/>
}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2SecretDiscountPaymentModal())} path={removePrefix(
element={<PaymentPage routes.client.compatibilityV2SecretDiscountPaymentModal()
funnel={ELocalesPlacement.CompatibilityV2} )}
paymentPlacement="main_secret_discount" element={
onError={onPaymentErrorDiscount} <PaymentPage
onSuccess={onPaymentSuccessDiscount} funnel={ELocalesPlacement.CompatibilityV2}
/>} paymentPlacement="main_secret_discount"
onError={onPaymentErrorDiscount}
onSuccess={onPaymentSuccessDiscount}
/>
}
/> />
</Route> </Route>
<Route <Route
@ -258,7 +272,9 @@ function CompatibilityV2Routes() {
element={<Birthdate />} element={<Birthdate />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2BirthdatePartner())} path={removePrefix(
routes.client.compatibilityV2BirthdatePartner()
)}
element={<BirthdatePartner />} element={<BirthdatePartner />}
/> />
<Route <Route
@ -266,11 +282,15 @@ function CompatibilityV2Routes() {
element={<DateEvent />} element={<DateEvent />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2PalmsInformation())} path={removePrefix(
routes.client.compatibilityV2PalmsInformation()
)}
element={<PalmsInformation />} element={<PalmsInformation />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2PalmsInformationPartner())} path={removePrefix(
routes.client.compatibilityV2PalmsInformationPartner()
)}
element={<PalmsInformationPartner />} element={<PalmsInformationPartner />}
/> />
<Route <Route
@ -296,11 +316,15 @@ function CompatibilityV2Routes() {
element={<CheckingPhone />} element={<CheckingPhone />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2ElementResonates())} path={removePrefix(
routes.client.compatibilityV2ElementResonates()
)}
element={<ElementResonates />} element={<ElementResonates />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2FavoriteColor())} path={removePrefix(
routes.client.compatibilityV2FavoriteColor()
)}
element={<FavoriteColor />} element={<FavoriteColor />}
/> />
<Route <Route
@ -314,7 +338,9 @@ function CompatibilityV2Routes() {
element={<HeadOrHeartResult />} element={<HeadOrHeartResult />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2RelateFollowing())} path={removePrefix(
routes.client.compatibilityV2RelateFollowing()
)}
element={<RelateFollowing />} element={<RelateFollowing />}
> >
<Route path=":questionId" element={<RelateFollowing />} /> <Route path=":questionId" element={<RelateFollowing />} />
@ -329,7 +355,9 @@ function CompatibilityV2Routes() {
element={<LetScan />} element={<LetScan />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2ScanInstruction())} path={removePrefix(
routes.client.compatibilityV2ScanInstruction()
)}
element={<ScanInstruction />} element={<ScanInstruction />}
/> />
<Route <Route
@ -342,7 +370,9 @@ function CompatibilityV2Routes() {
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV2TrialChoiceVideo())} path={removePrefix(
routes.client.compatibilityV2TrialChoiceVideo()
)}
element={<TrialChoiceVideo />} element={<TrialChoiceVideo />}
/> />

98
src/routerComponents/Compatibility/v3/index.tsx
View File

@ -57,7 +57,7 @@ function CompatibilityV3Routes() {
const { funnelData } = useFunnel({ const { funnelData } = useFunnel({
funnel: ELocalesPlacement.CompatibilityV3, funnel: ELocalesPlacement.CompatibilityV3,
paymentPlacement: "" paymentPlacement: "",
}); });
const availablePaths = useMemo(() => { const availablePaths = useMemo(() => {
@ -88,7 +88,7 @@ function CompatibilityV3Routes() {
dispatch(actions.compatibilityV3.update({ fromRedesign: true })); dispatch(actions.compatibilityV3.update({ fromRedesign: true }));
}, [dispatch]); }, [dispatch]);
function onPaymentError(error?: string | undefined): void { function onPaymentError(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.compatibilityV3TrialChoice()); return navigate(routes.client.compatibilityV3TrialChoice());
} }
@ -108,14 +108,18 @@ function CompatibilityV3Routes() {
function onPopState(): void { function onPopState(): void {
if (!availablePaths.main_secret_discount) return; if (!availablePaths.main_secret_discount) return;
if ( if (
document.location.toString() === `${window.location.origin}${routes.client.compatibilityV3Payment()}` || document.location.toString() ===
document.location.toString() === `${window.location.origin}${routes.client.compatibilityV3TrialPayment()}` `${window.location.origin}${routes.client.compatibilityV3Payment()}` ||
document.location.toString() ===
`${
window.location.origin
}${routes.client.compatibilityV3TrialPayment()}`
) { ) {
navigate(routes.client.compatibilityV3SaveOff()); navigate(routes.client.compatibilityV3SaveOff());
} }
} }
function onPaymentErrorDiscount(error?: string | undefined): void { function onPaymentErrorDiscount(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.compatibilityV3SecretDiscount()); return navigate(routes.client.compatibilityV3SecretDiscount());
} }
@ -142,19 +146,21 @@ function CompatibilityV3Routes() {
funnel={ELocalesPlacement.CompatibilityV3} funnel={ELocalesPlacement.CompatibilityV3}
paymentPlacement="add_consultant" paymentPlacement="add_consultant"
nextRoute={ nextRoute={
availablePaths.add_guides ? availablePaths.add_guides
routes.client.compatibilityV3AddGuides() : ? routes.client.compatibilityV3AddGuides()
`${routes.client.getInformationPartner()}?path=back` : `${routes.client.getInformationPartner()}?path=back`
} }
/> />
} }
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3AddGuides())} path={removePrefix(routes.client.compatibilityV3AddGuides())}
element={<AddGuides element={
funnel={ELocalesPlacement.CompatibilityV3} <AddGuides
paymentPlacement="add_guides" funnel={ELocalesPlacement.CompatibilityV3}
/>} paymentPlacement="add_guides"
/>
}
/> />
</Route> </Route>
</Route> </Route>
@ -167,23 +173,29 @@ function CompatibilityV3Routes() {
> >
<Route <Route
path={removePrefix(routes.client.compatibilityV3PaymentModal())} path={removePrefix(routes.client.compatibilityV3PaymentModal())}
element={<PaymentPage element={
funnel={ELocalesPlacement.CompatibilityV3} <PaymentPage
paymentPlacement="main" funnel={ELocalesPlacement.CompatibilityV3}
onError={onPaymentError} paymentPlacement="main"
onSuccess={onPaymentSuccess} onError={onPaymentError}
onBack={onBack} onSuccess={onPaymentSuccess}
onPopState={onPopState} onBack={onBack}
/>} onPopState={onPopState}
/>
}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3SecretDiscountPaymentModal())} path={removePrefix(
element={<PaymentPage routes.client.compatibilityV3SecretDiscountPaymentModal()
funnel={ELocalesPlacement.CompatibilityV3} )}
paymentPlacement="main_secret_discount" element={
onError={onPaymentErrorDiscount} <PaymentPage
onSuccess={onPaymentSuccessDiscount} funnel={ELocalesPlacement.CompatibilityV3}
/>} paymentPlacement="main_secret_discount"
onError={onPaymentErrorDiscount}
onSuccess={onPaymentSuccessDiscount}
/>
}
/> />
</Route> </Route>
<Route <Route
@ -225,7 +237,9 @@ function CompatibilityV3Routes() {
element={<Birthdate />} element={<Birthdate />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3BirthdatePartner())} path={removePrefix(
routes.client.compatibilityV3BirthdatePartner()
)}
element={<BirthdatePartner />} element={<BirthdatePartner />}
/> />
<Route <Route
@ -233,11 +247,15 @@ function CompatibilityV3Routes() {
element={<DateEvent />} element={<DateEvent />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3PalmsInformation())} path={removePrefix(
routes.client.compatibilityV3PalmsInformation()
)}
element={<PalmsInformation />} element={<PalmsInformation />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3PalmsInformationPartner())} path={removePrefix(
routes.client.compatibilityV3PalmsInformationPartner()
)}
element={<PalmsInformationPartner />} element={<PalmsInformationPartner />}
/> />
<Route <Route
@ -263,11 +281,15 @@ function CompatibilityV3Routes() {
element={<CheckingPhone />} element={<CheckingPhone />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3ElementResonates())} path={removePrefix(
routes.client.compatibilityV3ElementResonates()
)}
element={<ElementResonates />} element={<ElementResonates />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3FavoriteColor())} path={removePrefix(
routes.client.compatibilityV3FavoriteColor()
)}
element={<FavoriteColor />} element={<FavoriteColor />}
/> />
<Route <Route
@ -281,7 +303,9 @@ function CompatibilityV3Routes() {
element={<HeadOrHeartResult />} element={<HeadOrHeartResult />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3RelateFollowing())} path={removePrefix(
routes.client.compatibilityV3RelateFollowing()
)}
element={<RelateFollowing />} element={<RelateFollowing />}
> >
<Route path=":questionId" element={<RelateFollowing />} /> <Route path=":questionId" element={<RelateFollowing />} />
@ -296,7 +320,9 @@ function CompatibilityV3Routes() {
element={<LetScan />} element={<LetScan />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3ScanInstruction())} path={removePrefix(
routes.client.compatibilityV3ScanInstruction()
)}
element={<ScanInstruction />} element={<ScanInstruction />}
/> />
<Route <Route
@ -309,7 +335,9 @@ function CompatibilityV3Routes() {
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV3TrialChoiceVideo())} path={removePrefix(
routes.client.compatibilityV3TrialChoiceVideo()
)}
element={<TrialChoiceVideo />} element={<TrialChoiceVideo />}
/> />

150
src/routerComponents/Compatibility/v4/index.tsx
View File

@ -82,7 +82,7 @@ function CompatibilityV4Routes() {
const { funnelData } = useFunnel({ const { funnelData } = useFunnel({
funnel: ELocalesPlacement.CompatibilityV4, funnel: ELocalesPlacement.CompatibilityV4,
paymentPlacement: "" paymentPlacement: "",
}); });
const availablePaths = useMemo(() => { const availablePaths = useMemo(() => {
@ -113,7 +113,7 @@ function CompatibilityV4Routes() {
dispatch(actions.compatibilityV4.update({ fromRedesign: true })); dispatch(actions.compatibilityV4.update({ fromRedesign: true }));
}, [dispatch]); }, [dispatch]);
function onPaymentError(error?: string | undefined): void { function onPaymentError(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.compatibilityV4TrialChoice()); return navigate(routes.client.compatibilityV4TrialChoice());
} }
@ -133,14 +133,18 @@ function CompatibilityV4Routes() {
function onPopState(): void { function onPopState(): void {
if (!availablePaths.main_secret_discount) return; if (!availablePaths.main_secret_discount) return;
if ( if (
document.location.toString() === `${window.location.origin}${routes.client.compatibilityV4Payment()}` || document.location.toString() ===
document.location.toString() === `${window.location.origin}${routes.client.compatibilityV4TrialPayment()}` `${window.location.origin}${routes.client.compatibilityV4Payment()}` ||
document.location.toString() ===
`${
window.location.origin
}${routes.client.compatibilityV4TrialPayment()}`
) { ) {
navigate(routes.client.compatibilityV4SaveOff()); navigate(routes.client.compatibilityV4SaveOff());
} }
} }
function onPaymentErrorDiscount(error?: string | undefined): void { function onPaymentErrorDiscount(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.compatibilityV4SecretDiscount()); return navigate(routes.client.compatibilityV4SecretDiscount());
} }
@ -167,19 +171,21 @@ function CompatibilityV4Routes() {
funnel={ELocalesPlacement.CompatibilityV4} funnel={ELocalesPlacement.CompatibilityV4}
paymentPlacement="add_consultant" paymentPlacement="add_consultant"
nextRoute={ nextRoute={
availablePaths.add_guides ? availablePaths.add_guides
routes.client.compatibilityV4AddGuides() : ? routes.client.compatibilityV4AddGuides()
`${routes.client.getInformationPartner()}?path=back` : `${routes.client.getInformationPartner()}?path=back`
} }
/> />
} }
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4AddGuides())} path={removePrefix(routes.client.compatibilityV4AddGuides())}
element={<AddGuides element={
funnel={ELocalesPlacement.CompatibilityV4} <AddGuides
paymentPlacement="add_guides" funnel={ELocalesPlacement.CompatibilityV4}
/>} paymentPlacement="add_guides"
/>
}
/> />
</Route> </Route>
</Route> </Route>
@ -192,23 +198,29 @@ function CompatibilityV4Routes() {
> >
<Route <Route
path={removePrefix(routes.client.compatibilityV4PaymentModal())} path={removePrefix(routes.client.compatibilityV4PaymentModal())}
element={<PaymentPage element={
funnel={ELocalesPlacement.CompatibilityV4} <PaymentPage
paymentPlacement="main" funnel={ELocalesPlacement.CompatibilityV4}
onError={onPaymentError} paymentPlacement="main"
onSuccess={onPaymentSuccess} onError={onPaymentError}
onBack={onBack} onSuccess={onPaymentSuccess}
onPopState={onPopState} onBack={onBack}
/>} onPopState={onPopState}
/>
}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4SecretDiscountPaymentModal())} path={removePrefix(
element={<PaymentPage routes.client.compatibilityV4SecretDiscountPaymentModal()
funnel={ELocalesPlacement.CompatibilityV4} )}
paymentPlacement="main_secret_discount" element={
onError={onPaymentErrorDiscount} <PaymentPage
onSuccess={onPaymentSuccessDiscount} funnel={ELocalesPlacement.CompatibilityV4}
/>} paymentPlacement="main_secret_discount"
onError={onPaymentErrorDiscount}
onSuccess={onPaymentSuccessDiscount}
/>
}
/> />
</Route> </Route>
<Route <Route
@ -271,34 +283,44 @@ function CompatibilityV4Routes() {
element={<HeadOrHeartResult />} element={<HeadOrHeartResult />}
/> />
<Route <Route
path={removePrefix( path={removePrefix(routes.client.compatibilityV4Loading())}
routes.client.compatibilityV4Loading()
)}
element={<Loading />} element={<Loading />}
/> />
<Route element={<StepperLayout />}> <Route element={<StepperLayout />}>
<Route <Route
path={removePrefix(routes.client.compatibilityV4WhatAddToAnalysis())} path={removePrefix(
routes.client.compatibilityV4WhatAddToAnalysis()
)}
element={<WhatAddToAnalysis />} element={<WhatAddToAnalysis />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4PotentialPartnerName())} path={removePrefix(
routes.client.compatibilityV4PotentialPartnerName()
)}
element={<PotentialPartnerName />} element={<PotentialPartnerName />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4PotentialPartnerBirthdate())} path={removePrefix(
routes.client.compatibilityV4PotentialPartnerBirthdate()
)}
element={<PotentialPartnerBirthdate />} element={<PotentialPartnerBirthdate />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4FormerPartnerName())} path={removePrefix(
routes.client.compatibilityV4FormerPartnerName()
)}
element={<FormerPartnerName />} element={<FormerPartnerName />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4FormerPartnerBirthdate())} path={removePrefix(
routes.client.compatibilityV4FormerPartnerBirthdate()
)}
element={<FormerPartnerBirthdate />} element={<FormerPartnerBirthdate />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4GenderPartner())} path={removePrefix(
routes.client.compatibilityV4GenderPartner()
)}
element={<GenderPartner />} element={<GenderPartner />}
/> />
<Route <Route
@ -310,7 +332,9 @@ function CompatibilityV4Routes() {
element={<Birthplace />} element={<Birthplace />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4BirthplacePartner())} path={removePrefix(
routes.client.compatibilityV4BirthplacePartner()
)}
element={<BirthplacePartner />} element={<BirthplacePartner />}
/> />
<Route <Route
@ -322,15 +346,21 @@ function CompatibilityV4Routes() {
element={<YourAnalysis />} element={<YourAnalysis />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4PartnerAnalysis())} path={removePrefix(
routes.client.compatibilityV4PartnerAnalysis()
)}
element={<PartnerAnalysis />} element={<PartnerAnalysis />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4ResultAnalysis())} path={removePrefix(
routes.client.compatibilityV4ResultAnalysis()
)}
element={<ResultAnalysis />} element={<ResultAnalysis />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4PartnerSimilarity())} path={removePrefix(
routes.client.compatibilityV4PartnerSimilarity()
)}
element={<PartnerSimilarity />} element={<PartnerSimilarity />}
/> />
<Route <Route
@ -338,7 +368,9 @@ function CompatibilityV4Routes() {
element={<ReviewPage />} element={<ReviewPage />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4BirthdatePartner())} path={removePrefix(
routes.client.compatibilityV4BirthdatePartner()
)}
element={<BirthdatePartner />} element={<BirthdatePartner />}
/> />
<Route <Route
@ -346,11 +378,15 @@ function CompatibilityV4Routes() {
element={<DateEvent />} element={<DateEvent />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4PalmsInformation())} path={removePrefix(
routes.client.compatibilityV4PalmsInformation()
)}
element={<PalmsInformation />} element={<PalmsInformation />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4PalmsInformationPartner())} path={removePrefix(
routes.client.compatibilityV4PalmsInformationPartner()
)}
element={<PalmsInformationPartner />} element={<PalmsInformationPartner />}
/> />
<Route <Route
@ -370,9 +406,7 @@ function CompatibilityV4Routes() {
element={<CalculateInAdvance />} element={<CalculateInAdvance />}
/> />
<Route <Route
path={removePrefix( path={removePrefix(routes.client.compatibilityV4AlmostThere())}
routes.client.compatibilityV4AlmostThere()
)}
element={<AlmostThere />} element={<AlmostThere />}
/> />
<Route <Route
@ -400,9 +434,7 @@ function CompatibilityV4Routes() {
element={<YourInclination />} element={<YourInclination />}
/> />
<Route <Route
path={removePrefix( path={removePrefix(routes.client.compatibilityV4YourFear())}
routes.client.compatibilityV4YourFear()
)}
element={<YourFear />} element={<YourFear />}
/> />
<Route <Route
@ -418,11 +450,15 @@ function CompatibilityV4Routes() {
element={<StressResponse />} element={<StressResponse />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4ElementResonates())} path={removePrefix(
routes.client.compatibilityV4ElementResonates()
)}
element={<ElementResonates />} element={<ElementResonates />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4FavoriteColor())} path={removePrefix(
routes.client.compatibilityV4FavoriteColor()
)}
element={<FavoriteColor />} element={<FavoriteColor />}
/> />
<Route <Route
@ -430,7 +466,9 @@ function CompatibilityV4Routes() {
element={<HeadOrHeart />} element={<HeadOrHeart />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4RelateFollowing())} path={removePrefix(
routes.client.compatibilityV4RelateFollowing()
)}
element={<RelateFollowing />} element={<RelateFollowing />}
> >
<Route path=":questionId" element={<RelateFollowing />} /> <Route path=":questionId" element={<RelateFollowing />} />
@ -445,7 +483,9 @@ function CompatibilityV4Routes() {
element={<LetScan />} element={<LetScan />}
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4ScanInstruction())} path={removePrefix(
routes.client.compatibilityV4ScanInstruction()
)}
element={<ScanInstruction />} element={<ScanInstruction />}
/> />
<Route <Route
@ -458,7 +498,9 @@ function CompatibilityV4Routes() {
/> />
<Route <Route
path={removePrefix(routes.client.compatibilityV4TrialChoiceVideo())} path={removePrefix(
routes.client.compatibilityV4TrialChoiceVideo()
)}
element={<TrialChoiceVideo />} element={<TrialChoiceVideo />}
/> />

239
src/routerComponents/MarketingLanding/v1/index.tsx
View File

@ -19,119 +19,138 @@ import { ELocalesPlacement } from "@/locales";
const removePrefix = (path: string) => path.replace(emailMarketingV1Prefix, ""); const removePrefix = (path: string) => path.replace(emailMarketingV1Prefix, "");
function MarketingLandingV1Routes() { function MarketingLandingV1Routes() {
const navigate = useNavigate(); const navigate = useNavigate();
function onPaymentError(error?: string | undefined): void { function onPaymentError(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.emailMarketingV1SpecialOffer()); return navigate(routes.client.emailMarketingV1SpecialOffer());
}
}
function onPaymentSuccess(): void {
setTimeout(() => {
navigate(routes.client.emailMarketingV1SkipTrial());
}, 1500);
}
function onBack(): void {
navigate(routes.client.emailMarketingV1SaveOff());
}
function onPopState(): void {
if (
document.location.toString() ===
`${window.location.origin}${routes.client.emailMarketingV1SpecialOffer()}`
) {
navigate(routes.client.emailMarketingV1SaveOff());
}
}
function onPaymentErrorDiscount(error?: string | null): void {
if (error === "Product not found") {
return navigate(routes.client.emailMarketingV1SecretDiscount());
}
}
function onPaymentSuccessDiscount(): void {
setTimeout(() => {
navigate(routes.client.emailMarketingV1SkipTrial());
}, 1500);
}
return (
<Routes>
<Route
path={removePrefix(routes.client.emailMarketingV1Onboarding())}
element={<OnboardingPage />}
/>
<Route element={<PrivateOutlet />}>
<Route element={<AdditionalPurchasesPalmistry />}>
<Route
path={removePrefix(routes.client.emailMarketingV1SkipTrial())}
element={<SkipTrial />}
/>
<Route
path={removePrefix(routes.client.emailMarketingV1AddConsultant())}
element={
<AddConsultant
funnel={ELocalesPlacement.EmailMarketingCompatibilityV1}
paymentPlacement="add_consultant"
/>
}
/>
<Route
path={removePrefix(routes.client.emailMarketingV1AddGuides())}
element={
<AddGuides
funnel={ELocalesPlacement.EmailMarketingCompatibilityV1}
paymentPlacement="add_guides"
/>
}
/>
</Route>
</Route>
<Route
element={
<CheckSubscriptionOutlet
subscribedReturnUrl={routes.client.compatibilityV2SkipTrial()}
/>
} }
} >
<Route
function onPaymentSuccess(): void { path={removePrefix(routes.client.emailMarketingV1PaymentModal())}
setTimeout(() => { element={
navigate(routes.client.emailMarketingV1SkipTrial()); <PaymentPage
}, 1500); funnel={ELocalesPlacement.EmailMarketingCompatibilityV1}
} paymentPlacement="main"
onError={onPaymentError}
function onBack(): void { onSuccess={onPaymentSuccess}
navigate(routes.client.emailMarketingV1SaveOff()); onBack={onBack}
} onPopState={onPopState}
function onPopState(): void {
if (document.location.toString() === `${window.location.origin}${routes.client.emailMarketingV1SpecialOffer()}`) {
navigate(routes.client.emailMarketingV1SaveOff());
}
}
function onPaymentErrorDiscount(error?: string | undefined): void {
if (error === "Product not found") {
return navigate(routes.client.emailMarketingV1SecretDiscount());
}
}
function onPaymentSuccessDiscount(): void {
setTimeout(() => {
navigate(routes.client.emailMarketingV1SkipTrial());
}, 1500);
}
return (
<Routes>
<Route
path={removePrefix(routes.client.emailMarketingV1Onboarding())}
element={<OnboardingPage />}
/> />
<Route element={<PrivateOutlet />}> }
<Route element={<AdditionalPurchasesPalmistry />}> />
<Route <Route
path={removePrefix(routes.client.emailMarketingV1SkipTrial())} path={removePrefix(
element={<SkipTrial />} routes.client.emailMarketingV1SecretDiscountPaymentModal()
/> )}
<Route element={
path={removePrefix(routes.client.emailMarketingV1AddConsultant())} <PaymentPage
element={<AddConsultant funnel={ELocalesPlacement.EmailMarketingCompatibilityV1}
funnel={ELocalesPlacement.EmailMarketingCompatibilityV1} paymentPlacement="main_secret_discount"
paymentPlacement="add_consultant" onError={onPaymentErrorDiscount}
/>} onSuccess={onPaymentSuccessDiscount}
/> />
<Route }
path={removePrefix(routes.client.emailMarketingV1AddGuides())} />
element={<AddGuides </Route>
funnel={ELocalesPlacement.EmailMarketingCompatibilityV1} <Route
paymentPlacement="add_guides" element={
/>} <div className={styles.container}>
/> <Outlet />
</Route> </div>
</Route> }
<Route >
element={ <Route
<CheckSubscriptionOutlet path={removePrefix(routes.client.emailMarketingV1Landing())}
subscribedReturnUrl={routes.client.compatibilityV2SkipTrial()} element={<MarketingLanding />}
/> />
} <Route
> path={removePrefix(routes.client.emailMarketingV1SpecialOffer())}
<Route element={<SpecialOffer />}
path={removePrefix(routes.client.emailMarketingV1PaymentModal())} />
element={<PaymentPage <Route
funnel={ELocalesPlacement.EmailMarketingCompatibilityV1} path={removePrefix(routes.client.emailMarketingV1SaveOff())}
paymentPlacement="main" element={<SaveOff />}
onError={onPaymentError} />
onSuccess={onPaymentSuccess} <Route
onBack={onBack} path={removePrefix(routes.client.emailMarketingV1SecretDiscount())}
onPopState={onPopState} element={<SecretDiscount />}
/>} />
/> <Route path="*" element={<NotFoundPage />} />
<Route </Route>
path={removePrefix(routes.client.emailMarketingV1SecretDiscountPaymentModal())} </Routes>
element={<PaymentPage );
funnel={ELocalesPlacement.EmailMarketingCompatibilityV1}
paymentPlacement="main_secret_discount"
onError={onPaymentErrorDiscount}
onSuccess={onPaymentSuccessDiscount}
/>}
/>
</Route>
<Route element={<div className={styles.container}><Outlet /></div>}>
<Route
path={removePrefix(routes.client.emailMarketingV1Landing())}
element={<MarketingLanding />}
/>
<Route
path={removePrefix(routes.client.emailMarketingV1SpecialOffer())}
element={<SpecialOffer />}
/>
<Route
path={removePrefix(routes.client.emailMarketingV1SaveOff())}
element={<SaveOff />}
/>
<Route
path={removePrefix(routes.client.emailMarketingV1SecretDiscount())}
element={<SecretDiscount />}
/>
<Route path="*" element={<NotFoundPage />} />
</Route>
</Routes>
);
} }
export default MarketingLandingV1Routes; export default MarketingLandingV1Routes;

94
src/routerComponents/Palmistry/v1/index.tsx
View File

@ -62,19 +62,19 @@ const availableUrlsDarkTheme = [
routes.client.palmistryV1Camera(), routes.client.palmistryV1Camera(),
routes.client.palmistryV1ScannedPhoto(), routes.client.palmistryV1ScannedPhoto(),
routes.client.palmistryV1Email(), routes.client.palmistryV1Email(),
] ];
function PalmistryV1Routes() { function PalmistryV1Routes() {
const navigate = useNavigate(); const navigate = useNavigate();
const dispatch = useDispatch(); const dispatch = useDispatch();
const { isReady, variant: darkThemePalmistryV1Variant } = useUnleash({ const { isReady, variant: darkThemePalmistryV1Variant } = useUnleash({
flag: EUnleashFlags.darkThemePalmistryV1 flag: EUnleashFlags.darkThemePalmistryV1,
}) });
const { funnelData } = useFunnel({ const { funnelData } = useFunnel({
funnel: ELocalesPlacement.PalmistryV1, funnel: ELocalesPlacement.PalmistryV1,
paymentPlacement: "" paymentPlacement: "",
}); });
const availablePaths = useMemo(() => { const availablePaths = useMemo(() => {
@ -105,7 +105,7 @@ function PalmistryV1Routes() {
dispatch(actions.palmistry.update({ fromRedesign: true })); dispatch(actions.palmistry.update({ fromRedesign: true }));
}, [dispatch]); }, [dispatch]);
function onPaymentError(error?: string | undefined): void { function onPaymentError(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.palmistryV1TrialChoice()); return navigate(routes.client.palmistryV1TrialChoice());
} }
@ -125,14 +125,16 @@ function PalmistryV1Routes() {
function onPopState(): void { function onPopState(): void {
if (!availablePaths.main_secret_discount) return; if (!availablePaths.main_secret_discount) return;
if ( if (
document.location.toString() === `${window.location.origin}${routes.client.palmistryV1Payment()}` || document.location.toString() ===
document.location.toString() === `${window.location.origin}${routes.client.palmistryV1TrialPayment()}` `${window.location.origin}${routes.client.palmistryV1Payment()}` ||
document.location.toString() ===
`${window.location.origin}${routes.client.palmistryV1TrialPayment()}`
) { ) {
navigate(routes.client.palmistryV1SaveOff()); navigate(routes.client.palmistryV1SaveOff());
} }
} }
function onPaymentErrorDiscount(error?: string | undefined): void { function onPaymentErrorDiscount(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.palmistryV1SecretDiscount()); return navigate(routes.client.palmistryV1SecretDiscount());
} }
@ -157,19 +159,21 @@ function PalmistryV1Routes() {
} else { } else {
document.body.classList.remove("dark-theme"); document.body.classList.remove("dark-theme");
} }
}, [window.location.pathname]) }, [window.location.pathname]);
if (!isReady) { if (!isReady) {
return <div return (
style={{ <div
display: "flex", style={{
justifyContent: "center", display: "flex",
alignItems: "center", justifyContent: "center",
height: "100dvh" alignItems: "center",
}} height: "100dvh",
> }}
<Loader color={LoaderColor.Black} /> >
</div> <Loader color={LoaderColor.Black} />
</div>
);
} }
return ( return (
@ -187,19 +191,21 @@ function PalmistryV1Routes() {
funnel={ELocalesPlacement.PalmistryV1} funnel={ELocalesPlacement.PalmistryV1}
paymentPlacement="add_consultant" paymentPlacement="add_consultant"
nextRoute={ nextRoute={
availablePaths.add_guides ? availablePaths.add_guides
routes.client.palmistryV1AddGuides() : ? routes.client.palmistryV1AddGuides()
`${routes.client.getInformationPartner()}?path=back` : `${routes.client.getInformationPartner()}?path=back`
} }
/> />
} }
/> />
<Route <Route
path={removePrefix(routes.client.palmistryV1AddGuides())} path={removePrefix(routes.client.palmistryV1AddGuides())}
element={<AddGuides element={
funnel={ELocalesPlacement.PalmistryV1} <AddGuides
paymentPlacement="add_guides" funnel={ELocalesPlacement.PalmistryV1}
/>} paymentPlacement="add_guides"
/>
}
/> />
</Route> </Route>
</Route> </Route>
@ -212,23 +218,29 @@ function PalmistryV1Routes() {
> >
<Route <Route
path={removePrefix(routes.client.palmistryV1PaymentModal())} path={removePrefix(routes.client.palmistryV1PaymentModal())}
element={<PaymentPage element={
funnel={ELocalesPlacement.PalmistryV1} <PaymentPage
paymentPlacement="main" funnel={ELocalesPlacement.PalmistryV1}
onError={onPaymentError} paymentPlacement="main"
onSuccess={onPaymentSuccess} onError={onPaymentError}
onBack={onBack} onSuccess={onPaymentSuccess}
onPopState={onPopState} onBack={onBack}
/>} onPopState={onPopState}
/>
}
/> />
<Route <Route
path={removePrefix(routes.client.palmistryV1SecretDiscountPaymentModal())} path={removePrefix(
element={<PaymentPage routes.client.palmistryV1SecretDiscountPaymentModal()
funnel={ELocalesPlacement.PalmistryV1} )}
paymentPlacement="main_secret_discount" element={
onError={onPaymentErrorDiscount} <PaymentPage
onSuccess={onPaymentSuccessDiscount} funnel={ELocalesPlacement.PalmistryV1}
/>} paymentPlacement="main_secret_discount"
onError={onPaymentErrorDiscount}
onSuccess={onPaymentSuccessDiscount}
/>
}
/> />
</Route> </Route>
<Route <Route

55
src/routerComponents/Palmistry/v2/index.tsx
View File

@ -28,7 +28,7 @@ function PalmistryV2Routes() {
dispatch(actions.palmistry.update({ fromRedesign: true })); dispatch(actions.palmistry.update({ fromRedesign: true }));
}, [dispatch]); }, [dispatch]);
function onPaymentError(error?: string | undefined): void { function onPaymentError(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.palmistryV2TrialPayment()); return navigate(routes.client.palmistryV2TrialPayment());
} }
@ -41,7 +41,10 @@ function PalmistryV2Routes() {
} }
function onPopState(): void { function onPopState(): void {
if (document.location.toString() === `${window.location.origin}${routes.client.palmistryV2TrialPayment()}`) { if (
document.location.toString() ===
`${window.location.origin}${routes.client.palmistryV2TrialPayment()}`
) {
navigate(routes.client.palmistryV2SaveOff()); navigate(routes.client.palmistryV2SaveOff());
} }
} }
@ -50,7 +53,7 @@ function PalmistryV2Routes() {
navigate(routes.client.palmistryV2SaveOff()); navigate(routes.client.palmistryV2SaveOff());
} }
function onPaymentErrorDiscount(error?: string | undefined): void { function onPaymentErrorDiscount(error?: string | null): void {
if (error === "Product not found") { if (error === "Product not found") {
return navigate(routes.client.palmistryV2SecretDiscount()); return navigate(routes.client.palmistryV2SecretDiscount());
} }
@ -85,10 +88,12 @@ function PalmistryV2Routes() {
/> />
<Route <Route
path={removePrefix(routes.client.palmistryV2AddGuides())} path={removePrefix(routes.client.palmistryV2AddGuides())}
element={<AddGuides element={
funnel={ELocalesPlacement.EmailMarketingPalmistryV2} <AddGuides
paymentPlacement="add_guides" funnel={ELocalesPlacement.EmailMarketingPalmistryV2}
/>} paymentPlacement="add_guides"
/>
}
/> />
</Route> </Route>
</Route> </Route>
@ -101,23 +106,29 @@ function PalmistryV2Routes() {
> >
<Route <Route
path={removePrefix(routes.client.palmistryV2PaymentModal())} path={removePrefix(routes.client.palmistryV2PaymentModal())}
element={<PaymentPage element={
funnel={ELocalesPlacement.EmailMarketingPalmistryV2} <PaymentPage
paymentPlacement="main" funnel={ELocalesPlacement.EmailMarketingPalmistryV2}
onError={onPaymentError} paymentPlacement="main"
onSuccess={onPaymentSuccess} onError={onPaymentError}
onBack={onBack} onSuccess={onPaymentSuccess}
onPopState={onPopState} onBack={onBack}
/>} onPopState={onPopState}
/>
}
/> />
<Route <Route
path={removePrefix(routes.client.palmistryV2SecretDiscountPaymentModal())} path={removePrefix(
element={<PaymentPage routes.client.palmistryV2SecretDiscountPaymentModal()
funnel={ELocalesPlacement.EmailMarketingPalmistryV2} )}
paymentPlacement="main_secret_discount" element={
onError={onPaymentErrorDiscount} <PaymentPage
onSuccess={onPaymentSuccessDiscount} funnel={ELocalesPlacement.EmailMarketingPalmistryV2}
/>} paymentPlacement="main_secret_discount"
onError={onPaymentErrorDiscount}
onSuccess={onPaymentSuccessDiscount}
/>
}
/> />
</Route> </Route>
<Route <Route