devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- Added a new type of exercise

Browse Source 
- Updated all solutions to solve a huge bug where after reviewing, it would reset the score
This commit is contained in:
Tiago Ribeiro
2023-08-11 14:23:09 +01:00
parent 5099721b9b
commit db54d58bab
18 changed files with 407 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/Solutions/MultipleChoice.tsx
View File

@@ -21,7 +21,7 @@ function Question({
return "!border-mti-purple-light !text-mti-purple-light";
}
return userSolution === option ? "!border-mti-orange-light !text-mti-orange-light" : "";
return userSolution === option ? "!border-mti-rose-light !text-mti-rose-light" : "";
};
return (
@@ -54,12 +54,20 @@ function Question({
);
}
export default function MultipleChoice({prompt, questions, userSolutions, onNext, onBack}: MultipleChoiceExercise & CommonProps) {
export default function MultipleChoice({id, type, prompt, questions, userSolutions, onNext, onBack}: MultipleChoiceExercise & CommonProps) {
const [questionIndex, setQuestionIndex] = useState(0);
const calculateScore = () => {
const total = questions.length;
const correct = userSolutions.filter((x) => questions.find((y) => y.id === x.question)?.solution === x.option || false).length;
const missing = total - userSolutions.filter((x) => questions.find((y) => y.id === x.question)).length;
return {total, correct, missing};
};
const next = () => {
if (questionIndex === questions.length - 1) {
onNext();
onNext({exercise: id, solutions: userSolutions, score: calculateScore(), type});
} else {
setQuestionIndex((prev) => prev + 1);
}
@@ -67,7 +75,7 @@ export default function MultipleChoice({prompt, questions, userSolutions, onNext
const back = () => {
if (questionIndex === 0) {
onBack();
onBack({exercise: id, solutions: userSolutions, score: calculateScore(), type});
} else {
setQuestionIndex((prev) => prev - 1);
}
@@ -95,7 +103,7 @@ export default function MultipleChoice({prompt, questions, userSolutions, onNext
Unanswered
</div>
<div className="flex gap-2 items-center">
<div className="w-4 h-4 rounded-full bg-mti-orange" />
<div className="w-4 h-4 rounded-full bg-mti-rose" />
Wrong
</div>
</div>