From cf74f293362b1543768a6a46051459f2355f155e Mon Sep 17 00:00:00 2001 From: CANCI0 Date: Tue, 5 Mar 2024 16:07:31 +0100 Subject: [PATCH 1/2] =?UTF-8?q?Ya=20no=20se=20repite=20la=20primera=20preg?= =?UTF-8?q?unta=20en=20cl=C3=A1sico?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- gatewayservice/gateway-service.js | 2 ++ webapp/src/App.js | 2 +- webapp/src/pages/Clasico/Clasico.js | 13 +++---------- webapp/src/pages/Stats/Stats.css | 6 ------ 4 files changed, 6 insertions(+), 17 deletions(-) diff --git a/gatewayservice/gateway-service.js b/gatewayservice/gateway-service.js index e5fbe175..ba124555 100644 --- a/gatewayservice/gateway-service.js +++ b/gatewayservice/gateway-service.js @@ -18,6 +18,8 @@ app.use(express.json()); const metricsMiddleware = promBundle({includeMethod: true}); app.use(metricsMiddleware); +app.set("json spaces", 40); + // Health check endpoint app.get('/health', (req, res) => { res.json({ status: 'OK' }); diff --git a/webapp/src/App.js b/webapp/src/App.js index b879f817..e654bb13 100644 --- a/webapp/src/App.js +++ b/webapp/src/App.js @@ -6,7 +6,7 @@ import Bateria from './pages/Bateria/Bateria.js'; import WrongRoute from './pages/WrongRoute/WrongRoute.js'; import Stats from './pages/Stats/Stats.js'; import './App.css'; -import {BrowserRouter, Routes, Route, Navigate} from "react-router-dom"; +import {BrowserRouter, Routes, Route} from "react-router-dom"; function App() { return ( diff --git a/webapp/src/pages/Clasico/Clasico.js b/webapp/src/pages/Clasico/Clasico.js index 290d6d78..6bd7fb15 100644 --- a/webapp/src/pages/Clasico/Clasico.js +++ b/webapp/src/pages/Clasico/Clasico.js @@ -30,7 +30,8 @@ const JuegoPreguntas = () => { .then((response) => response.json()) .then((data) => { setPreguntas(data); - //setIsLoading(false); + setPreguntaActual(data[0]); + setIsLoading(false); }) .catch((error) => { console.error('Error al obtener las preguntas:', error); @@ -38,13 +39,6 @@ const JuegoPreguntas = () => { }); }, []); - useEffect(() => { - if (preguntas && preguntas.length > 0) { - setPreguntaActual(preguntas[0]); - setIsLoading(false); - } - }, [preguntas]); - useEffect(() => { if (tiempoRestante === 0) { setPreguntaTerminada(true); @@ -96,12 +90,11 @@ const JuegoPreguntas = () => { setTiempoTotal(tiempoTotal+10-tiempoRestante); - setRespuestaSeleccionada(null); setTiempoRestante(10); if (indicePregunta + 1 < preguntas.length) { setIndicePregunta(indicePregunta + 1); - setPreguntaActual(preguntas[indicePregunta]); + setPreguntaActual(preguntas[indicePregunta + 1]); } else { try { diff --git a/webapp/src/pages/Stats/Stats.css b/webapp/src/pages/Stats/Stats.css index 355af678..a2d1506e 100644 --- a/webapp/src/pages/Stats/Stats.css +++ b/webapp/src/pages/Stats/Stats.css @@ -24,10 +24,4 @@ input, button, a{ color: #6b456c; font-family: "Times New Roman", serif; -} - -body { - background-color: #ffffe5; - font-family: "Times New Roman", serif; - } \ No newline at end of file From f51cf40f6e8f0862486e3c9ed548770346d962e1 Mon Sep 17 00:00:00 2001 From: CANCI0 Date: Tue, 5 Mar 2024 16:15:22 +0100 Subject: [PATCH 2/2] =?UTF-8?q?Se=20ha=20a=C3=B1adido=20timeout=20a=20la?= =?UTF-8?q?=20b=C3=BAsqueda=20de=20usuarios=20para=20no=20sobrecargar=20al?= =?UTF-8?q?=20microservicio?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- webapp/src/pages/Stats/Stats.js | 179 +++++++++++++++++++------------- 1 file changed, 107 insertions(+), 72 deletions(-) diff --git a/webapp/src/pages/Stats/Stats.js b/webapp/src/pages/Stats/Stats.js index 7ee9da5b..f9e5117c 100644 --- a/webapp/src/pages/Stats/Stats.js +++ b/webapp/src/pages/Stats/Stats.js @@ -1,9 +1,8 @@ -import React, { useState, useEffect } from 'react'; -import axios from 'axios'; -import Nav from '../../components/Nav/Nav.js'; -import Footer from '../../components/Footer/Footer.js'; -import './Stats.css'; - +import React, { useState, useEffect } from "react"; +import axios from "axios"; +import Nav from "../../components/Nav/Nav.js"; +import Footer from "../../components/Footer/Footer.js"; +import "./Stats.css"; const Stats = () => { const [username, setUsername] = useState(localStorage.username); @@ -11,7 +10,6 @@ const Stats = () => { const [isLoading, setIsLoading] = useState(true); const [error, setError] = useState(null); - const fetchStats = () => { setIsLoading(true); fetch(`http://localhost:8001/getstats?user=${username}`) @@ -21,97 +19,134 @@ const Stats = () => { setIsLoading(false); }) .catch((error) => { - console.error('Error al obtener las preguntas:', error); - setError(error.message || 'Ha ocurrido un error al obtener las estadísticas'); + console.error("Error al obtener las preguntas:", error); + setError( + error.message || "Ha ocurrido un error al obtener las estadísticas" + ); setIsLoading(false); }); }; useEffect(() => { - fetch(`http://localhost:8001/getstats?user=${username}`) - .then((response) => response.json()) - .then((data) => { - setStats(data); - setIsLoading(false); - }) - .catch((error) => { - console.error('Error al obtener las preguntas:', error); - setIsLoading(false); - }); + const delayDebounceFn = setTimeout(() => { + fetch(`http://localhost:8001/getstats?user=${username}`) + .then((response) => response.json()) + .then((data) => { + setStats(data); + setIsLoading(false); + }) + .catch((error) => { + console.error("Error al obtener las preguntas:", error); + setIsLoading(false); + }); + }, 2000); + return () => clearTimeout(delayDebounceFn); }, [username]); const handleUsernameChange = (event) => { setUsername(event.target.value); }; - - const handleSearch = () => { - if (username.trim() !== '') { - fetchStats(); - } - }; if (isLoading) { - return
-

Cargando ...

-

Se está consultando su búsqueda, espere unos instantes.

-
+ return ( +
+

Cargando ...

+

Se está consultando su búsqueda, espere unos instantes.

+
+ ); } if (error) { - return <> + return ( + <>