Merge pull request #30 from cbvora/controlled_inuput

making input as controlled compoenent

Author: cbvora

components/QuizForm.tsx

@@ -100,7 +100,7 @@ const QuizForm: FC<Props> = ({
     if (savedAnswer !== null && typeof savedAnswer === "string") {
       return savedAnswer === optionText;
     } else {
-      return;
+      return false;
     }
   };
 
@@ -168,7 +168,7 @@ const QuizForm: FC<Props> = ({
     if (savedAnswer?.length) {
       return savedAnswer.includes(optionText);
     } else {
-      return;
+      return false;
     }
   };
 
@@ -316,7 +316,7 @@ const QuizForm: FC<Props> = ({
                 showCorrectAnswer[currentQuestionIndex] || false
               }
               disabled={showCorrectAnswer[currentQuestionIndex] || false}
-              defaultChecked={
+              checked={
                 isOptionChecked(option.text) ||
                 isOptionCheckedWithoutReveal(option.text)
               }

components/SelectionInput.tsx

@@ -23,6 +23,7 @@ const SelectionInput = forwardRef<HTMLInputElement, Props>(
       showCorrectAnswer,
       disabled = false,
       defaultChecked,
+      checked,
       handleChange = () => {},
       ...rest
     },
@@ -38,6 +39,7 @@ const SelectionInput = forwardRef<HTMLInputElement, Props>(
           id={id}
           className={`peer hidden [&:checked_+_label_svg_path]:block `}
           defaultChecked={defaultChecked}
+          checked={checked}
           onClick={handleChange}
           {...rest}
         />