add GameStore

src/MancalaApp.tsx

@@ -34,9 +34,9 @@ const MancalaApp: FunctionComponent = () => {
     const onConnectionError = (event: Event) => {
         setConnetionState("error");
     };
-    const connectToServer = (connectionState: ConnectionState) => {
+    const connectToServer = async (connectionState: ConnectionState) => {
         setConnetionState(connectionState);
-        context.userKeyStore.getUserKey((userKey: string) => {
+        const userKey = await context.userKeyStore.getUserKey();
         setUserKey(userKey);
         const rtmtws = context.rtmt as RTMTWS;
         if (rtmtws) {
@@ -49,7 +49,6 @@ const MancalaApp: FunctionComponent = () => {
         } else {
             console.error("context.rtmt is not RTMTWS");
         }
-        });
     };
     React.useEffect(() => {
         connectToServer("connecting");
@@ -85,7 +84,7 @@ const MancalaApp: FunctionComponent = () => {
                     <Route index element={<Home context={context} theme={theme} userKey={userKey} />} />
                     <Route path="/" >
                         <Route path="game" >
-                            <Route path=":gameId" element={<GamePage context={context} theme={theme} userKey={userKey} />}  ></Route>
+                            <Route path=":gameId" element={<GamePage context={context} theme={theme} userKey={userKey} connectionState={connectionState} />}  ></Route>
                         </Route>
                         <Route path="loby" element={<LobyPage context={context} theme={theme} userKey={userKey} />}>
                         </Route>

src/context/context.tsx

@@ -1,7 +1,10 @@
+import { server } from "../const/config";
 import { Texts, TrTr } from "../const/texts";
 import { RTMT } from "../rtmt/rtmt";
 import { RTMTWS } from "../rtmt/rtmt_websocket";
-import { UserKeyStore, UserKeyStoreImpl } from "../store/key_store";
+import { HttpServiceImpl } from "../service/HttpService";
+import { GameStore, GameStoreImpl } from "../store/GameStore";
+import { UserKeyStore, UserKeyStoreImpl } from "../store/KeyStore";
 import ThemeManager from "../theme/ThemeManager";
 
 export type Context = {
@@ -9,11 +12,14 @@ export type Context = {
   userKeyStore: UserKeyStore;
   texts: Texts;
   themeManager: ThemeManager;
+  gameStore: GameStore;
 };
 
 export const initContext = (): Context => {
   const rtmt = new RTMTWS();
-  const userKeyStore = new UserKeyStoreImpl();
+  const httpService = new HttpServiceImpl(server.serverAdress);
+  const userKeyStore = new UserKeyStoreImpl({ httpService });
+  const gameStore = new GameStoreImpl({ httpService });
   const texts = TrTr;
   const themeManager = new ThemeManager();
   return {
@@ -21,5 +27,6 @@ export const initContext = () : Context =>  {
     userKeyStore: userKeyStore,
     texts: texts,
     themeManager,
+    gameStore
   };
 };

src/store/GameStore.ts

@@ -0,0 +1,25 @@
+import { CommonMancalaGame, MancalaGame } from "mancala.js";
+import { HttpService } from "../service/HttpService";
+
+export interface GameStore {
+    get(id: string): Promise<MancalaGame | undefined>;
+}
+
+export class GameStoreImpl implements GameStore {
+    httpService: HttpService;
+    constructor(props: { httpService: HttpService }) {
+        this.httpService = props.httpService;
+    }
+
+    async get(id: string): Promise<MancalaGame | undefined> {
+        try {
+            const response = await this.httpService.get(`/game/${id}`);
+            const json = await response.json();
+            return MancalaGame.createFromMancalaGame(json as CommonMancalaGame);
+        } catch (error) {
+            // todo check error
+            Promise.resolve(undefined);
+        }
+    }
+
+}