diff --git a/webapp/src/components/Game/GameAction.jsx b/webapp/src/components/Game/GameAction.jsx
index 6c51a42..435b853 100644
--- a/webapp/src/components/Game/GameAction.jsx
+++ b/webapp/src/components/Game/GameAction.jsx
@@ -5,10 +5,10 @@ import Create from './GameAction/Create'
 import Reject from './GameAction/Reject'
 import Cancel from './GameAction/Cancel'
 import Accept from './GameAction/Accept'
-import { AppContext } from '../../context/app'
+// import { AppContext } from '../../context/app'
 
 export default function GameAction() {
-  const [ctx, dispatchCtx] = React.useContext(AppContext)
+  // const [ctx, dispatchCtx] = React.useContext(AppContext)
 
   return (
     <div>
diff --git a/webapp/src/components/Game/GameBoard.css b/webapp/src/components/Game/GameBoard.css
index 6e9cc05..e69de29 100644
--- a/webapp/src/components/Game/GameBoard.css
+++ b/webapp/src/components/Game/GameBoard.css
@@ -1,33 +0,0 @@
-.board {
-    display: flex;
-    flex-direction: column;
-    justify-content: center; 
-    align-items: center;
-    /* scale: 15%; */
-}
-
-.tile {
-    border: 1px solid #e4e4e4;
-    float: left;
-    font-size: 200%;
-    font-weight: bold;
-    line-height: 34px;
-    height: 34px;
-    width: 34px; 
-    margin-right: -1px;
-    margin-top: -1px;
-    padding: 0;
-    text-align: center;
-}
-
-.tile.black {
-    background: lightgray;
-}
-
-.tile.white:hover {
-    background-color:azure;
-}
-
-.stone {
-    font-size: 120%;
-} 
\ No newline at end of file
diff --git a/webapp/src/components/Game/GameBoard.jsx b/webapp/src/components/Game/GameBoard.jsx
index 32ec995..2dcc0fa 100644
--- a/webapp/src/components/Game/GameBoard.jsx
+++ b/webapp/src/components/Game/GameBoard.jsx
@@ -1,79 +1,13 @@
 import './GameBoard.css';
 import React from 'react';
 
-import { WhiteStone, BlackStone } from './Stone' 
+import Board from './GameBoard/Board'
 
-export default function Board() {
-
-  return <div className='board'>
-    <div className='row'>
-      <BlackTile/> <WhiteTile id={0} stone={WhiteStone()} /> 
-      <BlackTile/> <WhiteTile id={1} stone={WhiteStone()} />
-      <BlackTile/> <WhiteTile id={2} stone={WhiteStone()} />
-      <BlackTile/> <WhiteTile id={4} stone={WhiteStone()} />
-    </div>
-    <div className='row'>
-      <WhiteTile id={5} stone={WhiteStone()} /> <BlackTile/>
-      <WhiteTile id={6} stone={WhiteStone()} /> <BlackTile/>
-      <WhiteTile id={7} stone={WhiteStone()} /> <BlackTile/>
-      <WhiteTile id={8} stone={WhiteStone()} /> <BlackTile/>
-    </div>
-    <div className='row'>
-      <BlackTile/> <WhiteTile id={ 9} stone={WhiteStone()} /> 
-      <BlackTile/> <WhiteTile id={10} stone={WhiteStone()} />
-      <BlackTile/> <WhiteTile id={11} stone={WhiteStone()} />
-      <BlackTile/> <WhiteTile id={12} stone={WhiteStone()} />
-    </div>
-    <div className='row'>
-      <WhiteTile id={13} stone={null} /> <BlackTile/>
-      <WhiteTile id={14} stone={null} /> <BlackTile/>
-      <WhiteTile id={15} stone={null} /> <BlackTile/>
-      <WhiteTile id={16} stone={null} /> <BlackTile/>
-    </div>
-
-    <div className='row'>
-      <BlackTile/> <WhiteTile id={17} stone={null} /> 
-      <BlackTile/> <WhiteTile id={18} stone={null} />
-      <BlackTile/> <WhiteTile id={19} stone={null} />
-      <BlackTile/> <WhiteTile id={20} stone={null} />
-    </div>
-    <div className='row'>
-      <WhiteTile id={21} stone={BlackStone()} /> <BlackTile/>
-      <WhiteTile id={22} stone={BlackStone()} /> <BlackTile/>
-      <WhiteTile id={23} stone={BlackStone()} /> <BlackTile/>
-      <WhiteTile id={24} stone={BlackStone()} /> <BlackTile/>
-    </div>
-    <div className='row'>
-      <BlackTile/> <WhiteTile id={25} stone={BlackStone()} /> 
-      <BlackTile/> <WhiteTile id={26} stone={BlackStone()} />
-      <BlackTile/> <WhiteTile id={27} stone={BlackStone()} />
-      <BlackTile/> <WhiteTile id={28} stone={BlackStone()} />
-    </div>
-    <div className='row'>
-      <WhiteTile id={29} stone={BlackStone()} /> <BlackTile/>
-      <WhiteTile id={30} stone={BlackStone()} /> <BlackTile/>
-      <WhiteTile id={31} stone={BlackStone()} /> <BlackTile/>
-      <WhiteTile id={32} stone={BlackStone()} /> <BlackTile/>
-    </div>
-  </div>
-}
-
-function WhiteTile({ id, stone }) {
+export default function GameBoard() {
 
   return (
-    <div 
-      className='tile white'
-      onClick={() => handleClick(id)}
-    >
-      {stone}
+    <div className='game-board'>
+      <Board />
     </div>
-  );
-}
-
-function BlackTile() {
-  return <div className='tile black'/>
-}
-
-function handleClick(i) {
-  console.log("click", i)
+  )
 }
diff --git a/webapp/src/components/Game/GameBoard/Board.css b/webapp/src/components/Game/GameBoard/Board.css
new file mode 100644
index 0000000..6e9cc05
--- /dev/null
+++ b/webapp/src/components/Game/GameBoard/Board.css
@@ -0,0 +1,33 @@
+.board {
+    display: flex;
+    flex-direction: column;
+    justify-content: center; 
+    align-items: center;
+    /* scale: 15%; */
+}
+
+.tile {
+    border: 1px solid #e4e4e4;
+    float: left;
+    font-size: 200%;
+    font-weight: bold;
+    line-height: 34px;
+    height: 34px;
+    width: 34px; 
+    margin-right: -1px;
+    margin-top: -1px;
+    padding: 0;
+    text-align: center;
+}
+
+.tile.black {
+    background: lightgray;
+}
+
+.tile.white:hover {
+    background-color:azure;
+}
+
+.stone {
+    font-size: 120%;
+} 
\ No newline at end of file
diff --git a/webapp/src/components/Game/GameBoard/Board.jsx b/webapp/src/components/Game/GameBoard/Board.jsx
new file mode 100644
index 0000000..3d1644a
--- /dev/null
+++ b/webapp/src/components/Game/GameBoard/Board.jsx
@@ -0,0 +1,79 @@
+import './Board.css';
+import React from 'react';
+
+import { WhiteStone, BlackStone } from '../Stone' 
+
+export default function Board() {
+
+  return <div className='board'>
+    <div className='row'>
+      <BlackTile/> <WhiteTile id={0} stone={WhiteStone()} /> 
+      <BlackTile/> <WhiteTile id={1} stone={WhiteStone()} />
+      <BlackTile/> <WhiteTile id={2} stone={WhiteStone()} />
+      <BlackTile/> <WhiteTile id={4} stone={WhiteStone()} />
+    </div>
+    <div className='row'>
+      <WhiteTile id={5} stone={WhiteStone()} /> <BlackTile/>
+      <WhiteTile id={6} stone={WhiteStone()} /> <BlackTile/>
+      <WhiteTile id={7} stone={WhiteStone()} /> <BlackTile/>
+      <WhiteTile id={8} stone={WhiteStone()} /> <BlackTile/>
+    </div>
+    <div className='row'>
+      <BlackTile/> <WhiteTile id={ 9} stone={WhiteStone()} /> 
+      <BlackTile/> <WhiteTile id={10} stone={WhiteStone()} />
+      <BlackTile/> <WhiteTile id={11} stone={WhiteStone()} />
+      <BlackTile/> <WhiteTile id={12} stone={WhiteStone()} />
+    </div>
+    <div className='row'>
+      <WhiteTile id={13} stone={null} /> <BlackTile/>
+      <WhiteTile id={14} stone={null} /> <BlackTile/>
+      <WhiteTile id={15} stone={null} /> <BlackTile/>
+      <WhiteTile id={16} stone={null} /> <BlackTile/>
+    </div>
+
+    <div className='row'>
+      <BlackTile/> <WhiteTile id={17} stone={null} /> 
+      <BlackTile/> <WhiteTile id={18} stone={null} />
+      <BlackTile/> <WhiteTile id={19} stone={null} />
+      <BlackTile/> <WhiteTile id={20} stone={null} />
+    </div>
+    <div className='row'>
+      <WhiteTile id={21} stone={BlackStone()} /> <BlackTile/>
+      <WhiteTile id={22} stone={BlackStone()} /> <BlackTile/>
+      <WhiteTile id={23} stone={BlackStone()} /> <BlackTile/>
+      <WhiteTile id={24} stone={BlackStone()} /> <BlackTile/>
+    </div>
+    <div className='row'>
+      <BlackTile/> <WhiteTile id={25} stone={BlackStone()} /> 
+      <BlackTile/> <WhiteTile id={26} stone={BlackStone()} />
+      <BlackTile/> <WhiteTile id={27} stone={BlackStone()} />
+      <BlackTile/> <WhiteTile id={28} stone={BlackStone()} />
+    </div>
+    <div className='row'>
+      <WhiteTile id={29} stone={BlackStone()} /> <BlackTile/>
+      <WhiteTile id={30} stone={BlackStone()} /> <BlackTile/>
+      <WhiteTile id={31} stone={BlackStone()} /> <BlackTile/>
+      <WhiteTile id={32} stone={BlackStone()} /> <BlackTile/>
+    </div>
+  </div>
+}
+
+function WhiteTile({ id, stone }) {
+
+  return (
+    <div 
+      className='tile white'
+      onClick={() => handleClick(id)}
+    >
+      {stone}
+    </div>
+  );
+}
+
+function BlackTile() {
+  return <div className='tile black'/>
+}
+
+function handleClick(i) {
+  console.log("click", i)
+}
diff --git a/webapp/src/context/data/reducer.js b/webapp/src/context/data/reducer.js
index 770fe57..6e9e065 100644
--- a/webapp/src/context/data/reducer.js
+++ b/webapp/src/context/data/reducer.js
@@ -19,7 +19,7 @@ export const initialState = {
   leaderboard: null,
   leaderboardFetching: false,
   
-  isCurrentUser: () => false,
+  isCurrentUser: () => null,
 
   offlineMode: false
 }