Fix: Update socket ID refs on reconnect (leader buttons bug)

.env.example

@@ -1,13 +1,25 @@
+# ===========================================
+# Archivo de ejemplo de configuración
+# Copia este archivo a .env y modifica los valores
+# ===========================================
+
 # Configuración de red local
 # Cambia esta IP a la IP de tu PC en la red local
-HOST_IP=192.168.1.131
+HOST_IP=192.168.1.XXX
 
 # URLs para desarrollo local
-NEXT_PUBLIC_API_URL=http://192.168.1.131:4000
+NEXT_PUBLIC_API_URL=http://192.168.1.XXX:4000
-CORS_ORIGIN=http://192.168.1.131:3000
+CORS_ORIGIN=http://192.168.1.XXX:3000
+
+# URLs para producción (descomentar y ajustar)
+# NEXT_PUBLIC_API_URL=https://api.tudominio.com
+# CORS_ORIGIN=https://tudominio.com
 
 # Configuración de base de datos
 DATABASE_URL=postgresql://postgres:password@db:5432/resistencia
 POSTGRES_USER=postgres
-POSTGRES_PASSWORD=password
+POSTGRES_PASSWORD=cambia_esta_contraseña
 POSTGRES_DB=resistencia
+
+# Contraseña del dashboard de administración
+NEXT_PUBLIC_ADMIN_PASSWORD=cambia_esta_contraseña

client/Dockerfile

@@ -1,7 +1,12 @@
 FROM node:20-alpine
 
-# Build argument for API URL
+# Build arguments
 ARG NEXT_PUBLIC_API_URL=http://localhost:4000
+ARG NEXT_PUBLIC_ADMIN_PASSWORD=admin123
+
+# Make args available as env vars during build
+ENV NEXT_PUBLIC_API_URL=$NEXT_PUBLIC_API_URL
+ENV NEXT_PUBLIC_ADMIN_PASSWORD=$NEXT_PUBLIC_ADMIN_PASSWORD
 
 # Create app directory
 WORKDIR /app

client/package.json

