feat: add chat message history and infinite scroll

Backend changes:
- Socket.IO: Send last 20 messages on join_event_room
- REST API: Add GET /api/events/:eventId/messages endpoint with pagination
- Support for 'before' cursor-based pagination for loading older messages

Frontend changes:
- Load initial 20 messages when joining event chat
- Implement infinite scroll to load older messages on scroll to top
- Add loading indicator for older messages
- Preserve scroll position when loading older messages
- Add eventsAPI.getMessages() function for pagination

User experience:
- New users see last 20 messages immediately
- Scrolling up automatically loads older messages in batches of 20
- Smooth scrolling experience with position restoration

Note: Messages are encrypted in transit via HTTPS/WSS but stored
as plain text in database (no E2E encryption).

backend/src/socket/index.js

@@ -77,6 +77,43 @@ function initializeSocket(httpServer) {
 
         console.log(`👤 ${socket.user.username} joined event room ${eventId}`);
 
+        // Load last 20 messages from database
+        const chatRoom = await prisma.chatRoom.findFirst({
+          where: {
+            eventId: parseInt(eventId),
+            type: 'event',
+          },
+        });
+
+        if (chatRoom) {
+          const messages = await prisma.message.findMany({
+            where: { roomId: chatRoom.id },
+            include: {
+              user: {
+                select: {
+                  id: true,
+                  username: true,
+                  avatar: true,
+                },
+              },
+            },
+            orderBy: { createdAt: 'desc' },
+            take: 20,
+          });
+
+          // Send message history to the joining user (reverse to chronological order)
+          socket.emit('message_history', messages.reverse().map(msg => ({
+            id: msg.id,
+            roomId: msg.roomId,
+            userId: msg.user.id,
+            username: msg.user.username,
+            avatar: msg.user.avatar,
+            content: msg.content,
+            type: msg.type,
+            createdAt: msg.createdAt,
+          })));
+        }
+
         // Broadcast updated active users list
         const users = Array.from(activeUsers.get(eventId)).map(u => JSON.parse(u));
         io.to(roomName).emit('active_users', users);