diff --git a/messages/en.json b/messages/en.json
index 576353c..e1ce809 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -230,15 +230,19 @@
"one_time_price_offer": "One time price offer: ",
"choose_from": "Choose from 80+ experts astrologers.",
"original_price": "Original price: {oldPrice} ",
- "save": "Economisez 50",
+ "save": "Economisez {discount}%",
"get_my_consultation": "Get my consultation",
- "skip_this_offer": "Skip this offer"
+ "skip_this_offer": "Skip this offer",
+ "payment_error": "Something went wrong. Please try again later."
},
"add-guides": {
"title": "Choose your sign-up offer 🔥",
"subtitle": "Available only now",
"description": "*You will be charged for the add-on services or offers selected at the time of purchase. This is a non-recuring payment.",
"button": "Get my copy",
+ "payment_error": "Something went wrong. Please try again later.",
+ "select_product_error": "Please select a product",
+ "skip_offer": "Skip offer",
"products": {
"main_ultra_pack": {
diff --git a/src/app/[locale]/(additional-purchases)/add-consultant/loading.module.scss b/src/app/[locale]/(additional-purchases)/add-consultant/loading.module.scss
new file mode 100644
index 0000000..9a4e274
--- /dev/null
+++ b/src/app/[locale]/(additional-purchases)/add-consultant/loading.module.scss
@@ -0,0 +1,6 @@
+.loading {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100dvh;
+}
diff --git a/src/app/[locale]/(additional-purchases)/add-consultant/loading.tsx b/src/app/[locale]/(additional-purchases)/add-consultant/loading.tsx
new file mode 100644
index 0000000..0cd6c20
--- /dev/null
+++ b/src/app/[locale]/(additional-purchases)/add-consultant/loading.tsx
@@ -0,0 +1,11 @@
+import { Spinner } from "@/components/ui";
+
+import styles from "./loading.module.scss";
+
+export default function AddConsultantLoading() {
+ return (
+
+
+
+ );
+}
diff --git a/src/app/[locale]/(additional-purchases)/add-consultant/page.module.scss b/src/app/[locale]/(additional-purchases)/add-consultant/page.module.scss
index b81f29c..aaa1b2d 100644
--- a/src/app/[locale]/(additional-purchases)/add-consultant/page.module.scss
+++ b/src/app/[locale]/(additional-purchases)/add-consultant/page.module.scss
@@ -12,3 +12,7 @@
border-radius: 8px;
line-height: 125%;
}
+
+.consultationTable.consultationTable {
+ margin-top: 16px;
+}
diff --git a/src/app/[locale]/(additional-purchases)/add-consultant/page.tsx b/src/app/[locale]/(additional-purchases)/add-consultant/page.tsx
index 6299b34..91dadbc 100644
--- a/src/app/[locale]/(additional-purchases)/add-consultant/page.tsx
+++ b/src/app/[locale]/(additional-purchases)/add-consultant/page.tsx
@@ -1,14 +1,25 @@
+import { Suspense } from "react";
import { useTranslations } from "next-intl";
import {
AddConsultantButton,
Caution,
ConsultationTable,
+ ConsultationTableSkeleton,
} from "@/components/domains/additional-purchases";
-import { Typography } from "@/components/ui";
+import { Card, Typography } from "@/components/ui";
+import {
+ loadFunnelProducts,
+ loadFunnelProperties,
+} from "@/entities/session/funnel/loaders";
+import { ELocalesPlacement } from "@/types";
import styles from "./page.module.scss";
+const payload = {
+ funnel: ELocalesPlacement.CompatibilityV2,
+};
+
export default function AddConsultant() {
const t = useTranslations("AdditionalPurchases.add-consultant");
@@ -26,8 +37,17 @@ export default function AddConsultant() {
>
{t("exclusive_offer")}
-
-
+ }>
+
+
+
+
+
>
);
}
diff --git a/src/app/[locale]/(additional-purchases)/add-guides/page.tsx b/src/app/[locale]/(additional-purchases)/add-guides/page.tsx
index ddedf00..f4bc1fa 100644
--- a/src/app/[locale]/(additional-purchases)/add-guides/page.tsx
+++ b/src/app/[locale]/(additional-purchases)/add-guides/page.tsx
@@ -1,58 +1,28 @@
+import { Suspense } from "react";
import { useTranslations } from "next-intl";
import {
AddGuidesButton,
Caution,
- IOffer,
Offers,
+ OffersSkeleton,
+ ProductSelectionProvider,
} from "@/components/domains/additional-purchases";
import { Typography } from "@/components/ui";
+import { loadFunnelProducts } from "@/entities/session/funnel/loaders";
+import { ELocalesPlacement } from "@/types";
import styles from "./page.module.scss";
-const PRODUCTS: (Omit & { key: string })[] = [
- {
- id: "67ae7c05b29427c9ae695039",
- key: "main.ultra.pack",
- type: "one_time",
- price: 4999,
- oldPrice: 2499.5,
- },
- {
- id: "67ae7c05b29427c9ae69503c",
- key: "main.numerology.analysis",
- type: "one_time",
- price: 1499,
- oldPrice: 749.5,
- },
- {
- id: "67ae7c05b29427c9ae69503e",
- key: "main.tarot.reading",
- type: "one_time",
- price: 1999,
- oldPrice: 999.5,
- },
- {
- id: "6839ece6960824e7bba3e7bb",
- key: "main.money.reading",
- type: "one_time",
- price: 1999,
- oldPrice: 999.5,
- },
- {
- id: "main_skip_offer",
- key: "main.skip.offer",
- type: "one_time",
- price: 0,
- oldPrice: 0,
- },
-];
+const payload = {
+ funnel: ELocalesPlacement.CompatibilityV2,
+};
export default function AddGuides() {
const t = useTranslations("AdditionalPurchases.add-guides");
return (
- <>
+
{t("title")}
@@ -60,11 +30,13 @@ export default function AddGuides() {
{t("subtitle")}
-
+ }>
+
+
{t("description")}
- >
+
);
}
diff --git a/src/components/domains/additional-purchases/AddConsultantButton/AddConsultantButton.tsx b/src/components/domains/additional-purchases/AddConsultantButton/AddConsultantButton.tsx
index 3c9eadb..cfa4659 100644
--- a/src/components/domains/additional-purchases/AddConsultantButton/AddConsultantButton.tsx
+++ b/src/components/domains/additional-purchases/AddConsultantButton/AddConsultantButton.tsx
@@ -1,17 +1,59 @@
"use client";
+import { use } from "react";
import { useRouter } from "next/navigation";
import { useTranslations } from "next-intl";
-import { Button, Typography } from "@/components/ui";
+import { Button, Spinner, Typography } from "@/components/ui";
import { BlurComponent } from "@/components/widgets";
+import { IFunnelPaymentVariant } from "@/entities/session/funnel/types";
+import { useSingleCheckout } from "@/hooks/payment/useSingleCheckout";
+import { useToast } from "@/providers/toast-provider";
import { ROUTES } from "@/shared/constants/client-routes";
import styles from "./AddConsultantButton.module.scss";
-export default function AddConsultantButton() {
+interface AddConsultantButtonProps {
+ products: Promise;
+}
+
+export default function AddConsultantButton({
+ products,
+}: AddConsultantButtonProps) {
const router = useRouter();
const t = useTranslations("AdditionalPurchases.add-consultant");
+ const { addToast } = useToast();
+
+ const product = use(products)?.[0];
+
+ const { handleSingleCheckout, isLoading } = useSingleCheckout({
+ onSuccess: () => {
+ router.push(ROUTES.addGuides());
+ },
+ onError: _error => {
+ addToast({
+ variant: "error",
+ message: t("payment_error"),
+ duration: 5000,
+ });
+ },
+ });
+
+ const handleGetConsultation = () => {
+ if (!product) {
+ addToast({
+ variant: "error",
+ message: t("payment_error"),
+ duration: 5000,
+ });
+ return;
+ }
+
+ handleSingleCheckout({
+ productId: product.id,
+ key: product.key,
+ });
+ };
const handleSkipOffer = () => {
router.push(ROUTES.addGuides());
@@ -19,12 +61,24 @@ export default function AddConsultantButton() {
return (
-