UX mejoras

backend/server-prod.js

@@ -21,6 +21,9 @@ const client = new MongoClient(uri);
 let db;
 let amigosCollection;
 
+// Array para almacenar las conexiones SSE
+let sseClients = [];
+
 // Connect to MongoDB
 async function connectDB() {
   try {
@@ -49,6 +52,40 @@ app.get('/api/amigos', async (req, res) => {
   }
 });
 
+// SSE endpoint para cambios en tiempo real
+app.get('/api/stream', (req, res) => {
+  // Configurar headers para SSE
+  res.writeHead(200, {
+    'Content-Type': 'text/event-stream',
+    'Cache-Control': 'no-cache',
+    'Connection': 'keep-alive',
+    'Access-Control-Allow-Origin': '*',
+    'Access-Control-Allow-Headers': 'Cache-Control'
+  });
+
+  // Agregar cliente a la lista
+  sseClients.push(res);
+
+  // Manejar desconexión del cliente
+  req.on('close', () => {
+    sseClients = sseClients.filter(client => client !== res);
+  });
+
+  // Enviar ping inicial
+  res.write(`data: ${JSON.stringify({ type: 'connected', message: 'SSE connected' })}\n\n`);
+});
+
+// Función para notificar a todos los clientes SSE
+function notifyClients(data) {
+  sseClients.forEach(client => {
+    try {
+      client.write(`data: ${JSON.stringify(data)}\n\n`);
+    } catch (error) {
+      console.error('Error sending SSE data:', error);
+    }
+  });
+}
+
 // Add new amigo
 app.post('/api/amigos', async (req, res) => {
   try {
@@ -62,6 +99,14 @@ app.post('/api/amigos', async (req, res) => {
     }
     
     const result = await amigosCollection.insertOne({ nombre });
+    const newAmigo = { _id: result.insertedId, nombre };
+    
+    // Notificar a todos los clientes SSE
+    notifyClients({
+      type: 'amigo_added',
+      amigo: newAmigo
+    });
+    
     res.status(201).json({ 
       message: 'Amigo agregado exitosamente',
       id: result.insertedId,

backend/server.js

@@ -16,6 +16,9 @@ const client = new MongoClient(uri);
 let db;
 let amigosCollection;
 
+// Array para almacenar las conexiones SSE
+let sseClients = [];
+
 // Connect to MongoDB
 async function connectDB() {
   try {
@@ -48,6 +51,40 @@ app.get('/api/vistiantes_hoy', async (req, res) => {
   }
 });
 
+// SSE endpoint para cambios en tiempo real
+app.get('/api/stream', (req, res) => {
+  // Configurar headers para SSE
+  res.writeHead(200, {
+    'Content-Type': 'text/event-stream',
+    'Cache-Control': 'no-cache',
+    'Connection': 'keep-alive',
+    'Access-Control-Allow-Origin': '*',
+    'Access-Control-Allow-Headers': 'Cache-Control'
+  });
+
+  // Agregar cliente a la lista
+  sseClients.push(res);
+
+  // Manejar desconexión del cliente
+  req.on('close', () => {
+    sseClients = sseClients.filter(client => client !== res);
+  });
+
+  // Enviar ping inicial
+  res.write(`data: ${JSON.stringify({ type: 'connected', message: 'SSE connected' })}\n\n`);
+});
+
+// Función para notificar a todos los clientes SSE
+function notifyClients(data) {
+  sseClients.forEach(client => {
+    try {
+      client.write(`data: ${JSON.stringify(data)}\n\n`);
+    } catch (error) {
+      console.error('Error sending SSE data:', error);
+    }
+  });
+}
+
 // Add new amigo
 app.post('/api/amigos', async (req, res) => {
   try {
@@ -57,6 +94,14 @@ app.post('/api/amigos', async (req, res) => {
     }
     
     const result = await amigosCollection.insertOne({ nombre });
+    const newAmigo = { _id: result.insertedId, nombre };
+    
+    // Notificar a todos los clientes SSE
+    notifyClients({
+      type: 'amigo_added',
+      amigo: newAmigo
+    });
+    
     res.status(201).json({ 
       message: 'Amigo agregado exitosamente',
       id: result.insertedId,