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

AW-97-yandex-metric-optimization

Browse Source
This commit is contained in:
Денис Катаев 2024-06-03 16:59:51 +00:00 committed by Daniil Chemerkin
parent 6de439ac7b
commit 663b887a04
12 changed files with 75 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
environments/.env.develop
View File

@ -4,4 +4,5 @@ AURA_DAPI_PREFIX=v2
AURA_SITE_HOST=https://aura.wit.life AURA_SITE_HOST=https://aura.wit.life
AURA_PREFIX=api/v1 AURA_PREFIX=api/v1
AURA_OPEN_AI_HOST=https://api.openai.com AURA_OPEN_AI_HOST=https://api.openai.com
AURA_OPEN_AI_PREFIX=v1 AURA_OPEN_AI_PREFIX=v1
AURA_YANDEX_COUNTER_NUMBER=95799066

3
environments/.env.production
View File

@ -4,4 +4,5 @@ AURA_DAPI_PREFIX=v2
AURA_SITE_HOST=https://aura.wit.life AURA_SITE_HOST=https://aura.wit.life
AURA_PREFIX=api/v1 AURA_PREFIX=api/v1
AURA_OPEN_AI_HOST=https://api.openai.com AURA_OPEN_AI_HOST=https://api.openai.com
AURA_OPEN_AI_PREFIX=v1 AURA_OPEN_AI_PREFIX=v1
AURA_YANDEX_COUNTER_NUMBER=95799066

41
index.html
View File

@ -42,30 +42,6 @@
} }
} }
</style> </style>
<!-- <script type="text/javascript">
window.smartlook ||
(function (d) {
var o = (smartlook = function () {
o.api.push(arguments);
}),
h = d.getElementsByTagName("head")[0];
var c = d.createElement("script");
o.api = new Array();
c.async = true;
c.type = "text/javascript";
c.charset = "utf-8";
c.src = "https://web-sdk.smartlook.com/recorder.js";
h.appendChild(c);
})(document);
smartlook("init", "2162354c75f8e0cb315634bc429aced457d3230c", {
region: "eu",
});
</script> -->
<!-- <script
type="text/javascript"
src="//script.crazyegg.com/pages/scripts/0121/5622.js"
async="async"
></script> -->
</head> </head>
<body> <body>
<!-- Yandex.Metrika counter --> <!-- Yandex.Metrika counter -->
@ -91,16 +67,9 @@
window, window,
document, document,
"script", "script",
"https://mc.yandex.ru/metrika/tag.js", "https://cdn.jsdelivr.net/npm/yandex-metrica-watch/tag.js",
"ym" "ym"
); );
ym(95799066, "init", {
clickmap: true,
trackLinks: true,
accurateTrackBounce: true,
webvisor: true,
});
</script> </script>
<noscript> <noscript>
<div> <div>
@ -113,14 +82,6 @@
</noscript> </noscript>
<!-- /Yandex.Metrika counter --> <!-- /Yandex.Metrika counter -->
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
<noscript
><div>
<img
src="https://mc.yandex.ru/watch/95799066"
style="position: absolute; left: -9999px"
alt=""
/></div
></noscript>
<!-- Google Tag Manager (noscript) --> <!-- Google Tag Manager (noscript) -->
<noscript <noscript
><iframe ><iframe

4
src/components/EmailEnterPage/index.tsx
View File

