feat: add WebSocket chat message handler for multi-user chat

Enables real-time message delivery between users in the same session:

- Import addMessageFromWebSocket action from sessionChatSlice
- Create handleChatMessage callback to transform Protocol Buffer format
  to Redux format (msg_id → id, sender_id → senderId, etc.)
- Register CHAT_MESSAGE (237) callback when joining session
- Messages now dispatched to Redux when received via WebSocket

This fixes:
- Multi-user message exchange (messages now appear for remote users)
- Badge updates (unread count increments when messages arrive)

Protocol Buffer format (ChatMessage):
  - sender_name, sender_id, msg, msg_id, created_at

Redux format:
  - id, senderId, senderName, message, createdAt, channel, sessionId

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Nuwan 2026-02-01 00:21:00 +05:30
parent 99f9d4b898
commit f3044a29e8
1 changed files with 18 additions and 1 deletions

View File

@ -55,6 +55,7 @@ import {
selectBackingTrackData,
selectJamTrackData
} from '../../store/features/activeSessionSlice';
import { addMessageFromWebSocket } from '../../store/features/sessionChatSlice';
import { CLIENT_ROLE, RECORD_TYPE_AUDIO, RECORD_TYPE_BOTH } from '../../helpers/globals';
import { MessageType } from '../../helpers/MessageFactory.js';
@ -538,12 +539,28 @@ const JKSessionScreen = () => {
//@refreshCurrentSession(true);
// Chat message handler - receives messages from WebSocket and dispatches to Redux
const handleChatMessage = (data) => {
// Transform Protocol Buffer format to Redux format
const message = {
id: data.msg_id,
senderId: data.sender_id,
senderName: data.sender_name,
message: data.msg,
createdAt: data.created_at,
channel: 'session',
sessionId: currentSession.id
};
dispatch(addMessageFromWebSocket(message));
};
// Register message callbacks and store references for cleanup
const callbacksToRegister = [
{ type: MessageType.SESSION_JOIN, callback: trackChanges },
{ type: MessageType.SESSION_DEPART, callback: trackChanges },
{ type: MessageType.TRACKS_CHANGED, callback: trackChanges },
{ type: MessageType.HEARTBEAT_ACK, callback: trackChanges }
{ type: MessageType.HEARTBEAT_ACK, callback: trackChanges },
{ type: MessageType.CHAT_MESSAGE, callback: handleChatMessage }
];
callbacksToRegister.forEach(({ type, callback }) => {