zustand
This commit is contained in:
parent
03c1cec48f
commit
6ef147fa4a
@ -2,7 +2,7 @@ import useSWR from "swr";
|
|||||||
import { getQuizData } from "./quizRelase";
|
import { getQuizData } from "./quizRelase";
|
||||||
|
|
||||||
export function useQuizData(quizId: string, preview: boolean = false) {
|
export function useQuizData(quizId: string, preview: boolean = false) {
|
||||||
return useSWR(preview ? null : ["quizData", quizId], (params) => getQuizData({ quizId: params[1] }), {
|
return useSWR(preview ? null : ["quizData", quizId], (params) => getQuizData(params[1]), {
|
||||||
revalidateOnFocus: false,
|
revalidateOnFocus: false,
|
||||||
revalidateOnReconnect: false,
|
revalidateOnReconnect: false,
|
||||||
shouldRetryOnError: false,
|
shouldRetryOnError: false,
|
||||||
|
@ -71,8 +71,8 @@ export const publicationMakeRequest = ({ url, body }: PublicationMakeRequestPara
|
|||||||
method: "POST",
|
method: "POST",
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
let page = 0;
|
|
||||||
export async function getData(quizId: string): Promise<{
|
export async function getData({ quizId, page, status }: { quizId: string; page?: number; status?: string }): Promise<{
|
||||||
data: GetQuizDataResponse | null;
|
data: GetQuizDataResponse | null;
|
||||||
isRecentlyCompleted: boolean;
|
isRecentlyCompleted: boolean;
|
||||||
error?: AxiosError;
|
error?: AxiosError;
|
||||||
@ -92,18 +92,16 @@ export async function getData(quizId: string): Promise<{
|
|||||||
},
|
},
|
||||||
data: {
|
data: {
|
||||||
quiz_id: quizId,
|
quiz_id: quizId,
|
||||||
limit: 1,
|
limit: status === "ai" ? 1 : 100,
|
||||||
page,
|
page: status === "ai" ? page : 0,
|
||||||
need_config: page === 0,
|
need_config: true,
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
console.log(data);
|
|
||||||
if (data.items.length) page++;
|
|
||||||
const sessions = JSON.parse(localStorage.getItem("sessions") || "{}");
|
const sessions = JSON.parse(localStorage.getItem("sessions") || "{}");
|
||||||
|
|
||||||
//Тут ещё проверка на антифрод без парса конфига. Нам не интересно время если не нужно запрещать проходить чаще чем в сутки
|
//Тут ещё проверка на антифрод без парса конфига. Нам не интересно время если не нужно запрещать проходить чаще чем в сутки
|
||||||
if (!page && typeof sessions[quizId] === "number" && data.settings.cfg.includes('antifraud":true')) {
|
if (typeof sessions[quizId] === "number" && data.settings.cfg.includes('antifraud":true')) {
|
||||||
// unix время. Если меньше суток прошло - выводить ошибку, иначе пустить дальше
|
// unix время. Если меньше суток прошло - выводить ошибку, иначе пустить дальше
|
||||||
if (Date.now() - sessions[quizId] < 86400000) {
|
if (Date.now() - sessions[quizId] < 86400000) {
|
||||||
return { data, isRecentlyCompleted: true };
|
return { data, isRecentlyCompleted: true };
|
||||||
@ -120,15 +118,32 @@ export async function getData(quizId: string): Promise<{
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getQuizData({
|
export async function getQuizData(quizId: string) {
|
||||||
quizId,
|
if (!quizId) throw new Error("No quiz id");
|
||||||
status,
|
|
||||||
type = "",
|
const response = await getData({ quizId });
|
||||||
}: {
|
const quizDataResponse = response.data;
|
||||||
quizId: string;
|
|
||||||
status?: string;
|
if (response.error) {
|
||||||
type?: string;
|
throw response.error;
|
||||||
}): Promise<QuizSettings> {
|
}
|
||||||
|
if (!quizDataResponse) {
|
||||||
|
throw new Error("Quiz not found");
|
||||||
|
}
|
||||||
|
|
||||||
|
const quizSettings = replaceSpacesToEmptyLines(parseQuizData(quizDataResponse));
|
||||||
|
|
||||||
|
const res = JSON.parse(
|
||||||
|
JSON.stringify({ data: quizSettings })
|
||||||
|
.replaceAll(/\\" \\"/g, '""')
|
||||||
|
.replaceAll(/" "/g, '""')
|
||||||
|
).data as QuizSettings;
|
||||||
|
res.recentlyCompleted = response.isRecentlyCompleted;
|
||||||
|
return res;
|
||||||
|
}
|
||||||
|
|
||||||
|
let page = 1;
|
||||||
|
export async function getQuizDataAI(quizId: string) {
|
||||||
let maxRetries = 50;
|
let maxRetries = 50;
|
||||||
if (!quizId) throw new Error("No quiz id");
|
if (!quizId) throw new Error("No quiz id");
|
||||||
|
|
||||||
@ -139,13 +154,13 @@ export async function getQuizData({
|
|||||||
let resultRetryCount = 0;
|
let resultRetryCount = 0;
|
||||||
while (resultRetryCount < maxRetries) {
|
while (resultRetryCount < maxRetries) {
|
||||||
try {
|
try {
|
||||||
const response = await getData(quizId);
|
const response = await getData({ quizId, page, status: "ai" });
|
||||||
console.log("ф-я аналитики", response);
|
console.log("ф-я аналитики", response);
|
||||||
|
|
||||||
if (response.error) throw response.error;
|
if (response.error) throw response.error;
|
||||||
if (!response.data) throw new Error("Quiz not found");
|
if (!response.data) throw new Error("Quiz not found");
|
||||||
|
|
||||||
const hasAiResult = response.data.items.some((item) => item.typ === "result" && status === "ai");
|
const hasAiResult = response.data.items.some((item) => item.typ === "result");
|
||||||
|
|
||||||
if (hasAiResult) {
|
if (hasAiResult) {
|
||||||
page++; // Увеличиваем страницу
|
page++; // Увеличиваем страницу
|
||||||
@ -160,7 +175,7 @@ export async function getQuizData({
|
|||||||
lastError = error as Error;
|
lastError = error as Error;
|
||||||
resultRetryCount++;
|
resultRetryCount++;
|
||||||
if (resultRetryCount >= maxRetries) break;
|
if (resultRetryCount >= maxRetries) break;
|
||||||
await new Promise((resolve) => setTimeout(resolve, 1000 * resultRetryCount));
|
await new Promise((resolve) => setTimeout(resolve, 1500 * resultRetryCount));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -174,7 +189,7 @@ export async function getQuizData({
|
|||||||
while (isEmpty && emptyRetryCount < maxRetries) {
|
while (isEmpty && emptyRetryCount < maxRetries) {
|
||||||
try {
|
try {
|
||||||
await new Promise((resolve) => setTimeout(resolve, 1000));
|
await new Promise((resolve) => setTimeout(resolve, 1000));
|
||||||
const response = await getData(quizId);
|
const response = await getData({ quizId, page, status: "ai" });
|
||||||
|
|
||||||
if (response.error) throw response.error;
|
if (response.error) throw response.error;
|
||||||
if (!response.data) throw new Error("Quiz not found");
|
if (!response.data) throw new Error("Quiz not found");
|
||||||
@ -205,6 +220,7 @@ export async function getQuizData({
|
|||||||
).data as QuizSettings;
|
).data as QuizSettings;
|
||||||
|
|
||||||
res.recentlyCompleted = responseData.isRecentlyCompleted;
|
res.recentlyCompleted = responseData.isRecentlyCompleted;
|
||||||
|
|
||||||
return res;
|
return res;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -216,6 +232,8 @@ type SendAnswerProps = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export function sendAnswer({ questionId, body, qid, preview = false }: SendAnswerProps) {
|
export function sendAnswer({ questionId, body, qid, preview = false }: SendAnswerProps) {
|
||||||
|
console.log("qid");
|
||||||
|
console.log(qid);
|
||||||
if (preview) return;
|
if (preview) return;
|
||||||
const formData = new FormData();
|
const formData = new FormData();
|
||||||
|
|
||||||
|
@ -1,30 +1,32 @@
|
|||||||
import { useQuizSettings } from "@/contexts/QuizDataContext";
|
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import { getQuizData } from "./quizRelase";
|
import { getQuizDataAI } from "./quizRelase";
|
||||||
|
import { addQuestion, useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
export const useQuizGetNext = () => {
|
export const useQuizGetNext = () => {
|
||||||
const { addQuestion, quizId, settings } = useQuizSettings();
|
const { quizId, settings } = useQuizStore();
|
||||||
const [isLoading, setIsLoading] = useState(false);
|
const [isLoading, setIsLoading] = useState(false);
|
||||||
const [error, setError] = useState<Error | null>(null);
|
const [error, setError] = useState<Error | null>(null);
|
||||||
const [currentPage, setCurrentPage] = useState(1);
|
const [currentPage, setCurrentPage] = useState(1);
|
||||||
|
|
||||||
const loadMoreQuestions = async () => {
|
const loadMoreQuestions = async () => {
|
||||||
setIsLoading(true);
|
if (settings.status === "ai") {
|
||||||
setError(null);
|
setIsLoading(true);
|
||||||
|
setError(null);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const data = await getQuizData({ quizId, type: settings.cfg.type || "", status: settings.status });
|
const data = await getQuizDataAI(quizId);
|
||||||
const newQuestion = data?.questions[0];
|
const newQuestion = data?.questions[0];
|
||||||
if (newQuestion) {
|
if (newQuestion) {
|
||||||
newQuestion.page = currentPage;
|
newQuestion.page = currentPage;
|
||||||
addQuestion(newQuestion);
|
addQuestion(newQuestion);
|
||||||
setCurrentPage((old) => old++);
|
setCurrentPage((old) => old++);
|
||||||
return newQuestion;
|
return newQuestion;
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
setError(err as Error);
|
||||||
|
} finally {
|
||||||
|
setIsLoading(false);
|
||||||
}
|
}
|
||||||
} catch (err) {
|
|
||||||
setError(err as Error);
|
|
||||||
} finally {
|
|
||||||
setIsLoading(false);
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -3,7 +3,6 @@ import { QuizViewContext, createQuizViewStore } from "@/stores/quizView";
|
|||||||
import LoadingSkeleton from "@/ui_kit/LoadingSkeleton";
|
import LoadingSkeleton from "@/ui_kit/LoadingSkeleton";
|
||||||
import { useVkMetricsGoals } from "@/utils/hooks/metrics/useVkMetricsGoals";
|
import { useVkMetricsGoals } from "@/utils/hooks/metrics/useVkMetricsGoals";
|
||||||
import { useYandexMetricsGoals } from "@/utils/hooks/metrics/useYandexMetricsGoals";
|
import { useYandexMetricsGoals } from "@/utils/hooks/metrics/useYandexMetricsGoals";
|
||||||
import { QuizSettingsContext, QuizSettingsContextValue } from "@contexts/QuizDataContext";
|
|
||||||
import { RootContainerWidthContext } from "@contexts/RootContainerWidthContext";
|
import { RootContainerWidthContext } from "@contexts/RootContainerWidthContext";
|
||||||
import type { QuizSettings } from "@model/settingsData";
|
import type { QuizSettings } from "@model/settingsData";
|
||||||
import { Box, CssBaseline, ScopedCssBaseline, ThemeProvider } from "@mui/material";
|
import { Box, CssBaseline, ScopedCssBaseline, ThemeProvider } from "@mui/material";
|
||||||
@ -21,8 +20,7 @@ import ViewPublicationPage from "./ViewPublicationPage/ViewPublicationPage";
|
|||||||
import { HelmetProvider } from "react-helmet-async";
|
import { HelmetProvider } from "react-helmet-async";
|
||||||
|
|
||||||
import "moment/dist/locale/ru";
|
import "moment/dist/locale/ru";
|
||||||
import { AnyTypedQuizQuestion } from "..";
|
import { useQuizStore, setQuizData, addquizid } from "@/stores/useQuizStore";
|
||||||
import { produce } from "immer";
|
|
||||||
moment.locale("ru");
|
moment.locale("ru");
|
||||||
const localeText = ruRU.components.MuiLocalizationProvider.defaultProps.localeText;
|
const localeText = ruRU.components.MuiLocalizationProvider.defaultProps.localeText;
|
||||||
|
|
||||||
@ -58,14 +56,19 @@ function QuizAnswererInner({
|
|||||||
const { data, error, isLoading } = useQuizData(quizId, preview);
|
const { data, error, isLoading } = useQuizData(quizId, preview);
|
||||||
const vkMetrics = useVkMetricsGoals(quizSettings?.settings.cfg.vkMetricsNumber);
|
const vkMetrics = useVkMetricsGoals(quizSettings?.settings.cfg.vkMetricsNumber);
|
||||||
const yandexMetrics = useYandexMetricsGoals(quizSettings?.settings.cfg.yandexMetricsNumber);
|
const yandexMetrics = useYandexMetricsGoals(quizSettings?.settings.cfg.yandexMetricsNumber);
|
||||||
const [localQuizSettings, setLocalQuizSettings] = useState(quizSettings);
|
const r = useQuizStore();
|
||||||
|
const { settings, questions } = useQuizStore();
|
||||||
|
|
||||||
// Добавляем эффект для обновления localQuizSettings при получении новых данных
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (data && !quizSettings) {
|
addquizid(quizId);
|
||||||
setLocalQuizSettings(data);
|
}, []);
|
||||||
}
|
|
||||||
}, [data, quizSettings]);
|
useEffect(() => {
|
||||||
|
console.log(settings);
|
||||||
|
console.log(questions);
|
||||||
|
console.log("r");
|
||||||
|
console.log(r);
|
||||||
|
}, [questions, settings]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
@ -74,6 +77,18 @@ function QuizAnswererInner({
|
|||||||
}, 4000);
|
}, 4000);
|
||||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||||
}, []);
|
}, []);
|
||||||
|
useEffect(() => {
|
||||||
|
console.log("got data");
|
||||||
|
console.log(quizSettings);
|
||||||
|
console.log(data);
|
||||||
|
const quiz = quizSettings || data;
|
||||||
|
console.log("quiz");
|
||||||
|
console.log(quiz);
|
||||||
|
if (quiz !== undefined) {
|
||||||
|
console.log("is not undefined");
|
||||||
|
setQuizData(quiz);
|
||||||
|
}
|
||||||
|
}, [quizSettings, data]);
|
||||||
|
|
||||||
useLayoutEffect(() => {
|
useLayoutEffect(() => {
|
||||||
if (rootContainerRef.current) setRootContainerWidth(rootContainerRef.current.clientWidth);
|
if (rootContainerRef.current) setRootContainerWidth(rootContainerRef.current.clientWidth);
|
||||||
@ -92,36 +107,15 @@ function QuizAnswererInner({
|
|||||||
};
|
};
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const finalQuizSettings = quizSettings || localQuizSettings;
|
console.log("settings");
|
||||||
|
console.log(settings);
|
||||||
const contextValue = useMemo(
|
|
||||||
() => ({
|
|
||||||
...(finalQuizSettings as QuizSettings),
|
|
||||||
quizId,
|
|
||||||
preview,
|
|
||||||
changeFaviconAndTitle,
|
|
||||||
addQuestion: (newQuestion: AnyTypedQuizQuestion) => {
|
|
||||||
setLocalQuizSettings((prev) => {
|
|
||||||
if (!prev) return prev;
|
|
||||||
|
|
||||||
return produce(prev, (draft) => {
|
|
||||||
draft.questions.push(newQuestion);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
[quizId, preview, changeFaviconAndTitle, finalQuizSettings]
|
|
||||||
);
|
|
||||||
|
|
||||||
if (isLoading) return <LoadingSkeleton />;
|
if (isLoading) return <LoadingSkeleton />;
|
||||||
if (error) return <ApologyPage error={error} />;
|
if (error) return <ApologyPage error={error} />;
|
||||||
|
|
||||||
if (!finalQuizSettings) return <ApologyPage error={new Error("quiz data is null")} />;
|
if (Object.keys(settings).length == 0) return <ApologyPage error={new Error("quiz data is null")} />;
|
||||||
if (!finalQuizSettings.questions || finalQuizSettings.questions.length === 0)
|
if (questions.length === 0) return <ApologyPage error={new Error("No questions found")} />;
|
||||||
return <ApologyPage error={new Error("No questions found")} />;
|
|
||||||
|
|
||||||
if (finalQuizSettings.questions.length === 1 && finalQuizSettings?.settings.cfg.noStartPage)
|
if (questions.length === 1 && settings.cfg.noStartPage) return <ApologyPage error={new Error("quiz is empty")} />;
|
||||||
return <ApologyPage error={new Error("quiz is empty")} />;
|
|
||||||
if (!quizId) return <ApologyPage error={new Error("no quiz id")} />;
|
if (!quizId) return <ApologyPage error={new Error("no quiz id")} />;
|
||||||
|
|
||||||
const quizContainer = (
|
const quizContainer = (
|
||||||
@ -146,21 +140,19 @@ function QuizAnswererInner({
|
|||||||
return (
|
return (
|
||||||
<QuizViewContext.Provider value={quizViewStore}>
|
<QuizViewContext.Provider value={quizViewStore}>
|
||||||
<RootContainerWidthContext.Provider value={rootContainerWidth}>
|
<RootContainerWidthContext.Provider value={rootContainerWidth}>
|
||||||
<QuizSettingsContext.Provider value={contextValue}>
|
{disableGlobalCss ? (
|
||||||
{disableGlobalCss ? (
|
<ScopedCssBaseline
|
||||||
<ScopedCssBaseline
|
sx={{
|
||||||
sx={{
|
height: "100%",
|
||||||
height: "100%",
|
width: "100%",
|
||||||
width: "100%",
|
backgroundColor: "transparent",
|
||||||
backgroundColor: "transparent",
|
}}
|
||||||
}}
|
>
|
||||||
>
|
{quizContainer}
|
||||||
{quizContainer}
|
</ScopedCssBaseline>
|
||||||
</ScopedCssBaseline>
|
) : (
|
||||||
) : (
|
<CssBaseline>{quizContainer}</CssBaseline>
|
||||||
<CssBaseline>{quizContainer}</CssBaseline>
|
)}
|
||||||
)}
|
|
||||||
</QuizSettingsContext.Provider>
|
|
||||||
</RootContainerWidthContext.Provider>
|
</RootContainerWidthContext.Provider>
|
||||||
</QuizViewContext.Provider>
|
</QuizViewContext.Provider>
|
||||||
);
|
);
|
||||||
|
@ -8,7 +8,6 @@ import { Inputs } from "@/components/ViewPublicationPage/ContactForm/Inputs/Inpu
|
|||||||
import { ContactTextBlock } from "./ContactTextBlock";
|
import { ContactTextBlock } from "./ContactTextBlock";
|
||||||
|
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
|
|
||||||
import { sendFC, SendFCParams } from "@api/quizRelase";
|
import { sendFC, SendFCParams } from "@api/quizRelase";
|
||||||
|
|
||||||
@ -25,6 +24,7 @@ import type { FormContactFieldData, FormContactFieldName } from "@model/settings
|
|||||||
import type { QuizQuestionResult } from "@model/questionTypes/result";
|
import type { QuizQuestionResult } from "@model/questionTypes/result";
|
||||||
import type { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
|
import type { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
|
||||||
import { isProduction } from "@/utils/defineDomain";
|
import { isProduction } from "@/utils/defineDomain";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
currentQuestion: AnyTypedQuizQuestion;
|
currentQuestion: AnyTypedQuizQuestion;
|
||||||
@ -35,7 +35,7 @@ const isDisableEmail = window.location.pathname.includes("/377c7570-1bee-4320-ac
|
|||||||
|
|
||||||
export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
|
export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const { settings, questions, quizId, show_badge, preview } = useQuizSettings();
|
const { settings, questions, quizId, show_badge, preview } = useQuizStore();
|
||||||
|
|
||||||
const [ready, setReady] = useState(false);
|
const [ready, setReady] = useState(false);
|
||||||
const [name, setName] = useState("");
|
const [name, setName] = useState("");
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
import { Box, InputAdornment, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
|
import { Box, InputAdornment, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext.ts";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext.ts";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext.ts";
|
|
||||||
import { useIMask, IMask } from "react-imask";
|
import { useIMask, IMask } from "react-imask";
|
||||||
import { quizThemes } from "@utils/themes/Publication/themePublication.ts";
|
import { quizThemes } from "@utils/themes/Publication/themePublication.ts";
|
||||||
import { ChangeEvent, FC, HTMLInputTypeAttribute, useEffect, useState } from "react";
|
import { ChangeEvent, FC, HTMLInputTypeAttribute, useEffect, useState } from "react";
|
||||||
import { CountrySelector } from "@/components/ViewPublicationPage/ContactForm/CustomInput/CountrySelector/CountrySelector.tsx";
|
import { CountrySelector } from "@/components/ViewPublicationPage/ContactForm/CustomInput/CountrySelector/CountrySelector.tsx";
|
||||||
import { phoneMasksByCountry } from "@utils/phoneMasksByCountry.tsx";
|
import { phoneMasksByCountry } from "@utils/phoneMasksByCountry.tsx";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type InputProps = {
|
type InputProps = {
|
||||||
title: string;
|
title: string;
|
||||||
@ -37,7 +37,7 @@ function phoneChange(e: ChangeEvent<HTMLInputElement>, mask: string) {
|
|||||||
export const CustomInput = ({ title, desc, Icon, onChange, onChangePhone, isPhone, type, value }: InputProps) => {
|
export const CustomInput = ({ title, desc, Icon, onChange, onChangePhone, isPhone, type, value }: InputProps) => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const isMobile = useRootContainerSize() < 600;
|
const isMobile = useRootContainerSize() < 600;
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const [mask, setMask] = useState(phoneMasksByCountry["RU"][1]);
|
const [mask, setMask] = useState(phoneMasksByCountry["RU"][1]);
|
||||||
// const { ref } = useIMask({ mask });
|
// const { ref } = useIMask({ mask });
|
||||||
|
|
||||||
|
@ -1,4 +1,3 @@
|
|||||||
import { useQuizSettings } from "@contexts/QuizDataContext.ts";
|
|
||||||
import NameIcon from "@icons/ContactFormIcon/NameIcon.tsx";
|
import NameIcon from "@icons/ContactFormIcon/NameIcon.tsx";
|
||||||
import EmailIcon from "@icons/ContactFormIcon/EmailIcon.tsx";
|
import EmailIcon from "@icons/ContactFormIcon/EmailIcon.tsx";
|
||||||
import TextIcon from "@icons/ContactFormIcon/TextIcon.tsx";
|
import TextIcon from "@icons/ContactFormIcon/TextIcon.tsx";
|
||||||
@ -7,6 +6,7 @@ import { Dispatch, SetStateAction } from "react";
|
|||||||
import { CustomInput } from "@/components/ViewPublicationPage/ContactForm/CustomInput/CustomInput.tsx";
|
import { CustomInput } from "@/components/ViewPublicationPage/ContactForm/CustomInput/CustomInput.tsx";
|
||||||
import PhoneIcon from "@icons/ContactFormIcon/PhoneIcon.tsx";
|
import PhoneIcon from "@icons/ContactFormIcon/PhoneIcon.tsx";
|
||||||
import PhoneInput from "react-phone-number-input";
|
import PhoneInput from "react-phone-number-input";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type InputsProps = {
|
type InputsProps = {
|
||||||
name: string;
|
name: string;
|
||||||
@ -37,7 +37,7 @@ export const Inputs = ({
|
|||||||
setAdress,
|
setAdress,
|
||||||
crutch,
|
crutch,
|
||||||
}: InputsProps) => {
|
}: InputsProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const FC = settings.cfg.formContact.fields;
|
const FC = settings.cfg.formContact.fields;
|
||||||
|
|
||||||
if (!FC) return null;
|
if (!FC) return null;
|
||||||
|
@ -1,9 +1,8 @@
|
|||||||
import { ReactNode } from "react";
|
import { ReactNode } from "react";
|
||||||
import { Box, Typography, useTheme } from "@mui/material";
|
import { Box, Typography, useTheme } from "@mui/material";
|
||||||
|
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
|
|
||||||
import Stepper from "@ui_kit/Stepper";
|
import Stepper from "@ui_kit/Stepper";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type FooterProps = {
|
type FooterProps = {
|
||||||
stepNumber: number | null;
|
stepNumber: number | null;
|
||||||
@ -13,7 +12,7 @@ type FooterProps = {
|
|||||||
|
|
||||||
export const Footer = ({ stepNumber, nextButton, prevButton }: FooterProps) => {
|
export const Footer = ({ stepNumber, nextButton, prevButton }: FooterProps) => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const { questions, settings, cnt } = useQuizSettings();
|
const { questions, settings } = useQuizStore();
|
||||||
const questionsAmount = questions.filter(({ type }) => type !== "result").length;
|
const questionsAmount = questions.filter(({ type }) => type !== "result").length;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@ -41,7 +40,7 @@ export const Footer = ({ stepNumber, nextButton, prevButton }: FooterProps) => {
|
|||||||
{stepNumber !== null && settings.status !== "ai" && (
|
{stepNumber !== null && settings.status !== "ai" && (
|
||||||
<Box sx={{ flexGrow: 1 }}>
|
<Box sx={{ flexGrow: 1 }}>
|
||||||
<Typography sx={{ color: theme.palette.text.primary }}>
|
<Typography sx={{ color: theme.palette.text.primary }}>
|
||||||
Вопрос {stepNumber} из {cnt}
|
Вопрос {stepNumber} из {questionsAmount}
|
||||||
</Typography>
|
</Typography>
|
||||||
<Stepper
|
<Stepper
|
||||||
activeStep={stepNumber}
|
activeStep={stepNumber}
|
||||||
|
@ -1,13 +1,13 @@
|
|||||||
import { IncorrectAnswer } from "@/assets/icons/IncorrectAnswer";
|
import { IncorrectAnswer } from "@/assets/icons/IncorrectAnswer";
|
||||||
import { CorrectAnswer } from "@/assets/icons/CorrectAnswer";
|
import { CorrectAnswer } from "@/assets/icons/CorrectAnswer";
|
||||||
import { Box, Typography, useTheme } from "@mui/material";
|
import { Box, Typography, useTheme } from "@mui/material";
|
||||||
import { useQuizSettings } from "@/contexts/QuizDataContext";
|
|
||||||
import { useQuizViewStore } from "@/stores/quizView";
|
import { useQuizViewStore } from "@/stores/quizView";
|
||||||
import { AnyTypedQuizQuestion, QuizQuestionVariant } from "@/index";
|
import { AnyTypedQuizQuestion, QuizQuestionVariant } from "@/index";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
export const PointSystemResultList = () => {
|
export const PointSystemResultList = () => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const { questions } = useQuizSettings();
|
const { questions } = useQuizStore();
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
|
|
||||||
const questionsWothoutResult = questions.filter<QuizQuestionVariant>(
|
const questionsWothoutResult = questions.filter<QuizQuestionVariant>(
|
||||||
|
@ -15,7 +15,6 @@ import { Varimg } from "./questions/Varimg";
|
|||||||
|
|
||||||
import type { RealTypedQuizQuestion } from "../../model/questionTypes/shared";
|
import type { RealTypedQuizQuestion } from "../../model/questionTypes/shared";
|
||||||
|
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { NameplateLogoFQ } from "@icons/NameplateLogoFQ";
|
import { NameplateLogoFQ } from "@icons/NameplateLogoFQ";
|
||||||
import { NameplateLogoFQDark } from "@icons/NameplateLogoFQDark";
|
import { NameplateLogoFQDark } from "@icons/NameplateLogoFQDark";
|
||||||
import { notReachable } from "@utils/notReachable";
|
import { notReachable } from "@utils/notReachable";
|
||||||
@ -24,6 +23,7 @@ import { quizThemes } from "@utils/themes/Publication/themePublication";
|
|||||||
import { DESIGN_LIST } from "@/utils/designList";
|
import { DESIGN_LIST } from "@/utils/designList";
|
||||||
import { type ReactNode } from "react";
|
import { type ReactNode } from "react";
|
||||||
import { isProduction } from "@/utils/defineDomain";
|
import { isProduction } from "@/utils/defineDomain";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
currentQuestion: RealTypedQuizQuestion;
|
currentQuestion: RealTypedQuizQuestion;
|
||||||
@ -41,7 +41,7 @@ export const Question = ({
|
|||||||
questionSelect,
|
questionSelect,
|
||||||
}: Props) => {
|
}: Props) => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const { settings, show_badge, quizId } = useQuizSettings();
|
const { settings, show_badge, quizId } = useQuizStore();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { useQuizSettings } from "@/contexts/QuizDataContext";
|
|
||||||
import { AnyTypedQuizQuestion } from "@/model/questionTypes/shared";
|
import { AnyTypedQuizQuestion } from "@/model/questionTypes/shared";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import { Box, FormControl, MenuItem, Select as MuiSelect, useTheme } from "@mui/material";
|
import { Box, FormControl, MenuItem, Select as MuiSelect, useTheme } from "@mui/material";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
@ -9,7 +9,7 @@ interface Props {
|
|||||||
|
|
||||||
export default function QuestionSelect({ selectedQuestion, setQuestion }: Props) {
|
export default function QuestionSelect({ selectedQuestion, setQuestion }: Props) {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const { questions, preview } = useQuizSettings();
|
const { questions, preview } = useQuizStore();
|
||||||
|
|
||||||
if (!preview) return null;
|
if (!preview) return null;
|
||||||
|
|
||||||
|
@ -4,7 +4,6 @@ import { Box, Button, Link, Typography, useTheme } from "@mui/material";
|
|||||||
import { useQuizViewStore } from "@/stores/quizView";
|
import { useQuizViewStore } from "@/stores/quizView";
|
||||||
|
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
|
|
||||||
import { useVkMetricsGoals } from "@/utils/hooks/metrics/useVkMetricsGoals";
|
import { useVkMetricsGoals } from "@/utils/hooks/metrics/useVkMetricsGoals";
|
||||||
import { useYandexMetricsGoals } from "@/utils/hooks/metrics/useYandexMetricsGoals";
|
import { useYandexMetricsGoals } from "@/utils/hooks/metrics/useYandexMetricsGoals";
|
||||||
@ -19,6 +18,7 @@ import { PointSystemResultList } from "./PointSystemResultList";
|
|||||||
import { enqueueSnackbar } from "notistack";
|
import { enqueueSnackbar } from "notistack";
|
||||||
import { sendFC, sendResult } from "@/api/quizRelase";
|
import { sendFC, sendResult } from "@/api/quizRelase";
|
||||||
import { isProduction } from "@/utils/defineDomain";
|
import { isProduction } from "@/utils/defineDomain";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type ResultFormProps = {
|
type ResultFormProps = {
|
||||||
resultQuestion: QuizQuestionResult;
|
resultQuestion: QuizQuestionResult;
|
||||||
@ -28,7 +28,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
|
|||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const isMobile = useRootContainerSize() < 650;
|
const isMobile = useRootContainerSize() < 650;
|
||||||
const isTablet = useRootContainerSize() < 1000;
|
const isTablet = useRootContainerSize() < 1000;
|
||||||
const { settings, show_badge, quizId, questions, preview } = useQuizSettings();
|
const { settings, show_badge, quizId, questions, preview } = useQuizStore();
|
||||||
const setCurrentQuizStep = useQuizViewStore((state) => state.setCurrentQuizStep);
|
const setCurrentQuizStep = useQuizViewStore((state) => state.setCurrentQuizStep);
|
||||||
//Список засчитанных баллов для балловых квизов
|
//Список засчитанных баллов для балловых квизов
|
||||||
const pointsSum = useQuizViewStore((state) => state.pointsSum);
|
const pointsSum = useQuizViewStore((state) => state.pointsSum);
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { Box } from "@mui/material";
|
import { Box } from "@mui/material";
|
||||||
|
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
import { notReachable } from "@utils/notReachable";
|
import { notReachable } from "@utils/notReachable";
|
||||||
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
||||||
@ -22,7 +22,7 @@ type LayoutProps = Omit<StartPageDesktopProps, "startpageType">;
|
|||||||
const StandartLayout = ({ alignType, quizHeaderBlock, quizMainBlock, backgroundBlock }: LayoutProps) => {
|
const StandartLayout = ({ alignType, quizHeaderBlock, quizMainBlock, backgroundBlock }: LayoutProps) => {
|
||||||
const size = useRootContainerSize();
|
const size = useRootContainerSize();
|
||||||
const isTablet = size >= 700 && size < 1100;
|
const isTablet = size >= 700 && size < 1100;
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
@ -170,7 +170,7 @@ const ExpandedLayout = ({ alignType, quizHeaderBlock, quizMainBlock, backgroundB
|
|||||||
|
|
||||||
const CenteredLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: LayoutProps) => {
|
const CenteredLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: LayoutProps) => {
|
||||||
const isTablet = useRootContainerSize() < 1100;
|
const isTablet = useRootContainerSize() < 1100;
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import { Box } from "@mui/material";
|
import { Box } from "@mui/material";
|
||||||
|
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
import { notReachable } from "@utils/notReachable";
|
import { notReachable } from "@utils/notReachable";
|
||||||
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
||||||
@ -18,7 +18,7 @@ type StartPageMobileProps = {
|
|||||||
type MobileLayoutProps = Omit<StartPageMobileProps, "startpageType">;
|
type MobileLayoutProps = Omit<StartPageMobileProps, "startpageType">;
|
||||||
|
|
||||||
const StandartMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: MobileLayoutProps) => {
|
const StandartMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: MobileLayoutProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
@ -163,7 +163,7 @@ const ExpandedMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock
|
|||||||
);
|
);
|
||||||
|
|
||||||
const CenteredMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: MobileLayoutProps) => {
|
const CenteredMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: MobileLayoutProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
|
@ -2,7 +2,7 @@ import { Box, Button, ButtonBase, Link, Paper, Typography, useTheme } from "@mui
|
|||||||
|
|
||||||
import { QuizPreviewLayoutByType } from "./QuizPreviewLayoutByType";
|
import { QuizPreviewLayoutByType } from "./QuizPreviewLayoutByType";
|
||||||
|
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
|
|
||||||
import { useUADevice } from "@utils/hooks/useUADevice";
|
import { useUADevice } from "@utils/hooks/useUADevice";
|
||||||
@ -20,7 +20,7 @@ import { isProduction } from "@/utils/defineDomain";
|
|||||||
|
|
||||||
export const StartPageViewPublication = () => {
|
export const StartPageViewPublication = () => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const { settings, show_badge, quizId, questions } = useQuizSettings();
|
const { settings, show_badge, quizId, questions } = useQuizStore();
|
||||||
const { isMobileDevice } = useUADevice();
|
const { isMobileDevice } = useUADevice();
|
||||||
const setCurrentQuizStep = useQuizViewStore((state) => state.setCurrentQuizStep);
|
const setCurrentQuizStep = useQuizViewStore((state) => state.setCurrentQuizStep);
|
||||||
|
|
||||||
|
@ -3,7 +3,6 @@ import { extractImageLinksFromQuestion } from "@/utils/extractImageLinks";
|
|||||||
import { useVKMetrics } from "@/utils/hooks/metrics/useVKMetrics";
|
import { useVKMetrics } from "@/utils/hooks/metrics/useVKMetrics";
|
||||||
import { useYandexMetrics } from "@/utils/hooks/metrics/useYandexMetrics";
|
import { useYandexMetrics } from "@/utils/hooks/metrics/useYandexMetrics";
|
||||||
import { sendQuestionAnswer } from "@/utils/sendQuestionAnswer";
|
import { sendQuestionAnswer } from "@/utils/sendQuestionAnswer";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { ThemeProvider, Typography } from "@mui/material";
|
import { ThemeProvider, Typography } from "@mui/material";
|
||||||
import { useQuizViewStore } from "@stores/quizView";
|
import { useQuizViewStore } from "@stores/quizView";
|
||||||
import { useQuestionFlowControl } from "@utils/hooks/useQuestionFlowControl";
|
import { useQuestionFlowControl } from "@utils/hooks/useQuestionFlowControl";
|
||||||
@ -19,9 +18,10 @@ 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 unscreen from "@/ui_kit/unscreen";
|
import unscreen from "@/ui_kit/unscreen";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
export default function ViewPublicationPage() {
|
export default function ViewPublicationPage() {
|
||||||
const { settings, recentlyCompleted, quizId, preview, changeFaviconAndTitle, questions } = useQuizSettings();
|
const { settings, recentlyCompleted, quizId, preview, changeFaviconAndTitle } = useQuizStore();
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
const ownVariants = useQuizViewStore((state) => state.ownVariants);
|
const ownVariants = useQuizViewStore((state) => state.ownVariants);
|
||||||
let currentQuizStep = useQuizViewStore((state) => state.currentQuizStep);
|
let currentQuizStep = useQuizViewStore((state) => state.currentQuizStep);
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { useQuizViewStore } from "@/stores/quizView";
|
import { useQuizViewStore } from "@/stores/quizView";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import CalendarIcon from "@icons/CalendarIcon";
|
import CalendarIcon from "@icons/CalendarIcon";
|
||||||
import type { QuizQuestionDate } from "@model/questionTypes/date";
|
import type { QuizQuestionDate } from "@model/questionTypes/date";
|
||||||
import { Box, Typography, useTheme } from "@mui/material";
|
import { Box, Typography, useTheme } from "@mui/material";
|
||||||
@ -13,7 +13,7 @@ type DateProps = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export default ({ currentQuestion }: DateProps) => {
|
export default ({ currentQuestion }: DateProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
const { updateAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer } = useQuizViewStore((state) => state);
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
@ -1,4 +1,3 @@
|
|||||||
import { useQuizSettings } from "@/contexts/QuizDataContext";
|
|
||||||
import { useQuizViewStore } from "@/stores/quizView";
|
import { useQuizViewStore } from "@/stores/quizView";
|
||||||
import type { QuizQuestionDate } from "@model/questionTypes/date";
|
import type { QuizQuestionDate } from "@model/questionTypes/date";
|
||||||
import { DateCalendar } from "@mui/x-date-pickers";
|
import { DateCalendar } from "@mui/x-date-pickers";
|
||||||
@ -7,6 +6,7 @@ import type { Moment } from "moment";
|
|||||||
import moment from "moment";
|
import moment from "moment";
|
||||||
import { Box, Paper, TextField, useTheme } from "@mui/material";
|
import { Box, Paper, TextField, useTheme } from "@mui/material";
|
||||||
import { useRootContainerSize } from "@/contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@/contexts/RootContainerWidthContext";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type DateProps = {
|
type DateProps = {
|
||||||
currentQuestion: QuizQuestionDate;
|
currentQuestion: QuizQuestionDate;
|
||||||
@ -16,7 +16,7 @@ export default ({ currentQuestion }: DateProps) => {
|
|||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const today = moment();
|
const today = moment();
|
||||||
const isMobile = useRootContainerSize() < 690;
|
const isMobile = useRootContainerSize() < 690;
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const { updateAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer } = useQuizViewStore((state) => state);
|
||||||
|
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import type { QuestionVariant } from "@/model/questionTypes/shared";
|
import type { QuestionVariant } from "@/model/questionTypes/shared";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import {
|
import {
|
||||||
Box,
|
Box,
|
||||||
Checkbox,
|
Checkbox,
|
||||||
@ -104,7 +104,7 @@ export const EmojiVariant = ({
|
|||||||
questionLargeCheck,
|
questionLargeCheck,
|
||||||
ownPlaceholder,
|
ownPlaceholder,
|
||||||
}: EmojiVariantProps) => {
|
}: EmojiVariantProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
@ -3,7 +3,6 @@ import { Box, ButtonBase, Skeleton, Typography, useTheme } from "@mui/material";
|
|||||||
import { enqueueSnackbar } from "notistack";
|
import { enqueueSnackbar } from "notistack";
|
||||||
|
|
||||||
import { sendAnswer, sendFile } from "@api/quizRelase";
|
import { sendAnswer, sendFile } from "@api/quizRelase";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
import { useQuizViewStore } from "@stores/quizView";
|
import { useQuizViewStore } from "@stores/quizView";
|
||||||
|
|
||||||
@ -18,6 +17,7 @@ import UploadIcon from "@icons/UploadIcon";
|
|||||||
|
|
||||||
import type { QuizQuestionFile } from "@model/questionTypes/file";
|
import type { QuizQuestionFile } from "@model/questionTypes/file";
|
||||||
import type { ModalWarningType } from "./index";
|
import type { ModalWarningType } from "./index";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type UploadFileProps = {
|
type UploadFileProps = {
|
||||||
currentQuestion: QuizQuestionFile;
|
currentQuestion: QuizQuestionFile;
|
||||||
@ -27,7 +27,7 @@ type UploadFileProps = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const UploadFile = ({ currentQuestion, setModalWarningType, isSending, setIsSending }: UploadFileProps) => {
|
export const UploadFile = ({ currentQuestion, setModalWarningType, isSending, setIsSending }: UploadFileProps) => {
|
||||||
const { quizId, preview } = useQuizSettings();
|
const { quizId, preview } = useQuizStore();
|
||||||
const [isDropzoneHighlighted, setIsDropzoneHighlighted] = useState<boolean>(false);
|
const [isDropzoneHighlighted, setIsDropzoneHighlighted] = useState<boolean>(false);
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
|
@ -1,12 +1,12 @@
|
|||||||
import { Box, IconButton, Typography, useTheme } from "@mui/material";
|
import { Box, IconButton, Typography, useTheme } from "@mui/material";
|
||||||
|
|
||||||
import { sendAnswer } from "@api/quizRelase";
|
import { sendAnswer } from "@api/quizRelase";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { useQuizViewStore } from "@stores/quizView";
|
import { useQuizViewStore } from "@stores/quizView";
|
||||||
|
|
||||||
import CloseBold from "@icons/CloseBold";
|
import CloseBold from "@icons/CloseBold";
|
||||||
|
|
||||||
import type { QuizQuestionFile } from "@model/questionTypes/file";
|
import type { QuizQuestionFile } from "@model/questionTypes/file";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type UploadedFileProps = {
|
type UploadedFileProps = {
|
||||||
currentQuestion: QuizQuestionFile;
|
currentQuestion: QuizQuestionFile;
|
||||||
@ -14,7 +14,7 @@ type UploadedFileProps = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const UploadedFile = ({ currentQuestion, setIsSending }: UploadedFileProps) => {
|
export const UploadedFile = ({ currentQuestion, setIsSending }: UploadedFileProps) => {
|
||||||
const { quizId, preview } = useQuizSettings();
|
const { quizId, preview } = useQuizStore();
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
const { updateAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer } = useQuizViewStore((state) => state);
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
@ -1,6 +1,5 @@
|
|||||||
import { CheckboxIcon } from "@/assets/icons/Checkbox";
|
import { CheckboxIcon } from "@/assets/icons/Checkbox";
|
||||||
import type { QuestionVariant, QuestionVariantWithEditedImages } from "@/model/questionTypes/shared";
|
import type { QuestionVariant, QuestionVariantWithEditedImages } from "@/model/questionTypes/shared";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { Box, Checkbox, FormControlLabel, Input, Radio, TextareaAutosize, Typography, useTheme } from "@mui/material";
|
import { Box, Checkbox, FormControlLabel, Input, Radio, TextareaAutosize, Typography, useTheme } from "@mui/material";
|
||||||
import { useQuizViewStore } from "@stores/quizView";
|
import { useQuizViewStore } from "@stores/quizView";
|
||||||
import RadioCheck from "@ui_kit/RadioCheck";
|
import RadioCheck from "@ui_kit/RadioCheck";
|
||||||
@ -8,6 +7,7 @@ import RadioIcon from "@ui_kit/RadioIcon";
|
|||||||
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
||||||
import { useMemo, type MouseEvent, useRef, useEffect } from "react";
|
import { useMemo, type MouseEvent, useRef, useEffect } from "react";
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type ImagesProps = {
|
type ImagesProps = {
|
||||||
questionId: string;
|
questionId: string;
|
||||||
@ -92,7 +92,7 @@ export const ImageVariant = ({
|
|||||||
questionLargeCheck,
|
questionLargeCheck,
|
||||||
ownPlaceholder,
|
ownPlaceholder,
|
||||||
}: ImagesProps) => {
|
}: ImagesProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const { deleteAnswer, updateAnswer } = useQuizViewStore((state) => state);
|
const { deleteAnswer, updateAnswer } = useQuizViewStore((state) => state);
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import type { QuizQuestionNumber } from "@model/questionTypes/number";
|
import type { QuizQuestionNumber } from "@model/questionTypes/number";
|
||||||
import { Box, Typography, useTheme } from "@mui/material";
|
import { Box, Typography, useTheme } from "@mui/material";
|
||||||
import { useQuizViewStore } from "@stores/quizView";
|
import { useQuizViewStore } from "@stores/quizView";
|
||||||
@ -20,7 +20,7 @@ export const Number = ({ currentQuestion }: NumberProps) => {
|
|||||||
const [reversedInputValue, setReversedInputValue] = useState<string>("0");
|
const [reversedInputValue, setReversedInputValue] = useState<string>("0");
|
||||||
const [reversedMinRange, setReversedMinRange] = useState<string>("0");
|
const [reversedMinRange, setReversedMinRange] = useState<string>("0");
|
||||||
const [reversedMaxRange, setReversedMaxRange] = useState<string>("100000000000");
|
const [reversedMaxRange, setReversedMaxRange] = useState<string>("100000000000");
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const { updateAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer } = useQuizViewStore((state) => state);
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { Select as SelectComponent } from "@/components/ViewPublicationPage/tools/Select";
|
import { Select as SelectComponent } from "@/components/ViewPublicationPage/tools/Select";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import type { QuizQuestionSelect } from "@model/questionTypes/select";
|
import type { QuizQuestionSelect } from "@model/questionTypes/select";
|
||||||
import { Box, Typography, useTheme } from "@mui/material";
|
import { Box, Typography, useTheme } from "@mui/material";
|
||||||
import { useQuizViewStore } from "@stores/quizView";
|
import { useQuizViewStore } from "@stores/quizView";
|
||||||
@ -10,7 +10,7 @@ type SelectProps = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const Select = ({ currentQuestion }: SelectProps) => {
|
export const Select = ({ currentQuestion }: SelectProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
@ -3,13 +3,13 @@ import { Box, Typography, useTheme } from "@mui/material";
|
|||||||
import CustomTextField from "@ui_kit/CustomTextField";
|
import CustomTextField from "@ui_kit/CustomTextField";
|
||||||
|
|
||||||
import { Answer, useQuizViewStore } from "@stores/quizView";
|
import { Answer, useQuizViewStore } from "@stores/quizView";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
|
|
||||||
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
||||||
|
|
||||||
import { useMemo, type ChangeEvent } from "react";
|
import { useMemo, type ChangeEvent } from "react";
|
||||||
import type { QuizQuestionText } from "@model/questionTypes/text";
|
import type { QuizQuestionText } from "@model/questionTypes/text";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
interface TextNormalProps {
|
interface TextNormalProps {
|
||||||
currentQuestion: QuizQuestionText;
|
currentQuestion: QuizQuestionText;
|
||||||
@ -18,7 +18,7 @@ interface TextNormalProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const TextNormal = ({ currentQuestion, answer }: TextNormalProps) => {
|
export const TextNormal = ({ currentQuestion, answer }: TextNormalProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const { updateAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer } = useQuizViewStore((state) => state);
|
||||||
const isMobile = useRootContainerSize() < 650;
|
const isMobile = useRootContainerSize() < 650;
|
||||||
const isTablet = useRootContainerSize() < 850;
|
const isTablet = useRootContainerSize() < 850;
|
||||||
|
@ -1,13 +1,13 @@
|
|||||||
import { Box, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
|
import { Box, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
|
||||||
|
|
||||||
import { Answer, useQuizViewStore } from "@stores/quizView";
|
import { Answer, useQuizViewStore } from "@stores/quizView";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
|
|
||||||
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
||||||
|
|
||||||
import type { ChangeEvent, FC } from "react";
|
import type { ChangeEvent, FC } from "react";
|
||||||
import type { QuizQuestionText } from "@model/questionTypes/text";
|
import type { QuizQuestionText } from "@model/questionTypes/text";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
const TextField = MuiTextField as unknown as FC<TextFieldProps>; // temporary fix ts(2590)
|
const TextField = MuiTextField as unknown as FC<TextFieldProps>; // temporary fix ts(2590)
|
||||||
|
|
||||||
@ -45,7 +45,7 @@ interface TextSpecialProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const TextSpecial = ({ currentQuestion, answer, stepNumber }: TextSpecialProps) => {
|
export const TextSpecial = ({ currentQuestion, answer, stepNumber }: TextSpecialProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const { updateAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer } = useQuizViewStore((state) => state);
|
||||||
const isHorizontal = ORIENTATION[Number(stepNumber) - 1].horizontal;
|
const isHorizontal = ORIENTATION[Number(stepNumber) - 1].horizontal;
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
@ -1,13 +1,13 @@
|
|||||||
import { Box, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
|
import { Box, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
|
||||||
|
|
||||||
import { Answer, useQuizViewStore } from "@stores/quizView";
|
import { Answer, useQuizViewStore } from "@stores/quizView";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
|
||||||
|
|
||||||
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
||||||
|
|
||||||
import type { ChangeEvent, FC } from "react";
|
import type { ChangeEvent, FC } from "react";
|
||||||
import type { QuizQuestionText } from "@model/questionTypes/text";
|
import type { QuizQuestionText } from "@model/questionTypes/text";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
const TextField = MuiTextField as unknown as FC<TextFieldProps>; // temporary fix ts(2590)
|
const TextField = MuiTextField as unknown as FC<TextFieldProps>; // temporary fix ts(2590)
|
||||||
|
|
||||||
@ -18,7 +18,7 @@ interface TextSpecialProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const TextSpecialHorisontal = ({ currentQuestion, answer, stepNumber }: TextSpecialProps) => {
|
export const TextSpecialHorisontal = ({ currentQuestion, answer, stepNumber }: TextSpecialProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const { updateAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer } = useQuizViewStore((state) => state);
|
||||||
const isHorizontal = true;
|
const isHorizontal = true;
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
|
||||||
import { useQuizViewStore } from "@stores/quizView";
|
import { useQuizViewStore } from "@stores/quizView";
|
||||||
import { TextNormal } from "./TextNormal";
|
import { TextNormal } from "./TextNormal";
|
||||||
import { TextSpecial } from "./TextSpecial";
|
import { TextSpecial } from "./TextSpecial";
|
||||||
import { TextSpecialHorisontal } from "./TextSpecialHorisontal";
|
import { TextSpecialHorisontal } from "./TextSpecialHorisontal";
|
||||||
|
|
||||||
import type { QuizQuestionText } from "@model/questionTypes/text";
|
import type { QuizQuestionText } from "@model/questionTypes/text";
|
||||||
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
type TextProps = {
|
type TextProps = {
|
||||||
currentQuestion: QuizQuestionText;
|
currentQuestion: QuizQuestionText;
|
||||||
@ -14,7 +14,7 @@ type TextProps = {
|
|||||||
const pathOnly = window.location.pathname;
|
const pathOnly = window.location.pathname;
|
||||||
|
|
||||||
export const Text = ({ currentQuestion, stepNumber }: TextProps) => {
|
export const Text = ({ currentQuestion, stepNumber }: TextProps) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const answers = useQuizViewStore((state) => state.answers);
|
const answers = useQuizViewStore((state) => state.answers);
|
||||||
const { answer } = answers.find(({ questionId }) => questionId === currentQuestion.id) ?? {};
|
const { answer } = answers.find(({ questionId }) => questionId === currentQuestion.id) ?? {};
|
||||||
|
|
||||||
|
@ -1,5 +1,4 @@
|
|||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import { CheckboxIcon } from "@icons/Checkbox";
|
|
||||||
import type { QuestionVariant } from "@model/questionTypes/shared";
|
import type { QuestionVariant } from "@model/questionTypes/shared";
|
||||||
import {
|
import {
|
||||||
Checkbox,
|
Checkbox,
|
||||||
@ -99,7 +98,7 @@ export const VariantItem = ({
|
|||||||
questionLargeCheck: boolean;
|
questionLargeCheck: boolean;
|
||||||
ownPlaceholder: string;
|
ownPlaceholder: string;
|
||||||
}) => {
|
}) => {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
|
||||||
|
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import type { QuestionVariant, QuestionVariantWithEditedImages } from "@/model/questionTypes/shared";
|
import type { QuestionVariant, QuestionVariantWithEditedImages } from "@/model/questionTypes/shared";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import {
|
import {
|
||||||
FormControlLabel,
|
FormControlLabel,
|
||||||
TextareaAutosize,
|
TextareaAutosize,
|
||||||
@ -104,7 +104,7 @@ export const VarimgVariant = ({
|
|||||||
}: VarimgVariantProps) => {
|
}: VarimgVariantProps) => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
|
const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
|
||||||
|
|
||||||
const sendVariant = async (event: MouseEvent<HTMLLabelElement>) => {
|
const sendVariant = async (event: MouseEvent<HTMLLabelElement>) => {
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
import { Button } from "@mui/material";
|
import { Button } from "@mui/material";
|
||||||
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
||||||
|
|
||||||
@ -8,7 +8,7 @@ interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export default function NextButton({ isNextButtonEnabled, moveToNextQuestion }: Props) {
|
export default function NextButton({ isNextButtonEnabled, moveToNextQuestion }: Props) {
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Button
|
<Button
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { Button, useTheme } from "@mui/material";
|
import { Button, useTheme } from "@mui/material";
|
||||||
import { useRootContainerSize } from "../../../contexts/RootContainerWidthContext";
|
import { useRootContainerSize } from "../../../contexts/RootContainerWidthContext";
|
||||||
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
import { quizThemes } from "@utils/themes/Publication/themePublication";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
isPreviousButtonEnabled: boolean;
|
isPreviousButtonEnabled: boolean;
|
||||||
@ -10,7 +10,7 @@ interface Props {
|
|||||||
|
|
||||||
export default function PrevButton({ isPreviousButtonEnabled, moveToPrevQuestion }: Props) {
|
export default function PrevButton({ isPreviousButtonEnabled, moveToPrevQuestion }: Props) {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const { settings } = useQuizSettings();
|
const { settings } = useQuizStore();
|
||||||
const isMobileMini = useRootContainerSize() < 382;
|
const isMobileMini = useRootContainerSize() < 382;
|
||||||
return (
|
return (
|
||||||
<Button
|
<Button
|
||||||
|
@ -1,18 +0,0 @@
|
|||||||
import { QuizSettings } from "@model/settingsData";
|
|
||||||
import { createContext, useContext, useMemo } from "react";
|
|
||||||
import { AnyTypedQuizQuestion } from "..";
|
|
||||||
|
|
||||||
export type QuizSettingsContextValue = QuizSettings & {
|
|
||||||
quizId: string;
|
|
||||||
preview: boolean;
|
|
||||||
changeFaviconAndTitle: boolean;
|
|
||||||
addQuestion: (newQuestion: AnyTypedQuizQuestion) => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const QuizSettingsContext = createContext<QuizSettingsContextValue | null>(null);
|
|
||||||
|
|
||||||
export const useQuizSettings = () => {
|
|
||||||
const quizSettings = useContext(QuizSettingsContext);
|
|
||||||
if (quizSettings === null) throw new Error("QuizSettings context is null");
|
|
||||||
return quizSettings;
|
|
||||||
};
|
|
39
lib/stores/useQuizStore.ts
Normal file
39
lib/stores/useQuizStore.ts
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
import { create } from "zustand";
|
||||||
|
import { produce } from "immer";
|
||||||
|
import { QuizSettings, QuizSettingsConfig } from "@model/settingsData";
|
||||||
|
import { AnyTypedQuizQuestion } from "..";
|
||||||
|
|
||||||
|
export type QuizStore = QuizSettings & {
|
||||||
|
quizId: string;
|
||||||
|
preview: boolean;
|
||||||
|
changeFaviconAndTitle: boolean;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const useQuizStore = create<QuizStore>(() => ({
|
||||||
|
settings: {} as QuizSettingsConfig,
|
||||||
|
questions: [],
|
||||||
|
quizId: "",
|
||||||
|
preview: false,
|
||||||
|
changeFaviconAndTitle: false,
|
||||||
|
cnt: 0,
|
||||||
|
recentlyCompleted: false,
|
||||||
|
show_badge: false,
|
||||||
|
}));
|
||||||
|
|
||||||
|
export const setQuizData = (data: QuizSettings) => {
|
||||||
|
console.log("zusstand");
|
||||||
|
console.log(data);
|
||||||
|
useQuizStore.setState((state: QuizStore) => ({ ...state, ...data }));
|
||||||
|
};
|
||||||
|
export const addQuestion = (newQuestion: AnyTypedQuizQuestion) =>
|
||||||
|
useQuizStore.setState(
|
||||||
|
produce((state: QuizStore) => {
|
||||||
|
state.questions.push(newQuestion);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
export const addquizid = (id: string) =>
|
||||||
|
useQuizStore.setState(
|
||||||
|
produce((state: QuizStore) => {
|
||||||
|
state.quizId = id;
|
||||||
|
})
|
||||||
|
);
|
@ -3,7 +3,7 @@ import { enqueueSnackbar } from "notistack";
|
|||||||
import moment from "moment";
|
import moment from "moment";
|
||||||
|
|
||||||
import { isResultQuestionEmpty } from "@/components/ViewPublicationPage/tools/checkEmptyData";
|
import { isResultQuestionEmpty } from "@/components/ViewPublicationPage/tools/checkEmptyData";
|
||||||
import { useQuizSettings } from "@contexts/QuizDataContext";
|
import { useQuizStore } from "@/stores/useQuizStore";
|
||||||
|
|
||||||
import { useQuizViewStore } from "@stores/quizView";
|
import { useQuizViewStore } from "@stores/quizView";
|
||||||
|
|
||||||
@ -18,7 +18,7 @@ let isgetting = false;
|
|||||||
export function useQuestionFlowControl() {
|
export function useQuestionFlowControl() {
|
||||||
//Получаем инфо о квизе и список вопросов.
|
//Получаем инфо о квизе и список вопросов.
|
||||||
const { loadMoreQuestions } = useQuizGetNext();
|
const { loadMoreQuestions } = useQuizGetNext();
|
||||||
const { settings, questions, quizId, cnt } = useQuizSettings();
|
const { settings, questions, quizId, cnt } = useQuizStore();
|
||||||
|
|
||||||
console.log(questions);
|
console.log(questions);
|
||||||
|
|
||||||
@ -211,6 +211,7 @@ export function useQuestionFlowControl() {
|
|||||||
//рычаг управления из визуала в эту функцию
|
//рычаг управления из визуала в эту функцию
|
||||||
const moveToNextQuestion = useCallback(async () => {
|
const moveToNextQuestion = useCallback(async () => {
|
||||||
// Если есть следующий вопрос в уже загруженных - используем его
|
// Если есть следующий вопрос в уже загруженных - используем его
|
||||||
|
|
||||||
if (nextQuestion) {
|
if (nextQuestion) {
|
||||||
vkMetrics.questionPassed(currentQuestion.id);
|
vkMetrics.questionPassed(currentQuestion.id);
|
||||||
yandexMetrics.questionPassed(currentQuestion.id);
|
yandexMetrics.questionPassed(currentQuestion.id);
|
||||||
|
Loading…
Reference in New Issue
Block a user