Trying to fix BOARD disconnect in ws sync closure

Signed-off-by: James Ketrenos <james_eikona@ketrenos.com>

client/src/Board.js

@@ -219,14 +219,14 @@ const Board = () => {
     }));
   }, [ws]);
 
-  const Road = ({road}) => {
-    const onClick = (event) => {
+  const onRoadClicked = useCallback((road) => {
     console.log(`Road clicked: ${road.index}`);
     sendPlacement('place-road', road.index);
-    };
+  }, [sendPlacement]);
 
+  const Road = ({road}) => {
     return <div className="Road"
-      onClick={onClick}
+      onClick={() => { onRoadClicked(road) }}
       data-index={road.index}
       style={{
         transform: `translate(-50%, -50%) rotate(${road.angle}deg)`,
@@ -236,8 +236,7 @@ const Board = () => {
     ><div className="Road-Shape"/></div>;
   };
   
-  const Corner = ({corner}) => {
-    const onClick = (event) => {
+  const onCornerClicked = useCallback((event, corner) => {
     let type;
     if (event.currentTarget.getAttribute('data-type') === 'settlement') {
       type = 'place-city';
@@ -245,10 +244,11 @@ const Board = () => {
       type = 'place-settlement';
     }
     sendPlacement(type, corner.index);
-    };
+  }, [sendPlacement]);
 
+  const Corner = ({corner}) => {
     return <div className="Corner"
-      onClick={onClick}
+      onClick={(event) => { onCornerClicked(event, corner) }}
       data-index={corner.index}
       style={{
         top: `${corner.top}px`,
@@ -257,13 +257,13 @@ const Board = () => {
     ><div className="Corner-Shape"/></div>;
   };
 
-  const Pip = ({pip}) => {
-    const onClick = (event) => {
+  const onPipClicked = useCallback((pip) => {
     sendPlacement('place-robber', pip.index);
-    };
+  }, [sendPlacement]);
 
+  const Pip = ({pip}) => {
     return <div className="Pip"
-      onClick={onClick}
+      onClick={() => { onPipClicked(pip) }}
       data-roll={pip.roll}
       data-index={pip.index}
       style={{

server/routes/games.js

@@ -1942,10 +1942,19 @@ const stealResource = (game, session, color) => {
   if (game.turn.limits.players.findIndex(item => item.color === color) === -1) {
     return `You can only steal a resource from a player on this terrain!`;
   }
-  const victim = game.players[color];
+  let victim;
+  for (let key in game.sessions) {
+    if (game.sessions[key].color === color) {
+      victim = game.sessions[key];
+      break;
+    }
+  }
+  if (!victim) {
+    return `You sent a wierd color for the target to steal from.`;
+  }
   const cards = [];
   [ 'wheat', 'brick', 'sheep', 'stone', 'wood' ].forEach(field => {
-    for (let i = 0; i < victim[field]; i++) {
+    for (let i = 0; i < victim.player[field]; i++) {
       cards.push(field);
     }
   });
@@ -1961,8 +1970,8 @@ const stealResource = (game, session, color) => {
   } else {
     let index = Math.floor(Math.random() * cards.length),
       type = cards[index];
-    victim[type]--;
-    victim.resources--;
+    victim.player[type]--;
+    victim.player.resources--;
     session.player[type]++;
     session.player.resources++;
     game.turn.actions = [];
@@ -1970,18 +1979,22 @@ const stealResource = (game, session, color) => {
     addChatMessage(game, session, 
       `${session.name} randomly stole 1 ${type} from ` +
       `${victim.name}.`);
+    sendUpdateToPlayer(victim, {
+      private: victim.player
+    });
   }
   debugChat(game, 'After steal');
 
   game.turn.robberInAction = false;
+
+  sendUpdateToPlayer(session, {
+    private: session.player
+  });
   sendUpdateToPlayers(game, {
     turn: game.turn,
     chat: game.chat,
     activities: game.activities
   });
-  sendUpdateToPlayer(session, {
-    private: session.player
-  });
 }
 
 const buyDevelopment = (game, session) => {