refactor: when selecting total-questions-of-quiz - better to pass num…

…ber (#964)
freeCodeCamp · Jun 18, 2024 · b12b22d · b12b22d
1 parent caba804
commit b12b22d
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 9 deletions.
diff --git a/src/components/QuizTemplate.tsx b/src/components/QuizTemplate.tsx
@@ -63,9 +63,11 @@ const QuizTemplate: React.FC = () => {
     navigate(`/quizzes/${category}/questionsTotal`);
   };
 
-  const startQuiz = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-    const userAnswer = parseInt(e.currentTarget.value);
-    const shuffledQuiz = shuffle(filteredQuestions).slice(0, userAnswer);
+  const startQuiz = (quizQuestionsCount: number) => {
+    const shuffledQuiz = shuffle(filteredQuestions).slice(
+      0,
+      quizQuestionsCount
+    );
 
     // Shuffle the answer options
     const choicesArr: string[][] = shuffledQuiz.map(obj => {
@@ -80,7 +82,9 @@ const QuizTemplate: React.FC = () => {
 
     setQuiz(shuffledQuiz);
     setChoicesArr(choicesArr);
-    navigate(`/quizzes/${selectedCategory}/questions/1/of/${userAnswer}`);
+    navigate(
+      `/quizzes/${selectedCategory}/questions/1/of/${quizQuestionsCount}`
+    );
   };
 
   // Function to start a random quiz

diff --git a/src/components/SelectQuestionsTotal.tsx b/src/components/SelectQuestionsTotal.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import { QUESTION_NUMS } from "../constants";
 
 interface SelectQuestionsTotalProps {
-  startQuiz: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+  startQuiz: (e: number) => void;
   selectedCategory: string; // Add the selectedCategory prop
   totalQuestions: number; // Add the totalQuestions prop
 }
@@ -22,8 +22,7 @@ const SelectQuestionsTotal: React.FC<SelectQuestionsTotalProps> = ({
         {availableQuizLengths.map((choice: number, index: number) => (
           <button
             className="select-btns"
-            onClick={e => startQuiz(e)}
-            value={choice}
+            onClick={() => startQuiz(choice)}
             key={index}
           >
             {choice}
@@ -32,8 +31,7 @@ const SelectQuestionsTotal: React.FC<SelectQuestionsTotalProps> = ({
 
         <button
           className="select-btns"
-          onClick={startQuiz}
-          value={totalQuestions}
+          onClick={() => startQuiz(totalQuestions)}
         >
           All ({totalQuestions})
         </button>