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

Updated the problems with the marking - related to the DB not having the correct type

Browse Source
This commit is contained in:
Tiago Ribeiro
2023-09-13 23:46:50 +01:00
parent 3a51185942
commit dc8682e1c3
9 changed files with 50 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/Exercises/FillBlanks.tsx
View File

@@ -35,10 +35,10 @@ function WordsDrawer({words, isOpen, blankId, previouslySelectedWord, onCancel,
<div className="rounded-full w-6 h-6 flex items-center justify-center text-white bg-mti-purple-light">{blankId}</div> <div className="rounded-full w-6 h-6 flex items-center justify-center text-white bg-mti-purple-light">{blankId}</div>
<span> Choose the correct word:</span> <span> Choose the correct word:</span>
</div> </div>
<div className="grid grid-cols-6 gap-6"> <div className="grid grid-cols-6 gap-6" key="word-array">
{words.map(({word, isDisabled}) => ( {words.map(({word, isDisabled}) => (
<button <button
key={word} key={`${word}_${blankId}`}
onClick={() => setSelectedWord((prev) => (prev === word ? undefined : word))} onClick={() => setSelectedWord((prev) => (prev === word ? undefined : word))}
className={clsx( className={clsx(
"rounded-full py-3 text-center transition duration-300 ease-in-out", "rounded-full py-3 text-center transition duration-300 ease-in-out",
@@ -93,8 +93,10 @@ export default function FillBlanks({
const calculateScore = () => { const calculateScore = () => {
const total = text.match(/({{\d+}})/g)?.length || 0; const total = text.match(/({{\d+}})/g)?.length || 0;
const correct = answers.filter((x) => solutions.find((y) => x.id === y.id.toString())?.solution === x.solution.toLowerCase() || false).length; const correct = answers.filter(
const missing = total - answers.filter((x) => solutions.find((y) => x.id === y.id.toString())).length; (x) => solutions.find((y) => x.id.toString() === y.id.toString())?.solution === x.solution.toLowerCase() || false,
).length;
const missing = total - answers.filter((x) => solutions.find((y) => x.id.toString() === y.id.toString())).length;
return {total, correct, missing}; return {total, correct, missing};
}; };

6
src/components/Exercises/MatchSentences.tsx
View File

@@ -18,8 +18,10 @@ export default function MatchSentences({id, options, type, prompt, sentences, us
const calculateScore = () => { const calculateScore = () => {
const total = sentences.length; const total = sentences.length;
const correct = answers.filter((x) => sentences.find((y) => y.id.toString() === x.question)?.solution === x.option || false).length; const correct = answers.filter(
const missing = total - answers.filter((x) => sentences.find((y) => y.id.toString() === x.question)).length; (x) => sentences.find((y) => y.id.toString() === x.question.toString())?.solution === x.option || false,
).length;
const missing = total - answers.filter((x) => sentences.find((y) => y.id.toString() === x.question.toString())).length;
return {total, correct, missing}; return {total, correct, missing};
}; };

6
src/components/Exercises/MultipleChoice.tsx
View File

@@ -66,8 +66,10 @@ export default function MultipleChoice({id, prompt, type, questions, userSolutio
const calculateScore = () => { const calculateScore = () => {
const total = questions.length; const total = questions.length;
const correct = answers.filter((x) => questions.find((y) => y.id.toString() === x.question)?.solution === x.option || false).length; const correct = answers.filter(
const missing = total - answers.filter((x) => questions.find((y) => y.id.toString() === x.question)).length; (x) => questions.find((y) => y.id.toString() === x.question.toString())?.solution === x.option || false,
).length;
const missing = total - answers.filter((x) => questions.find((y) => y.id.toString() === x.question.toString())).length;
return {total, correct, missing}; return {total, correct, missing};
}; };

20
src/components/Exercises/TrueFalse.tsx
View File

@@ -16,8 +16,10 @@ export default function TrueFalse({id, type, prompt, questions, userSolutions, o
const calculateScore = () => { const calculateScore = () => {
const total = questions.length || 0; const total = questions.length || 0;
const correct = answers.filter((x) => questions.find((y) => x.id === y.id.toString())?.solution === x.solution.toLowerCase() || false).length; const correct = answers.filter(
const missing = total - answers.filter((x) => questions.find((y) => x.id === y.id.toString())).length; (x) => questions.find((y) => x.id.toString() === y.id.toString())?.solution === x.solution.toLowerCase() || false,
).length;
const missing = total - answers.filter((x) => questions.find((y) => x.id.toString() === y.id.toString())).length;
return {total, correct, missing}; return {total, correct, missing};
}; };
@@ -67,19 +69,27 @@ export default function TrueFalse({id, type, prompt, questions, userSolutions, o
</span> </span>
<div className="flex gap-4"> <div className="flex gap-4">
<Button <Button
variant={answers.find((x) => x.id === question.id.toString())?.solution === "true" ? "solid" : "outline"} variant={
answers.find((x) => x.id.toString() === question.id.toString())?.solution === "true" ? "solid" : "outline"
}
onClick={() => toggleAnswer("true", question.id.toString())} onClick={() => toggleAnswer("true", question.id.toString())}
className="!py-2"> className="!py-2">
True True
</Button> </Button>
<Button <Button
variant={answers.find((x) => x.id === question.id.toString())?.solution === "false" ? "solid" : "outline"} variant={
answers.find((x) => x.id.toString() === question.id.toString())?.solution === "false" ? "solid" : "outline"
}
onClick={() => toggleAnswer("false", question.id.toString())} onClick={() => toggleAnswer("false", question.id.toString())}
className="!py-2"> className="!py-2">
False False
</Button> </Button>
<Button <Button
variant={answers.find((x) => x.id === question.id.toString())?.solution === "not_given" ? "solid" : "outline"} variant={
answers.find((x) => x.id.toString() === question.id.toString())?.solution === "not_given"
? "solid"
: "outline"
}
onClick={() => toggleAnswer("not_given", question.id.toString())} onClick={() => toggleAnswer("not_given", question.id.toString())}
className="!py-2"> className="!py-2">
Not Given Not Given

2
src/components/Exercises/WriteBlanks.tsx
View File

@@ -61,7 +61,7 @@ export default function WriteBlanks({id, prompt, type, maxWords, solutions, user
const correct = answers.filter( const correct = answers.filter(
(x) => (x) =>
solutions solutions
.find((y) => x.id === y.id.toString()) .find((y) => x.id.toString() === y.id.toString())
?.solution.map((y) => y.toLowerCase()) ?.solution.map((y) => y.toLowerCase())
.includes(x.solution.toLowerCase()) || false, .includes(x.solution.toLowerCase()) || false,
).length; ).length;

4
src/components/Solutions/FillBlanks.tsx
View File

@@ -9,9 +9,9 @@ export default function FillBlanksSolutions({id, type, prompt, solutions, text,
const calculateScore = () => { const calculateScore = () => {
const total = text.match(/({{\d+}})/g)?.length || 0; const total = text.match(/({{\d+}})/g)?.length || 0;
const correct = userSolutions.filter( const correct = userSolutions.filter(
(x) => solutions.find((y) => x.id === y.id.toString())?.solution === x.solution.toLowerCase() || false, (x) => solutions.find((y) => x.id.toString() === y.id.toString())?.solution === x.solution.toLowerCase() || false,
).length; ).length;
const missing = total - userSolutions.filter((x) => solutions.find((y) => x.id === y.id.toString())).length; const missing = total - userSolutions.filter((x) => solutions.find((y) => x.id.toString() === y.id.toString())).length;
return {total, correct, missing}; return {total, correct, missing};
}; };

12
src/components/Solutions/MatchSentences.tsx
View File

@@ -21,8 +21,10 @@ export default function MatchSentencesSolutions({
}: MatchSentencesExercise & CommonProps) { }: MatchSentencesExercise & CommonProps) {
const calculateScore = () => { const calculateScore = () => {
const total = sentences.length; const total = sentences.length;
const correct = userSolutions.filter((x) => sentences.find((y) => y.id.toString() === x.question)?.solution === x.option || false).length; const correct = userSolutions.filter(
const missing = total - userSolutions.filter((x) => sentences.find((y) => y.id.toString() === x.question)).length; (x) => sentences.find((y) => y.id.toString() === x.question.toString())?.solution === x.option || false,
).length;
const missing = total - userSolutions.filter((x) => sentences.find((y) => y.id.toString() === x.question.toString())).length;
return {total, correct, missing}; return {total, correct, missing};
}; };
@@ -48,9 +50,9 @@ export default function MatchSentencesSolutions({
className={clsx( className={clsx(
"w-8 h-8 rounded-full z-10 text-white", "w-8 h-8 rounded-full z-10 text-white",
"transition duration-300 ease-in-out", "transition duration-300 ease-in-out",
!userSolutions.find((x) => x.question === id) && "!bg-mti-red", !userSolutions.find((x) => x.question.toString() === id.toString()) && "!bg-mti-red",
userSolutions.find((x) => x.question === id)?.option === solution && "bg-mti-purple", userSolutions.find((x) => x.question.toString() === id.toString())?.option === solution && "bg-mti-purple",
userSolutions.find((x) => x.question === id)?.option !== solution && "bg-mti-rose", userSolutions.find((x) => x.question.toString() === id.toString())?.option !== solution && "bg-mti-rose",
)}> )}>
{id} {id}
</button> </button>

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

@@ -59,8 +59,10 @@ export default function MultipleChoice({id, type, prompt, questions, userSolutio
const calculateScore = () => { const calculateScore = () => {
const total = questions.length; const total = questions.length;
const correct = userSolutions.filter((x) => questions.find((y) => y.id.toString() === x.question)?.solution === x.option || false).length; const correct = userSolutions.filter(
const missing = total - userSolutions.filter((x) => questions.find((y) => y.id.toString() === x.question)).length; (x) => questions.find((y) => y.id.toString() === x.question.toString())?.solution === x.option || false,
).length;
const missing = total - userSolutions.filter((x) => questions.find((y) => y.id.toString() === x.question.toString())).length;
return {total, correct, missing}; return {total, correct, missing};
}; };

12
src/components/Solutions/WriteBlanks.tsx
View File

@@ -80,11 +80,11 @@ export default function WriteBlanksSolutions({
const correct = userSolutions.filter( const correct = userSolutions.filter(
(x) => (x) =>
solutions solutions
.find((y) => x.id === y.id.toString()) .find((y) => x.id.toString() === y.id.toString())
?.solution.map((y) => y.toLowerCase()) ?.solution.map((y) => y.toLowerCase())
.includes(x.solution.toLowerCase()) || false, .includes(x.solution.toLowerCase()) || false,
).length; ).length;
const missing = total - userSolutions.filter((x) => solutions.find((y) => x.id === y.id.toString())).length; const missing = total - userSolutions.filter((x) => solutions.find((y) => x.id.toString() === y.id.toString())).length;
return {total, correct, missing}; return {total, correct, missing};
}; };
@@ -94,10 +94,12 @@ export default function WriteBlanksSolutions({
<span className="text-base leading-5"> <span className="text-base leading-5">
{reactStringReplace(line, /({{\d+}})/g, (match) => { {reactStringReplace(line, /({{\d+}})/g, (match) => {
const id = match.replaceAll(/[\{\}]/g, "").toString(); const id = match.replaceAll(/[\{\}]/g, "").toString();
const userSolution = userSolutions.find((x) => x.id === id); const userSolution = userSolutions.find((x) => x.id.toString() === id.toString());
const solution = solutions.find((x) => x.id.toString() === id)!; const solution = solutions.find((x) => x.id.toString() === id.toString())!;
return <Blank userSolution={userSolution?.solution} maxWords={maxWords} id={id} solutions={solution.solution} disabled />; return (
<Blank userSolution={userSolution?.solution} maxWords={maxWords} id={id.toString()} solutions={solution.solution} disabled />
);
})} })}
</span> </span>
); );