108 lines
2.7 KiB
TypeScript
108 lines
2.7 KiB
TypeScript
import { Row } from "reactstrap";
|
|
import React, { useEffect } from "react";
|
|
import { useFormikContext } from "formik";
|
|
import { FaCirclePlus } from "react-icons/fa6";
|
|
import { Choice } from "../../../../../types/Item";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useObjectToEdit } from "../../../../../zustand/ObjectToEditState";
|
|
import useKeyCombination from "../../../../../Hooks/useKeyCombination";
|
|
import { CombinationKeyEnum } from "../../../../../enums/CombinationKeyEnum";
|
|
import { toast } from "react-toastify";
|
|
import MainInputs from "./components/MainInputs";
|
|
import Questions from "./components/Questions";
|
|
|
|
const Form = () => {
|
|
const formik = useFormikContext<any>();
|
|
const { setSuccess, Success ,ShowHint} = useObjectToEdit();
|
|
|
|
const handleAddChoice = (
|
|
parent_index: number,
|
|
fromKeyCombination: boolean = false,
|
|
) => {
|
|
|
|
formik.setFieldValue(`Questions.[${parent_index}].answers`, [
|
|
...((formik?.values as any)?.Questions?.[parent_index]
|
|
?.answers as Choice[]),
|
|
|
|
{
|
|
answer: null,
|
|
content_image: null,
|
|
content:null,
|
|
isCorrect: 0,
|
|
},
|
|
]);
|
|
|
|
if (fromKeyCombination) {
|
|
toast.success(t("header.new_choice_have_been_added"));
|
|
}
|
|
};
|
|
|
|
const handleAddQuestion = (fromKeyCombination: boolean = false) => {
|
|
formik.setFieldValue("Questions", [
|
|
...((formik?.values as any)?.Questions as Choice[]),
|
|
|
|
{
|
|
content: "",
|
|
image: "",
|
|
parent: "",
|
|
isBase: 0,
|
|
// max_mark: 1,
|
|
// min_mark_to_pass: 1,
|
|
answers: [{ answer: null, answer_image: null, isCorrect: 0 }],
|
|
tags: [],
|
|
},
|
|
]);
|
|
|
|
const max_mark = formik?.values?.max_mark + 1;
|
|
|
|
formik.setFieldValue("max_mark", max_mark);
|
|
if (fromKeyCombination) {
|
|
toast.success(t("header.new_question_have_been_added"));
|
|
}
|
|
};
|
|
const [t] = useTranslation();
|
|
|
|
|
|
const lastQuestions = formik?.values?.Questions?.length - 1;
|
|
useKeyCombination(
|
|
{ ctrlKey: true, shiftKey: true, code: CombinationKeyEnum.CHOICE },
|
|
() => {
|
|
handleAddChoice(lastQuestions, true);
|
|
},
|
|
);
|
|
|
|
useKeyCombination(
|
|
{ ctrlKey: true, shiftKey: true, code: CombinationKeyEnum.QUESTION },
|
|
() => {
|
|
handleAddQuestion(true);
|
|
},
|
|
);
|
|
|
|
|
|
useEffect(() => {
|
|
if (Success) {
|
|
formik.resetForm()
|
|
setSuccess(false);
|
|
}
|
|
}, [Success]);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
<Row className="w-100 exercise_form_container">
|
|
<MainInputs/>
|
|
<div className="flex"></div>
|
|
<Questions setFieldValue={formik.setFieldValue} values={formik.values} />
|
|
<p className="add_new_button">
|
|
<FaCirclePlus onClick={() => handleAddQuestion()} size={23} />{" "}
|
|
{t("header.add_new_question")}
|
|
</p>
|
|
</Row>
|
|
);
|
|
};
|
|
|
|
export default Form;
|