- {options.map((option) => {
- const optionId = `${groupId}-${option}`;
- const isSelected = selectedOption === option;
+
+
+
+ {question.extras.options.map((option) => {
+ const optionId = `question-${questionIndex}-${option}`;
+ const isSelected = String(value) === option;
return (
);
})}
-
+
);
}
diff --git a/src/components/questions/question-slider.tsx b/src/components/questions/question-slider.tsx
index 283193f..138d4b3 100644
--- a/src/components/questions/question-slider.tsx
+++ b/src/components/questions/question-slider.tsx
@@ -2,24 +2,24 @@
import { useLayoutEffect, useRef, useState } from "react";
import type { QuestionField } from "@/data/question-data";
-import { useQuestionAnswer } from "./question-answer-storage";
+import { useQuestionAnswers } from "./question-answer-storage";
import QuestionTitle from "./question-title";
type QuestionSliderProps = {
question: QuestionField;
questionIndex: number;
+ disabled?: boolean;
};
export function QuestionSlider({
question,
questionIndex,
+ disabled,
}: QuestionSliderProps) {
const [min, max] = question.extras.range;
const initialValue = Math.round((min + max) / 2);
- const { setValue, value: storedValue } = useQuestionAnswer(
- question,
- questionIndex,
- );
+ const { getAnswerValue, setAnswerValue } = useQuestionAnswers();
+ const storedValue = getAnswerValue(question, questionIndex);
const value = typeof storedValue === "number" ? storedValue : initialValue;
const progress = max === min ? 0 : ((value - min) / (max - min)) * 100;
const sliderWrapperRef = useRef
(null);
@@ -67,7 +67,12 @@ export function QuestionSlider({
}, [progress]);
return (
-