import { useExperiments } from "yandex-metrica-ab-react"; export enum EGoals { ENTERED_EMAIL = "EnteredEmail", LEAD = "Lead", PAYMENT_SUCCESS = "PaymentSuccess", PURCHASE = "Purchase", ROSE_VIDEO_CREATION_START = 'RoseVideoCreationStart', ROSE_LOADING_START = "RoseLoadingStart", ROSE_VIDEO_CREATED = "RoseVideoCreated", ROSE_LOADING_END = "RoseLoadingEnd", ROSE_VIDEO_PLAY_START = "RoseVideoPlayStart", ROSE_VIDEO_PLAY_END = "RoseVideoPlayEnd", ROSE_VIDEO_PLAY_USER_STOP = "RoseVideoPlayUserStop", ROSE_VIDEO_PLAY_USER_PLAY = "RoseVideoPlayUserPlay", AURA_PAYMENT_METHODS_OPENED = "AuraPaymentMethodsOpened", AURA_SELECT_TRIAL = "AuraSelectTrial", AURA_TRIAL_CHOICE_PAGE_VISIT = "AuraTrialChoicePageVisit", AURA_TRIAL_PAYMENT_PAGE_VISIT = "AuraTrialPaymentPageVisit", PAYMENT_SUCCESS_PALMISTRY = "PaymentSuccessPalmistry", ENTER_EMAIL_PALMISTRY = "EnterEmailPalmistry" } export enum EFlags { isNextPageMentioned = 'Go to page mentionedIn', aboutUsAnswers = 'Key for aboutUsAnswers' } export enum EMetrics { YANDEX = "Yandex", KLAVIYO = "Klaviyo", FACEBOOK = "Facebook" } interface IUserParams { UserID: number | string; genderFrom: string; email: string; hasPersonalVideo: boolean; gender: string; age: number; } const environments = import.meta.env const metricCounterNumber = Number(environments.AURA_YANDEX_COUNTER_NUMBER) const checkIsAvailableYandexMetric = () => { if (typeof window.ym !== "function") { console.error("Yandex.Metric not found") return false } return true } const checkIsAvailableYandexMetricAB = () => { if (typeof window.ymab !== "function") { console.error("Yandex.Metric not found") return false } return true } const setUserID = (userId: string) => { if (!checkIsAvailableYandexMetric()) return; window.ym(metricCounterNumber, "setUserID", userId) if (!window.klaviyo) return console.error("Klaviyo.Metric not found"); window.klaviyo.push(['identify', userId]); } const userParams = (parameters: Partial) => { if (!checkIsAvailableYandexMetric()) return; window.ym(metricCounterNumber, "userParams", parameters) if (!window.klaviyo) return console.error("Klaviyo.Metric not found"); window.klaviyo.push(['identify', parameters]); } const reachGoal = (goal: EGoals, usingMetrics = [EMetrics.KLAVIYO, EMetrics.YANDEX], options?: unknown) => { if (!checkIsAvailableYandexMetric()) return; if (usingMetrics.includes(EMetrics.YANDEX)) window.ym(metricCounterNumber, "reachGoal", goal); console.log("goal: ", goal); if (!window.klaviyo) return console.error("Klaviyo.Metric not found"); if (usingMetrics.includes(EMetrics.KLAVIYO)) window.klaviyo.push(['track', goal]); if (!window.fbq) return console.error("Facebook.Metric not found"); if (goal === EGoals.ENTERED_EMAIL) { if (usingMetrics.includes(EMetrics.FACEBOOK)) window.fbq('track', EGoals.LEAD, options); } if (usingMetrics.includes(EMetrics.FACEBOOK)) window.fbq('track', goal, options); } type THitOptions = { callback: () => void; ctx: object; params: { order_price: number; currency: string; }, referer: string; title: string; } const hit = (url?: string, options?: THitOptions) => { if (!checkIsAvailableYandexMetric()) return; window.ym(metricCounterNumber, "hit", url, options); } const initMetric = () => { if (!checkIsAvailableYandexMetric()) return; window.ym(metricCounterNumber, "init", { clickmap: true, trackLinks: true, accurateTrackBounce: true, webvisor: true, }); console.log("Metric initialized"); } const initMetricAB = () => { if (!checkIsAvailableYandexMetricAB()) return; window.ymab(`metrika.${metricCounterNumber}`, 'setConfig', { enableJS: true, enableWatch: true }); window.ymab(`metrika.${metricCounterNumber}`, 'init'/*, {clientFeatures}, {callback}*/); console.log("Metric initialized"); } type TABFlags = { showTimerTrial: "show" | "hide"; text: "1" | "2" | "3"; auraVideoTrial: "on"; auraPalmistry: "on"; } export const useMetricABFlags = () => { return useExperiments({ clientId: `metrika.${metricCounterNumber}` }) } export default { setUserID, userParams, reachGoal, hit, initMetric, initMetricAB }