CODEWITHSUNDEEP
redux-saga
hbrls
hbrls

Reputation: 2150

redux-saga how to listen to multiple eventChannel

I'm subscribing to 2 channels for a chat room. The code will stuck at C until the 2nd channel receives a new message. And then stuck at A until the 1st channel receives a new message.

How can I make the 2 channel working separatedly.

function* ChatRoomPageEnter() {
  const chanChat = yield call($stomp.eventChannel, 'ChatRoomPage', '/topic/chat');
  const chanEcho = yield call($stomp.eventChannel, 'ChatRoomPage', '/user/queue/echo');

  while (true) { // eslint-disable-line no-constant-condition
    console.log('A');
    const messageChat = yield take(chanChat);
    console.log('B');
    yield put({ type: 'chatroom/newMessage', payload: messageChat });
    console.log('C'); // <----
    const messageEcho = yield take(chanEcho);
    console.log('D');
    yield put({ type: 'chatroom/newMessage', payload: messageEcho });
    console.log('E');
  }
}

Upvotes: 5

Views: 1628

Answers (1)

Krasimir
Krasimir

Reputation: 13529

Why not create a watcher as a separate function and call it twice. For example:

function * chatWatcher(chanName) {
  while(true) {
    const message = yield take(chanName);
    yield put({ type: 'chatroom/newMessage', payload: message });
  }
}

function* ChatRoomPageEnter() {
  const chanChat = yield call($stomp.eventChannel, 'ChatRoomPage', '/topic/chat');
  const chanEcho = yield call($stomp.eventChannel, 'ChatRoomPage', '/user/queue/echo');

  yield * chatWatcher(chanChat);
  yield * chatWatcher(chanEcho);
}

Upvotes: 2

Related Questions