fix exercise validation in quizzes

rage · Aug 4, 2023 · a325598 · a325598
1 parent 1bfc3d9
commit a325598
Show file tree

Hide file tree

Showing 8 changed files with 24 additions and 13 deletions.
diff --git a/services/quizzes/src/components/AnswerExercise.tsx b/services/quizzes/src/components/AnswerExercise.tsx
@@ -37,6 +37,13 @@ const Exercise: React.FC<React.PropsWithChildren<ExerciseProps>> = ({
         outputState: userAnswer,
         port: port,
         _rawSetOutputState: setUserAnswer,
+        validate: (previousState) => {
+          if (!previousState) {
+            return false
+          }
+          const validities = previousState.itemAnswers.map((item) => item.valid)
+          return validities.every(Boolean)
+        },
       }}
     >
       <Widget

diff --git a/services/quizzes/src/components/ExerciseEditor.tsx b/services/quizzes/src/components/ExerciseEditor.tsx
@@ -19,6 +19,7 @@ const EditorImpl: React.FC<React.PropsWithChildren<EditorProps>> = ({ port, priv
         outputState,
         port: port,
         _rawSetOutputState: setOutputState,
+        validate: () => true,
       }}
     >
       <QuizItemsV2 />

diff --git a/services/quizzes/src/components/widget/ClosedEndedQuestion.tsx b/services/quizzes/src/components/widget/ClosedEndedQuestion.tsx
@@ -24,13 +24,13 @@ const ClosedEndedQuestion: React.FC<
         quizItemId: quizItem.id,
         type: "closed-ended-question",
         textData: newValue,
-        valid: true,
+        valid: newValue.length > 0,
       })
       return
     }
 
     if (!quizItem.formatRegex) {
-      return setQuizItemAnswerState({ ...quizItemAnswerState, textData: newValue, valid: true })
+      return setQuizItemAnswerState({ ...quizItemAnswerState, textData: newValue, valid: false })
     }
 
     const newValueIsValid = newValue

diff --git a/services/quizzes/src/components/widget/Matrix/Matrix.tsx b/services/quizzes/src/components/widget/Matrix/Matrix.tsx
@@ -76,9 +76,6 @@ const Matrix: React.FunctionComponent<
     handleSizeChange(matrixVariable)
   }, [handleSizeChange, matrixVariable])
 
-  if (!quizItemAnswerState) {
-    return <div></div>
-  }
   const handleOptionSelect = (text: string, column: number, row: number) => {
     const newMatrix = matrixVariable.map((rowArray, rowIndex) => {
       return rowArray.map((cell, columnIndex) => {
@@ -148,9 +145,7 @@ const Matrix: React.FunctionComponent<
                           cellText={cellText}
                           handleOptionSelect={handleOptionSelect}
                           matrixSize={matrixActiveSize}
-                        >
-                          {" "}
-                        </MatrixCell>
+                        ></MatrixCell>
                       )
                     }
                   })}

diff --git a/services/quizzes/src/contexts/QuizzesExerciseServiceContext.tsx b/services/quizzes/src/contexts/QuizzesExerciseServiceContext.tsx
@@ -1,6 +1,6 @@
 import { PrivateSpecQuiz } from "../../types/quizTypes/privateSpec"
 import { createExerciseServiceContext } from "../shared-module/contexts/ExerciseServiceContext"
 
-const QuizzesExerciseServiceContext = createExerciseServiceContext<PrivateSpecQuiz>()
+const QuizzesExerciseServiceContext = createExerciseServiceContext<PrivateSpecQuiz>(() => false)
 
 export default QuizzesExerciseServiceContext
diff --git a/services/quizzes/src/contexts/QuizzesUserItemAnswerContext.tsx b/services/quizzes/src/contexts/QuizzesUserItemAnswerContext.tsx
@@ -1,6 +1,6 @@
 import { UserAnswer } from "../../types/quizTypes/answer"
 import { createExerciseServiceContext } from "../shared-module/contexts/ExerciseServiceContext"
 
-const QuizzesUserItemAnswerContext = createExerciseServiceContext<UserAnswer>()
+const QuizzesUserItemAnswerContext = createExerciseServiceContext<UserAnswer>(() => false)
 
 export default QuizzesUserItemAnswerContext
diff --git a/shared-module/src/contexts/ExerciseServiceContext.tsx b/shared-module/src/contexts/ExerciseServiceContext.tsx
@@ -3,16 +3,20 @@ import React from "react"
 interface ExerciseServiceContextProps<T> {
   outputState: T | null
   port: MessagePort | null
+  validate: (newState: T | null) => boolean
   _rawSetOutputState: (newValue: T | null) => void
 }
 
-export const createExerciseServiceContext = <OutputType,>() => {
+export const createExerciseServiceContext = <OutputType,>(
+  validate: (newState: OutputType | null) => boolean,
+) => {
   return React.createContext<ExerciseServiceContextProps<OutputType>>({
     outputState: null,
     port: null,
     _rawSetOutputState: () => {
       /* NOP */
     },
+    validate,
   })
 }
 

diff --git a/shared-module/src/hooks/exerciseServiceHooks/useExerciseServiceOutputState.tsx b/shared-module/src/hooks/exerciseServiceHooks/useExerciseServiceOutputState.tsx
@@ -15,13 +15,17 @@ const useExerciseServiceOutputState = <OutputType, SelectorReturnType>(
   context: ExerciseServiceContextType<OutputType>,
   selector: (arg: OutputType | null) => SelectorReturnType | null,
 ): UseExerciseServiceOutputStateReturn<SelectorReturnType> => {
-  const { outputState, port, _rawSetOutputState } = useContext(context)
+  const { outputState, port, _rawSetOutputState, validate } = useContext(context)
 
   const updateState = (func: UpdateFunction<SelectorReturnType>) => {
     if (!port) {
       return
     }
 
+    if (!validate) {
+      return
+    }
+
     const nextState = produce(outputState, (draft) => {
       const selected = selector(draft as OutputType)
       // Selected is a draft too because it is a subset of the draft variable
@@ -32,7 +36,7 @@ const useExerciseServiceOutputState = <OutputType, SelectorReturnType>(
       data: nextState,
       // eslint-disable-next-line i18next/no-literal-string
       message: "current-state",
-      valid: true,
+      valid: validate(nextState),
     }
     port.postMessage(message)
     _rawSetOutputState(nextState)