From c8a472ed0bae5e01ae529e1c6a05cb6ef81cb901 Mon Sep 17 00:00:00 2001
From: IlyaDoronin <ryletd@gmail.com>
Date: Wed, 27 Dec 2023 11:28:37 +0300
Subject: [PATCH] fix: slider answer logic

---
 .../Questions/SliderOptions/SliderOptions.tsx | 34 ++++++++++++++++---
 1 file changed, 30 insertions(+), 4 deletions(-)

diff --git a/src/pages/Questions/SliderOptions/SliderOptions.tsx b/src/pages/Questions/SliderOptions/SliderOptions.tsx
index 77f223cb..b413fd51 100644
--- a/src/pages/Questions/SliderOptions/SliderOptions.tsx
+++ b/src/pages/Questions/SliderOptions/SliderOptions.tsx
@@ -1,11 +1,16 @@
 import { useEffect, useState } from "react";
 import { Box, Typography, useMediaQuery, useTheme } from "@mui/material";
-import ButtonsOptions from "../ButtonsOptions";
+import { useDebouncedCallback } from "use-debounce";
+
 import CustomNumberField from "@ui_kit/CustomNumberField";
+
+import ButtonsOptions from "../ButtonsOptions";
 import SwitchSlider from "./switchSlider";
-import type { QuizQuestionNumber } from "../../../model/questionTypes/number";
+
 import { updateQuestion } from "@root/questions/actions";
 
+import type { QuizQuestionNumber } from "../../../model/questionTypes/number";
+
 interface Props {
   question: QuizQuestionNumber;
 }
@@ -19,14 +24,31 @@ export default function SliderOptions({ question }: Props) {
   const [startError, setStartError] = useState<boolean>(false);
   const [minError, setMinError] = useState<boolean>(false);
   const [maxError, setMaxError] = useState<boolean>(false);
+  const startValueDebounce = useDebouncedCallback((value) => {
+    updateQuestion(question.id, (question) => {
+      if (question.type !== "number") return;
+
+      question.content.start = value;
+    });
+  }, 2000);
 
   useEffect(() => {
     const min = Number(question.content.range.split("—")[0]);
     const max = Number(question.content.range.split("—")[1]);
     const start = Number(question.content.start);
 
-    if (start < min || start > max) {
+    if (start < min) {
       setStartError(true);
+      startValueDebounce(min);
+
+      return;
+    }
+
+    if (start > max && min < max) {
+      setStartError(true);
+      startValueDebounce(max);
+
+      return;
     }
 
     if (start >= min && start <= max) {
@@ -211,7 +233,11 @@ export default function SliderOptions({ question }: Props) {
               placeholder={"1"}
               error={stepError}
               value={String(question.content.step)}
-              onChange={({ target }) => {
+              onChange={({ target, type }) => {
+                if (type === "blur") {
+                  return;
+                }
+
                 updateQuestion(question.id, (question) => {
                   if (question.type !== "number") return;