fix: questions store

2023-10-04 12:07:59 +03:00 · 2023-10-04 12:07:59 +03:00 · f5867f30ce
commit f5867f30ce
parent ade9e25d5f
31 changed files with 178 additions and 305 deletions
--- a/src/constants/base.ts
+++ b/src/constants/base.ts
@ -10,6 +10,16 @@ export const QUIZ_QUESTION_BASE: Omit<QuizQuestionBase, "id"> = {
      text: "",
      video: "",
    },
+    rule: {
+      or: true,
+      show: true,
+      reqs: [
+        {
+          id: "",
+          vars: [],
+        },
+      ],
+    },
    back: "",
    autofill: false,
  },
--- a/src/constants/date.ts
+++ b/src/constants/date.ts
@ -13,19 +13,5 @@ export const QUIZ_QUESTION_DATE: Omit<QuizQuestionDate, "id"> = {
    type: "calendar",
    dateRange: false,
    time: false,
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
  },
 };
--- a/src/constants/emoji.ts
+++ b/src/constants/emoji.ts
@ -19,19 +19,5 @@ export const QUIZ_QUESTION_EMOJI: Omit<QuizQuestionEmoji, "id"> = {
        extendedText: "",
      },
    ],
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
  },
 };
--- a/src/constants/file.ts
+++ b/src/constants/file.ts
@ -11,19 +11,5 @@ export const QUIZ_QUESTION_FILE: Omit<QuizQuestionFile, "id"> = {
    innerNameCheck: false,
    innerName: "",
    type: "all",
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
  },
 };
--- a/src/constants/images.ts
+++ b/src/constants/images.ts
@ -22,20 +22,6 @@ export const QUIZ_QUESTION_IMAGES: Omit<QuizQuestionImages, "id"> = {
        extendedText: "",
      },
    ],
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
    largeCheck: false,
  },
 };
--- a/src/constants/number.ts
+++ b/src/constants/number.ts
@ -16,20 +16,6 @@ export const QUIZ_QUESTION_NUMBER: Omit<QuizQuestionNumber, "id"> = {
    steps: 5,
    start: 50,
    chooseRange: false,
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
    form: "star",
  },
 };
--- a/src/constants/page.ts
+++ b/src/constants/page.ts
@ -11,19 +11,5 @@ export const QUIZ_QUESTION_PAGE: Omit<QuizQuestionPage, "id"> = {
    innerName: "",
    text: "",
    video: "",
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
  },
 };
--- a/src/constants/rating.ts
+++ b/src/constants/rating.ts
@ -14,19 +14,5 @@ export const QUIZ_QUESTION_RATING: Omit<QuizQuestionRating, "id"> = {
    ratingExpanded: false,
    ratingDescription: "",
    form: "",
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
  },
 };
--- a/src/constants/select.ts
+++ b/src/constants/select.ts
@ -12,19 +12,6 @@ export const QUIZ_QUESTION_SELECT: Omit<QuizQuestionSelect, "id"> = {
    innerNameCheck: false,
    innerName: "",
    default: "",
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
+    variants: [{ answer: "", hints: "", extendedText: "" }],
  },
 };
--- a/src/constants/text.ts
+++ b/src/constants/text.ts
@ -12,19 +12,5 @@ export const QUIZ_QUESTION_TEXT: Omit<QuizQuestionText, "id"> = {
    innerName: "",
    required: false,
    answerType: "single",
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
  },
 };
--- a/src/constants/variant.ts
+++ b/src/constants/variant.ts
@ -14,19 +14,5 @@ export const QUIZ_QUESTION_VARIANT: Omit<QuizQuestionVariant, "id"> = {
    required: false,
    innerName: "",
    variants: [{ answer: "", hints: "", extendedText: "" }],
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
  },
 };
