diff --git a/pac-man-board-game/ClientApp/src/game/box.ts b/pac-man-board-game/ClientApp/src/game/box.ts
index c25c603..6428cb9 100644
--- a/pac-man-board-game/ClientApp/src/game/box.ts
+++ b/pac-man-board-game/ClientApp/src/game/box.ts
@@ -5,9 +5,9 @@ export default class Box {
   public Pellets: Pellet[];
   public readonly Colour: Colour;
 
-  public constructor({colour, pellets = []}: BoxProps) {
-    this.Colour = colour;
-    this.Pellets = pellets;
+  public constructor({Colour, Pellets = []}: BoxProps) {
+    this.Colour = Colour;
+    this.Pellets = Pellets;
   }
 
   get powerPellet(): Pellet | undefined {
diff --git a/pac-man-board-game/ClientApp/src/game/player.ts b/pac-man-board-game/ClientApp/src/game/player.ts
index c8d2a07..313b0d5 100644
--- a/pac-man-board-game/ClientApp/src/game/player.ts
+++ b/pac-man-board-game/ClientApp/src/game/player.ts
@@ -18,7 +18,7 @@ export default class Player {
   constructor(props: PlayerProps) {
     this.Name = props.Name;
     this.Colour = props.Colour;
-    this.Box = new Box(props.Box ?? {colour: props.Colour});
+    this.Box = new Box(props.Box ?? {Colour: props.Colour});
     this.PacMan = new Character(props.PacMan ?? {
       Colour: props.Colour,
       Type: CharacterType.pacMan
diff --git a/pac-man-board-game/ClientApp/src/pages/game.tsx b/pac-man-board-game/ClientApp/src/pages/game.tsx
index e34b3cb..5811a9b 100644
--- a/pac-man-board-game/ClientApp/src/pages/game.tsx
+++ b/pac-man-board-game/ClientApp/src/pages/game.tsx
@@ -1,17 +1,18 @@
 import React, {useEffect} from "react";
 import {GameComponent} from "../components/gameComponent";
-import {useAtom} from "jotai";
+import {useAtomValue} from "jotai";
 import {thisPlayerAtom} from "../utils/state";
 
 const Game: Component = () => {
-  const [player] = useAtom(thisPlayerAtom); // TODO get player from session storage
+  const player = useAtomValue(thisPlayerAtom);
 
   useEffect(() => {
+    console.debug(player);
     if (!player) {
-      // TODO state dissapears on refresh
-      window.location.href = "/";
+      // TODO player is undefined on first render, then defined on second render
+      // window.location.href = "/";
     }
-  }, []);
+  }, [player]);
 
   if (player) {
     return <GameComponent player={player}/>;
diff --git a/pac-man-board-game/ClientApp/src/types/props.d.ts b/pac-man-board-game/ClientApp/src/types/props.d.ts
index c576fd0..3e0781c 100644
--- a/pac-man-board-game/ClientApp/src/types/props.d.ts
+++ b/pac-man-board-game/ClientApp/src/types/props.d.ts
@@ -28,8 +28,8 @@ interface CharacterProps {
 }
 
 interface BoxProps {
-  pellets?: import("../game/pellet").default[],
-  readonly colour: import("../game/colour").Colour,
+  Pellets?: import("../game/pellet").default[],
+  readonly Colour: import("../game/colour").Colour,
 }
 
 interface PlayerProps {
diff --git a/pac-man-board-game/ClientApp/src/utils/state.ts b/pac-man-board-game/ClientApp/src/utils/state.ts
index f8cf243..7b6d1e9 100644
--- a/pac-man-board-game/ClientApp/src/utils/state.ts
+++ b/pac-man-board-game/ClientApp/src/utils/state.ts
@@ -8,7 +8,13 @@ const playerStorage = createJSONStorage<Player | undefined>(() => sessionStorage
 // TODO merge character and player atoms, since the player is the owner of the character
 export const charactersAtom = atom<Character[] | undefined>(undefined);
 export const playersAtom = atom<Player[]>([]);
-export const thisPlayerAtom = atomWithStorage<Player | undefined>("player", undefined, playerStorage);
+export const thisPlayerAtom = atomWithStorage<Player | undefined>("player", undefined, {
+  ...playerStorage,
+  getItem(key, initialValue): Player | undefined {
+    const playerProps = playerStorage.getItem(key, initialValue) as PlayerProps | undefined;
+    return playerProps ? new Player(playerProps) : undefined;
+  },
+});
 export const diceAtom = atom<number[] | undefined>(undefined);
 export const selectedDiceAtom = atom<SelectedDice | undefined>(undefined);
 export const currentPlayerAtom = atom<Player | undefined>(undefined);