From b12b22de82e1664993f1320dc0d0002a98f64c3f Mon Sep 17 00:00:00 2001
From: Moshe <shootermv@gmail.com>
Date: Tue, 18 Jun 2024 16:13:57 +0300
Subject: [PATCH] refactor: when selecting total-questions-of-quiz - better to
 pass number (#964)

---
 src/components/QuizTemplate.tsx         | 12 ++++++++----
 src/components/SelectQuestionsTotal.tsx |  8 +++-----
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/components/QuizTemplate.tsx b/src/components/QuizTemplate.tsx
index 666bdbb7f..d621a1f1e 100644
--- 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
index 7e78bff95..6a5f84e25 100644
--- 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>