From 1f7fdf794959abed7b66e948eeb535e17da69203 Mon Sep 17 00:00:00 2001
From: gofnnp <itkataev@gmail.com>
Date: Thu, 7 Aug 2025 19:35:27 +0400
Subject: [PATCH] remove-metric-from-success-payment

remove metrics from /payment/success
---
 ...Metrics.module.scss => Button.module.scss} |   0
 .../(payment)/payment/success/Button.tsx      |  24 +++
 .../(payment)/payment/success/Metrics.tsx     | 195 ------------------
 .../(payment)/payment/success/page.tsx        |  22 +-
 4 files changed, 27 insertions(+), 214 deletions(-)
 rename src/app/[locale]/(payment)/payment/success/{Metrics.module.scss => Button.module.scss} (100%)
 create mode 100644 src/app/[locale]/(payment)/payment/success/Button.tsx
 delete mode 100644 src/app/[locale]/(payment)/payment/success/Metrics.tsx

diff --git a/src/app/[locale]/(payment)/payment/success/Metrics.module.scss b/src/app/[locale]/(payment)/payment/success/Button.module.scss
similarity index 100%
rename from src/app/[locale]/(payment)/payment/success/Metrics.module.scss
rename to src/app/[locale]/(payment)/payment/success/Button.module.scss
diff --git a/src/app/[locale]/(payment)/payment/success/Button.tsx b/src/app/[locale]/(payment)/payment/success/Button.tsx
new file mode 100644
index 0000000..65b0541
--- /dev/null
+++ b/src/app/[locale]/(payment)/payment/success/Button.tsx
@@ -0,0 +1,24 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useTranslations } from "next-intl";
+
+import { Button, Typography } from "@/components/ui";
+import { ROUTES } from "@/shared/constants/client-routes";
+
+import styles from "./Button.module.scss";
+
+export default function PaymentSuccessButton() {
+  const t = useTranslations("Payment.Success");
+  const router = useRouter();
+
+  const handleNext = () => {
+    router.push(ROUTES.additionalPurchases());
+  };
+
+  return (
+    <Button onClick={handleNext} className={styles.button}>
+      <Typography color="white">{t("button")}</Typography>
+    </Button>
+  );
+}
diff --git a/src/app/[locale]/(payment)/payment/success/Metrics.tsx b/src/app/[locale]/(payment)/payment/success/Metrics.tsx
deleted file mode 100644
index 75ad095..0000000
--- a/src/app/[locale]/(payment)/payment/success/Metrics.tsx
+++ /dev/null
@@ -1,195 +0,0 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import Script from "next/script";
-import { useTranslations } from "next-intl";
-
-import { Button, Typography } from "@/components/ui";
-import { ROUTES } from "@/shared/constants/client-routes";
-
-import styles from "./Metrics.module.scss";
-
-interface MetricsProps {
-  fbPixels: string[];
-  productPrice: string;
-  currency: string;
-}
-
-export default function Metrics({
-  fbPixels,
-  productPrice,
-  currency,
-}: MetricsProps) {
-  const t = useTranslations("Payment.Success");
-
-  const [isButtonVisible, setIsButtonVisible] = useState(false);
-
-  const handleNext = () => {
-    window.location.href = ROUTES.additionalPurchases();
-  };
-
-  // Yandex Metrica
-  useEffect(() => {
-    const timeout = setTimeout(() => {
-      if (
-        typeof window.ym === "function" &&
-        typeof window.klaviyo === "object" &&
-        typeof window.gtag === "function"
-      ) {
-        try {
-          window.gtag("event", "PaymentSuccess");
-          window.klaviyo.push(["track", "PaymentSuccess"]);
-
-          window.ym(95799066, "init", {
-            clickmap: true,
-            trackLinks: true,
-            accurateTrackBounce: true,
-            webvisor: true,
-          });
-
-          window.ym(95799066, "reachGoal", "PaymentSuccess", {}, () => {
-            // deleteYm()
-          });
-        } catch (e) {
-          // eslint-disable-next-line no-console
-          console.error("YM error:", e);
-        } finally {
-          clearTimeout(timeout);
-          setIsButtonVisible(true);
-        }
-      }
-    }, 200);
-
-    return () => clearTimeout(timeout);
-  }, []);
-
-  return (
-    <>
-      {/* Klaviyo */}
-      {/* <Script src="https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=RM7w5r" /> */}
-      <Script id="klaviyo-script">
-        {`const script = document.createElement("script");
-    script.src = "https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=RM7w5r";
-    script.type = "text/javascript";
-    script.async = "";
-    document.head.appendChild(script);`}
-      </Script>
-      <Script id="klaviyo-script-proxy">
-        {`
-            !(function () {
-      if (!window.klaviyo) {
-                window._klOnsite = window._klOnsite || [];
-            try {
-                window.klaviyo = new Proxy(
-                    {},
-                    {
-                        get: function (n, i) {
-                            return "push" === i
-                                ? function () {
-                                    var n;
-                                    (n = window._klOnsite).push.apply(n, arguments);
-                                }
-                                : function () {
-                                    for (
-                                        var n = arguments.length, o = new Array(n), w = 0;
-                                        w < n;
-                                        w++
-                                    )
-                                        o[w] = arguments[w];
-                                    var t =
-                                        "function" == typeof o[o.length - 1]
-                                            ? o.pop()
-                                            : void 0,
-                                        e = new Promise(function (n) {
-                                            window._klOnsite.push(
-                                                [i].concat(o, [
-                                                    function (i) {
-                                                        t && t(i), n(i);
-                                                    },
-                                                ])
-                                            );
-                                        });
-                                    return e;
-                                };
-                        },
-                    }
-                );
-        } catch (n) {
-                (window.klaviyo = window.klaviyo || []),
-                (window.klaviyo.push = function () {
-                    var n;
-                    (n = window._klOnsite).push.apply(n, arguments);
-                });
-        }
-      }
-    })();
-    `}
-      </Script>
-
-      {/* Yandex Metrica */}
-      <Script id="yandex-metrica-script">
-        {`(function (m, e, t, r, i, k, a) {
-    m[i] =
-        m[i] ||
-        function () {
-            (m[i].a = m[i].a || []).push(arguments);
-        };
-    m[i].l = 1 * new Date();
-    for (var j = 0; j < document.scripts.length; j++) {
-        if (document.scripts[j].src === r) {
-            return;
-        }
-    }
-    (k = e.createElement(t)),
-        (a = e.getElementsByTagName(t)[0]),
-        (k.async = 1),
-        (k.src = r),
-        a.parentNode.insertBefore(k, a);
-})(
-    window,
-    document,
-    "script",
-    "https://cdn.jsdelivr.net/npm/yandex-metrica-watch/tag.js",
-    "ym"
-);`}
-      </Script>
-
-      {/* Google Analytics */}
-      <Script
-        id="google-analytics-script"
-        async
-        src="https://www.googletagmanager.com/gtag/js?id=G-4N17LL3BB5"
-      />
-      <Script id="google-analytics-script-config">
-        {`window.dataLayer = window.dataLayer || [];
-    function gtag(){dataLayer.push(arguments);}
-    gtag('js', new Date());
-
-    gtag('config','G-4N17LL3BB5');`}
-      </Script>
-
-      {/* Facebook Pixel */}
-      {fbPixels.map(pixel => (
-        <Script id={`facebook-pixel-${pixel}`} key={pixel}>
-          {`!function(f,b,e,v,n,t,s)
-{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
-n.callMethod.apply(n,arguments):n.queue.push(arguments)};
-if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
-n.queue=[];t=b.createElement(e);t.async=!0;
-t.src=v;s=b.getElementsByTagName(e)[0];
-s.parentNode.insertBefore(t,s)}(window, document,'script',
-'https://connect.facebook.net/en_US/fbevents.js');
-fbq('init', '${pixel}');
-fbq('track', 'PageView');
-fbq('track', 'Purchase', { value: ${productPrice}, currency: "${currency}" });`}
-        </Script>
-      ))}
-
-      {isButtonVisible && (
-        <Button onClick={handleNext} className={styles.button}>
-          <Typography color="white">{t("button")}</Typography>
-        </Button>
-      )}
-    </>
-  );
-}
diff --git a/src/app/[locale]/(payment)/payment/success/page.tsx b/src/app/[locale]/(payment)/payment/success/page.tsx
index 138c657..6614735 100644
--- a/src/app/[locale]/(payment)/payment/success/page.tsx
+++ b/src/app/[locale]/(payment)/payment/success/page.tsx
@@ -3,21 +3,9 @@ import { getTranslations } from "next-intl/server";
 import { AnimatedInfoScreen, LottieAnimation } from "@/components/widgets";
 import { ELottieKeys } from "@/shared/constants/lottie";
 
-import Metrics from "./Metrics";
-
-export default async function PaymentSuccess({
-  searchParams,
-}: {
-  searchParams: Promise<{
-    [key: string]: string | undefined;
-  }>;
-}) {
-  const params = await searchParams;
-
-  const fbPixels = params?.fb_pixels?.split(",") || [];
-  const productPrice = params?.price || "0";
-  const currency = params?.currency || "USD";
+import PaymentSuccessButton from "./Button";
 
+export default async function PaymentSuccess() {
   const t = await getTranslations("Payment.Success");
 
   return (
@@ -28,11 +16,7 @@ export default async function PaymentSuccess({
         }
         title={t("title")}
       />
-      <Metrics
-        fbPixels={fbPixels}
-        productPrice={productPrice}
-        currency={currency}
-      />
+      <PaymentSuccessButton />
     </>
   );
 }