Merge pull request #13 from Arquisoft/master

Actualizar develop
Arquisoft · Mar 25, 2024 · 86b524c · 86b524c
2 parents 53f4468 + 2230378
commit 86b524c
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 48 deletions.
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -166,4 +166,4 @@ jobs:
           wget https://raw.githubusercontent.com/arquisoft/wiq_es04d/master/docker-compose.yml -O docker-compose.yml
           wget https://raw.githubusercontent.com/arquisoft/wiq_es04d/master/.env -O .env
           docker compose --profile prod down
-          docker compose --profile prod up -d --pull always
+          docker compose --profile prod up -d --pull always
diff --git a/webapp/e2e/steps/register-form.steps.js b/webapp/e2e/steps/register-form.steps.js
@@ -26,7 +26,7 @@ defineFeature(feature, test => {
     let password;
 
     given('An unregistered user', async () => {
-      username = "pablo"
+      username = "ProbandoV1"
       password = "pabloasw"
       await expect(page).toClick("a", { text: "Don't have an account? Register here." });
     });

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,53 +35,34 @@ function Jugar() {
     ]
   }]);
 
-  const getQuestions = async() => {
-    try {
-      console.log("Requesting random questions to " + apiEndpoint);
-      const response = await axios.get(`${apiEndpoint}/getquestions`);
-      console.log(response);
-      setQuestions(response.data);
-      setQuestionsLoaded(true);
-    } catch (error) {
-      console.error('Error getting questions', error);
-    }
-  }
 
   useEffect(() => {
+    const getQuestions = async () => {
+      try {
+        console.log("Requesting random questions to " + apiEndpoint);
+        const response = await axios.get(`${apiEndpoint}/getquestions`);
+        console.log(response);
+        setQuestions(response.data);
+        setQuestionsLoaded(true);
+      } catch (error) {
+        console.error('Error getting questions', error);
+      }
+    };
+
     if (!isLoggedIn) {
       navigate('/login');
     } else {
       getQuestions();
     }
-  }, [isLoggedIn, navigate]);
+  }, [isLoggedIn, navigate]); // Asegúrate de incluir apiEndpoint en las dependencias si su valor puede cambiar.
 
-  useEffect(() => {
-    if (!quizFinished && questionsLoaded) {
-      const countdown = setInterval(() => {
-        setTimer((prevTimer) => {
-          if (prevTimer === 1) {
-            handleNextQuestion(true); // Agrega un indicador de que el cambio fue por tiempo
-            return INITIAL_TIMER;
-          }
-          return prevTimer - 1;
-        });
-      }, 1000);
-      return () => clearInterval(countdown);
-    }
-  }, [quizFinished, questionsLoaded, currentQuestionIndex, timer]);
-
-  const handleAnswerSelect = (index) => {
-    setSelectedAnswerIndex(index);
-  };
 
-  const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000';
-
-  const handleNextQuestion = (timeExpired = false) => {
+  const handleNextQuestion = useCallback((timeExpired = false) => {
     setTimer(INITIAL_TIMER);
     if (selectedAnswerIndex !== null || timeExpired) {
       const isCorrect =
-        selectedAnswerIndex !== null &&
-        questions[currentQuestionIndex].answers[selectedAnswerIndex]?.correct;
+          selectedAnswerIndex !== null &&
+          questions[currentQuestionIndex].answers[selectedAnswerIndex]?.correct;
       if (isCorrect) {
         setCorrectAnswers(correctAnswers + 1);
       }
@@ -90,23 +71,45 @@ 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
-        })
-        .catch(error => {
-          console.error('Error al guardar el historial:', error);
+          .then(response => {
+            console.log(response.data);
+          })
+          .catch(error => {
+            console.error('Error al guardar el historial:', error);
+          });
+    }
+  }, [currentQuestionIndex, selectedAnswerIndex, correctAnswers, questions, username]);
+
+
+  useEffect(() => {
+    if (!quizFinished && questionsLoaded) {
+      const countdown = setInterval(() => {
+        setTimer((prevTimer) => {
+          if (prevTimer === 1) {
+            handleNextQuestion(true); // Agrega un indicador de que el cambio fue por tiempo
+            return INITIAL_TIMER;
+          }
+          return prevTimer - 1;
         });
+      }, 1000);
+      return () => clearInterval(countdown);
     }
+  }, [quizFinished, questionsLoaded, currentQuestionIndex, timer, handleNextQuestion]);
+
+  const handleAnswerSelect = (index) => {
+    setSelectedAnswerIndex(index);
   };
+
+
   const videoSource = quizFinished ? "/videos/celebracion.mp4" : "/videos/question.mp4";
   // Renderizado del componente
   return (