memoize metrics hooks & fix hook dependencies
This commit is contained in:
parent
430d4f1a4b
commit
3eb3966fca
@ -1,4 +1,5 @@
|
||||
import type { MetricsMessengers } from "@model/metrics";
|
||||
import { useMemo } from "react";
|
||||
|
||||
type MetricsGoal = {
|
||||
type: "reachGoal";
|
||||
@ -19,28 +20,31 @@ const sendMetrics = (vkPixelId: number | undefined, goal: string) => {
|
||||
};
|
||||
|
||||
export const useVkMetricsGoals = (vkId: number | undefined) => {
|
||||
return {
|
||||
// Посетитель открыл квиз
|
||||
quizOpened: () => sendMetrics(vkId, "penaquiz-start"),
|
||||
// Посетитель нажал на кнопку стартовой страницы
|
||||
firstPageOpened: () => sendMetrics(vkId, "penaquiz-startquiz"),
|
||||
// Посетитель кликнул по номеру телефона на стартовой странице
|
||||
phoneNumberOpened: () => sendMetrics(vkId, "penaquiz-phone"),
|
||||
// Посетитель кликнул по email на стартовой странице
|
||||
emailOpened: () => sendMetrics(vkId, "penaquiz-email"),
|
||||
// Посетитель увидел определенный результат (id - айдишник вопроса с типом result)
|
||||
resultIdShown: (resultId: string) => sendMetrics(vkId, `penaquiz-result-${resultId}`),
|
||||
// Посетитель нажал на ссылку в результате
|
||||
resultLink: () => sendMetrics(vkId, `penaquiz-resultlink`),
|
||||
// Посетитель дошёл до формы контактов
|
||||
contactsFormOpened: () => sendMetrics(vkId, "penaquiz-form"),
|
||||
// Посетитель заполнил форму контактов
|
||||
contactsFormFilled: () => sendMetrics(vkId, "penaquiz-contacts"),
|
||||
// Посетитель заполнил поле формы контактов
|
||||
contactsFormField: (field: string) => sendMetrics(vkId, `penaquiz-formfield-${field}`),
|
||||
// Посетитель отправил заявку с мессенджером
|
||||
messengerRequestSended: (messenger: MetricsMessengers) => sendMetrics(vkId, `penaquiz-messengers-${messenger}`),
|
||||
// Посетитель прошёл вопрос
|
||||
questionPassed: (questionId: string) => sendMetrics(vkId, `penaquiz-step${questionId}`),
|
||||
};
|
||||
return useMemo(
|
||||
() => ({
|
||||
// Посетитель открыл квиз
|
||||
quizOpened: () => sendMetrics(vkId, "penaquiz-start"),
|
||||
// Посетитель нажал на кнопку стартовой страницы
|
||||
firstPageOpened: () => sendMetrics(vkId, "penaquiz-startquiz"),
|
||||
// Посетитель кликнул по номеру телефона на стартовой странице
|
||||
phoneNumberOpened: () => sendMetrics(vkId, "penaquiz-phone"),
|
||||
// Посетитель кликнул по email на стартовой странице
|
||||
emailOpened: () => sendMetrics(vkId, "penaquiz-email"),
|
||||
// Посетитель увидел определенный результат (id - айдишник вопроса с типом result)
|
||||
resultIdShown: (resultId: string) => sendMetrics(vkId, `penaquiz-result-${resultId}`),
|
||||
// Посетитель нажал на ссылку в результате
|
||||
resultLink: () => sendMetrics(vkId, `penaquiz-resultlink`),
|
||||
// Посетитель дошёл до формы контактов
|
||||
contactsFormOpened: () => sendMetrics(vkId, "penaquiz-form"),
|
||||
// Посетитель заполнил форму контактов
|
||||
contactsFormFilled: () => sendMetrics(vkId, "penaquiz-contacts"),
|
||||
// Посетитель заполнил поле формы контактов
|
||||
contactsFormField: (field: string) => sendMetrics(vkId, `penaquiz-formfield-${field}`),
|
||||
// Посетитель отправил заявку с мессенджером
|
||||
messengerRequestSended: (messenger: MetricsMessengers) => sendMetrics(vkId, `penaquiz-messengers-${messenger}`),
|
||||
// Посетитель прошёл вопрос
|
||||
questionPassed: (questionId: string) => sendMetrics(vkId, `penaquiz-step${questionId}`),
|
||||
}),
|
||||
[vkId]
|
||||
);
|
||||
};
|
||||
|
@ -1,4 +1,5 @@
|
||||
import type { MetricsMessengers } from "@model/metrics";
|
||||
import { useMemo } from "react";
|
||||
|
||||
type ExtendedWindow = Window & {
|
||||
ym?: (id: number, type: string, goal: string) => void;
|
||||
@ -11,28 +12,31 @@ const sendMetrics = (yandexMetricsId: number | undefined, goal: string) => {
|
||||
};
|
||||
|
||||
export const useYandexMetricsGoals = (id: number | undefined) => {
|
||||
return {
|
||||
// Посетитель открыл квиз
|
||||
quizOpened: () => sendMetrics(id, "penaquiz-start"),
|
||||
// Посетитель нажал на кнопку стартовой страницы
|
||||
firstPageOpened: () => sendMetrics(id, "penaquiz-startquiz"),
|
||||
// Посетитель кликнул по номеру телефона на стартовой странице
|
||||
phoneNumberOpened: () => sendMetrics(id, "penaquiz-phone"),
|
||||
// Посетитель кликнул по email на стартовой странице
|
||||
emailOpened: () => sendMetrics(id, "penaquiz-email"),
|
||||
// Посетитель увидел определенный результат (id - айдишник вопроса с типом result)
|
||||
resultIdShown: (resultId: string) => sendMetrics(id, `penaquiz-result-${resultId}`),
|
||||
// Посетитель нажал на ссылку в результате
|
||||
resultLink: () => sendMetrics(id, `penaquiz-resultlink`),
|
||||
// Посетитель дошёл до формы контактов
|
||||
contactsFormOpened: () => sendMetrics(id, "penaquiz-form"),
|
||||
// Посетитель заполнил форму контактов
|
||||
contactsFormFilled: () => sendMetrics(id, "penaquiz-contacts"),
|
||||
// Посетитель заполнил поле формы контактов
|
||||
contactsFormField: (field: string) => sendMetrics(id, `penaquiz-formfield-${field}`),
|
||||
// Посетитель отправил заявку с мессенджером
|
||||
messengerRequestSended: (messenger: MetricsMessengers) => sendMetrics(id, `penaquiz-messengers-${messenger}`),
|
||||
// Посетитель прошёл вопрос
|
||||
questionPassed: (questionId: string) => sendMetrics(id, `penaquiz-step${questionId}`),
|
||||
};
|
||||
return useMemo(
|
||||
() => ({
|
||||
// Посетитель открыл квиз
|
||||
quizOpened: () => sendMetrics(id, "penaquiz-start"),
|
||||
// Посетитель нажал на кнопку стартовой страницы
|
||||
firstPageOpened: () => sendMetrics(id, "penaquiz-startquiz"),
|
||||
// Посетитель кликнул по номеру телефона на стартовой странице
|
||||
phoneNumberOpened: () => sendMetrics(id, "penaquiz-phone"),
|
||||
// Посетитель кликнул по email на стартовой странице
|
||||
emailOpened: () => sendMetrics(id, "penaquiz-email"),
|
||||
// Посетитель увидел определенный результат (id - айдишник вопроса с типом result)
|
||||
resultIdShown: (resultId: string) => sendMetrics(id, `penaquiz-result-${resultId}`),
|
||||
// Посетитель нажал на ссылку в результате
|
||||
resultLink: () => sendMetrics(id, `penaquiz-resultlink`),
|
||||
// Посетитель дошёл до формы контактов
|
||||
contactsFormOpened: () => sendMetrics(id, "penaquiz-form"),
|
||||
// Посетитель заполнил форму контактов
|
||||
contactsFormFilled: () => sendMetrics(id, "penaquiz-contacts"),
|
||||
// Посетитель заполнил поле формы контактов
|
||||
contactsFormField: (field: string) => sendMetrics(id, `penaquiz-formfield-${field}`),
|
||||
// Посетитель отправил заявку с мессенджером
|
||||
messengerRequestSended: (messenger: MetricsMessengers) => sendMetrics(id, `penaquiz-messengers-${messenger}`),
|
||||
// Посетитель прошёл вопрос
|
||||
questionPassed: (questionId: string) => sendMetrics(id, `penaquiz-step${questionId}`),
|
||||
}),
|
||||
[id]
|
||||
);
|
||||
};
|
||||
|
@ -23,7 +23,6 @@ export function useQuestionFlowControl() {
|
||||
const yandexMetrics = useYandexMetricsGoals(settings.cfg.yandexMetricsNumber);
|
||||
|
||||
const currentQuestion = sortedQuestions.find((question) => question.id === currentQuestionId) ?? sortedQuestions[0];
|
||||
console.log("currentQuestion", currentQuestion);
|
||||
|
||||
const linearQuestionIndex =
|
||||
currentQuestion && sortedQuestions.every(({ content }) => content.rule.parentId !== "root") // null when branching enabled
|
||||
@ -161,7 +160,7 @@ export function useQuestionFlowControl() {
|
||||
if (nextQuestion.type === "result") return showResult();
|
||||
|
||||
setCurrentQuestionId(nextQuestion.id);
|
||||
}, [currentQuestion, nextQuestion, showResult]);
|
||||
}, [currentQuestion.id, nextQuestion, showResult, vkMetrics, yandexMetrics]);
|
||||
|
||||
const setQuestion = useCallback(
|
||||
(questionId: string) => {
|
||||
|
Loading…
Reference in New Issue
Block a user