diff --git a/webapp/src/components/Checkers.jsx b/webapp/src/components/Checkers.jsx
index 2cda7d3..6a94137 100644
--- a/webapp/src/components/Checkers.jsx
+++ b/webapp/src/components/Checkers.jsx
@@ -27,6 +27,8 @@ export function Stone({ color }) {
             return BlackStone();
 
         case '':
+        case undefined:
+        case null:
             return; // no color :)
 
         default:
diff --git a/webapp/src/container/games/GameBoard.jsx b/webapp/src/container/games/GameBoard.jsx
index 6c849fd..047a5fb 100644
--- a/webapp/src/container/games/GameBoard.jsx
+++ b/webapp/src/container/games/GameBoard.jsx
@@ -7,32 +7,32 @@ import './GameBoard.css';
 
 export default function GameBoard() {
   const games = useContext(GamesContext);
-  const {pathname} = useLocation();
+  const { pathname } = useLocation();
 
-  let opponentName = '';
-  let opponentColor = Color.white; // defaut color
+  const [opponentName, opponentColor, myColor] = (() => {
+    if (matchPath('/games/new', pathname))
+      return [games.newGame.opponentName, games.newGame.opponentColor, Color.opposite(games.newGame.opponentColor)];
 
-  if (matchPath('/games/new', pathname)) {
-    opponentName = games.newGame.opponentName;
-    opponentColor = games.newGame.opponentColor;
-  }
+    let selectedGame;
 
-  // if (matchPath('/games/proposal', pathname)) {
-  //   const selectedGame = games.findGame({ uuid: games.proposal.selectedUUID });
+    if (matchPath('/games/proposal', pathname))
+      selectedGame = games.findGame({ uuid: games.proposal.selectedUUID });
+    else if (matchPath('/games/active', pathname))
+      selectedGame = games.findGame({ uuid: games.active.selectedUUID });
+    else if (matchPath('/games/archive', pathname))
+      selectedGame = games.findGame({ uuid: games.archive.selectedUUID });
 
-  //   const opponentColor = selectedGame
-
-  //   whiteName = selectedGame.newGame.whitePlayer;
-  //   blackName = games.newGame.blackPlayer;
-  // }
-
-  const myColor = Color.opposite(opponentColor);
+    if (selectedGame)
+      return [selectedGame?.opponentName, Color.opposite(selectedGame?.myColor), selectedGame?.myColor];
+    else
+      return ['', Color.white, Color.black]; //  defaults
+  })(); // <<-- Execute
 
   return (
     <div className='GameBoard'>
       <Player color={opponentColor} name={opponentName} />
       <Board />
-      <Player color={myColor} name='MyName' />
+      <Player color={myColor} name={opponentName ? 'MyName' : ''} />
     </div>
   )
 }
\ No newline at end of file