From eb7713d6aa420e5c11f755ff3b6e3f070d99b512 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=83=A2=E3=83=8F=E3=83=A1=E3=83=83=E3=83=89?=
 <154572400+Mbensassi2026@users.noreply.github.com>
Date: Wed, 25 Sep 2024 14:09:28 -0400
Subject: [PATCH] Update App.jsx

---
 src/App.jsx | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/App.jsx b/src/App.jsx
index b7bde75..346a707 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -14,6 +14,15 @@ function App() {
     setSelectedAnswer(selection);
   };
 
+  const fetchNewQuestion = async () => {
+    const response = await fetch(
+      "https://opentdb.com/api.php?amount=1&category=9&type=multiple"
+    );
+    const data = await response.json();
+    setQuestionData(data.results[0]);
+    setSelectedAnswer(null); // Reset selected answer for the new question
+  };
+
   let card;
 
   if (selectedAnswer) {
@@ -41,7 +50,9 @@ function App() {
     <div className="w-100 my-5 d-flex justify-content-center align-items-center">
       <div style={{ maxWidth: "45%" }}>
         <h1 className="text-center">Trivia App</h1>
-        <button className="btn btn-success">Next Question</button>
+        <button className="btn btn-success" onClick={fetchNewQuestion}>
+          Next Question
+        </button>
         {card}
       </div>
     </div>
@@ -49,3 +60,4 @@ function App() {
 }
 
 export default App;
+