@ -15,6 +15,7 @@ import { useAuthentication } from "@/hooks/authentication/use-authentication";
import { ESourceAuthorization } from "@/api/resources/User"; import { ESourceAuthorization } from "@/api/resources/User";
import { EPlacementKeys, IPaywallProduct } from "@/api/resources/Paywall"; import { EPlacementKeys, IPaywallProduct } from "@/api/resources/Paywall";
import { usePaywall } from "@/hooks/paywall/usePaywall"; import { usePaywall } from "@/hooks/paywall/usePaywall";
import metricService from "@/services/metric/metricService";
interface IEmailEnterPage { interface IEmailEnterPage {
redirectUrl?: string; redirectUrl?: string;
@ -88,8 +89,7 @@ function EmailEnterPage({
const handleClick = () => { const handleClick = () => {
authorize(); authorize();
if (typeof window.ym === "function") metricService.reachGoal("EnteredEmail");
window.ym(95799066, "reachGoal", "EnteredEmail");
}; };
const authorize = async () => { const authorize = async () => {

5
src/components/PaymentPage/results/SuccessPage/index.tsx
View File

@ -7,19 +7,20 @@ import MainButton from "@/components/MainButton";
import { useDispatch } from "react-redux"; import { useDispatch } from "react-redux";
import { actions } from "@/store"; import { actions } from "@/store";
import { useEffect } from "react"; import { useEffect } from "react";
import metricService from "@/services/metric/metricService";
function PaymentSuccessPage(): JSX.Element { function PaymentSuccessPage(): JSX.Element {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate(); const navigate = useNavigate();
const dispatch = useDispatch(); const dispatch = useDispatch();
const handleNext = () => { const handleNext = () => {
dispatch(actions.status.update("subscribed")); dispatch(actions.status.update("subscribed"));
navigate(routes.client.addReport()); navigate(routes.client.addReport());
}; };
useEffect(() => { useEffect(() => {
if (typeof window.ym === "function") metricService.reachGoal("PaymentSuccess");
window.ym(95799066, "reachGoal", "PaymentSuccess");
}, []); }, []);
return ( return (

4
src/components/pages/ABDesign/v1/pages/EmailEnterPage/index.tsx
View File

@ -18,6 +18,7 @@ import { ESourceAuthorization } from "@/api/resources/User";
import { useAuthentication } from "@/hooks/authentication/use-authentication"; import { useAuthentication } from "@/hooks/authentication/use-authentication";
import { usePaywall } from "@/hooks/paywall/usePaywall"; import { usePaywall } from "@/hooks/paywall/usePaywall";
import { EPlacementKeys, IPaywallProduct } from "@/api/resources/Paywall"; import { EPlacementKeys, IPaywallProduct } from "@/api/resources/Paywall";
import metricService from "@/services/metric/metricService";
interface IEmailEnterPage { interface IEmailEnterPage {
redirectUrl?: string; redirectUrl?: string;
@ -93,8 +94,7 @@ function EmailEnterPage({
const handleClick = () => { const handleClick = () => {
authorize(); authorize();
if (typeof window.ym === "function") metricService.reachGoal("EnteredEmail");
window.ym(95799066, "reachGoal", "EnteredEmail");
}; };
const authorize = async () => { const authorize = async () => {

9
src/components/pages/Gender/index.tsx
View File

@ -7,6 +7,7 @@ import { actions } from "@/store";
import { useEffect } from "react"; import { useEffect } from "react";
import { useDispatch } from "react-redux"; import { useDispatch } from "react-redux";
import { useNavigate, useParams } from "react-router-dom"; import { useNavigate, useParams } from "react-router-dom";
import metricService from "@/services/metric/metricService";
interface IGenderPageProps { interface IGenderPageProps {
productKey?: EProductKeys; productKey?: EProductKeys;
@ -20,11 +21,9 @@ function GenderPage({ productKey }: IGenderPageProps): JSX.Element {
useEffect(() => { useEffect(() => {
const isShowTryApp = targetId === "i"; const isShowTryApp = targetId === "i";
dispatch(actions.userConfig.addIsShowTryApp(isShowTryApp)); dispatch(actions.userConfig.addIsShowTryApp(isShowTryApp));
if (targetId && typeof window.ym === "function" && targetId !== "i") { metricService.userParams({
window.ym(95799066, "userParams", { genderFrom: targetId,
genderFrom: targetId, });
});
}
}, [dispatch, targetId]); }, [dispatch, targetId]);
const selectGender = (gender: Gender) => { const selectGender = (gender: Gender) => {

4
src/components/pages/SinglePaymentPage/ResultPayment/SuccessPaymentPage/index.tsx
View File

@ -5,6 +5,7 @@ import MainButton from "@/components/MainButton";
import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
import routes from "@/routes"; import routes from "@/routes";
import { useEffect } from "react"; import { useEffect } from "react";
import metricService from "@/services/metric/metricService";
function SuccessPaymentPage(): JSX.Element { function SuccessPaymentPage(): JSX.Element {
const { t } = useTranslation(); const { t } = useTranslation();
@ -15,8 +16,7 @@ function SuccessPaymentPage(): JSX.Element {
: "The information has been sent to your email"; : "The information has been sent to your email";
useEffect(() => { useEffect(() => {
if (typeof window.ym === "function") metricService.reachGoal("PaymentSuccess");
window.ym(95799066, "reachGoal", "PaymentSuccess");
}, []); }, []);
return ( return (

4
src/components/palmistry/step-email/step-email.tsx
View File

@ -9,6 +9,7 @@ import Title from "@/components/Title";
import Loader, { LoaderColor } from "@/components/Loader"; import Loader, { LoaderColor } from "@/components/Loader";
import { useAuthentication } from "@/hooks/authentication/use-authentication"; import { useAuthentication } from "@/hooks/authentication/use-authentication";
import { ESourceAuthorization } from "@/api/resources/User"; import { ESourceAuthorization } from "@/api/resources/User";
import metricService from "@/services/metric/metricService";
const emailRegex = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/; const emailRegex = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;
@ -43,8 +44,7 @@ export default function StepEmail() {
const authorize = async () => { const authorize = async () => {
await authorization(email, ESourceAuthorization["aura.palmistry"]); await authorization(email, ESourceAuthorization["aura.palmistry"]);
if (typeof window.ym === "function") metricService.reachGoal("EnteredEmail");
window.ym(95799066, "reachGoal", "EnteredEmail");
setIsAuth(true); setIsAuth(true);
}; };

5
src/env.d.ts vendored
View File

@ -4,6 +4,7 @@ interface ImportMetaEnv {
AURA_DAPI_PREFIX: string, AURA_DAPI_PREFIX: string,
AURA_SITE_HOST: string, AURA_SITE_HOST: string,
AURA_PREFIX: string, AURA_PREFIX: string,
AURA_OPEN_AI_HOST: number, AURA_OPEN_AI_HOST: string,
AURA_OPEN_AI_PREFIX: string AURA_OPEN_AI_PREFIX: string,
AURA_YANDEX_COUNTER_NUMBER: string
} }

15
src/init.tsx
View File

@ -10,6 +10,9 @@ import { ApiContext, createApi } from "./api";
import { LegalContext, buildLegal } from "./legal"; import { LegalContext, buildLegal } from "./legal";
import { getClientLocale, buildResources, fallbackLng } from "./locales"; import { getClientLocale, buildResources, fallbackLng } from "./locales";
import App from "./components/App"; import App from "./components/App";
import metricService from "./services/metric/metricService";
const environments = import.meta.env;
const init = async () => { const init = async () => {
const api = createApi(); const api = createApi();
@ -35,23 +38,19 @@ const init = async () => {
.use(new ReactPostprocessor()) .use(new ReactPostprocessor())
.init(options); .init(options);
const isProduction = import.meta.env.MODE === "production"; const isProduction = environments.MODE === "production";
// SCRIPTS TO HEAD // SCRIPTS TO HEAD
// const yandexMetric = () => {
// const script = document.createElement("script");
// script.setAttribute("src", "/metrics/yandex.js");
// document.head.appendChild(script);
// };
const smartLook = () => { const smartLook = () => {
if (!config.smartlook_manage) return; if (!config.smartlook_manage) return;
const script = document.createElement("script"); const script = document.createElement("script");
script.setAttribute("src", "/metrics/smartlook.js"); script.setAttribute("src", "/metrics/smartlook.js");
document.head.appendChild(script); document.head.appendChild(script);
}; };
metricService.initMetric();
if (isProduction) { if (isProduction) {
// yandexMetric();
smartLook(); smartLook();
} }

45
src/services/metric/metricService.ts Normal file
View File

@ -0,0 +1,45 @@
interface IUserParams {
UserID: number;
genderFrom: string;
email: string;
}
const environments = import.meta.env
const metricCounterNumber = Number(environments.AURA_YANDEX_COUNTER_NUMBER)
const setUserID = (userId: string) => {
if (typeof window.ym !== "function") return console.error("Yandex.Metric not found");
window.ym(metricCounterNumber, "setUserID", userId)
// eslint-disable-next-line react-hooks/exhaustive-deps
}
const userParams = (parameters: Partial<IUserParams>) => {
if (typeof window.ym !== "function") return console.error("Yandex.Metric not found");
window.ym(metricCounterNumber, "userParams", parameters)
// eslint-disable-next-line react-hooks/exhaustive-deps
}
const reachGoal = (goal: "EnteredEmail" | "PaymentSuccess") => {
if (typeof window.ym !== "function") return console.error("Yandex.Metric not found");
window.ym(metricCounterNumber, "reachGoal", goal)
// eslint-disable-next-line react-hooks/exhaustive-deps
}
const initMetric = () => {
if (typeof window.ym !== "function") return console.error("Yandex.Metric not found");
window.ym(metricCounterNumber, "init", {
clickmap: true,
trackLinks: true,
accurateTrackBounce: true,
webvisor: true,
});
console.log("Metric initialized");
// eslint-disable-next-line react-hooks/exhaustive-deps
}
export default { setUserID, userParams, reachGoal, initMetric }