feat: View footer buttons disabled logic

This commit is contained in:
IlyaDoronin 2023-12-05 13:24:31 +03:00
parent 8e6852f38c
commit ac31202af6

@ -19,19 +19,95 @@ export const Footer = ({ setCurrentQuestion, question }: FooterProps) => {
const [disabledQuestionsId, setDisabledQuestionsId] = useState<Set<string>>(
new Set()
);
const [disablePreviousButton, setDisablePreviousButton] =
useState<boolean>(false);
const [disableNextButton, setDisableNextButton] = useState<boolean>(false);
const { answers } = useQuizViewStore();
const theme = useTheme();
useEffect(() => {
// Логика для аргумента disabled у кнопки "Назад"
if (question?.content.rule.parentId === "root") {
setDisablePreviousButton(true);
} else {
setDisablePreviousButton(false);
}
// Логика для аргумента disabled у кнопки "Далее"
const nextQuestionId = getNextQuestionId();
if (nextQuestionId) {
setDisableNextButton(false);
} else {
const nextQuestion = getQuestionByContentId(
question.content.rule.default
);
if (nextQuestion?.type) {
setDisableNextButton(false);
} else {
setDisableNextButton(true);
}
}
}, [question]);
const getNextQuestionId = () => {
if (answers.length) {
const answer = answers.find(
({ questionId }) => questionId === question.content.id
);
let readyBeNextQuestion = "";
question.content.rule.main.forEach(({ next, rules }) => {
let longerArray = Math.max(
rules[0].answers.length,
[answer?.answer].length
);
for (
var i = 0;
i < longerArray;
i++ // Цикл по всем эле­мен­там бОльшего массива
) {
if (rules[0].answers[i] === answer?.answer) {
readyBeNextQuestion = next; // Ес­ли хоть один эле­мент от­ли­ча­ет­ся, мас­си­вы не рав­ны
}
}
});
return readyBeNextQuestion;
}
};
const followPreviousStep = () => {
if (question?.content.rule.parentId !== "root") {
const parent = getQuestionByContentId(question?.content.rule.parentId);
if (parent) {
if (parent?.type) {
setCurrentQuestion(parent);
} else {
enqueueSnackbar("не могу получить предыдущий вопрос");
}
}
const nextQuestionId = getNextQuestionId();
if (nextQuestionId) {
const nextQuestion = getQuestionByContentId(nextQuestionId);
if (nextQuestion?.type) {
setCurrentQuestion(nextQuestion);
return;
} else {
enqueueSnackbar("не могу получить последующий вопрос");
}
} else {
enqueueSnackbar("вы находитесь на первом вопросе");
const nextQuestion = getQuestionByContentId(
question.content.rule.default
);
if (nextQuestion?.type) {
setCurrentQuestion(nextQuestion);
} else {
enqueueSnackbar("не могу получить последующий вопрос (дефолтный)");
}
}
};
@ -62,7 +138,7 @@ export const Footer = ({ setCurrentQuestion, question }: FooterProps) => {
if (readyBeNextQuestion) {
const nextQuestion = getQuestionByContentId(readyBeNextQuestion);
if (nextQuestion) {
if (nextQuestion?.type) {
setCurrentQuestion(nextQuestion);
return;
} else {
@ -72,7 +148,7 @@ export const Footer = ({ setCurrentQuestion, question }: FooterProps) => {
const nextQuestion = getQuestionByContentId(
question.content.rule.default
);
if (nextQuestion) {
if (nextQuestion?.type) {
setCurrentQuestion(nextQuestion);
} else {
enqueueSnackbar("не могу получить последующий вопрос (дефолтный)");
@ -130,6 +206,7 @@ export const Footer = ({ setCurrentQuestion, question }: FooterProps) => {
</Typography> */}
</Box>
<Button
disabled={disablePreviousButton}
variant="contained"
sx={{ fontSize: "16px", padding: "10px 15px" }}
onClick={followPreviousStep}
@ -137,6 +214,7 @@ export const Footer = ({ setCurrentQuestion, question }: FooterProps) => {
Назад
</Button>
<Button
disabled={disableNextButton}
variant="contained"
sx={{ fontSize: "16px", padding: "10px 15px" }}
onClick={followNextStep}