From 77ced54c6feda40283dc54220f60a7cac76ee3c1 Mon Sep 17 00:00:00 2001 From: sorrelbri Date: Sat, 6 Jun 2020 17:08:40 -0700 Subject: [PATCH] patch useContext dependencies in Game component --- packages/play-node-go/src/io.js | 77 ++++++++++--------- packages/play-node-go/src/pages/Game/Game.js | 15 ++-- .../src/reducers/socket/reducer.socket.js | 60 +++++++-------- 3 files changed, 75 insertions(+), 77 deletions(-) diff --git a/packages/play-node-go/src/io.js b/packages/play-node-go/src/io.js index 7bc8d7c..0e4b9a7 100644 --- a/packages/play-node-go/src/io.js +++ b/packages/play-node-go/src/io.js @@ -1,43 +1,48 @@ -import socketIOClient from 'socket.io-client'; -import config from './config'; +import socketIOClient from "socket.io-client"; +import config from "./config"; const launch = (nsp, dispatch) => { const socket = socketIOClient(`${config.socketAddress}/${nsp}`); - - socket.on('connected', () => { - dispatch({ type:'SOCKET', message:'CONNECTED', body:{nsp: socket.nsp} }); - }); - socket.on('connect_error', err => { - dispatch({ type: 'ERR', message:'SOCKET_ERROR', body: { socketError: err }}); - }); - socket.on('error', err => { - dispatch({ type: 'ERR', message:'SOCKET_ERROR', body: { socketError: err } }); - }); - - socket.on('room_connected', (data) => { - dispatch({ type: 'ROOMS', message: 'CONNECT_ROOM', body: data }); - }); - - socket.on('new_user', (data) => { - console.log('new_user received') - dispatch({ type: 'ROOMS', message: 'NEW_USER', body: data }) - }) - socket.on('game_connected', (data) => { - console.log(data) - console.log('game_connected received') - dispatch({ type: 'GAMES', message: 'UPDATE_BOARD', body: data }) - }) - - socket.on('update_board', (data) => { - console.log(data) - console.log('update_board received') - dispatch({ type: 'GAMES', message: 'UPDATE_BOARD', body: data }) - }) + socket.on("connected", () => { + dispatch({ + type: "SOCKET", + message: "CONNECTED", + body: { nsp: socket.nsp }, + }); + }); + socket.on("connect_error", (err) => { + dispatch({ + type: "ERR", + message: "SOCKET_ERROR", + body: { socketError: err }, + }); + }); + socket.on("error", (err) => { + dispatch({ + type: "ERR", + message: "SOCKET_ERROR", + body: { socketError: err }, + }); + }); + + socket.on("room_connected", (data) => { + dispatch({ type: "ROOMS", message: "CONNECT_ROOM", body: data }); + }); + + socket.on("new_user", (data) => { + dispatch({ type: "ROOMS", message: "NEW_USER", body: data }); + }); + + socket.on("game_connected", (data) => { + dispatch({ type: "GAMES", message: "UPDATE_BOARD", body: data }); + }); + + socket.on("update_board", (data) => { + dispatch({ type: "GAMES", message: "UPDATE_BOARD", body: data }); + }); return socket; -} +}; -export { - launch -} \ No newline at end of file +export { launch }; diff --git a/packages/play-node-go/src/pages/Game/Game.js b/packages/play-node-go/src/pages/Game/Game.js index 7072105..e366152 100644 --- a/packages/play-node-go/src/pages/Game/Game.js +++ b/packages/play-node-go/src/pages/Game/Game.js @@ -11,6 +11,8 @@ const Game = (props) => { const gameId = parseInt(useParams().id) || 0; const [playerBlackMeta, setPlayerBlackMeta] = useState({}); const [playerWhiteMeta, setPlayerWhiteMeta] = useState({}); + const playerState = state?.meta?.playerState; + const game = state.active?.game; useEffect(() => { const fetchGameAPI = async () => { @@ -42,14 +44,9 @@ const Game = (props) => { }, [state.active.game, dispatch, state.user]); useEffect(() => { - if (!state.meta) return; - const { - playerBlack, - playerBlackRank, - playerWhite, - playerWhiteRank, - } = state.active.game; - const { bCaptures, wCaptures } = state.meta.playerState; + if (!game || !playerState) return; + const { playerBlack, playerBlackRank, playerWhite, playerWhiteRank } = game; + const { bCaptures, wCaptures } = playerState; setPlayerBlackMeta({ player: playerBlack, rank: playerBlackRank, @@ -62,7 +59,7 @@ const Game = (props) => { captures: wCaptures, stones: "white", }); - }, [state?.meta?.playerState, state.active?.game]); + }, [playerState, game]); return (
diff --git a/packages/play-node-go/src/reducers/socket/reducer.socket.js b/packages/play-node-go/src/reducers/socket/reducer.socket.js index 074130b..832abad 100644 --- a/packages/play-node-go/src/reducers/socket/reducer.socket.js +++ b/packages/play-node-go/src/reducers/socket/reducer.socket.js @@ -1,69 +1,65 @@ -import { stateReducer } from '../reducer'; -const io = require('../../io'); +import { stateReducer } from "../reducer"; +const io = require("../../io"); export const socketReducer = (state, action) => { - switch(action.message) { + switch (action.message) { + case "CONNECTED": + return { ...state, connect: { type: "home", location: action.body.nsp } }; - case 'CONNECTED': - console.log(action.body.nsp) - return {...state, connect: { type: 'home', location: action.body.nsp } } - - case 'LAUNCH': { - const {nsp, dispatch} = action.body; + case "LAUNCH": { + const { nsp, dispatch } = action.body; const launchedSocket = io.launch(nsp, dispatch); - return {...state, socket: launchedSocket}; + return { ...state, socket: launchedSocket }; } - case 'CONNECT_ROOM': { - const {user, room, dispatch} = action.body; + case "CONNECT_ROOM": { + const { user, room, dispatch } = action.body; let priorSocket = state.socket; if (!priorSocket.nsp) { - priorSocket = io.launch('', dispatch) + priorSocket = io.launch("", dispatch); } if (priorSocket.nsp !== `/${room}`) { - priorSocket.emit('connect_room', {user, room}); + priorSocket.emit("connect_room", { user, room }); priorSocket.close(); } const socket = io.launch(room, dispatch); - return {...state, socket} + return { ...state, socket }; } - case 'CONNECT_GAME': { + case "CONNECT_GAME": { return connectGame(state, action); } - case 'MAKE_MOVE': { + case "MAKE_MOVE": { return makeMove(state, action); } default: return state; } -} +}; -function connectGame (state, action) { +function connectGame(state, action) { const { user, game, dispatch } = action.body; const priorSocket = state.socket; let updatedState; - if ( !priorSocket.nsp || priorSocket.nsp !== `/${game.room}` ) { + if (!priorSocket.nsp || priorSocket.nsp !== `/${game.room}`) { const connectRoomAction = { - type: 'SOCKET', - message: 'CONNECT_ROOM', - body: { user, room: game.room, dispatch} - } + type: "SOCKET", + message: "CONNECT_ROOM", + body: { user, room: game.room, dispatch }, + }; updatedState = stateReducer(state, connectRoomAction); - } - if (!updatedState) updatedState = {...state}; + if (!updatedState) updatedState = { ...state }; const socket = updatedState.socket; - socket.emit('connect_game', {user, game}); - return {...updatedState}; + socket.emit("connect_game", { user, game }); + return { ...updatedState }; } -function makeMove (state, action) { +function makeMove(state, action) { // const { user, game, room, board, move } = action.body; const socket = state.socket; - console.log(action) - socket.emit('make_move', {...action.body}); + socket.emit("make_move", { ...action.body }); return state; -} \ No newline at end of file +}