From d5f7daa7a8ba5d3f27349bc9ac8354162d4cda63 Mon Sep 17 00:00:00 2001 From: ErickHub192 Date: Sun, 9 Aug 2026 22:54:30 -0600 Subject: [PATCH] No volver a preguntar tu nombre cada vez que recargas Al refrescar la pagina te sacaba a la pantalla del nombre, con el nombre ya escrito y la sala ya elegida: un boton de "entrar" que solo estorba. Pasaba porque `entered` es estado de React y se pierde al recargar, asi que arrancaba en false aunque el nombre llevara ahi desde la primera visita. Se nota mas de lo que parece: recargar es lo primero que hace la gente cuando algo se ve raro. Ahora arranca mirando el nombre guardado, que es justo la senal de que esa pantalla ya cumplio. Sin nombre se sigue preguntando, porque es la primera vez. De paso, `recordarSala` se mueve del boton a un efecto: vivia solo ahi, y con este cambio ese boton deja de pulsarse en casi todas las visitas, asi que "tus salas" se habria quedado congelada en la primera vez que entraste a cada una. Sigue sin anotarse por solo abrir un link: corre cuando ya estas dentro. Co-Authored-By: Claude Opus 5 --- web/src/App.tsx | 34 ++++++++++++++++++++++++++++++---- 1 file changed, 30 insertions(+), 4 deletions(-) diff --git a/web/src/App.tsx b/web/src/App.tsx index 682265d..4b5049a 100644 --- a/web/src/App.tsx +++ b/web/src/App.tsx @@ -41,7 +41,19 @@ function readRoomFromHash(): string | null { export function App() { const [roomId, setRoomId] = useState(readRoomFromHash()); const [name, setName] = useState(localStorage.getItem("multi-name") ?? ""); - const [entered, setEntered] = useState(false); + /** + * Si ya diste tu nombre alguna vez, no se te vuelve a preguntar. + * + * `entered` es estado de React y se pierde al recargar, así que arrancar + * siempre en `false` mandaba a la pantalla del nombre CADA vez que alguien + * refrescaba: con el nombre ya escrito y la sala ya elegida, un botón de + * "entrar" que solo estorba. Recargar es lo primero que hace la gente cuando + * algo se ve raro, así que se topaban con eso seguido. + * + * El nombre guardado es justo la señal de que esa pantalla ya cumplió su + * función. Sin nombre sí se pregunta: es la primera vez. + */ + const [entered, setEntered] = useState(() => !!localStorage.getItem("multi-name")); useEffect(() => { const onHash = () => setRoomId(readRoomFromHash()); @@ -49,6 +61,21 @@ export function App() { return () => window.removeEventListener("hashchange", onHash); }, []); + /** + * Anotar la sala en la que de verdad estás, también al recargar. + * + * `recordarSala` vivía solo en el botón de entrar. Con el salto de arriba ese + * botón deja de pulsarse en la mayoría de las visitas, y sin esto la lista de + * "tus salas" se quedaría congelada en la primera vez que entraste a cada una. + * + * Sigue sin anotarse por el solo hecho de leer el hash: esto corre cuando + * `entered` ya es cierto, o sea cuando estás dentro, no cuando abriste un link + * que no llegaste a usar. + */ + useEffect(() => { + if (roomId && entered) recordarSala(roomId); + }, [roomId, entered]); + // Pantalla 1: sin sala → crear o pegar link. if (!roomId) return ; @@ -61,9 +88,8 @@ export function App() { setName={setName} onEnter={() => { localStorage.setItem("multi-name", name || "anónimo"); - // Se anota AQUÍ y no al leer el hash: abrir un link que no llegaste a - // usar no debería llenarte el historial. - recordarSala(roomId); + // La sala se anota en el efecto de arriba, en cuanto `entered` es + // cierto. Aquí solo se guarda el nombre y se entra. setEntered(true); }} />