Arreglo test para despliegue V2

Arquisoft · Mar 25, 2024 · 2230378 · 2230378
1 parent 8a80d8e
commit 2230378
Showing 1 changed file with 15 additions and 14 deletions.
diff --git a/webapp/src/components/pages/Jugar.js b/webapp/src/components/pages/Jugar.js
@@ -1,12 +1,12 @@
-import React, { useContext, useState, useEffect } from "react";
+import React, {useContext, useState, useEffect, useCallback} from "react";
 import { useNavigate } from 'react-router-dom';
 import { AuthContext } from '../../AuthContext';
 import "./Jugar.css";
 import axios from 'axios';
 
 // Configuración inicial y datos
 const INITIAL_TIMER = 20;
-
+const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000';
 
 
 
@@ -35,8 +35,9 @@ function Jugar() {
     ]
   }]);
 
+
   useEffect(() => {
-    const getQuestions = async() => {
+    const getQuestions = async () => {
       try {
         console.log("Requesting random questions to " + apiEndpoint);
         const response = await axios.get(`${apiEndpoint}/getquestions`);
@@ -51,11 +52,12 @@ function Jugar() {
     if (!isLoggedIn) {
       navigate('/login');
     } else {
-      getQuestions().then(r =>{});
+      getQuestions();
     }
-  }, [isLoggedIn, navigate]);
+  }, [isLoggedIn, navigate]); // Asegúrate de incluir apiEndpoint en las dependencias si su valor puede cambiar.
+
 
-  const handleNextQuestion = (timeExpired = false) => {
+  const handleNextQuestion = useCallback((timeExpired = false) => {
     setTimer(INITIAL_TIMER);
     if (selectedAnswerIndex !== null || timeExpired) {
       const isCorrect =
@@ -69,23 +71,24 @@ function Jugar() {
       setCurrentQuestionIndex(currentQuestionIndex + 1);
       setSelectedAnswerIndex(null);
     } else {
-      //Finaliza el quiz
+      // Finaliza el quiz
       setQuizFinished(true);
 
-      //Guardamos en el historial los datos de la partida
+      // Guardamos en el historial los datos de la partida
       axios.post(`${apiEndpoint}/savehistory`, {
         username: username,
-        NumPreguntasJugadas: questions.length, // Número total de preguntas jugadas (la longitud de la matriz de preguntas)
-        NumAcertadas: correctAnswers, // Número de preguntas respondidas correctamente
+        NumPreguntasJugadas: questions.length,
+        NumAcertadas: correctAnswers,
       })
           .then(response => {
-            console.log(response.data); // Mensaje de confirmación del servidor
+            console.log(response.data);
           })
           .catch(error => {
             console.error('Error al guardar el historial:', error);
           });
     }
-  };
+  }, [currentQuestionIndex, selectedAnswerIndex, correctAnswers, questions, username]);
+
 
   useEffect(() => {
     if (!quizFinished && questionsLoaded) {
@@ -106,8 +109,6 @@ function Jugar() {
     setSelectedAnswerIndex(index);
   };
 
-  const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000';
-
 
   const videoSource = quizFinished ? "/videos/celebracion.mp4" : "/videos/question.mp4";
   // Renderizado del componente