memoize metrics hooks & fix hook dependencies

lib/utils/hooks/metrics/useVkMetricsGoals.ts

@@ -1,4 +1,5 @@
 import type { MetricsMessengers } from "@model/metrics";
+import { useMemo } from "react";
 
 type MetricsGoal = {
   type: "reachGoal";
@@ -19,7 +20,8 @@ const sendMetrics = (vkPixelId: number | undefined, goal: string) => {
 };
 
 export const useVkMetricsGoals = (vkId: number | undefined) => {
-  return {
+  return useMemo(
+    () => ({
       // Посетитель открыл квиз
       quizOpened: () => sendMetrics(vkId, "penaquiz-start"),
       // Посетитель нажал на кнопку стартовой страницы
@@ -42,5 +44,7 @@ export const useVkMetricsGoals = (vkId: number | undefined) => {
       messengerRequestSended: (messenger: MetricsMessengers) => sendMetrics(vkId, `penaquiz-messengers-${messenger}`),
       // Посетитель прошёл вопрос
       questionPassed: (questionId: string) => sendMetrics(vkId, `penaquiz-step${questionId}`),
-  };
+    }),
+    [vkId]
+  );
 };

lib/utils/hooks/metrics/useYandexMetricsGoals.ts

@@ -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,7 +12,8 @@ const sendMetrics = (yandexMetricsId: number | undefined, goal: string) => {
 };
 
 export const useYandexMetricsGoals = (id: number | undefined) => {
-  return {
+  return useMemo(
+    () => ({
       // Посетитель открыл квиз
       quizOpened: () => sendMetrics(id, "penaquiz-start"),
       // Посетитель нажал на кнопку стартовой страницы
@@ -34,5 +36,7 @@ export const useYandexMetricsGoals = (id: number | undefined) => {
       messengerRequestSended: (messenger: MetricsMessengers) => sendMetrics(id, `penaquiz-messengers-${messenger}`),
       // Посетитель прошёл вопрос
       questionPassed: (questionId: string) => sendMetrics(id, `penaquiz-step${questionId}`),
-  };
+    }),
+    [id]
+  );
 };

lib/utils/hooks/useQuestionFlowControl.ts

@@ -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) => {