Refactor backend CORS settings to include default origins and improve error handling in chat services: Introduce dynamic CORS origin handling, enhance RabbitMQ message sending with fallback mechanisms, and update WebSocket service to manage pending messages. Update UI components for better accessibility and responsiveness, including adjustments to dialog and navigation elements. Enhance styling for improved user experience across various components.

backend/services/webSocketService.js

@@ -4,10 +4,50 @@ import amqp from 'amqplib/callback_api.js';
 
 const RABBITMQ_URL = process.env.AMQP_URL || 'amqp://localhost';
 const QUEUE = 'chat_messages';
+const MAX_PENDING_MESSAGES = 500;
+
+function routeMessage(io, message) {
+    if (!message || typeof message !== 'object') return;
+
+    if (message.socketId) {
+        io.to(message.socketId).emit('newMessage', message);
+        return;
+    }
+    if (message.recipientSocketId) {
+        io.to(message.recipientSocketId).emit('newMessage', message);
+        return;
+    }
+    if (message.roomId) {
+        io.to(String(message.roomId)).emit('newMessage', message);
+        return;
+    }
+    if (message.room) {
+        io.to(String(message.room)).emit('newMessage', message);
+        return;
+    }
+
+    io.emit('newMessage', message);
+}
 
 export function setupWebSocket(server) {
     const io = new Server(server);
     let channel = null;
+    let pendingMessages = [];
+
+    const flushPendingMessages = () => {
+        if (!channel || pendingMessages.length === 0) return;
+        const queued = pendingMessages;
+        pendingMessages = [];
+        for (const message of queued) {
+            try {
+                channel.sendToQueue(QUEUE, Buffer.from(JSON.stringify(message)));
+            } catch (err) {
+                console.warn('[webSocketService] Flush fehlgeschlagen, Nachricht bleibt im Fallback:', err.message);
+                pendingMessages.unshift(message);
+                break;
+            }
+        }
+    };
 
     amqp.connect(RABBITMQ_URL, (err, connection) => {
         if (err) {
@@ -36,8 +76,9 @@ export function setupWebSocket(server) {
             channel.consume(QUEUE, (msg) => {
                 if (!msg) return;
                 const message = JSON.parse(msg.content.toString());
-                io.emit('newMessage', message);
+                routeMessage(io, message);
             }, { noAck: true });
+            flushPendingMessages();
         });
     });
 
@@ -46,11 +87,21 @@ export function setupWebSocket(server) {
 
         socket.on('newMessage', (message) => {
             if (channel) {
-                channel.sendToQueue(QUEUE, Buffer.from(JSON.stringify(message)));
-                return;
+                try {
+                    channel.sendToQueue(QUEUE, Buffer.from(JSON.stringify(message)));
+                } catch (err) {
+                    console.warn('[webSocketService] sendToQueue fehlgeschlagen, nutze In-Memory-Fallback:', err.message);
+                    channel = null;
+                }
             }
 
-            io.emit('newMessage', message);
+            if (!channel) {
+                pendingMessages.push(message);
+                if (pendingMessages.length > MAX_PENDING_MESSAGES) {
+                    pendingMessages = pendingMessages.slice(-MAX_PENDING_MESSAGES);
+                }
+                return;
+            }
         });
 
         socket.on('disconnect', () => {