Handle username choice from server

4 files changed, 53 insertions, 11 deletions

diff --git a/src/main/js/src/containers/GameBrowser/saga.js b/src/main/js/src/containers/GameBrowser/saga.js
index 29115a2b..4cd3d207 100644
--- a/src/main/js/src/containers/GameBrowser/saga.js
+++ b/src/main/js/src/containers/GameBrowser/saga.js
@@ -1,6 +1,7 @@
 import { call, put, take } from 'redux-saga/effects'
 import { eventChannel } from 'redux-saga'
 import { fromJS } from 'immutable'
+import { push } from 'react-router-redux'
 
 import { NEW_GAME, JOIN_GAME, CREATE_GAME } from './constants'
 import { newGame, joinGame } from './actions'
@@ -63,6 +64,8 @@ export function* createGame(socketConnection) {
 }
 
 export function* gameBrowserSaga(socketConnection) {
+  yield put(push('/lobby'))
+
   yield [
     call(watchGames, socketConnection),
     call(createGame, socketConnection)
diff --git a/src/main/js/src/containers/HomePage/saga.js b/src/main/js/src/containers/HomePage/saga.js
index 616f24af..0fbe8a45 100644
--- a/src/main/js/src/containers/HomePage/saga.js
+++ b/src/main/js/src/containers/HomePage/saga.js
@@ -1,24 +1,57 @@
 import { call, put, take } from 'redux-saga/effects'
-import { push } from 'react-router-redux'
+import { eventChannel } from 'redux-saga'
 import { ENTER_GAME } from './actions'
 import { setUsername } from '../UserRepo/actions'
 
-function* initGameSession(socketConnection) {
+import gameBrowserSaga from '../GameBrowser/saga'
+
+function* sendUsername(socketConnection) {
   const { username: playerName } = yield take(ENTER_GAME)
   const { socket } = socketConnection
 
   socket.send("/app/chooseName", JSON.stringify({
     playerName
   }), {})
-  // TODO: get response from server to continue
-  // TODO: handle case where username is taken
+}
+
+function createSocketChannel(socket) {
+  return eventChannel(emit => {
+    const receiveUsername = socket.subscribe('/user/queue/nameChoice', event => {
+      emit(JSON.parse(event.body))
+    })
+
+    const unsubscribe = () => {
+      receiveUsername.unsubscribe()
+    }
+
+    return unsubscribe
+  })
+}
+
+function* validateUsername(socketConnection) {
+  const { socket } = socketConnection
+  const socketChannel = createSocketChannel(socket)
+
+  const response = yield take(socketChannel)
+
+  if (response.error) {
+    return false
+  }
 
-  yield put(setUsername(playerName))
-  yield put(push('/lobby'))
+  yield put(setUsername(response.userName, response.displayName, response.index))
+  yield call(gameBrowserSaga, socketConnection)
+  return true
 }
 
 function* homeSaga(socketConnection) {
-  yield call(initGameSession, socketConnection)
+  let validated = false
+  do {
+    const [, usernameValid] = yield [
+      call(sendUsername, socketConnection),
+      call(validateUsername, socketConnection)
+    ]
+    validated = usernameValid
+  } while (!validated)
 }
 
 export default homeSaga
diff --git a/src/main/js/src/containers/UserRepo/actions.js b/src/main/js/src/containers/UserRepo/actions.js
index c850a900..dc06035b 100644
--- a/src/main/js/src/containers/UserRepo/actions.js
+++ b/src/main/js/src/containers/UserRepo/actions.js
@@ -1,6 +1,8 @@
 export const SET_USERNAME = 'homePage/SET_USERNAME'
 
-export const setUsername = (username) => ({
+export const setUsername = (userName, displayName, index) => ({
   type: SET_USERNAME,
-  username
+  userName,
+  index,
+  displayName
 })
diff --git a/src/main/js/src/containers/UserRepo/reducer.js b/src/main/js/src/containers/UserRepo/reducer.js
index 3d9f6e38..82960a58 100644
--- a/src/main/js/src/containers/UserRepo/reducer.js
+++ b/src/main/js/src/containers/UserRepo/reducer.js
@@ -1,13 +1,17 @@
 import { SET_USERNAME } from './actions'
 import { fromJS } from 'immutable'
 const initialState = fromJS({
-  username: ''
+  username: '',
+  displayName: '',
+  id: null
 })
 
 export default (state = initialState, action) => {
   switch (action.type) {
     case SET_USERNAME:
-      return state.set('username', action.username)
+      return state.set('username', action.userName)
+        .set('displayName', action.displayName)
+        .set('id', action.index)
     default:
       return state
   }