Isolate Seven Wonders API from sagas

4 files changed, 41 insertions, 50 deletions

diff --git a/frontend/src/sagas/errors.js b/frontend/src/sagas/errors.js
index e43875ae..86fa0124 100644
--- a/frontend/src/sagas/errors.js
+++ b/frontend/src/sagas/errors.js
@@ -1,12 +1,13 @@
-import { apply, call, cancelled, take } from 'redux-saga/effects';
-import { createSubscriptionChannel } from '../utils/websocket';
-import { toastr } from 'react-redux-toastr';
+import {apply, cancelled, take} from 'redux-saga/effects';
+import {toastr} from 'react-redux-toastr';
+import {ApiError, SevenWondersSession} from '../api/sevenWondersApi';
+import type {Channel} from 'redux-saga';
 
-export default function* errorHandlingSaga({ socket }) {
-  const errorChannel = yield call(createSubscriptionChannel, socket, '/user/queue/errors');
+export default function* errorHandlingSaga(session: SevenWondersSession) {
+  const errorChannel: Channel<ApiError> = yield apply(session, session.watchErrors, []);
   try {
     while (true) {
-      const error = yield take(errorChannel);
+      const error: ApiError = yield take(errorChannel);
       yield* handleOneError(error);
     }
   } finally {
@@ -17,13 +18,13 @@ export default function* errorHandlingSaga({ socket }) {
   }
 }
 
-function* handleOneError(err) {
+function* handleOneError(err: ApiError) {
   console.error('Error received on web socket channel', err);
   const msg = buildMsg(err);
   yield apply(toastr, toastr.error, [msg, { icon: 'error' }]);
 }
 
-function buildMsg(err) {
+function buildMsg(err: ApiError): string {
   if (err.details.length > 0) {
     return err.details.map(d => d.message).join('\n');
   } else {
diff --git a/frontend/src/sagas/gameBrowser.js b/frontend/src/sagas/gameBrowser.js
index 55927bf2..17eb9287 100644
--- a/frontend/src/sagas/gameBrowser.js
+++ b/frontend/src/sagas/gameBrowser.js
@@ -1,6 +1,5 @@
 // @flow
 import { call, put, take, apply } from 'redux-saga/effects';
-import { createSubscriptionChannel } from '../utils/websocket';
 import { push } from 'react-router-redux';
 
 import { normalize } from 'normalizr';
@@ -8,11 +7,10 @@ import { game as gameSchema, gameList as gameListSchema } from '../schemas/games
 
 import { actions as gameActions, types } from '../redux/games';
 import { actions as playerActions } from '../redux/players';
+import type { SevenWondersSession } from '../api/sevenWondersApi';
 
-import type { SocketObjectType, SocketType } from '../utils/websocket';
-
-function* watchGames({ socket }: { socket: SocketType }): * {
-  const gamesChannel = yield call(createSubscriptionChannel, socket, '/topic/games');
+function* watchGames(session: SevenWondersSession): * {
+  const gamesChannel = yield apply(session, session.watchGames, []);
   try {
     while (true) {
       const gameList = yield take(gamesChannel);
@@ -26,8 +24,8 @@ function* watchGames({ socket }: { socket: SocketType }): * {
   }
 }
 
-function* watchLobbyJoined({ socket }: { socket: SocketType }): * {
-  const joinedLobbyChannel = yield call(createSubscriptionChannel, socket, '/user/queue/lobby/joined');
+function* watchLobbyJoined(session: SevenWondersSession): * {
+  const joinedLobbyChannel = yield apply(session, session.watchLobbyJoined, []);
   try {
     const joinedLobby = yield take(joinedLobbyChannel);
     const normalized = normalize(joinedLobby, gameSchema);
@@ -41,27 +39,22 @@ function* watchLobbyJoined({ socket }: { socket: SocketType }): * {
   }
 }
 
-function* createGame({ socket }: { socket: SocketType }): * {
+function* createGame(session: SevenWondersSession): * {
   while (true) {
     const { gameName } = yield take(types.REQUEST_CREATE_GAME);
-    yield apply(socket, socket.send, ['/app/lobby/create', JSON.stringify({ gameName }), {}]);
+    yield apply(session, session.createGame, [gameName]);
   }
 }
 
-function* joinGame({ socket }: { socket: SocketType }): * {
+function* joinGame(session: SevenWondersSession): * {
   while (true) {
     const { gameId } = yield take(types.REQUEST_JOIN_GAME);
-    yield apply(socket, socket.send, ['/app/lobby/join', JSON.stringify({ gameId }), {}]);
+    yield apply(session, session.joinGame, [gameId]);
   }
 }
 
-function* gameBrowserSaga(socketConnection: SocketObjectType): * {
-  yield [
-    call(watchGames, socketConnection),
-    call(watchLobbyJoined, socketConnection),
-    call(createGame, socketConnection),
-    call(joinGame, socketConnection),
-  ];
+function* gameBrowserSaga(session: SevenWondersSession): * {
+  yield [call(watchGames, session), call(watchLobbyJoined, session), call(createGame, session), call(joinGame, session)];
 }
 
 export default gameBrowserSaga;
diff --git a/frontend/src/sagas/home.js b/frontend/src/sagas/home.js
index 579c7fd6..eb65097b 100644
--- a/frontend/src/sagas/home.js
+++ b/frontend/src/sagas/home.js
@@ -1,18 +1,18 @@
 import { apply, call, put, take } from 'redux-saga/effects';
-import { createSubscriptionChannel } from '../utils/websocket';
 import { push } from 'react-router-redux';
 
 import { actions, types } from '../redux/players';
+import type { SevenWondersSession } from '../api/sevenWondersApi';
 
-function* sendUsername({ socket }) {
+function* sendUsername(session: SevenWondersSession) {
   while (true) {
     const { username } = yield take(types.REQUEST_CHOOSE_USERNAME);
-    yield apply(socket, socket.send, ['/app/chooseName', JSON.stringify({ playerName: username })]);
+    yield apply(session, session.chooseName, [username]);
   }
 }
 
-function* validateUsername({ socket }) {
-  const usernameChannel = yield call(createSubscriptionChannel, socket, '/user/queue/nameChoice');
+function* validateUsername(session: SevenWondersSession) {
+  const usernameChannel = yield apply(session, session.watchNameChoice, []);
   while (true) {
     const user = yield take(usernameChannel);
     yield put(actions.setCurrentPlayer(user));
@@ -21,9 +21,8 @@ function* validateUsername({ socket }) {
   }
 }
 
-function* usernameChoiceSaga(wsConnection) {
-  // TODO: Run sendUsername in loop when we have the ability to cancel saga on route change
-  yield [call(sendUsername, wsConnection), call(validateUsername, wsConnection)];
+function* homeSaga(session: SevenWondersSession) {
+  yield [call(sendUsername, session), call(validateUsername, session)];
 }
 
-export default usernameChoiceSaga;
+export default homeSaga;
diff --git a/frontend/src/sagas/lobby.js b/frontend/src/sagas/lobby.js
index d11511e8..0c264dde 100644
--- a/frontend/src/sagas/lobby.js
+++ b/frontend/src/sagas/lobby.js
@@ -1,5 +1,6 @@
 import { call, put, take, apply } from 'redux-saga/effects';
-import { createSubscriptionChannel } from '../utils/websocket';
+import type { Channel } from 'redux-saga';
+
 import { push } from 'react-router-redux';
 
 import { normalize } from 'normalizr';
@@ -7,15 +8,16 @@ import { game as gameSchema } from '../schemas/games';
 
 import { actions as gameActions, types } from '../redux/games';
 import { actions as playerActions } from '../redux/players';
+import { SevenWondersSession } from '../api/sevenWondersApi';
 
-function getCurrentGameId() {
+function getCurrentGameId(): number {
   const path = window.location.pathname;
   return path.split('lobby/')[1];
 }
 
-function* watchLobbyUpdates({ socket }) {
-  const currentGameId = getCurrentGameId();
-  const lobbyUpdatesChannel = yield call(createSubscriptionChannel, socket, `/topic/lobby/${currentGameId}/updated`);
+function* watchLobbyUpdates(session: SevenWondersSession) {
+  const currentGameId: number = getCurrentGameId();
+  const lobbyUpdatesChannel: Channel = yield apply(session, session.watchLobbyUpdated, [currentGameId]);
   try {
     while (true) {
       const lobby = yield take(lobbyUpdatesChannel);
@@ -28,9 +30,9 @@ function* watchLobbyUpdates({ socket }) {
   }
 }
 
-function* watchGameStart({ socket }) {
+function* watchGameStart(session: SevenWondersSession) {
   const currentGameId = getCurrentGameId();
-  const gameStartedChannel = yield call(createSubscriptionChannel, socket, `/topic/lobby/${currentGameId}/started`);
+  const gameStartedChannel = yield apply(session, session.watchGameStarted, [currentGameId]);
   try {
     yield take(gameStartedChannel);
     yield put(gameActions.enterGame());
@@ -40,19 +42,15 @@ function* watchGameStart({ socket }) {
   }
 }
 
-function* startGame({ socket }) {
+function* startGame(session: SevenWondersSession) {
   while (true) {
     yield take(types.REQUEST_START_GAME);
-    yield apply(socket, socket.send, ['/app/lobby/startGame', {}]);
+    yield apply(session, session.startGame, []);
   }
 }
 
-function* lobbySaga(socketConnection) {
-  yield [
-    call(watchLobbyUpdates, socketConnection),
-    call(watchGameStart, socketConnection),
-    call(startGame, socketConnection),
-  ];
+function* lobbySaga(session: SevenWondersSession) {
+  yield [call(watchLobbyUpdates, session), call(watchGameStart, session), call(startGame, session)];
 }
 
 export default lobbySaga;