question added

Rakibhasaniu · Oct 11, 2022 · 09ead99 · 09ead99
1 parent 0e5021d
commit 09ead99
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 6 deletions.
diff --git a/src/App.js b/src/App.js
@@ -36,6 +36,7 @@ const router = createBrowserRouter([
         loader: async({params}) => fetch(`https://openapi.programming-hero.com/api/quiz/${params.id}`),
         element: <Topics></Topics>
       }
+
     ]
   },
 

diff --git a/src/components/Home/Home.js b/src/components/Home/Home.js
@@ -5,8 +5,8 @@ import Display from '../Display/Display';
 const Home = () => {
 
     const datas= useContext(DataContext);
+    // console.log(datas);
     const dt = datas.data
-    // console.log(dt);
 
 
     return (

diff --git a/src/components/Question/Question.js b/src/components/Question/Question.js
@@ -1,9 +1,10 @@
 import React from 'react';
 
-const Question = () => {
+const Question = ({option}) => {
+    console.log(option);
     return (
         <div>
-            <h2>This Is question Area</h2>
+            <h2></h2>
         </div>
     );
 };

diff --git a/src/components/Quiz/Quiz.js b/src/components/Quiz/Quiz.js
@@ -0,0 +1,31 @@
+import React from 'react';
+
+
+
+const Quiz = ({quiz}) => {
+    // console.log(quiz);
+    // const{question,options} = quiz;
+    // const allOption = quiz.options;
+    // // const allOption = quiz[0];
+    // // const {option} = allOption;
+    // console.log(allOption);
+    const{options, question} = quiz;
+
+
+    return (
+        <div>
+
+           <div>
+           {
+            <h1>Quiz: {question}</h1>
+           }
+           {
+            options.map(option => <p>{option}</p>)
+           }
+           </div>
+
+        </div>
+    );
+};
+
+export default Quiz;
diff --git a/src/components/Topics/Topics.js b/src/components/Topics/Topics.js
@@ -1,15 +1,23 @@
 import React from 'react';
 import { useLoaderData } from 'react-router-dom';
+import Quiz from '../Quiz/Quiz';
 
 const Topics = () => {
 
     const allData = useLoaderData();
+    // console.log(allData);
     const {data} = allData;
-    // const quiz = data.question
-    console.log(data);
+
+     const quizs = data.questions;
+    //  console.log(quiz);
+
+
     return (
         <div>
-            <h2>This is Quiz Area</h2>
+            <h2>Quiz of {data.name}</h2>
+            {
+               quizs.map(quiz => <Quiz key={quiz.id} quiz={quiz}></Quiz>) 
+            }
         </div>
     );
 };
-Original file line number
+Diff line change
@@ Expand Up / @@ -36,6 +36,7 @@ const router = createBrowserRouter([ @@
             loader: async({params}) => fetch(`https://openapi.programming-hero.com/api/quiz/${params.id}`),
             element: <Topics></Topics>
           }
         ]
       },
@@ Expand Down @@