@@ -1,6 +1,6 @@
 {
     "name": "resistencia-client",
-    "version": "1.1.2",
+    "version": "1.3.0",
     "private": true,
     "scripts": {
         "dev": "next dev",

client/src/app/dashboard/page.tsx

@@ -3,9 +3,9 @@
 import { useState, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { useSocket } from '../../hooks/useSocket';
-import { Shield, Users, Gamepad2, LogOut, Clock, History, UserMinus, Key } from 'lucide-react';
+import { Shield, Users, Gamepad2, LogOut, Clock, History, UserMinus, Key, ChevronDown } from 'lucide-react';
 
-const ADMIN_PASSWORD = "admin123";
+const ADMIN_PASSWORD = process.env.NEXT_PUBLIC_ADMIN_PASSWORD || "admin123";
 
 export default function Dashboard() {
     const { socket, isConnected } = useSocket();
@@ -14,6 +14,7 @@ export default function Dashboard() {
     const [activeGames, setActiveGames] = useState<any[]>([]);
     const [gameHistory, setGameHistory] = useState<any[]>([]);
     const [error, setError] = useState('');
+    const [expandedGames, setExpandedGames] = useState<Set<string>>(new Set());
 
     // Comprobar sesión al cargar
     useEffect(() => {
@@ -77,6 +78,15 @@ export default function Dashboard() {
         }
     };
 
+    const toggleGame = (id: string) => {
+        setExpandedGames(prev => {
+            const newSet = new Set(prev);
+            if (newSet.has(id)) newSet.delete(id);
+            else newSet.add(id);
+            return newSet;
+        });
+    };
+
     if (!isAuthenticated) {
         return (
             <div className="min-h-screen bg-[#0a0a0c] flex items-center justify-center p-4 font-['Inter',sans-serif]">
@@ -193,7 +203,7 @@ export default function Dashboard() {
                             <h2 className="text-xl font-black text-white uppercase tracking-tighter italic border-l-4 border-red-600 pl-4">Canales de Radio Activos</h2>
                         </div>
 
-                        <div className="grid gap-6">
+                        <div className="grid gap-4">
                             <AnimatePresence mode="popLayout">
                                 {activeGames.length === 0 ? (
                                     <motion.div
@@ -213,57 +223,93 @@ export default function Dashboard() {
                                             initial={{ opacity: 0, x: -20 }}
                                             animate={{ opacity: 1, x: 0 }}
                                             exit={{ opacity: 0, scale: 0.95 }}
-                                            className="bg-[#121216] border border-white/10 rounded-3xl p-8 hover:bg-[#16161c] transition-all group shadow-xl"
+                                            className="bg-[#121216] border border-white/10 rounded-3xl overflow-hidden hover:bg-[#16161c] transition-all group shadow-lg"
                                         >
-                                            <div className="flex flex-col md:flex-row justify-between items-start md:items-center gap-6">
+                                            {/* Cabecera Compacta (Clickable) */}
-                                                <div className="flex-1">
+                                            <div
-                                                    <div className="flex items-center gap-3 mb-2">
+                                                onClick={() => toggleGame(game.id)}
-                                                        <h3 className="text-2xl font-black text-white italic uppercase tracking-tighter leading-none">{game.name}</h3>
+                                                className="flex flex-wrap items-center justify-between p-6 cursor-pointer gap-4"
-                                                        <span className="text-[10px] font-bold px-2 py-0.5 bg-red-500/10 text-red-500 rounded border border-red-500/20">{game.status}</span>
+                                            >
-                                                    </div>
+                                                <div className="flex items-center gap-4">
-                                                    <div className="flex items-center gap-4 text-[10px] uppercase font-black tracking-widest text-gray-500">
+                                                    <div className="w-2 h-12 bg-red-600 rounded-full" />
-                                                        <span className="flex items-center gap-1.5">
+                                                    <div>
-                                                            <Users size={12} className="text-red-500" />
+                                                        <h3 className="text-xl font-black text-white italic uppercase tracking-tighter leading-none mb-1">{game.name}</h3>
-                                                            {game.currentPlayers} / {game.maxPlayers} Agentes Movilizados
+                                                        <div className="flex items-center gap-2 text-[10px] uppercase font-black tracking-widest text-gray-500">
-                                                        </span>
+                                                            <span>ID: {game.id.slice(0, 6)}</span>
-                                                        <span className="text-gray-800">|</span>
+                                                            <span className="text-gray-700">•</span>
-                                                        <span>ID: {game.id.slice(0, 8)}</span>
+                                                            <span>{new Date(game.created_at || Date.now()).toLocaleTimeString()}</span>
-                                                    </div>
-                                                </div>
-
-                                                <button
-                                                    onClick={() => closeGame(game.id)}
-                                                    className="px-6 py-3 bg-zinc-900 hover:bg-red-600 text-gray-400 hover:text-white rounded-2xl text-[10px] font-black uppercase tracking-[0.2em] transition-all border border-white/5 active:scale-95 whitespace-nowrap"
-                                                >
-                                                    Abortar Misión
-                                                </button>
-                                            </div>
-
-                                            {/* Subpanel: Jugadores */}
-                                            <div className="mt-8 pt-8 border-t border-white/5">
-                                                <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
-                                                    {game.players.map((player: any) => (
-                                                        <div key={player.id} className="bg-black/40 p-4 rounded-2xl border border-white/5 flex items-center justify-between group/player hover:border-red-500/30 transition-all">
-                                                            <div className="flex items-center gap-3">
-                                                                <div className="w-10 h-10 rounded-xl bg-white/5 flex items-center justify-center font-black text-red-500 border border-white/5 group-hover/player:bg-red-500 group-hover/player:text-white transition-all">
-                                                                    {player.name[0].toUpperCase()}
-                                                                </div>
-                                                                <div>
-                                                                    <p className="text-sm font-black text-white leading-none mb-1">{player.name}</p>
-                                                                    <p className="text-[9px] opacity-30 font-mono italic">AG-{player.id.slice(0, 4)}</p>
-                                                                </div>
-                                                            </div>
-                                                            <button
-                                                                onClick={() => kickPlayer(game.id, player.id)}
-                                                                className="p-2.5 text-gray-700 hover:text-red-500 hover:bg-red-500/10 rounded-xl transition-all opacity-0 group-hover/player:opacity-100"
-                                                                title="Expulsar de la zona"
-                                                            >
-                                                                <UserMinus size={18} />
-                                                            </button>
                                                         </div>
-                                                    ))}
+                                                    </div>
+                                                </div>
+
+                                                <div className="flex items-center gap-6">
+                                                    <div className="flex items-center gap-2 bg-black/40 px-3 py-1.5 rounded-lg border border-white/5">
+                                                        <Users size={14} className="text-gray-400" />
+                                                        <span className="text-xs font-bold text-white">{game.currentPlayers} / {game.maxPlayers}</span>
+                                                    </div>
+                                                    <div className={`px-3 py-1 rounded text-[10px] font-black uppercase tracking-widest border ${game.status === 'WAITING' ? 'bg-orange-500/10 text-orange-500 border-orange-500/20' : 'bg-green-500/10 text-green-500 border-green-500/20'}`}>
+                                                        {game.status}
+                                                    </div>
+                                                    {game.currentRound > 0 && (
+                                                        <div className="bg-white/10 px-3 py-1 rounded text-[10px] font-black uppercase tracking-widest border border-white/10">
+                                                            {game.matchNumber > 1 ? `P${game.matchNumber} - R${game.currentRound}` : `Ronda ${game.currentRound}`}
+                                                        </div>
+                                                    )}
+                                                    <ChevronDown
+                                                        size={20}
+                                                        className={`text-gray-500 transition-transform duration-300 ${expandedGames.has(game.id) ? 'rotate-180' : ''}`}
+                                                    />
                                                 </div>
                                             </div>
+
+                                            {/* Contenido Expandible */}
+                                            <AnimatePresence>
+                                                {expandedGames.has(game.id) && (
+                                                    <motion.div
+                                                        initial={{ height: 0, opacity: 0 }}
+                                                        animate={{ height: 'auto', opacity: 1 }}
+                                                        exit={{ height: 0, opacity: 0 }}
+                                                        className="border-t border-white/5 bg-black/20"
+                                                    >
+                                                        <div className="p-6 pt-2">
+                                                            {/* Panel de Control */}
+                                                            <div className="flex justify-end mb-6">
+                                                                <button
+                                                                    onClick={(e) => { e.stopPropagation(); closeGame(game.id); }}
+                                                                    className="px-6 py-3 bg-zinc-900 hover:bg-red-900/40 text-gray-400 hover:text-red-400 rounded-2xl text-[10px] font-black uppercase tracking-[0.2em] transition-all border border-white/5 hover:border-red-500/30 active:scale-95 whitespace-nowrap flex items-center gap-2"
+                                                                >
+                                                                    <LogOut size={14} />
+                                                                    Abortar Misión
+                                                                </button>
+                                                            </div>
+
+                                                            {/* Grid de Jugadores */}
+                                                            <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 gap-3">
+                                                                {game.players.map((player: any) => (
+                                                                    <div key={player.id} className="bg-[#0a0a0c] p-3 rounded-xl border border-white/5 flex items-center justify-between group/player hover:border-white/10 transition-all">
+                                                                        <div className="flex items-center gap-3">
+                                                                            <div className="w-8 h-8 rounded-lg bg-white/5 flex items-center justify-center font-black text-gray-400 text-xs border border-white/5 group-hover/player:text-white transition-all">
+                                                                                {player.name[0].toUpperCase()}
+                                                                            </div>
+                                                                            <div className="overflow-hidden">
+                                                                                <p className="text-xs font-bold text-gray-300 truncate">{player.name}</p>
+                                                                                <p className="text-[9px] opacity-30 font-mono">AG-{player.id.slice(0, 4)}</p>
+                                                                            </div>
+                                                                        </div>
+                                                                        <button
+                                                                            onClick={(e) => { e.stopPropagation(); kickPlayer(game.id, player.id); }}
+                                                                            className="p-2 text-gray-700 hover:text-red-500 hover:bg-red-500/10 rounded-lg transition-all opacity-0 group-hover/player:opacity-100"
+                                                                            title="Expulsar"
+                                                                        >
+                                                                            <UserMinus size={14} />
+                                                                        </button>
+                                                                    </div>
+                                                                ))}
+                                                            </div>
+                                                        </div>
+                                                    </motion.div>
+                                                )}
+                                            </AnimatePresence>
                                         </motion.div>
                                     ))
                                 )}
@@ -280,53 +326,104 @@ export default function Dashboard() {
                         </div>
 
                         <div className="bg-[#121216] border border-white/10 rounded-3xl overflow-hidden shadow-2xl">
-                            <div className="p-6 bg-white/5 border-b border-white/5">
+                            <div className="p-6 bg-white/5 border-b border-white/5 flex justify-between items-center">
-                                <p className="text-[10px] uppercase font-black tracking-widest text-gray-400">Últimos Informes Desclasificados</p>
+                                <p className="text-[10px] uppercase font-black tracking-widest text-gray-400">Archivos Recientes</p>
+                                <History size={14} className="text-gray-600" />
                             </div>
 
-                            <div className="max-h-[60vh] overflow-y-auto custom-scrollbar p-6 space-y-6">
+                            <div className="max-h-[60vh] overflow-y-auto custom-scrollbar p-0">
                                 {gameHistory.length === 0 ? (
                                     <div className="text-center py-20 opacity-10">
-                                        <History size={40} className="mx-auto mb-4" />
+                                        <p className="text-xs italic font-bold">Sin registros</p>
-                                        <p className="text-xs italic font-bold">Sin archivos registrados</p>
                                     </div>
                                 ) : (
                                     gameHistory.map((entry: any) => (
-                                        <motion.div
+                                        <div key={entry.id} className="border-b border-white/5 last:border-0 last:rounded-b-3xl">
-                                            initial={{ opacity: 0 }}
+                                            {/* Cabecera Historial */}
-                                            animate={{ opacity: 1 }}
+                                            <div
-                                            key={entry.id}
+                                                onClick={() => toggleGame(entry.id)}
-                                            className="group relative"
+                                                className={`p-4 cursor-pointer hover:bg-white/5 transition-colors flex justify-between items-center group relative overflow-hidden ${expandedGames.has(entry.id) ? 'bg-white/[0.02]' : ''}`}
-                                        >
+                                            >
-                                            <div className="flex justify-between items-start">
+                                                <div className={`absolute left-0 top-0 bottom-0 w-1 transition-all ${entry.winner === 'resistance' ? 'bg-blue-500' : entry.winner === 'spies' ? 'bg-red-500' : 'bg-gray-600'} ${expandedGames.has(entry.id) ? 'opacity-100' : 'opacity-40 group-hover:opacity-100'}`} />
-                                                <div className="space-y-1">
+
-                                                    <h4 className="text-sm font-black text-gray-200 uppercase tracking-tight group-hover:text-white transition-colors leading-none mb-1">{entry.room_name}</h4>
+                                                <div className="pl-3">
+                                                    <h4 className="text-sm font-black text-gray-200 uppercase tracking-tight leading-none mb-1">{entry.room_name}</h4>
                                                     <div className="flex items-center gap-2 text-[9px] text-gray-600 font-bold uppercase tracking-widest">
                                                         <span>{entry.host_name}</span>
-                                                        <span>•</span>
-                                                        <span>{new Date(entry.created_at).toLocaleDateString()}</span>
                                                     </div>
                                                 </div>
-                                                <div className={`text-[9px] font-black uppercase px-2 py-1 rounded shadow-sm ${entry.winner === 'resistance' ? 'bg-green-500/20 text-green-500' :
+
-                                                        entry.winner === 'spies' ? 'bg-red-500/20 text-red-500' : 'bg-gray-700/20 text-gray-500'
+                                                <div className="flex items-center gap-3">
-                                                    }`}>
+                                                    <div className={`text-[9px] font-black uppercase px-2 py-1 rounded ${entry.winner === 'resistance' ? 'bg-blue-500/10 text-blue-500' :
-                                                    {entry.winner ? (entry.winner === 'resistance' ? 'RES' : 'SPIES') : 'LOGOUT'}
+                                                        entry.winner === 'spies' ? 'bg-red-500/10 text-red-500' : 'bg-gray-700/20 text-gray-500'
+                                                        }`}>
+                                                        {entry.winner ? (entry.winner === 'resistance' ? 'ALIAD' : 'AXIS') : '??'}
+                                                    </div>
+                                                    <ChevronDown
+                                                        size={14}
+                                                        className={`text-gray-600 transition-transform ${expandedGames.has(entry.id) ? 'rotate-180' : ''}`}
+                                                    />
                                                 </div>
                                             </div>
-                                            <div className="mt-2 flex items-center gap-3 text-[9px] opacity-40 group-hover:opacity-60 transition-opacity">
+
-                                                <span className="flex items-center gap-1 font-mono">{entry.players.split(',').length} Agtes</span>
+                                            {/* Detalles Historial Expandido */}
-                                                <div className="w-1 h-1 bg-white/20 rounded-full"></div>
+                                            <AnimatePresence>
-                                                <span>{new Date(entry.created_at).toLocaleTimeString()}</span>
+                                                {expandedGames.has(entry.id) && (
-                                            </div>
+                                                    <motion.div
-                                            <div className="absolute -left-6 top-1.5 w-1 h-0 group-hover:h-3 bg-red-600 transition-all rounded-full"></div>
+                                                        initial={{ height: 0, opacity: 0 }}
-                                        </motion.div>
+                                                        animate={{ height: 'auto', opacity: 1 }}
+                                                        exit={{ height: 0, opacity: 0 }}
+                                                        className="bg-black/20"
+                                                    >
+                                                        <div className="p-4 pl-7 text-[10px] text-gray-400 space-y-2 font-mono border-t border-white/5">
+                                                            <div className="flex justify-between">
+                                                                <span>FECHA:</span>
+                                                                <span className="text-gray-300">{new Date(entry.created_at).toLocaleDateString()}</span>
+                                                            </div>
+                                                            <div className="flex justify-between">
+                                                                <span>HORA:</span>
+                                                                <span className="text-gray-300">{new Date(entry.created_at).toLocaleTimeString()}</span>
+                                                            </div>
+                                                            <div className="flex justify-between">
+                                                                <span>AGENTES:</span>
+                                                                <span className="text-gray-300">{entry.players.split(',').length}</span>
+                                                            </div>
+                                                            {entry.matches_played > 0 && (
+                                                                <>
+                                                                    <div className="flex justify-between">
+                                                                        <span>PARTIDAS:</span>
+                                                                        <span className="text-gray-300">{entry.matches_played}</span>
+                                                                    </div>
+                                                                    {entry.match_results && entry.match_results.length > 0 && (
+                                                                        <div className="flex justify-between items-center pt-2">
+                                                                            <span>RESULTADOS:</span>
+                                                                            <div className="flex gap-1">
+                                                                                {entry.match_results.split(',').map((res: string, idx: number) => (
+                                                                                    <div
+                                                                                        key={idx}
+                                                                                        className={`w-3 h-3 rounded-full ${res === 'aliados' ? 'bg-blue-500' : 'bg-red-500'}`}
+                                                                                        title={res === 'aliados' ? 'Victoria Aliados' : 'Victoria Nazis'}
+                                                                                    />
+                                                                                ))}
+                                                                            </div>
+                                                                        </div>
+                                                                    )}
+                                                                </>
+                                                            )}
+                                                            {entry.players && (
+                                                                <div className="pt-2 border-t border-white/5 mt-2">
+                                                                    <p className="mb-1 opacity-50">PARTICIPANTES:</p>
+                                                                    <p className="text-gray-500 leading-relaxed">{entry.players.split(',').join(', ')}</p>
+                                                                </div>
+                                                            )}
+                                                        </div>
+                                                    </motion.div>
+                                                )}
+                                            </AnimatePresence>
+                                        </div>
                                     ))
                                 )}
                             </div>
-
-                            <div className="p-6 bg-white/5 border-t border-white/5">
-                                <p className="text-[9px] font-bold text-center text-gray-600 uppercase tracking-widest">Fin del Informe Forense</p>
-                            </div>
                         </div>
                     </section>
                 </div>

client/src/components/GameBoard.tsx

@@ -996,7 +996,7 @@ function VotingTimer() {
     }, [timeLeft]);
 
     return (
-        <div className="fixed top-5 left-5 bg-red-600/80 text-white w-16 h-16 rounded-full flex items-center justify-center border-4 border-red-400 animate-pulse text-2xl font-bold font-mono">
+        <div className="mx-auto my-2 bg-gray-900/90 text-white w-20 h-20 rounded-full flex items-center justify-center border-4 border-gray-500 text-3xl font-bold font-mono shadow-xl relative z-20">
             {timeLeft}
         </div>
     );

client/src/components/MissionReveal.tsx

@@ -1,5 +1,5 @@
 import { motion } from 'framer-motion';
-import { useEffect } from 'react';
+import { useEffect, useMemo } from 'react';
 import Image from 'next/image';
 
 interface MissionRevealProps {
@@ -8,6 +8,16 @@ interface MissionRevealProps {
 }
 
 export default function MissionReveal({ votes, onFinished }: MissionRevealProps) {
+    // Barajar votos de forma aleatoria en cada cliente (orden diferente para cada jugador)
+    const shuffledVotes = useMemo(() => {
+        const shuffled = [...votes];
+        for (let i = shuffled.length - 1; i > 0; i--) {
+            const j = Math.floor(Math.random() * (i + 1));
+            [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];
+        }
+        return shuffled;
+    }, [votes]);
+
     // Timer de seguridad: 5 segundos y avanza
     useEffect(() => {
         const timer = setTimeout(() => {
@@ -28,7 +38,7 @@ export default function MissionReveal({ votes, onFinished }: MissionRevealProps)
             </h2>
 
             <div className="flex gap-4 justify-center mb-12 flex-wrap max-w-[90vw]">
-                {votes.map((vote, idx) => (
+                {shuffledVotes.map((vote, idx) => (
                     <motion.div
                         key={idx}
                         className="w-32 h-48 rounded-xl flex items-center justify-center shadow-2xl relative overflow-hidden"
@@ -55,7 +65,7 @@ export default function MissionReveal({ votes, onFinished }: MissionRevealProps)
                 className="text-white text-xl font-mono mt-8 text-center"
                 initial={{ opacity: 0 }}
                 animate={{ opacity: 1 }}
-                transition={{ delay: votes.length * 0.3 + 0.5 }}
+                transition={{ delay: shuffledVotes.length * 0.3 + 0.5 }}
             >
                 <span className="animate-pulse">Analizando resultado estratégico...</span>
             </motion.div>

docker-compose_prod.yml

@@ -7,6 +7,7 @@ services:
       dockerfile: client/Dockerfile
       args:
         - NEXT_PUBLIC_API_URL=${NEXT_PUBLIC_API_URL:-https://api.franciaocupada.martivich.es}
+        - NEXT_PUBLIC_ADMIN_PASSWORD=${NEXT_PUBLIC_ADMIN_PASSWORD:-admin123}
     ports:
       - "3000:3000"
     volumes:
@@ -15,6 +16,7 @@ services:
       - /app/client/node_modules
     environment:
       - NEXT_PUBLIC_API_URL=${NEXT_PUBLIC_API_URL:-https://api.franciaocupada.martivich.es}
+      - NEXT_PUBLIC_ADMIN_PASSWORD=${NEXT_PUBLIC_ADMIN_PASSWORD:-admin123}
     depends_on:
       - server
     networks:

server/package.json

@@ -1,6 +1,6 @@
 {
   "name": "resistencia-server",
-  "version": "1.1.2",
+  "version": "1.3.0",
   "description": "Backend para el juego La Resistencia",
   "main": "src/index.ts",
   "scripts": {

server/src/db.ts

@@ -25,6 +25,16 @@ export const initDb = async () => {
                 status TEXT DEFAULT 'active' -- 'active', 'finished', 'aborted'
             );
         `);
+
+        // Migration: Add new columns if they don't exist
+        await client.query(`
+            ALTER TABLE game_logs 
+            ADD COLUMN IF NOT EXISTS rounds_played INTEGER DEFAULT 0,
+            ADD COLUMN IF NOT EXISTS round_results TEXT DEFAULT '',
+            ADD COLUMN IF NOT EXISTS matches_played INTEGER DEFAULT 1,
+            ADD COLUMN IF NOT EXISTS match_results TEXT DEFAULT '';
+        `);
+
         console.log('[DB] Base de datos inicializada correctamente');
     } catch (err) {
         console.error('[DB] Error al inicializar base de datos:', err);
@@ -58,11 +68,24 @@ export const updateGamePlayers = async (roomId: string, players: string[]) => {
 };
 
 // Registrar fin de partida
-export const logGameEnd = async (roomId: string, winner: string | null = null, aborted: boolean = false) => {
+export const logGameEnd = async (
+    roomId: string,
+    winner: string | null = null,
+    aborted: boolean = false,
+    roundsPlayed: number = 0,
+    roundResults: boolean[] = [],
+    matchesPlayed: number = 1,
+    matchResults: string[] = []
+) => {
     try {
+        // Convert boolean[] to string "true,false,true"
+        const roundResultsStr = roundResults.map(r => r === true ? 'true' : r === false ? 'false' : '').filter(r => r).join(',');
+        // matchResults is already string[] like ["aliados", "alemanes"]
+        const matchResultsStr = matchResults.join(',');
+
         await pool.query(
-            'UPDATE game_logs SET finished_at = CURRENT_TIMESTAMP, winner = $1, status = $2 WHERE room_id = $3 AND status = $4',
+            'UPDATE game_logs SET finished_at = CURRENT_TIMESTAMP, winner = $1, status = $2, rounds_played = $3, round_results = $4, matches_played = $5, match_results = $6 WHERE room_id = $7 AND status = $8',
-            [winner, aborted ? 'aborted' : 'finished', roomId, 'active']
+            [winner, aborted ? 'aborted' : 'finished', roundsPlayed, roundResultsStr, matchesPlayed, matchResultsStr, roomId, 'active']
         );
     } catch (err) {
         console.error('[DB] Error al registrar fin de partida:', err);

server/src/index.ts

@@ -90,6 +90,8 @@ const getAdminData = async () => {
         status: g.state.phase,
         currentPlayers: g.state.players.length,
         maxPlayers: g.maxPlayers,
+        currentRound: g.state.currentRound,
+        matchNumber: g.state.matchNumber,
         players: g.state.players.map(p => ({ id: p.id, name: p.name }))
     }));
 
@@ -347,8 +349,10 @@ io.on('connection', (socket) => {
             // Desconectar a todos los jugadores de la sala
             io.in(roomId).socketsLeave(roomId);
 
-            // LOG EN DB
+            // LOG EN DB - Incluir resultado de la partida actual en matchResults
-            logGameEnd(roomId, game.state.winner, false);
+            const finalMatchResults = [...game.state.matchResults];
+            if (game.state.winner) finalMatchResults.push(game.state.winner);
+            logGameEnd(roomId, game.state.winner, false, game.state.currentRound, game.state.questResults, game.state.matchNumber, finalMatchResults);
             broadcastAdminUpdate();
         }
     });
@@ -381,7 +385,9 @@ io.on('connection', (socket) => {
             io.in(roomId).socketsLeave(roomId);
 
             // LOG EN DB COMO ABORTADA
-            logGameEnd(roomId, null, true);
+            const finalMatchResults = [...game.state.matchResults];
+            if (game.state.winner) finalMatchResults.push(game.state.winner);
+            logGameEnd(roomId, null, true, game.state.currentRound, game.state.questResults, game.state.matchNumber, finalMatchResults);
             broadcastAdminUpdate();
 
             console.log(`[LEAVE_GAME] ${playerName} abandonó la partida ${roomId}. Partida eliminada.`);
@@ -399,8 +405,8 @@ io.on('connection', (socket) => {
                 const existingPlayer = game.state.players.find(p => p.name === playerName);
 
                 if (existingPlayer) {
-                    // Actualizar el socket ID del jugador
+                    // Actualizar el socket ID del jugador y referencias
-                    existingPlayer.id = socket.id;
+                    game.updatePlayerSocket(existingPlayer.id, socket.id);
 
                     // Unir al socket a la sala
                     socket.join(roomId);
@@ -469,7 +475,9 @@ io.on('connection', (socket) => {
             io.in(roomId).socketsLeave(roomId);
 
             // Log como abortada por admin
-            await logGameEnd(roomId, null, true);
+            const finalMatchResults = [...game.state.matchResults];
+            if (game.state.winner) finalMatchResults.push(game.state.winner);
+            await logGameEnd(roomId, null, true, game.state.currentRound, game.state.questResults, game.state.matchNumber, finalMatchResults);
             socket.emit('admin_action_success');
             broadcastAdminUpdate();
         }

server/src/models/Game.ts

@@ -43,7 +43,9 @@ export class Game {
             missionHistory: [],
             revealedVotes: [],
             history: [],
-            hostId: hostId
+            hostId: hostId,
+            matchNumber: 1,
+            matchResults: []
         };
     }
 
@@ -369,7 +371,13 @@ export class Game {
     restartGame() {
         this.log('=== REINICIANDO PARTIDA ===');
 
-        // Resetear variables de juego
+        // Guardar resultado de la partida actual antes de resetear
+        if (this.state.winner) {
+            this.state.matchResults.push(this.state.winner);
+        }
+
+        // Incrementar contador de partidas y resetear variables de juego
+        this.state.matchNumber++;
         this.state.currentRound = 1;
         this.state.failedVotesCount = 0;
         this.state.questResults = [null, null, null, null, null];
@@ -407,4 +415,44 @@ export class Game {
         // Mantener solo los últimos 50 mensajes
         if (this.state.history.length > 50) this.state.history.shift();
     }
+
+    updatePlayerSocket(oldId: string, newId: string) {
+        const player = this.state.players.find(p => p.id === oldId);
+        if (!player) return;
+
+        // Actualizar ID del jugador
+        player.id = newId;
+
+        // Actualizar referencias en el estado
+
+        // 1. Host
+        if (this.hostId === oldId) {
+            this.hostId = newId;
+            this.state.hostId = newId;
+        }
+
+        // 2. Líder actual
+        if (this.state.currentLeaderId === oldId) {
+            this.state.currentLeaderId = newId;
+        }
+
+        // 3. Votos de Líder (leaderVotes)
+        if (this.state.leaderVotes && this.state.leaderVotes[oldId] !== undefined) {
+            this.state.leaderVotes[newId] = this.state.leaderVotes[oldId];
+            delete this.state.leaderVotes[oldId];
+        }
+
+        // 4. Votos de Equipo (teamVotes)
+        if (this.state.teamVotes && this.state.teamVotes[oldId] !== undefined) {
+            this.state.teamVotes[newId] = this.state.teamVotes[oldId];
+            delete this.state.teamVotes[oldId];
+        }
+
+        // 5. Equipo Propuesto (proposedTeam)
+        if (this.state.proposedTeam && this.state.proposedTeam.includes(oldId)) {
+            this.state.proposedTeam = this.state.proposedTeam.map(id => id === oldId ? newId : id);
+        }
+
+        this.log(`Jugador ${player.name} reconectado. ID actualizado.`);
+    }
 }

shared/types.ts

@@ -89,6 +89,8 @@ export interface GameState {
 
     winner?: Faction;
     history: string[]; // Log de acciones para mostrar en pantalla
+    matchNumber: number; // Número de partida en esta operación (se incrementa con cada restart)
+    matchResults: Faction[]; // Resultados de cada partida (quién ganó)
 }
 
 // Configuración de jugadores por partida (según tus reglas)