AW-97-yandex-metric-optimization
This commit is contained in:
parent
6de439ac7b
commit
663b887a04
@ -5,3 +5,4 @@ AURA_SITE_HOST=https://aura.wit.life
|
||||
AURA_PREFIX=api/v1
|
||||
AURA_OPEN_AI_HOST=https://api.openai.com
|
||||
AURA_OPEN_AI_PREFIX=v1
|
||||
AURA_YANDEX_COUNTER_NUMBER=95799066
|
||||
@ -5,3 +5,4 @@ AURA_SITE_HOST=https://aura.wit.life
|
||||
AURA_PREFIX=api/v1
|
||||
AURA_OPEN_AI_HOST=https://api.openai.com
|
||||
AURA_OPEN_AI_PREFIX=v1
|
||||
AURA_YANDEX_COUNTER_NUMBER=95799066
|
||||
41
index.html
41
index.html
@ -42,30 +42,6 @@
|
||||
}
|
||||
}
|
||||
</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>
|
||||
<body>
|
||||
<!-- Yandex.Metrika counter -->
|
||||
@ -91,16 +67,9 @@
|
||||
window,
|
||||
document,
|
||||
"script",
|
||||
"https://mc.yandex.ru/metrika/tag.js",
|
||||
"https://cdn.jsdelivr.net/npm/yandex-metrica-watch/tag.js",
|
||||
"ym"
|
||||
);
|
||||
|
||||
ym(95799066, "init", {
|
||||
clickmap: true,
|
||||
trackLinks: true,
|
||||
accurateTrackBounce: true,
|
||||
webvisor: true,
|
||||
});
|
||||
</script>
|
||||
<noscript>
|
||||
<div>
|
||||
@ -113,14 +82,6 @@
|
||||
</noscript>
|
||||
<!-- /Yandex.Metrika counter -->
|
||||
<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) -->
|
||||
<noscript
|
||||
><iframe
|
||||
|
||||
@ -15,6 +15,7 @@ import { useAuthentication } from "@/hooks/authentication/use-authentication";
|
||||
import { ESourceAuthorization } from "@/api/resources/User";
|
||||
import { EPlacementKeys, IPaywallProduct } from "@/api/resources/Paywall";
|
||||
import { usePaywall } from "@/hooks/paywall/usePaywall";
|
||||
import metricService from "@/services/metric/metricService";
|
||||
|
||||
interface IEmailEnterPage {
|
||||
redirectUrl?: string;
|
||||
@ -88,8 +89,7 @@ function EmailEnterPage({
|
||||
|
||||
const handleClick = () => {
|
||||
authorize();
|
||||
if (typeof window.ym === "function")
|
||||
window.ym(95799066, "reachGoal", "EnteredEmail");
|
||||
metricService.reachGoal("EnteredEmail");
|
||||
};
|
||||
|
||||
const authorize = async () => {
|
||||
|
||||
@ -7,19 +7,20 @@ import MainButton from "@/components/MainButton";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { actions } from "@/store";
|
||||
import { useEffect } from "react";
|
||||
import metricService from "@/services/metric/metricService";
|
||||
|
||||
function PaymentSuccessPage(): JSX.Element {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const handleNext = () => {
|
||||
dispatch(actions.status.update("subscribed"));
|
||||
navigate(routes.client.addReport());
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (typeof window.ym === "function")
|
||||
window.ym(95799066, "reachGoal", "PaymentSuccess");
|
||||
metricService.reachGoal("PaymentSuccess");
|
||||
}, []);
|
||||
|
||||
return (
|
||||
|
||||
@ -18,6 +18,7 @@ import { ESourceAuthorization } from "@/api/resources/User";
|
||||
import { useAuthentication } from "@/hooks/authentication/use-authentication";
|
||||
import { usePaywall } from "@/hooks/paywall/usePaywall";
|
||||
import { EPlacementKeys, IPaywallProduct } from "@/api/resources/Paywall";
|
||||
import metricService from "@/services/metric/metricService";
|
||||
|
||||
interface IEmailEnterPage {
|
||||
redirectUrl?: string;
|
||||
@ -93,8 +94,7 @@ function EmailEnterPage({
|
||||
|
||||
const handleClick = () => {
|
||||
authorize();
|
||||
if (typeof window.ym === "function")
|
||||
window.ym(95799066, "reachGoal", "EnteredEmail");
|
||||
metricService.reachGoal("EnteredEmail");
|
||||
};
|
||||
|
||||
const authorize = async () => {
|
||||
|
||||
@ -7,6 +7,7 @@ import { actions } from "@/store";
|
||||
import { useEffect } from "react";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import metricService from "@/services/metric/metricService";
|
||||
|
||||
interface IGenderPageProps {
|
||||
productKey?: EProductKeys;
|
||||
@ -20,11 +21,9 @@ function GenderPage({ productKey }: IGenderPageProps): JSX.Element {
|
||||
useEffect(() => {
|
||||
const isShowTryApp = targetId === "i";
|
||||
dispatch(actions.userConfig.addIsShowTryApp(isShowTryApp));
|
||||
if (targetId && typeof window.ym === "function" && targetId !== "i") {
|
||||
window.ym(95799066, "userParams", {
|
||||
genderFrom: targetId,
|
||||
});
|
||||
}
|
||||
metricService.userParams({
|
||||
genderFrom: targetId,
|
||||
});
|
||||
}, [dispatch, targetId]);
|
||||
|
||||
const selectGender = (gender: Gender) => {
|
||||
|
||||
@ -5,6 +5,7 @@ import MainButton from "@/components/MainButton";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import routes from "@/routes";
|
||||
import { useEffect } from "react";
|
||||
import metricService from "@/services/metric/metricService";
|
||||
|
||||
function SuccessPaymentPage(): JSX.Element {
|
||||
const { t } = useTranslation();
|
||||
@ -15,8 +16,7 @@ function SuccessPaymentPage(): JSX.Element {
|
||||
: "The information has been sent to your email";
|
||||
|
||||
useEffect(() => {
|
||||
if (typeof window.ym === "function")
|
||||
window.ym(95799066, "reachGoal", "PaymentSuccess");
|
||||
metricService.reachGoal("PaymentSuccess");
|
||||
}, []);
|
||||
|
||||
return (
|
||||
|
||||
@ -9,6 +9,7 @@ import Title from "@/components/Title";
|
||||
import Loader, { LoaderColor } from "@/components/Loader";
|
||||
import { useAuthentication } from "@/hooks/authentication/use-authentication";
|
||||
import { ESourceAuthorization } from "@/api/resources/User";
|
||||
import metricService from "@/services/metric/metricService";
|
||||
|
||||
const emailRegex = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;
|
||||
|
||||
@ -43,8 +44,7 @@ export default function StepEmail() {
|
||||
|
||||
const authorize = async () => {
|
||||
await authorization(email, ESourceAuthorization["aura.palmistry"]);
|
||||
if (typeof window.ym === "function")
|
||||
window.ym(95799066, "reachGoal", "EnteredEmail");
|
||||
metricService.reachGoal("EnteredEmail");
|
||||
setIsAuth(true);
|
||||
};
|
||||
|
||||
|
||||
5
src/env.d.ts
vendored
5
src/env.d.ts
vendored
@ -4,6 +4,7 @@ interface ImportMetaEnv {
|
||||
AURA_DAPI_PREFIX: string,
|
||||
AURA_SITE_HOST: string,
|
||||
AURA_PREFIX: string,
|
||||
AURA_OPEN_AI_HOST: number,
|
||||
AURA_OPEN_AI_PREFIX: string
|
||||
AURA_OPEN_AI_HOST: string,
|
||||
AURA_OPEN_AI_PREFIX: string,
|
||||
AURA_YANDEX_COUNTER_NUMBER: string
|
||||
}
|
||||
15
src/init.tsx
15
src/init.tsx
@ -10,6 +10,9 @@ import { ApiContext, createApi } from "./api";
|
||||
import { LegalContext, buildLegal } from "./legal";
|
||||
import { getClientLocale, buildResources, fallbackLng } from "./locales";
|
||||
import App from "./components/App";
|
||||
import metricService from "./services/metric/metricService";
|
||||
|
||||
const environments = import.meta.env;
|
||||
|
||||
const init = async () => {
|
||||
const api = createApi();
|
||||
@ -35,23 +38,19 @@ const init = async () => {
|
||||
.use(new ReactPostprocessor())
|
||||
.init(options);
|
||||
|
||||
const isProduction = import.meta.env.MODE === "production";
|
||||
const isProduction = environments.MODE === "production";
|
||||
|
||||
// SCRIPTS TO HEAD
|
||||
// const yandexMetric = () => {
|
||||
// const script = document.createElement("script");
|
||||
// script.setAttribute("src", "/metrics/yandex.js");
|
||||
// document.head.appendChild(script);
|
||||
// };
|
||||
|
||||
const smartLook = () => {
|
||||
if (!config.smartlook_manage) return;
|
||||
const script = document.createElement("script");
|
||||
script.setAttribute("src", "/metrics/smartlook.js");
|
||||
document.head.appendChild(script);
|
||||
};
|
||||
|
||||
metricService.initMetric();
|
||||
|
||||
if (isProduction) {
|
||||
// yandexMetric();
|
||||
smartLook();
|
||||
}
|
||||
|
||||
|
||||
45
src/services/metric/metricService.ts
Normal file
45
src/services/metric/metricService.ts
Normal 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 }
|
||||
Loading…
Reference in New Issue
Block a user