Merge pull request #373 from VinayLodhi1712/backbutton

back buttons added for quiz page: #351 done

package.json

@@ -29,7 +29,7 @@
     "react-loader-spinner": "^6.1.6",
     "react-parallax-tilt": "^1.7.229",
     "react-player": "^2.16.0",
-    "react-router-dom": "^6.23.1",
+    "react-router-dom": "^6.27.0",
     "react-spinners": "^0.14.1",
     "react-top-loading-bar": "^2.3.1",
     "react-typed": "^2.0.12"

src/pages/resources/ChanakyaQuiz.jsx

@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
+import { useNavigate } from 'react-router-dom'; // Only import useNavigate
 import "./../../css/ChanakyaQuiz.css";
 
 const allQuestions = [
@@ -113,6 +114,8 @@ const getRandomQuestions = (questions, num) => {
 };
 
 const ChanakyaQuiz = () => {
+  const navigate = useNavigate(); // Initialize useNavigate
+
   const [started, setStarted] = useState(false);
   const [questions, setQuestions] = useState([]);
   const [currentQuestionIndex, setCurrentQuestionIndex] = useState(0);
@@ -133,6 +136,10 @@ const ChanakyaQuiz = () => {
     setUserAnswers(newAnswers);
   };
 
+  const handleBackToHome = () => {
+    navigate('/'); // Navigate to the home page
+  };
+
   const handleNext = () => {
     if (currentQuestionIndex < questions.length - 1) {
       setCurrentQuestionIndex(currentQuestionIndex + 1);
@@ -170,13 +177,17 @@ const ChanakyaQuiz = () => {
         <>
           <h1>Ready to attempt Quiz</h1>
           <button className="start-button" onClick={startQuiz}>Start Quiz</button>
+          <button className="start-button" onClick={handleBackToHome}>Back</button>
         </>
       ) : showResult ? (
-        <Result 
-          score={calculateScore()} 
-          questions={questions} 
-          userAnswers={userAnswers} 
-        />
+        <>
+          <Result 
+            score={calculateScore()} 
+            questions={questions} 
+            userAnswers={userAnswers} 
+          />
+       <button className="quizbuttons" onClick={handleBackToHome}>Back</button>
+        </>
       ) : (
         <div>
           <div className="question-number">
@@ -201,6 +212,7 @@ const ChanakyaQuiz = () => {
               <button className="quizbuttons" onClick={finishQuiz}>Finish</button>
             )}
             <button className="quizbuttons" onClick={handleSkip}>Skip</button>
+            <button className="quizbuttons" onClick={handleBackToHome}>Back</button>
           </div>
         </div>
       )}