checkAnswer

Author: pktcodes

src/App.js

@@ -5,8 +5,15 @@ import SetupForm from "./SetupForm";
 import Loading from "./Loading";
 import Modal from "./Modal";
 function App() {
-  const { waiting, loading, questions, index, correct, nextQuestion } =
-    useGlobalContext();
+  const {
+    waiting,
+    loading,
+    questions,
+    index,
+    correct,
+    nextQuestion,
+    checkAnswer,
+  } = useGlobalContext();
 
   if (waiting) {
     return <SetupForm></SetupForm>;
@@ -34,6 +41,9 @@ function App() {
                 <button
                   key={index}
                   className="answer-btn"
+                  onClick={() => {
+                    checkAnswer(correct_answer === answer);
+                  }}
                   dangerouslySetInnerHTML={{ __html: answer }}
                 ></button>
               );

src/context.js

@@ -59,6 +59,13 @@ const AppProvider = ({ children }) => {
     });
   };
 
+  const checkAnswer = (value) => {
+    if (value) {
+      setCorrect((oldValue) => oldValue + 1);
+    }
+    nextQuestion();
+  };
+
   useEffect(() => {
     fetchQuestions(tempUrl);
   }, []);
@@ -74,6 +81,7 @@ const AppProvider = ({ children }) => {
         error,
         isModalOpen,
         nextQuestion,
+        checkAnswer,
       }}
     >
       {children}