zustand

lib/api/hooks.ts

@@ -2,7 +2,7 @@ import useSWR from "swr";
 import { getQuizData } from "./quizRelase";
 
 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,
     revalidateOnReconnect: false,
     shouldRetryOnError: false,

lib/api/quizRelase.ts

@@ -71,8 +71,8 @@ export const publicationMakeRequest = ({ url, body }: PublicationMakeRequestPara
     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;
   isRecentlyCompleted: boolean;
   error?: AxiosError;
@@ -92,18 +92,16 @@ export async function getData(quizId: string): Promise<{
         },
         data: {
           quiz_id: quizId,
-          limit: 1,
-          page,
-          need_config: page === 0,
+          limit: status === "ai" ? 1 : 100,
+          page: status === "ai" ? page : 0,
+          need_config: true,
         },
       }
     );
-    console.log(data);
-    if (data.items.length) page++;
     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 время. Если меньше суток прошло - выводить ошибку, иначе пустить дальше
       if (Date.now() - sessions[quizId] < 86400000) {
         return { data, isRecentlyCompleted: true };
@@ -120,15 +118,32 @@ export async function getData(quizId: string): Promise<{
   }
 }
 
-export async function getQuizData({
-  quizId,
-  status,
-  type = "",
-}: {
-  quizId: string;
-  status?: string;
-  type?: string;
-}): Promise<QuizSettings> {
+export async function getQuizData(quizId: string) {
+  if (!quizId) throw new Error("No quiz id");
+
+  const response = await getData({ quizId });
+  const quizDataResponse = response.data;
+
+  if (response.error) {
+    throw response.error;
+  }
+  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;
   if (!quizId) throw new Error("No quiz id");
 
@@ -139,13 +154,13 @@ export async function getQuizData({
   let resultRetryCount = 0;
   while (resultRetryCount < maxRetries) {
     try {
-      const response = await getData(quizId);
+      const response = await getData({ quizId, page, status: "ai" });
       console.log("ф-я аналитики", response);
 
       if (response.error) throw response.error;
       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) {
         page++; // Увеличиваем страницу
@@ -160,7 +175,7 @@ export async function getQuizData({
       lastError = error as Error;
       resultRetryCount++;
       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) {
     try {
       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.data) throw new Error("Quiz not found");
@@ -205,6 +220,7 @@ export async function getQuizData({
   ).data as QuizSettings;
 
   res.recentlyCompleted = responseData.isRecentlyCompleted;
+
   return res;
 }
 
@@ -216,6 +232,8 @@ type SendAnswerProps = {
 };
 
 export function sendAnswer({ questionId, body, qid, preview = false }: SendAnswerProps) {
+  console.log("qid");
+  console.log(qid);
   if (preview) return;
   const formData = new FormData();
 

lib/api/useQuizGetNext.ts

@@ -1,30 +1,32 @@
-import { useQuizSettings } from "@/contexts/QuizDataContext";
 import { useState } from "react";
-import { getQuizData } from "./quizRelase";
+import { getQuizDataAI } from "./quizRelase";
+import { addQuestion, useQuizStore } from "@/stores/useQuizStore";
 
 export const useQuizGetNext = () => {
-  const { addQuestion, quizId, settings } = useQuizSettings();
+  const { quizId, settings } = useQuizStore();
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState<Error | null>(null);
   const [currentPage, setCurrentPage] = useState(1);
 
   const loadMoreQuestions = async () => {
-    setIsLoading(true);
-    setError(null);
+    if (settings.status === "ai") {
+      setIsLoading(true);
+      setError(null);
 
-    try {
-      const data = await getQuizData({ quizId, type: settings.cfg.type || "", status: settings.status });
-      const newQuestion = data?.questions[0];
-      if (newQuestion) {
-        newQuestion.page = currentPage;
-        addQuestion(newQuestion);
-        setCurrentPage((old) => old++);
-        return newQuestion;
+      try {
+        const data = await getQuizDataAI(quizId);
+        const newQuestion = data?.questions[0];
+        if (newQuestion) {
+          newQuestion.page = currentPage;
+          addQuestion(newQuestion);
+          setCurrentPage((old) => old++);
+          return newQuestion;
+        }
+      } catch (err) {
+        setError(err as Error);
+      } finally {
+        setIsLoading(false);
       }
-    } catch (err) {
-      setError(err as Error);
-    } finally {
-      setIsLoading(false);
     }
   };
 

lib/components/QuizAnswerer.tsx

@@ -3,7 +3,6 @@ import { QuizViewContext, createQuizViewStore } from "@/stores/quizView";
 import LoadingSkeleton from "@/ui_kit/LoadingSkeleton";
 import { useVkMetricsGoals } from "@/utils/hooks/metrics/useVkMetricsGoals";
 import { useYandexMetricsGoals } from "@/utils/hooks/metrics/useYandexMetricsGoals";
-import { QuizSettingsContext, QuizSettingsContextValue } from "@contexts/QuizDataContext";
 import { RootContainerWidthContext } from "@contexts/RootContainerWidthContext";
 import type { QuizSettings } from "@model/settingsData";
 import { Box, CssBaseline, ScopedCssBaseline, ThemeProvider } from "@mui/material";
@@ -21,8 +20,7 @@ import ViewPublicationPage from "./ViewPublicationPage/ViewPublicationPage";
 import { HelmetProvider } from "react-helmet-async";
 
 import "moment/dist/locale/ru";
-import { AnyTypedQuizQuestion } from "..";
-import { produce } from "immer";
+import { useQuizStore, setQuizData, addquizid } from "@/stores/useQuizStore";
 moment.locale("ru");
 const localeText = ruRU.components.MuiLocalizationProvider.defaultProps.localeText;
 
@@ -58,14 +56,19 @@ function QuizAnswererInner({
   const { data, error, isLoading } = useQuizData(quizId, preview);
   const vkMetrics = useVkMetricsGoals(quizSettings?.settings.cfg.vkMetricsNumber);
   const yandexMetrics = useYandexMetricsGoals(quizSettings?.settings.cfg.yandexMetricsNumber);
-  const [localQuizSettings, setLocalQuizSettings] = useState(quizSettings);
+  const r = useQuizStore();
+  const { settings, questions } = useQuizStore();
 
-  // Добавляем эффект для обновления localQuizSettings при получении новых данных
   useEffect(() => {
-    if (data && !quizSettings) {
-      setLocalQuizSettings(data);
-    }
-  }, [data, quizSettings]);
+    addquizid(quizId);
+  }, []);
+
+  useEffect(() => {
+    console.log(settings);
+    console.log(questions);
+    console.log("r");
+    console.log(r);
+  }, [questions, settings]);
 
   useEffect(() => {
     setTimeout(() => {
@@ -74,6 +77,18 @@ function QuizAnswererInner({
     }, 4000);
     // 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(() => {
     if (rootContainerRef.current) setRootContainerWidth(rootContainerRef.current.clientWidth);
@@ -92,36 +107,15 @@ function QuizAnswererInner({
     };
   }, []);
 
-  const finalQuizSettings = quizSettings || localQuizSettings;
-
-  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]
-  );
-
+  console.log("settings");
+  console.log(settings);
   if (isLoading) return <LoadingSkeleton />;
   if (error) return <ApologyPage error={error} />;
 
-  if (!finalQuizSettings) return <ApologyPage error={new Error("quiz data is null")} />;
-  if (!finalQuizSettings.questions || finalQuizSettings.questions.length === 0)
-    return <ApologyPage error={new Error("No questions found")} />;
+  if (Object.keys(settings).length == 0) return <ApologyPage error={new Error("quiz data is null")} />;
+  if (questions.length === 0) return <ApologyPage error={new Error("No questions found")} />;
 
-  if (finalQuizSettings.questions.length === 1 && finalQuizSettings?.settings.cfg.noStartPage)
-    return <ApologyPage error={new Error("quiz is empty")} />;
+  if (questions.length === 1 && settings.cfg.noStartPage) return <ApologyPage error={new Error("quiz is empty")} />;
   if (!quizId) return <ApologyPage error={new Error("no quiz id")} />;
 
   const quizContainer = (
@@ -146,21 +140,19 @@ function QuizAnswererInner({
   return (
     <QuizViewContext.Provider value={quizViewStore}>
       <RootContainerWidthContext.Provider value={rootContainerWidth}>
-        <QuizSettingsContext.Provider value={contextValue}>
-          {disableGlobalCss ? (
-            <ScopedCssBaseline
-              sx={{
-                height: "100%",
-                width: "100%",
-                backgroundColor: "transparent",
-              }}
-            >
-              {quizContainer}
-            </ScopedCssBaseline>
-          ) : (
-            <CssBaseline>{quizContainer}</CssBaseline>
-          )}
-        </QuizSettingsContext.Provider>
+        {disableGlobalCss ? (
+          <ScopedCssBaseline
+            sx={{
+              height: "100%",
+              width: "100%",
+              backgroundColor: "transparent",
+            }}
+          >
+            {quizContainer}
+          </ScopedCssBaseline>
+        ) : (
+          <CssBaseline>{quizContainer}</CssBaseline>
+        )}
       </RootContainerWidthContext.Provider>
     </QuizViewContext.Provider>
   );

lib/components/ViewPublicationPage/ContactForm/ContactForm.tsx

@@ -8,7 +8,6 @@ import { Inputs } from "@/components/ViewPublicationPage/ContactForm/Inputs/Inpu
 import { ContactTextBlock } from "./ContactTextBlock";
 
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
-import { useQuizSettings } from "@contexts/QuizDataContext";
 
 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 { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
 import { isProduction } from "@/utils/defineDomain";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type Props = {
   currentQuestion: AnyTypedQuizQuestion;
@@ -35,7 +35,7 @@ const isDisableEmail = window.location.pathname.includes("/377c7570-1bee-4320-ac
 
 export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
   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 [name, setName] = useState("");

lib/components/ViewPublicationPage/ContactForm/CustomInput/CustomInput.tsx

@@ -1,11 +1,11 @@
 import { Box, InputAdornment, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext.ts";
-import { useQuizSettings } from "@contexts/QuizDataContext.ts";
 import { useIMask, IMask } from "react-imask";
 import { quizThemes } from "@utils/themes/Publication/themePublication.ts";
 import { ChangeEvent, FC, HTMLInputTypeAttribute, useEffect, useState } from "react";
 import { CountrySelector } from "@/components/ViewPublicationPage/ContactForm/CustomInput/CountrySelector/CountrySelector.tsx";
 import { phoneMasksByCountry } from "@utils/phoneMasksByCountry.tsx";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type InputProps = {
   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) => {
   const theme = useTheme();
   const isMobile = useRootContainerSize() < 600;
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const [mask, setMask] = useState(phoneMasksByCountry["RU"][1]);
   // const { ref } = useIMask({ mask });
 

lib/components/ViewPublicationPage/ContactForm/Inputs/Inputs.tsx

@@ -1,4 +1,3 @@
-import { useQuizSettings } from "@contexts/QuizDataContext.ts";
 import NameIcon from "@icons/ContactFormIcon/NameIcon.tsx";
 import EmailIcon from "@icons/ContactFormIcon/EmailIcon.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 PhoneIcon from "@icons/ContactFormIcon/PhoneIcon.tsx";
 import PhoneInput from "react-phone-number-input";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type InputsProps = {
   name: string;
@@ -37,7 +37,7 @@ export const Inputs = ({
   setAdress,
   crutch,
 }: InputsProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const FC = settings.cfg.formContact.fields;
 
   if (!FC) return null;

lib/components/ViewPublicationPage/Footer.tsx

@@ -1,9 +1,8 @@
 import { ReactNode } from "react";
 import { Box, Typography, useTheme } from "@mui/material";
 
-import { useQuizSettings } from "@contexts/QuizDataContext";
-
 import Stepper from "@ui_kit/Stepper";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type FooterProps = {
   stepNumber: number | null;
@@ -13,7 +12,7 @@ type FooterProps = {
 
 export const Footer = ({ stepNumber, nextButton, prevButton }: FooterProps) => {
   const theme = useTheme();
-  const { questions, settings, cnt } = useQuizSettings();
+  const { questions, settings } = useQuizStore();
   const questionsAmount = questions.filter(({ type }) => type !== "result").length;
 
   return (
@@ -41,7 +40,7 @@ export const Footer = ({ stepNumber, nextButton, prevButton }: FooterProps) => {
         {stepNumber !== null && settings.status !== "ai" && (
           <Box sx={{ flexGrow: 1 }}>
             <Typography sx={{ color: theme.palette.text.primary }}>
-              Вопрос {stepNumber} из {cnt}
+              Вопрос {stepNumber} из {questionsAmount}
             </Typography>
             <Stepper
               activeStep={stepNumber}

lib/components/ViewPublicationPage/PointSystemResultList.tsx

@@ -1,13 +1,13 @@
 import { IncorrectAnswer } from "@/assets/icons/IncorrectAnswer";
 import { CorrectAnswer } from "@/assets/icons/CorrectAnswer";
 import { Box, Typography, useTheme } from "@mui/material";
-import { useQuizSettings } from "@/contexts/QuizDataContext";
 import { useQuizViewStore } from "@/stores/quizView";
 import { AnyTypedQuizQuestion, QuizQuestionVariant } from "@/index";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 export const PointSystemResultList = () => {
   const theme = useTheme();
-  const { questions } = useQuizSettings();
+  const { questions } = useQuizStore();
   const answers = useQuizViewStore((state) => state.answers);
 
   const questionsWothoutResult = questions.filter<QuizQuestionVariant>(

lib/components/ViewPublicationPage/Question.tsx

@@ -15,7 +15,6 @@ import { Varimg } from "./questions/Varimg";
 
 import type { RealTypedQuizQuestion } from "../../model/questionTypes/shared";
 
-import { useQuizSettings } from "@contexts/QuizDataContext";
 import { NameplateLogoFQ } from "@icons/NameplateLogoFQ";
 import { NameplateLogoFQDark } from "@icons/NameplateLogoFQDark";
 import { notReachable } from "@utils/notReachable";
@@ -24,6 +23,7 @@ import { quizThemes } from "@utils/themes/Publication/themePublication";
 import { DESIGN_LIST } from "@/utils/designList";
 import { type ReactNode } from "react";
 import { isProduction } from "@/utils/defineDomain";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type Props = {
   currentQuestion: RealTypedQuizQuestion;
@@ -41,7 +41,7 @@ export const Question = ({
   questionSelect,
 }: Props) => {
   const theme = useTheme();
-  const { settings, show_badge, quizId } = useQuizSettings();
+  const { settings, show_badge, quizId } = useQuizStore();
 
   return (
     <Box

lib/components/ViewPublicationPage/QuestionSelect.tsx

@@ -1,5 +1,5 @@
-import { useQuizSettings } from "@/contexts/QuizDataContext";
 import { AnyTypedQuizQuestion } from "@/model/questionTypes/shared";
+import { useQuizStore } from "@/stores/useQuizStore";
 import { Box, FormControl, MenuItem, Select as MuiSelect, useTheme } from "@mui/material";
 
 interface Props {
@@ -9,7 +9,7 @@ interface Props {
 
 export default function QuestionSelect({ selectedQuestion, setQuestion }: Props) {
   const theme = useTheme();
-  const { questions, preview } = useQuizSettings();
+  const { questions, preview } = useQuizStore();
 
   if (!preview) return null;
 

lib/components/ViewPublicationPage/ResultForm.tsx

@@ -4,7 +4,6 @@ import { Box, Button, Link, Typography, useTheme } from "@mui/material";
 import { useQuizViewStore } from "@/stores/quizView";
 
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
-import { useQuizSettings } from "@contexts/QuizDataContext";
 
 import { useVkMetricsGoals } from "@/utils/hooks/metrics/useVkMetricsGoals";
 import { useYandexMetricsGoals } from "@/utils/hooks/metrics/useYandexMetricsGoals";
@@ -19,6 +18,7 @@ import { PointSystemResultList } from "./PointSystemResultList";
 import { enqueueSnackbar } from "notistack";
 import { sendFC, sendResult } from "@/api/quizRelase";
 import { isProduction } from "@/utils/defineDomain";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type ResultFormProps = {
   resultQuestion: QuizQuestionResult;
@@ -28,7 +28,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
   const theme = useTheme();
   const isMobile = useRootContainerSize() < 650;
   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 pointsSum = useQuizViewStore((state) => state.pointsSum);

lib/components/ViewPublicationPage/StartPageViewPublication/StartPageDesktop.tsx

@@ -1,7 +1,7 @@
 import { Box } from "@mui/material";
 
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 import { notReachable } from "@utils/notReachable";
 import { quizThemes } from "@utils/themes/Publication/themePublication";
@@ -22,7 +22,7 @@ type LayoutProps = Omit<StartPageDesktopProps, "startpageType">;
 const StandartLayout = ({ alignType, quizHeaderBlock, quizMainBlock, backgroundBlock }: LayoutProps) => {
   const size = useRootContainerSize();
   const isTablet = size >= 700 && size < 1100;
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
 
   return (
     <Box
@@ -170,7 +170,7 @@ const ExpandedLayout = ({ alignType, quizHeaderBlock, quizMainBlock, backgroundB
 
 const CenteredLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: LayoutProps) => {
   const isTablet = useRootContainerSize() < 1100;
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   return (
     <Box
       sx={{

lib/components/ViewPublicationPage/StartPageViewPublication/StartPageMobile.tsx

@@ -1,6 +1,6 @@
 import { Box } from "@mui/material";
 
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 import { notReachable } from "@utils/notReachable";
 import { quizThemes } from "@utils/themes/Publication/themePublication";
@@ -18,7 +18,7 @@ type StartPageMobileProps = {
 type MobileLayoutProps = Omit<StartPageMobileProps, "startpageType">;
 
 const StandartMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: MobileLayoutProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
 
   return (
     <Box
@@ -163,7 +163,7 @@ const ExpandedMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock
 );
 
 const CenteredMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: MobileLayoutProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   return (
     <Box
       sx={{

lib/components/ViewPublicationPage/StartPageViewPublication/index.tsx

@@ -2,7 +2,7 @@ import { Box, Button, ButtonBase, Link, Paper, Typography, useTheme } from "@mui
 
 import { QuizPreviewLayoutByType } from "./QuizPreviewLayoutByType";
 
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
 
 import { useUADevice } from "@utils/hooks/useUADevice";
@@ -20,7 +20,7 @@ import { isProduction } from "@/utils/defineDomain";
 
 export const StartPageViewPublication = () => {
   const theme = useTheme();
-  const { settings, show_badge, quizId, questions } = useQuizSettings();
+  const { settings, show_badge, quizId, questions } = useQuizStore();
   const { isMobileDevice } = useUADevice();
   const setCurrentQuizStep = useQuizViewStore((state) => state.setCurrentQuizStep);
 

lib/components/ViewPublicationPage/ViewPublicationPage.tsx

@@ -3,7 +3,6 @@ import { extractImageLinksFromQuestion } from "@/utils/extractImageLinks";
 import { useVKMetrics } from "@/utils/hooks/metrics/useVKMetrics";
 import { useYandexMetrics } from "@/utils/hooks/metrics/useYandexMetrics";
 import { sendQuestionAnswer } from "@/utils/sendQuestionAnswer";
-import { useQuizSettings } from "@contexts/QuizDataContext";
 import { ThemeProvider, Typography } from "@mui/material";
 import { useQuizViewStore } from "@stores/quizView";
 import { useQuestionFlowControl } from "@utils/hooks/useQuestionFlowControl";
@@ -19,9 +18,10 @@ import { StartPageViewPublication } from "./StartPageViewPublication";
 import NextButton from "./tools/NextButton";
 import PrevButton from "./tools/PrevButton";
 import unscreen from "@/ui_kit/unscreen";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 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 ownVariants = useQuizViewStore((state) => state.ownVariants);
   let currentQuizStep = useQuizViewStore((state) => state.currentQuizStep);

lib/components/ViewPublicationPage/questions/Date/DatePicker.tsx

@@ -1,5 +1,5 @@
 import { useQuizViewStore } from "@/stores/quizView";
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 import CalendarIcon from "@icons/CalendarIcon";
 import type { QuizQuestionDate } from "@model/questionTypes/date";
 import { Box, Typography, useTheme } from "@mui/material";
@@ -13,7 +13,7 @@ type DateProps = {
 };
 
 export default ({ currentQuestion }: DateProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const answers = useQuizViewStore((state) => state.answers);
   const { updateAnswer } = useQuizViewStore((state) => state);
   const theme = useTheme();

lib/components/ViewPublicationPage/questions/Date/DateRange.tsx

@@ -1,4 +1,3 @@
-import { useQuizSettings } from "@/contexts/QuizDataContext";
 import { useQuizViewStore } from "@/stores/quizView";
 import type { QuizQuestionDate } from "@model/questionTypes/date";
 import { DateCalendar } from "@mui/x-date-pickers";
@@ -7,6 +6,7 @@ import type { Moment } from "moment";
 import moment from "moment";
 import { Box, Paper, TextField, useTheme } from "@mui/material";
 import { useRootContainerSize } from "@/contexts/RootContainerWidthContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type DateProps = {
   currentQuestion: QuizQuestionDate;
@@ -16,7 +16,7 @@ export default ({ currentQuestion }: DateProps) => {
   const theme = useTheme();
   const today = moment();
   const isMobile = useRootContainerSize() < 690;
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const { updateAnswer } = useQuizViewStore((state) => state);
 
   const answers = useQuizViewStore((state) => state.answers);

lib/components/ViewPublicationPage/questions/Emoji/EmojiVariant.tsx

@@ -1,5 +1,5 @@
 import type { QuestionVariant } from "@/model/questionTypes/shared";
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 import {
   Box,
   Checkbox,
@@ -104,7 +104,7 @@ export const EmojiVariant = ({
   questionLargeCheck,
   ownPlaceholder,
 }: EmojiVariantProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const answers = useQuizViewStore((state) => state.answers);
   const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
   const theme = useTheme();

lib/components/ViewPublicationPage/questions/File/UploadFile.tsx

@@ -3,7 +3,6 @@ import { Box, ButtonBase, Skeleton, Typography, useTheme } from "@mui/material";
 import { enqueueSnackbar } from "notistack";
 
 import { sendAnswer, sendFile } from "@api/quizRelase";
-import { useQuizSettings } from "@contexts/QuizDataContext";
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
 import { useQuizViewStore } from "@stores/quizView";
 
@@ -18,6 +17,7 @@ import UploadIcon from "@icons/UploadIcon";
 
 import type { QuizQuestionFile } from "@model/questionTypes/file";
 import type { ModalWarningType } from "./index";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type UploadFileProps = {
   currentQuestion: QuizQuestionFile;
@@ -27,7 +27,7 @@ type UploadFileProps = {
 };
 
 export const UploadFile = ({ currentQuestion, setModalWarningType, isSending, setIsSending }: UploadFileProps) => {
-  const { quizId, preview } = useQuizSettings();
+  const { quizId, preview } = useQuizStore();
   const [isDropzoneHighlighted, setIsDropzoneHighlighted] = useState<boolean>(false);
   const theme = useTheme();
   const answers = useQuizViewStore((state) => state.answers);

lib/components/ViewPublicationPage/questions/File/UploadedFile.tsx

@@ -1,12 +1,12 @@
 import { Box, IconButton, Typography, useTheme } from "@mui/material";
 
 import { sendAnswer } from "@api/quizRelase";
-import { useQuizSettings } from "@contexts/QuizDataContext";
 import { useQuizViewStore } from "@stores/quizView";
 
 import CloseBold from "@icons/CloseBold";
 
 import type { QuizQuestionFile } from "@model/questionTypes/file";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type UploadedFileProps = {
   currentQuestion: QuizQuestionFile;
@@ -14,7 +14,7 @@ type UploadedFileProps = {
 };
 
 export const UploadedFile = ({ currentQuestion, setIsSending }: UploadedFileProps) => {
-  const { quizId, preview } = useQuizSettings();
+  const { quizId, preview } = useQuizStore();
   const answers = useQuizViewStore((state) => state.answers);
   const { updateAnswer } = useQuizViewStore((state) => state);
   const theme = useTheme();

lib/components/ViewPublicationPage/questions/Images/ImageVariant.tsx

@@ -1,6 +1,5 @@
 import { CheckboxIcon } from "@/assets/icons/Checkbox";
 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 { useQuizViewStore } from "@stores/quizView";
 import RadioCheck from "@ui_kit/RadioCheck";
@@ -8,6 +7,7 @@ import RadioIcon from "@ui_kit/RadioIcon";
 import { quizThemes } from "@utils/themes/Publication/themePublication";
 import { useMemo, type MouseEvent, useRef, useEffect } from "react";
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type ImagesProps = {
   questionId: string;
@@ -92,7 +92,7 @@ export const ImageVariant = ({
   questionLargeCheck,
   ownPlaceholder,
 }: ImagesProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const { deleteAnswer, updateAnswer } = useQuizViewStore((state) => state);
   const theme = useTheme();
   const answers = useQuizViewStore((state) => state.answers);

lib/components/ViewPublicationPage/questions/Number/index.tsx

@@ -1,4 +1,4 @@
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 import type { QuizQuestionNumber } from "@model/questionTypes/number";
 import { Box, Typography, useTheme } from "@mui/material";
 import { useQuizViewStore } from "@stores/quizView";
@@ -20,7 +20,7 @@ export const Number = ({ currentQuestion }: NumberProps) => {
   const [reversedInputValue, setReversedInputValue] = useState<string>("0");
   const [reversedMinRange, setReversedMinRange] = useState<string>("0");
   const [reversedMaxRange, setReversedMaxRange] = useState<string>("100000000000");
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const { updateAnswer } = useQuizViewStore((state) => state);
   const answers = useQuizViewStore((state) => state.answers);
   const theme = useTheme();

lib/components/ViewPublicationPage/questions/Select/index.tsx

@@ -1,5 +1,5 @@
 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 { Box, Typography, useTheme } from "@mui/material";
 import { useQuizViewStore } from "@stores/quizView";
@@ -10,7 +10,7 @@ type SelectProps = {
 };
 
 export const Select = ({ currentQuestion }: SelectProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
   const answers = useQuizViewStore((state) => state.answers);
   const theme = useTheme();

lib/components/ViewPublicationPage/questions/Text/TextNormal.tsx

@@ -3,13 +3,13 @@ import { Box, Typography, useTheme } from "@mui/material";
 import CustomTextField from "@ui_kit/CustomTextField";
 
 import { Answer, useQuizViewStore } from "@stores/quizView";
-import { useQuizSettings } from "@contexts/QuizDataContext";
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
 
 import { quizThemes } from "@utils/themes/Publication/themePublication";
 
 import { useMemo, type ChangeEvent } from "react";
 import type { QuizQuestionText } from "@model/questionTypes/text";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 interface TextNormalProps {
   currentQuestion: QuizQuestionText;
@@ -18,7 +18,7 @@ interface TextNormalProps {
 }
 
 export const TextNormal = ({ currentQuestion, answer }: TextNormalProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const { updateAnswer } = useQuizViewStore((state) => state);
   const isMobile = useRootContainerSize() < 650;
   const isTablet = useRootContainerSize() < 850;

lib/components/ViewPublicationPage/questions/Text/TextSpecial.tsx

@@ -1,13 +1,13 @@
 import { Box, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
 
 import { Answer, useQuizViewStore } from "@stores/quizView";
-import { useQuizSettings } from "@contexts/QuizDataContext";
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
 
 import { quizThemes } from "@utils/themes/Publication/themePublication";
 
 import type { ChangeEvent, FC } from "react";
 import type { QuizQuestionText } from "@model/questionTypes/text";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 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) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const { updateAnswer } = useQuizViewStore((state) => state);
   const isHorizontal = ORIENTATION[Number(stepNumber) - 1].horizontal;
   const theme = useTheme();

lib/components/ViewPublicationPage/questions/Text/TextSpecialHorisontal.tsx

@@ -1,13 +1,13 @@
 import { Box, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
 
 import { Answer, useQuizViewStore } from "@stores/quizView";
-import { useQuizSettings } from "@contexts/QuizDataContext";
 import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
 
 import { quizThemes } from "@utils/themes/Publication/themePublication";
 
 import type { ChangeEvent, FC } from "react";
 import type { QuizQuestionText } from "@model/questionTypes/text";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 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) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const { updateAnswer } = useQuizViewStore((state) => state);
   const isHorizontal = true;
   const theme = useTheme();

lib/components/ViewPublicationPage/questions/Text/index.tsx

@@ -1,10 +1,10 @@
-import { useQuizSettings } from "@contexts/QuizDataContext";
 import { useQuizViewStore } from "@stores/quizView";
 import { TextNormal } from "./TextNormal";
 import { TextSpecial } from "./TextSpecial";
 import { TextSpecialHorisontal } from "./TextSpecialHorisontal";
 
 import type { QuizQuestionText } from "@model/questionTypes/text";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 type TextProps = {
   currentQuestion: QuizQuestionText;
@@ -14,7 +14,7 @@ type TextProps = {
 const pathOnly = window.location.pathname;
 
 export const Text = ({ currentQuestion, stepNumber }: TextProps) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const answers = useQuizViewStore((state) => state.answers);
   const { answer } = answers.find(({ questionId }) => questionId === currentQuestion.id) ?? {};
 

lib/components/ViewPublicationPage/questions/Variant/VariantItem.tsx

@@ -1,5 +1,4 @@
-import { useQuizSettings } from "@contexts/QuizDataContext";
-import { CheckboxIcon } from "@icons/Checkbox";
+import { useQuizStore } from "@/stores/useQuizStore";
 import type { QuestionVariant } from "@model/questionTypes/shared";
 import {
   Checkbox,
@@ -99,7 +98,7 @@ export const VariantItem = ({
   questionLargeCheck: boolean;
   ownPlaceholder: string;
 }) => {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const theme = useTheme();
   const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
 

lib/components/ViewPublicationPage/questions/Varimg/VarimgVariant.tsx

@@ -1,5 +1,5 @@
 import type { QuestionVariant, QuestionVariantWithEditedImages } from "@/model/questionTypes/shared";
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 import {
   FormControlLabel,
   TextareaAutosize,
@@ -104,7 +104,7 @@ export const VarimgVariant = ({
 }: VarimgVariantProps) => {
   const theme = useTheme();
 
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const { updateAnswer, deleteAnswer } = useQuizViewStore((state) => state);
 
   const sendVariant = async (event: MouseEvent<HTMLLabelElement>) => {

lib/components/ViewPublicationPage/tools/NextButton.tsx

@@ -1,4 +1,4 @@
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 import { Button } from "@mui/material";
 import { quizThemes } from "@utils/themes/Publication/themePublication";
 
@@ -8,7 +8,7 @@ interface Props {
 }
 
 export default function NextButton({ isNextButtonEnabled, moveToNextQuestion }: Props) {
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
 
   return (
     <Button

lib/components/ViewPublicationPage/tools/PrevButton.tsx

@@ -1,7 +1,7 @@
 import { Button, useTheme } from "@mui/material";
 import { useRootContainerSize } from "../../../contexts/RootContainerWidthContext";
 import { quizThemes } from "@utils/themes/Publication/themePublication";
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 interface Props {
   isPreviousButtonEnabled: boolean;
@@ -10,7 +10,7 @@ interface Props {
 
 export default function PrevButton({ isPreviousButtonEnabled, moveToPrevQuestion }: Props) {
   const theme = useTheme();
-  const { settings } = useQuizSettings();
+  const { settings } = useQuizStore();
   const isMobileMini = useRootContainerSize() < 382;
   return (
     <Button

lib/contexts/QuizDataContext.ts

@@ -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;
-};

lib/stores/useQuizStore.ts

@@ -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;
+    })
+  );

lib/utils/hooks/useQuestionFlowControl.ts

@@ -3,7 +3,7 @@ import { enqueueSnackbar } from "notistack";
 import moment from "moment";
 
 import { isResultQuestionEmpty } from "@/components/ViewPublicationPage/tools/checkEmptyData";
-import { useQuizSettings } from "@contexts/QuizDataContext";
+import { useQuizStore } from "@/stores/useQuizStore";
 
 import { useQuizViewStore } from "@stores/quizView";
 
@@ -18,7 +18,7 @@ let isgetting = false;
 export function useQuestionFlowControl() {
   //Получаем инфо о квизе и список вопросов.
   const { loadMoreQuestions } = useQuizGetNext();
-  const { settings, questions, quizId, cnt } = useQuizSettings();
+  const { settings, questions, quizId, cnt } = useQuizStore();
 
   console.log(questions);
 
@@ -211,6 +211,7 @@ export function useQuestionFlowControl() {
   //рычаг управления из визуала в эту функцию
   const moveToNextQuestion = useCallback(async () => {
     // Если есть следующий вопрос в уже загруженных - используем его
+
     if (nextQuestion) {
       vkMetrics.questionPassed(currentQuestion.id);
       yandexMetrics.questionPassed(currentQuestion.id);