2024-04-03 12:42:12 +00:00
|
|
|
|
import { useCallback, useDebugValue, useMemo, useState } from "react";
|
2024-05-06 13:47:19 +00:00
|
|
|
|
import { enqueueSnackbar } from "notistack";
|
2024-04-03 12:42:12 +00:00
|
|
|
|
import moment from "moment";
|
2024-05-06 13:47:19 +00:00
|
|
|
|
|
|
|
|
|
import { isResultQuestionEmpty } from "@/components/ViewPublicationPage/tools/checkEmptyData";
|
2024-05-31 17:56:17 +00:00
|
|
|
|
import { useQuizSettings } from "@contexts/QuizDataContext";
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
import { useQuizViewStore } from "@stores/quizView";
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
import { useVkMetricsGoals } from "@/utils/hooks/metrics/useVkMetricsGoals";
|
|
|
|
|
import { useYandexMetricsGoals } from "@/utils/hooks/metrics/useYandexMetricsGoals";
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
export function useQuestionFlowControl() {
|
2024-05-31 17:56:17 +00:00
|
|
|
|
const { settings, questions } = useQuizSettings();
|
2024-05-06 13:47:19 +00:00
|
|
|
|
const sortedQuestions = useMemo(() => {
|
|
|
|
|
return [...questions].sort((a, b) => a.page - b.page);
|
|
|
|
|
}, [questions]);
|
2024-05-31 16:41:18 +00:00
|
|
|
|
const [currentQuestionId, setCurrentQuestionId] = useState<string | null>(getFirstQuestionId);
|
2024-05-06 13:47:19 +00:00
|
|
|
|
const answers = useQuizViewStore((state) => state.answers);
|
|
|
|
|
const pointsSum = useQuizViewStore((state) => state.pointsSum);
|
2024-05-31 16:41:18 +00:00
|
|
|
|
const setCurrentQuizStep = useQuizViewStore((state) => state.setCurrentQuizStep);
|
2024-05-06 13:47:19 +00:00
|
|
|
|
const vkMetrics = useVkMetricsGoals(settings.cfg.vkMetricsNumber);
|
|
|
|
|
const yandexMetrics = useYandexMetricsGoals(settings.cfg.yandexMetricsNumber);
|
|
|
|
|
|
2024-05-31 16:41:18 +00:00
|
|
|
|
const currentQuestion = sortedQuestions.find((question) => question.id === currentQuestionId) ?? sortedQuestions[0];
|
2024-05-06 13:47:19 +00:00
|
|
|
|
|
|
|
|
|
const linearQuestionIndex =
|
2024-05-31 16:41:18 +00:00
|
|
|
|
currentQuestion && sortedQuestions.every(({ content }) => content.rule.parentId !== "root") // null when branching enabled
|
2024-05-06 13:47:19 +00:00
|
|
|
|
? sortedQuestions.indexOf(currentQuestion)
|
|
|
|
|
: null;
|
|
|
|
|
|
|
|
|
|
function getFirstQuestionId() {
|
|
|
|
|
if (sortedQuestions.length === 0) return null;
|
|
|
|
|
|
|
|
|
|
if (settings.cfg.haveRoot) {
|
|
|
|
|
const nextQuestion = sortedQuestions.find(
|
2024-05-31 16:41:18 +00:00
|
|
|
|
(question) => question.id === settings.cfg.haveRoot || question.content.id === settings.cfg.haveRoot
|
2024-05-06 13:47:19 +00:00
|
|
|
|
);
|
|
|
|
|
if (!nextQuestion) return null;
|
|
|
|
|
|
|
|
|
|
return nextQuestion.id;
|
2024-04-03 12:42:12 +00:00
|
|
|
|
}
|
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
return sortedQuestions[0].id;
|
|
|
|
|
}
|
2024-04-12 11:29:37 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
const nextQuestionIdPointsLogic = useCallback(() => {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
return sortedQuestions.find((question) => question.type === "result" && question.content.rule.parentId === "line");
|
2024-05-06 13:47:19 +00:00
|
|
|
|
}, [sortedQuestions]);
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
const nextQuestionIdMainLogic = useCallback(() => {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
const questionAnswer = answers.find(({ questionId }) => questionId === currentQuestion.id);
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
if (questionAnswer && !moment.isMoment(questionAnswer.answer)) {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
const userAnswers = Array.isArray(questionAnswer.answer) ? questionAnswer.answer : [questionAnswer.answer];
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
for (const branchingRule of currentQuestion.content.rule.main) {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
if (userAnswers.some((answer) => branchingRule.rules[0].answers.includes(answer))) {
|
2024-05-06 13:47:19 +00:00
|
|
|
|
return branchingRule.next;
|
2024-04-03 12:42:12 +00:00
|
|
|
|
}
|
2024-05-06 13:47:19 +00:00
|
|
|
|
}
|
|
|
|
|
}
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
if (!currentQuestion.required) {
|
|
|
|
|
const defaultNextQuestionId = currentQuestion.content.rule.default;
|
2024-05-31 16:41:18 +00:00
|
|
|
|
if (defaultNextQuestionId.length > 1 && defaultNextQuestionId !== " ") return defaultNextQuestionId;
|
2024-05-06 13:47:19 +00:00
|
|
|
|
//Вопросы типа страница, ползунок, своё поле для ввода и дата не могут иметь больше 1 ребёнка. Пользователь не может настроить там дефолт
|
|
|
|
|
//Кинуть на ребёнка надо даже если там нет дефолта
|
|
|
|
|
if (
|
|
|
|
|
["date", "page", "text", "number"].includes(currentQuestion.type) &&
|
|
|
|
|
currentQuestion.content.rule.children.length === 1
|
|
|
|
|
)
|
|
|
|
|
return currentQuestion.content.rule.children[0];
|
|
|
|
|
}
|
2024-04-16 19:20:57 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
//ничё не нашли, ищем резулт
|
|
|
|
|
return sortedQuestions.find((q) => {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
return q.type === "result" && q.content.rule.parentId === currentQuestion.content.id;
|
2024-05-06 13:47:19 +00:00
|
|
|
|
})?.id;
|
|
|
|
|
}, [answers, currentQuestion, sortedQuestions]);
|
|
|
|
|
|
|
|
|
|
const nextQuestionId = useMemo(() => {
|
|
|
|
|
if (settings.cfg.score) {
|
|
|
|
|
return nextQuestionIdPointsLogic();
|
|
|
|
|
}
|
|
|
|
|
return nextQuestionIdMainLogic();
|
|
|
|
|
}, [nextQuestionIdMainLogic, nextQuestionIdPointsLogic, settings.cfg.score]);
|
|
|
|
|
|
|
|
|
|
const prevQuestion =
|
|
|
|
|
linearQuestionIndex !== null
|
|
|
|
|
? sortedQuestions[linearQuestionIndex - 1]
|
|
|
|
|
: sortedQuestions.find(
|
|
|
|
|
(q) =>
|
2024-05-31 16:41:18 +00:00
|
|
|
|
q.id === currentQuestion?.content.rule.parentId || q.content.id === currentQuestion?.content.rule.parentId
|
2024-04-03 12:42:12 +00:00
|
|
|
|
);
|
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
const findResultPointsLogic = useCallback(() => {
|
|
|
|
|
const results = sortedQuestions.filter(
|
2024-05-31 16:41:18 +00:00
|
|
|
|
(e) => e.type === "result" && e.content.rule.minScore !== undefined && e.content.rule.minScore <= pointsSum
|
2024-05-06 13:47:19 +00:00
|
|
|
|
);
|
|
|
|
|
const numbers = results.map((e) =>
|
2024-05-31 16:41:18 +00:00
|
|
|
|
e.type === "result" && e.content.rule.minScore !== undefined ? e.content.rule.minScore : 0
|
2024-05-06 13:47:19 +00:00
|
|
|
|
);
|
|
|
|
|
const indexOfNext = Math.max(...numbers);
|
|
|
|
|
|
|
|
|
|
return results[numbers.indexOf(indexOfNext)];
|
|
|
|
|
}, [pointsSum, sortedQuestions]);
|
|
|
|
|
|
|
|
|
|
const nextQuestion = useMemo(() => {
|
|
|
|
|
let next;
|
|
|
|
|
if (settings.cfg.score) {
|
|
|
|
|
if (linearQuestionIndex !== null) {
|
|
|
|
|
next = sortedQuestions[linearQuestionIndex + 1];
|
2024-05-31 16:41:18 +00:00
|
|
|
|
if (next?.type === "result" || next == undefined) next = findResultPointsLogic();
|
2024-05-06 13:47:19 +00:00
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
if (linearQuestionIndex !== null) {
|
|
|
|
|
next =
|
|
|
|
|
sortedQuestions[linearQuestionIndex + 1] ??
|
2024-05-31 16:41:18 +00:00
|
|
|
|
sortedQuestions.find((question) => question.type === "result" && question.content.rule.parentId === "line");
|
2024-05-06 13:47:19 +00:00
|
|
|
|
} else {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
next = sortedQuestions.find((q) => q.id === nextQuestionId || q.content.id === nextQuestionId);
|
2024-05-06 13:47:19 +00:00
|
|
|
|
}
|
|
|
|
|
}
|
2024-04-16 19:20:57 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
return next;
|
2024-05-31 16:41:18 +00:00
|
|
|
|
}, [nextQuestionId, findResultPointsLogic, linearQuestionIndex, sortedQuestions, settings.cfg.score]);
|
2024-05-06 13:47:19 +00:00
|
|
|
|
|
|
|
|
|
const showResult = useCallback(() => {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
if (nextQuestion?.type !== "result") throw new Error("Current question is not result");
|
2024-05-06 13:47:19 +00:00
|
|
|
|
|
|
|
|
|
setCurrentQuestionId(nextQuestion.id);
|
2024-06-02 11:08:09 +00:00
|
|
|
|
if (
|
|
|
|
|
settings.cfg.showfc !== false &&
|
|
|
|
|
(settings.cfg.resultInfo.showResultForm === "after" || isResultQuestionEmpty(nextQuestion))
|
|
|
|
|
)
|
2024-05-06 13:47:19 +00:00
|
|
|
|
setCurrentQuizStep("contactform");
|
2024-06-02 11:08:09 +00:00
|
|
|
|
}, [nextQuestion, setCurrentQuizStep, settings.cfg.resultInfo.showResultForm, settings.cfg.showfc]);
|
2024-05-06 13:47:19 +00:00
|
|
|
|
|
|
|
|
|
const showResultAfterContactForm = useCallback(() => {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
if (currentQuestion?.type !== "result") throw new Error("Current question is not result");
|
2024-05-06 13:47:19 +00:00
|
|
|
|
if (isResultQuestionEmpty(currentQuestion)) {
|
|
|
|
|
enqueueSnackbar("Данные отправлены");
|
|
|
|
|
return;
|
|
|
|
|
}
|
2024-04-16 19:20:57 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
setCurrentQuizStep("question");
|
|
|
|
|
}, [currentQuestion, setCurrentQuizStep]);
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
const moveToPrevQuestion = useCallback(() => {
|
|
|
|
|
if (!prevQuestion) throw new Error("Previous question not found");
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
setCurrentQuestionId(prevQuestion.id);
|
|
|
|
|
}, [prevQuestion]);
|
|
|
|
|
|
|
|
|
|
const moveToNextQuestion = useCallback(() => {
|
|
|
|
|
if (!nextQuestion) throw new Error("Next question not found");
|
|
|
|
|
|
|
|
|
|
// Засчитываем переход с вопроса дальше
|
|
|
|
|
vkMetrics.questionPassed(currentQuestion.id);
|
|
|
|
|
yandexMetrics.questionPassed(currentQuestion.id);
|
|
|
|
|
|
2024-05-13 09:09:15 +00:00
|
|
|
|
if (nextQuestion.type === "result") return showResult();
|
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
setCurrentQuestionId(nextQuestion.id);
|
2024-06-02 10:23:54 +00:00
|
|
|
|
}, [currentQuestion.id, nextQuestion, showResult, vkMetrics, yandexMetrics]);
|
2024-05-06 13:47:19 +00:00
|
|
|
|
|
|
|
|
|
const setQuestion = useCallback(
|
|
|
|
|
(questionId: string) => {
|
|
|
|
|
const question = sortedQuestions.find((q) => q.id === questionId);
|
|
|
|
|
if (!question) return;
|
|
|
|
|
|
|
|
|
|
setCurrentQuestionId(question.id);
|
|
|
|
|
},
|
|
|
|
|
[sortedQuestions]
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
const isPreviousButtonEnabled = Boolean(prevQuestion);
|
|
|
|
|
|
|
|
|
|
const isNextButtonEnabled = useMemo(() => {
|
2024-05-31 16:41:18 +00:00
|
|
|
|
const hasAnswer = answers.some(({ questionId }) => questionId === currentQuestion.id);
|
2024-05-06 13:47:19 +00:00
|
|
|
|
|
2024-05-31 16:41:18 +00:00
|
|
|
|
if ("required" in currentQuestion.content && currentQuestion.content.required) {
|
2024-05-06 13:47:19 +00:00
|
|
|
|
return hasAnswer;
|
|
|
|
|
}
|
2024-04-03 12:42:12 +00:00
|
|
|
|
|
2024-05-06 13:47:19 +00:00
|
|
|
|
return Boolean(nextQuestion);
|
|
|
|
|
}, [answers, currentQuestion, nextQuestion]);
|
|
|
|
|
|
|
|
|
|
useDebugValue({
|
|
|
|
|
linearQuestionIndex,
|
|
|
|
|
currentQuestion: currentQuestion,
|
|
|
|
|
prevQuestion: prevQuestion,
|
|
|
|
|
nextQuestion: nextQuestion,
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
currentQuestion,
|
2024-05-31 16:41:18 +00:00
|
|
|
|
currentQuestionStepNumber: linearQuestionIndex === null ? null : linearQuestionIndex + 1,
|
2024-05-06 13:47:19 +00:00
|
|
|
|
isNextButtonEnabled,
|
|
|
|
|
isPreviousButtonEnabled,
|
|
|
|
|
moveToPrevQuestion,
|
|
|
|
|
moveToNextQuestion,
|
|
|
|
|
showResultAfterContactForm,
|
|
|
|
|
setQuestion,
|
|
|
|
|
};
|
|
|
|
|
}
|