fix: useYandexMetrics

This commit is contained in:
IlyaDoronin 2024-04-22 11:55:19 +03:00
parent 2ee1a72259
commit 21ee974680
2 changed files with 134 additions and 113 deletions

@ -14,11 +14,17 @@ import { StartPageViewPublication } from "./StartPageViewPublication";
import NextButton from "./tools/NextButton"; import NextButton from "./tools/NextButton";
import PrevButton from "./tools/PrevButton"; import PrevButton from "./tools/PrevButton";
import QuestionSelect from "./QuestionSelect"; import QuestionSelect from "./QuestionSelect";
import {useYandexMetrica} from "@utils/hooks/useYandexMetrica.tsx"; import { useYandexMetrics } from "@/utils/hooks/useYandexMetrics";
export default function ViewPublicationPage() { export default function ViewPublicationPage() {
const { settings, recentlyCompleted, quizId, preview, changeFaviconAndTitle } = useQuizData(); const {
const answers = useQuizViewStore(state => state.answers); settings,
recentlyCompleted,
quizId,
preview,
changeFaviconAndTitle,
} = useQuizData();
const answers = useQuizViewStore((state) => state.answers);
let currentQuizStep = useQuizViewStore((state) => state.currentQuizStep); let currentQuizStep = useQuizViewStore((state) => state.currentQuizStep);
const { const {
currentQuestion, currentQuestion,
@ -30,13 +36,14 @@ export default function ViewPublicationPage() {
showResultAfterContactForm, showResultAfterContactForm,
setQuestion, setQuestion,
} = useQuestionFlowControl(); } = useQuestionFlowControl();
useYandexMetrics(settings?.cfg?.yandexMetricNumber);
const isAnswer = answers.some(ans => ans.questionId === currentQuestion?.id); const isAnswer = answers.some(
(ans) => ans.questionId === currentQuestion?.id
);
const yandexMetricNumber = settings?.cfg?.yandexMetricNumber useEffect(
useYandexMetrica(yandexMetricNumber); function setFaviconAndTitle() {
useEffect(function setFaviconAndTitle() {
if (!changeFaviconAndTitle) return; if (!changeFaviconAndTitle) return;
const link = document.querySelector('link[rel="icon"]'); const link = document.querySelector('link[rel="icon"]');
@ -45,16 +52,22 @@ export default function ViewPublicationPage() {
} }
document.title = settings.name; document.title = settings.name;
}, [changeFaviconAndTitle, settings.cfg.startpage.favIcon, settings.name]); },
[changeFaviconAndTitle, settings.cfg.startpage.favIcon, settings.name]
);
if (recentlyCompleted) throw new Error("Quiz already completed"); if (recentlyCompleted) throw new Error("Quiz already completed");
if (currentQuizStep === "startpage" && settings.cfg.noStartPage) currentQuizStep = "question"; if (currentQuizStep === "startpage" && settings.cfg.noStartPage)
currentQuizStep = "question";
if (!currentQuestion) return ( if (!currentQuestion)
return (
<ThemeProvider <ThemeProvider
theme={quizThemes[settings.cfg.theme || "StandardTheme"].theme} theme={quizThemes[settings.cfg.theme || "StandardTheme"].theme}
> >
<Typography textAlign={"center"} mt="50px">Вопрос не выбран</Typography> <Typography textAlign={"center"} mt="50px">
Вопрос не выбран
</Typography>
</ThemeProvider> </ThemeProvider>
); );
@ -74,7 +87,12 @@ export default function ViewPublicationPage() {
<Question <Question
currentQuestion={currentQuestion} currentQuestion={currentQuestion}
currentQuestionStepNumber={currentQuestionStepNumber} currentQuestionStepNumber={currentQuestionStepNumber}
prevButton={<PrevButton isPreviousButtonEnabled={isPreviousButtonEnabled} moveToPrevQuestion={moveToPrevQuestion} />} prevButton={
<PrevButton
isPreviousButtonEnabled={isPreviousButtonEnabled}
moveToPrevQuestion={moveToPrevQuestion}
/>
}
nextButton={ nextButton={
<NextButton <NextButton
isNextButtonEnabled={isNextButtonEnabled} isNextButtonEnabled={isNextButtonEnabled}
@ -85,7 +103,7 @@ export default function ViewPublicationPage() {
questionId: currentQuestion.id, questionId: currentQuestion.id,
body: "", body: "",
qid: quizId, qid: quizId,
preview preview,
}); });
} catch (e) { } catch (e) {
enqueueSnackbar("ответ не был засчитан"); enqueueSnackbar("ответ не был засчитан");

@ -1,8 +1,11 @@
import { useEffect } from "react"; import { useEffect } from "react";
export const useYandexMetrica = (yandexMetricNumber: number | undefined) => { export const useYandexMetrics = (yandexMetricNumber: number | undefined) => {
useEffect(() => { useEffect(() => {
if (yandexMetricNumber) { if (
typeof yandexMetricNumber === "number" &&
!Number.isNaN(yandexMetricNumber)
) {
const script = document.createElement("script"); const script = document.createElement("script");
script.type = "text/javascript"; script.type = "text/javascript";
script.innerHTML = ` script.innerHTML = `