--- a/src/constants/varimg.ts
+++ b/src/constants/varimg.ts
@ -12,20 +12,6 @@ export const QUIZ_QUESTION_VARIMG: Omit<QuizQuestionVarImg, "id"> = {
    innerName: "",
    required: false,
    variants: [{ answer: "", hints: "", extendedText: "" }],
-    hint: {
-      text: "",
-      video: "",
-    },
-    rule: {
-      or: true,
-      show: true,
-      reqs: [
-        {
-          id: "",
-          vars: [],
-        },
-      ],
-    },
    largeCheck: false,
    replText: "",
  },
--- a/src/model/questionTypes/date.ts
+++ b/src/model/questionTypes/date.ts
@ -1,7 +1,7 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionDate extends QuizQuestionBase {
@ -16,8 +16,8 @@ export interface QuizQuestionDate extends QuizQuestionBase {
    type: "calendar" | "mask";
    dateRange: boolean;
    time: boolean;
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
  };
--- a/src/model/questionTypes/emoji.ts
+++ b/src/model/questionTypes/emoji.ts
@ -1,8 +1,8 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
-  Variant,
+  QuestionVariant,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionEmoji extends QuizQuestionBase {
@ -18,9 +18,9 @@ export interface QuizQuestionEmoji extends QuizQuestionBase {
    innerName: string;
    /** Чекбокс "Необязательный вопрос" */
    required: boolean;
-    variants: Variant[];
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    variants: QuestionVariant[];
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
  };
--- a/src/model/questionTypes/file.ts
+++ b/src/model/questionTypes/file.ts
@ -1,7 +1,7 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export const uploadFileTypesMap = {
@ -26,8 +26,8 @@ export interface QuizQuestionFile extends QuizQuestionBase {
    /** Чекбокс "Автозаполнение адреса" */
    autofill: boolean;
    type: UploadFileType;
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
  };
 }
--- a/src/model/questionTypes/images.ts
+++ b/src/model/questionTypes/images.ts
@ -1,8 +1,8 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
-  Variant,
+  QuestionVariant,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionImages extends QuizQuestionBase {
@ -25,9 +25,9 @@ export interface QuizQuestionImages extends QuizQuestionBase {
    /** Чекбокс "Необязательный вопрос" */
    required: boolean;
    /** Варианты (картинки) */
-    variants: Variant[];
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    variants: QuestionVariant[];
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
    largeCheck: boolean;
--- a/src/model/questionTypes/number.ts
+++ b/src/model/questionTypes/number.ts
@ -1,7 +1,7 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionNumber extends QuizQuestionBase {
@ -24,8 +24,8 @@ export interface QuizQuestionNumber extends QuizQuestionBase {
    steps: number;
    /** Чекбокс "Выбор диапазона (два ползунка)" */
    chooseRange: boolean;
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
    form: "star" | "trophie" | "flag" | "heart" | "like" | "bubble" | "hashtag";
--- a/src/model/questionTypes/page.ts
+++ b/src/model/questionTypes/page.ts
@ -1,7 +1,7 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionPage extends QuizQuestionBase {
@ -13,8 +13,8 @@ export interface QuizQuestionPage extends QuizQuestionBase {
    innerName: string;
    text: string;
    video: string;
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
  };
--- a/src/model/questionTypes/rating.ts
+++ b/src/model/questionTypes/rating.ts
@ -1,7 +1,7 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionRating extends QuizQuestionBase {
@ -18,8 +18,8 @@ export interface QuizQuestionRating extends QuizQuestionBase {
    ratingDescription: string;
    /** Форма иконки */
    form: string;
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
  };
--- a/src/model/questionTypes/select.ts
+++ b/src/model/questionTypes/select.ts
@ -1,8 +1,8 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
-  Variant,
+  QuestionVariant,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionSelect extends QuizQuestionBase {
@ -18,9 +18,9 @@ export interface QuizQuestionSelect extends QuizQuestionBase {
    innerName: string;
    /** Поле "Текст в выпадающем списке" */
    default: string;
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
-    variants: Variant[];
+    variants: QuestionVariant[];
+    rule: QuestionBranchingRule;
+    hint: QuestionHint;
    back: string;
    autofill: boolean;
  };
--- a/src/model/questionTypes/shared.ts
+++ b/src/model/questionTypes/shared.ts
@ -10,7 +10,7 @@ import type { QuizQuestionText } from "./text";
 import type { QuizQuestionVariant } from "./variant";
 import type { QuizQuestionVarImg } from "./varimg";

-export interface QuizQuestionBranchingRules {
+export interface QuestionBranchingRule {
  /** Радиокнопка "Все условия обязательны" */
  or: boolean;
  show: boolean;
@ -21,24 +21,22 @@ export interface QuizQuestionBranchingRules {
  }[];
 }

-export interface QuizQuestionHint {
+export interface QuestionHint {
  /** Текст подсказки */
  text: string;
  /** URL видео подсказки */
  video: string;
 }

-export type Variant = {
+export type QuestionVariant = {
+  /** Текст */
  answer: string;
+  /** Текст подсказки */
  hints: string;
+  /** Дополнительное поле для текста, emoji, ссылки на картинку */
  extendedText: string;
 };

-export type Hint = {
-  text: string;
-  video: string;
-};
-
 export interface QuizQuestionBase {
  id: number;
  title: string;
@ -46,7 +44,8 @@ export interface QuizQuestionBase {
  expanded: boolean;
  required: boolean;
  content: {
-    hint: Hint;
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
  };
--- a/src/model/questionTypes/text.ts
+++ b/src/model/questionTypes/text.ts
@ -1,7 +1,7 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionText extends QuizQuestionBase {
@ -17,8 +17,8 @@ export interface QuizQuestionText extends QuizQuestionBase {
    /** Чекбокс "Автозаполнение адреса" */
    autofill: boolean;
    answerType: "single" | "multi" | "number";
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
  };
 }
--- a/src/model/questionTypes/variant.ts
+++ b/src/model/questionTypes/variant.ts
@ -1,8 +1,8 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
-  Variant,
+  QuestionVariant,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionVariant extends QuizQuestionBase {
@ -21,9 +21,9 @@ export interface QuizQuestionVariant extends QuizQuestionBase {
    /** Поле "Внутреннее название вопроса" */
    innerName: string;
    /** Варианты ответов */
-    variants: Variant[];
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    variants: QuestionVariant[];
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
  };
--- a/src/model/questionTypes/varimg.ts
+++ b/src/model/questionTypes/varimg.ts
@ -1,8 +1,8 @@
 import type {
  QuizQuestionBase,
-  QuizQuestionBranchingRules,
-  QuizQuestionHint,
-  Variant,
+  QuestionVariant,
+  QuestionHint,
+  QuestionBranchingRule,
 } from "./shared";

 export interface QuizQuestionVarImg extends QuizQuestionBase {
@ -16,9 +16,9 @@ export interface QuizQuestionVarImg extends QuizQuestionBase {
    innerName: string;
    /** Чекбокс "Необязательный вопрос" */
    required: boolean;
-    variants: Variant[];
-    hint: QuizQuestionHint;
-    rule: QuizQuestionBranchingRules;
+    variants: QuestionVariant[];
+    hint: QuestionHint;
+    rule: QuestionBranchingRule;
    back: string;
    autofill: boolean;
    largeCheck: boolean;
--- a/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx
+++ b/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx
@ -23,13 +23,14 @@ import TextareaAutosize from "@mui/base/TextareaAutosize";
 import AddEmoji from "../../../assets/icons/questionsPage/addEmoji";

 import type { ChangeEvent, KeyboardEvent } from "react";
-import type { Variants } from "@root/questions";
+import type { QuizQuestionVariant } from "../../../model/questionTypes/variant";
+import type { QuestionVariant } from "../../../model/questionTypes/shared";

 type AnswerItemProps = {
  index: number;
  totalIndex: number;
-  variants: Variants[];
-  variant: Variants;
+  variants: QuestionVariant[];
+  variant: QuestionVariant;
  emoji: boolean;
 };

@ -46,13 +47,14 @@ export const AnswerItem = ({
  const theme = useTheme();
  const isMobile = useMediaQuery(theme.breakpoints.down(790));
  const anchorElement = useRef();
+  const question = listQuestions[quizId][totalIndex] as QuizQuestionVariant;
  const debounced = useDebouncedCallback((value) => {
    const answerNew = variants.slice();
    answerNew[index].answer = value;

    updateQuestionsList(quizId, totalIndex, {
      content: {
-        ...listQuestions[quizId][totalIndex].content,
+        ...question.content,
        variants: answerNew,
      },
    });
@ -72,13 +74,10 @@ export const AnswerItem = ({

  const addNewAnswer = () => {
    const answerNew = variants.slice();
-    answerNew.push({ answer: "", hints: "", emoji: "" });
+    answerNew.push({ answer: "", hints: "", extendedText: "" });

    updateQuestionsList(quizId, totalIndex, {
-      content: {
-        ...listQuestions[quizId][totalIndex].content,
-        variants: answerNew,
-      },
+      content: { ...question.content, variants: answerNew },
    });
  };

@ -87,10 +86,7 @@ export const AnswerItem = ({
    answerNew.splice(index, 1);

    updateQuestionsList(quizId, totalIndex, {
-      content: {
-        ...listQuestions[quizId][totalIndex].content,
-        variants: answerNew,
-      },
+      content: { ...question.content, variants: answerNew },
    });
  };

@ -99,10 +95,7 @@ export const AnswerItem = ({
    answerNew[index].hints = event.target.value;

    updateQuestionsList(quizId, totalIndex, {
-      content: {
-        ...listQuestions[quizId][totalIndex].content,
-        variants: answerNew,
-      },
+      content: { ...question.content, variants: answerNew },
    });
  };

@ -121,13 +114,10 @@ export const AnswerItem = ({
              fullWidth
              focused={false}
              placeholder={"Добавьте ответ"}
-              multiline={listQuestions[quizId][totalIndex].content.largeCheck}
+              multiline={question.content.largeCheck}
              onChange={({ target }) => debounced(target.value)}
              onKeyDown={(event: KeyboardEvent<HTMLInputElement>) => {
-                if (
-                  event.code === "Enter" &&
-                  !listQuestions[quizId][totalIndex].content.largeCheck
-                ) {
+                if (event.code === "Enter" && !question.content.largeCheck) {
                  addNewAnswer();
                }
              }}
@ -151,8 +141,10 @@ export const AnswerItem = ({
                              gap: "5px",
                            }}
                          >
-                            {variant.emoji && (
-                              <Box sx={{ width: "30px" }}>{variant.emoji}</Box>
+                            {variant.extendedText && (
+                              <Box sx={{ width: "30px" }}>
+                                {variant.extendedText}
+                              </Box>
                            )}
                            <AddEmoji />
                          </Box>
@ -178,7 +170,7 @@ export const AnswerItem = ({

                              cloneVariants[index] = {
                                ...cloneVariants[index],
-                                emoji: native,
+                                extendedText: native,
                              };

                              updateQuestionsList(quizId, totalIndex, {
@ -223,9 +215,15 @@ export const AnswerItem = ({
              }}
              sx={{
                "& .MuiInputBase-root": {
-                  padding: emoji ? "5px 13.5px" : "13.5px",
+                  padding: emoji ? "5px 13px" : "13px",
                  borderRadius: "10px",
                  background: "#ffffff",
+                  "& input.MuiInputBase-input": {
+                    height: "22px",
+                  },
+                  "& textarea.MuiInputBase-input": {
+                    marginTop: "1px",
+                  },
                },
              }}
              inputProps={{
--- a/src/pages/Questions/AnswerDraggableList/index.tsx
+++ b/src/pages/Questions/AnswerDraggableList/index.tsx
@ -9,10 +9,10 @@ import { updateVariants } from "@root/questions";
 import { reorder } from "./helper";

 import type { DropResult } from "react-beautiful-dnd";
-import type { Variants } from "@root/questions";
+import type { QuestionVariant } from "../../../model/questionTypes/shared";

 type AnswerDraggableListProps = {
-  variants: Variants[];
+  variants: QuestionVariant[];
  totalIndex: number;
  emoji?: boolean;
 };
--- a/src/pages/Questions/DataOptions/DataOptions.tsx
+++ b/src/pages/Questions/DataOptions/DataOptions.tsx
@ -13,6 +13,8 @@ import InfoIcon from "../../../assets/icons/InfoIcon";
 import SelectableButton from "@ui_kit/SelectableButton";
 import { questionStore, updateQuestionsList } from "@root/questions";

+import type { QuizQuestionDate } from "../../../model/questionTypes/date";
+
 interface Props {
  totalIndex: number;
 }
@ -23,16 +25,17 @@ export default function DataOptions({ totalIndex }: Props) {
  const { listQuestions } = questionStore();
  const theme = useTheme();
  const isMobile = useMediaQuery(theme.breakpoints.down(790));
+  const question = listQuestions[quizId][totalIndex] as QuizQuestionDate;

  const SSHC = (data: string) => {
    setSwitchState(data);
  };

  useEffect(() => {
-    if (listQuestions[quizId][totalIndex].content.type !== "mask") {
-      const clonContent = listQuestions[quizId][totalIndex].content;
-      clonContent.type = "calendar";
-      updateQuestionsList(quizId, totalIndex, { content: clonContent });
+    if (question.content.type !== "mask") {
+      updateQuestionsList(quizId, totalIndex, {
+        content: { ...question.content, type: "calendar" },
+      });
    }
  }, []);

@ -50,26 +53,22 @@ export default function DataOptions({ totalIndex }: Props) {
      >
        <Box sx={{ gap: "10px", display: "flex", flexWrap: "wrap" }}>
          <SelectableButton
-            isSelected={
-              listQuestions[quizId][totalIndex].content.type === "calendar"
-            }
+            isSelected={question.content.type === "calendar"}
            onClick={() => {
-              const clonContent = listQuestions[quizId][totalIndex].content;
-              clonContent.type = "calendar";
-              updateQuestionsList(quizId, totalIndex, { content: clonContent });
+              updateQuestionsList(quizId, totalIndex, {
+                content: { ...question.content, type: "calendar" },
+              });
            }}
            sx={{ maxWidth: "257px", height: "48px", whiteSpace: "nowrap" }}
          >
            Использовать календарь
          </SelectableButton>
          <SelectableButton
-            isSelected={
-              listQuestions[quizId][totalIndex].content.type === "mask"
-            }
+            isSelected={question.content.type === "mask"}
            onClick={() => {
-              const clonContent = listQuestions[quizId][totalIndex].content;
-              clonContent.type = "mask";
-              updateQuestionsList(quizId, totalIndex, { content: clonContent });
+              updateQuestionsList(quizId, totalIndex, {
+                content: { ...question.content, type: "mask" },
+              });
            }}
            sx={{ maxWidth: "211px", height: "48px", whiteSpace: "nowrap" }}
          >
--- a/src/pages/Questions/QuestionsPage.tsx
+++ b/src/pages/Questions/QuestionsPage.tsx
@ -17,6 +17,8 @@ import {
 } from "@root/questions";
 import { DraggableList } from "./DraggableList";

+import type { AnyQuizQuestion } from "../../model/questionTypes/shared";
+
 export default function QuestionsPage() {
  const { listQuizes, updateQuizesList } = quizStore();
  const quizId = Number(useParams().quizId);
@ -32,7 +34,10 @@ export default function QuestionsPage() {

  const collapseEverything = () => {
    listQuestions[quizId].forEach((item, index) => {
-      updateQuestionsList(quizId, index, { ...item, expanded: false });
+      updateQuestionsList<AnyQuizQuestion>(quizId, index, {
+        ...item,
+        expanded: false,
+      });
    });
  };

--- a/src/pages/Questions/answerOptions/responseSettings.tsx
+++ b/src/pages/Questions/answerOptions/responseSettings.tsx
@ -12,6 +12,8 @@ import InfoIcon from "../../../assets/icons/InfoIcon";
 import CustomTextField from "@ui_kit/CustomTextField";
 import { questionStore, updateQuestionsList } from "@root/questions";

+import type { QuizQuestionVariant } from "../../../model/questionTypes/variant";
+
 interface Props {
  totalIndex: number;
 }
@ -22,10 +24,11 @@ export default function ResponseSettings({ totalIndex }: Props) {
  const theme = useTheme();
  const isTablet = useMediaQuery(theme.breakpoints.down(900));
  const isMobile = useMediaQuery(theme.breakpoints.down(790));
+  const question = listQuestions[quizId][totalIndex] as QuizQuestionVariant;
  const debounced = useDebouncedCallback((value) => {
-    let clonContent = listQuestions[quizId][totalIndex].content;
-    clonContent.innerName = value;
-    updateQuestionsList(quizId, totalIndex, { content: clonContent });
+    updateQuestionsList(quizId, totalIndex, {
+      content: { ...question.content, innerName: value },
+    });
  }, 1000);

  return (
@ -37,41 +40,47 @@ export default function ResponseSettings({ totalIndex }: Props) {
        marginRight: isMobile ? "0" : "30px",
      }}
    >
-      <Box sx={{ pt: "20px", pb: "20px", pl: "20px", display: "flex", flexDirection: "column" }}>
+      <Box
+        sx={{
+          pt: "20px",
+          pb: "20px",
+          pl: "20px",
+          display: "flex",
+          flexDirection: "column",
+        }}
+      >
        <Typography>Настройки ответов</Typography>
        <CustomCheckbox
          sx={{ mr: isMobile ? "0px" : "16px" }}
          label={"Длинный текстовый ответ"}
-          checked={listQuestions[quizId][totalIndex].content.largeCheck}
-          handleChange={(e) => {
-            let clonContent = listQuestions[quizId][totalIndex].content;
-            clonContent.largeCheck = e.target.checked;
-
-            if (!e.target.checked) {
-              clonContent.large = "";
-            }
-
-            updateQuestionsList(quizId, totalIndex, { content: clonContent });
+          checked={question.content.largeCheck}
+          handleChange={({ target }) => {
+            updateQuestionsList(quizId, totalIndex, {
+              content: {
+                ...question.content,
+                largeCheck: target.checked,
+              },
+            });
          }}
        />
        <CustomCheckbox
          sx={{ mr: isMobile ? "0px" : "16px" }}
          label={"Можно несколько"}
-          checked={listQuestions[quizId][totalIndex].content.multi}
-          handleChange={(e) => {
-            let clonContent = listQuestions[quizId][totalIndex].content;
-            clonContent.multi = e.target.checked;
-            updateQuestionsList(quizId, totalIndex, { content: clonContent });
+          checked={question.content.multi}
+          handleChange={({ target }) => {
+            updateQuestionsList(quizId, totalIndex, {
+              content: { ...question.content, multi: target.checked },
+            });
          }}
        />
        <CustomCheckbox
          sx={{ mr: isMobile ? "0px" : "16px" }}
          label={'Вариант "свой ответ"'}
-          checked={listQuestions[quizId][totalIndex].content.own}
-          handleChange={(e) => {
-            let clonContent = listQuestions[quizId][totalIndex].content;
-            clonContent.own = e.target.checked;
-            updateQuestionsList(quizId, totalIndex, { content: clonContent });
+          checked={question.content.own}
+          handleChange={({ target }) => {
+            updateQuestionsList(quizId, totalIndex, {
+              content: { ...question.content, own: target.checked },
+            });
          }}
        />
      </Box>
@ -80,28 +89,31 @@ export default function ResponseSettings({ totalIndex }: Props) {
        <CustomCheckbox
          sx={{ mr: isMobile ? "0px" : "16px" }}
          label={"Необязательный вопрос"}
-          checked={!listQuestions[quizId][totalIndex].required}
-          handleChange={(e) => {
+          checked={!question.required}
+          handleChange={({ target }) => {
            updateQuestionsList(quizId, totalIndex, {
-              required: !e.target.checked,
+              required: !target.checked,
            });
          }}
        />
-        <Box sx={{ width: isMobile ? "90%" : "auto", display: "flex", alignItems: "center" }}>
+        <Box
+          sx={{
+            width: isMobile ? "90%" : "auto",
+            display: "flex",
+            alignItems: "center",
+          }}
+        >
          <CustomCheckbox
            sx={{ mr: isMobile ? "0px" : "16px" }}
            label={"Внутреннее название вопроса"}
-            checked={listQuestions[quizId][totalIndex].content.innerNameCheck}
-            handleChange={(e) => {
-              let clonContent = listQuestions[quizId][totalIndex].content;
-              clonContent.innerNameCheck = e.target.checked;
-
-              if (!e.target.checked) {
-                clonContent.innerName = "";
-              }
-
+            checked={question.content.innerNameCheck}
+            handleChange={({ target }) => {
              updateQuestionsList(quizId, totalIndex, {
-                content: clonContent,
+                content: {
+                  ...question.content,
+                  innerNameCheck: target.checked,
+                  innerName: target.checked ? question.content.innerName : "",
+                },
              });
            }}
          />
@ -114,11 +126,11 @@ export default function ResponseSettings({ totalIndex }: Props) {
            </Box>
          </Tooltip>
        </Box>
-        {listQuestions[quizId][totalIndex].content.innerNameCheck && (
+        {question.content.innerNameCheck && (
          <CustomTextField
            sx={{ mr: isMobile ? "0px" : "16px" }}
            placeholder={"Развёрнутое описание вопроса"}
-            text={listQuestions[quizId][totalIndex].content.innerName}
+            text={question.content.innerName}
            onChange={({ target }) => debounced(target.value)}
          />
        )}
--- a/src/pages/Questions/branchingQuestions.tsx
+++ b/src/pages/Questions/branchingQuestions.tsx
@ -26,6 +26,8 @@ import RadioCheck from "@ui_kit/RadioCheck";
 import RadioIcon from "@ui_kit/RadioIcon";
 import InfoIcon from "@icons/Info";

+import type { QuizQuestionBase } from "../../model/questionTypes/shared";
+
 type BranchingQuestionsProps = {
  totalIndex: number;
 };
@ -47,6 +49,7 @@ export default function BranchingQuestions({
  const { openedModalSettings, listQuestions } = questionStore();
  const theme = useTheme();
  const titleRef = useRef<HTMLDivElement>(null);
+  const question = listQuestions[quizId][totalIndex] as QuizQuestionBase;

  useEffect(() => {
    setTitleInputWidth(titleRef.current?.offsetWidth || 0);
--- a/src/stores/questions.ts
+++ b/src/stores/questions.ts
@ -9,7 +9,7 @@ import { QuizQuestionVarImg } from "../model/questionTypes/varimg";
 import type {
  AnyQuizQuestion,
  QuizQuestionType,
-  Variant,
+  QuestionVariant,
 } from "../model/questionTypes/shared";

 import { QUIZ_QUESTION_BASE } from "../constants/base";
@ -50,7 +50,7 @@ export interface Question {
  deleted: true;
  page: number;
  content: {
-    variants: Variant[];
+    variants: QuestionVariant[];
    hint: Hint;
    rule: Rule;
    images: string[];
@ -203,7 +203,7 @@ export const updateQuestionsListDragAndDrop = (
 export const updateVariants = (
  quizId: number,
  index: number,
-  variants: Variant[]
+  variants: QuestionVariant[]
 ) => {
  const listQuestions = { ...questionStore.getState()["listQuestions"] };