Fix pipeline error: handle null game state during build

Co-authored-by: mgierschdev <62764972+mgierschdev@users.noreply.github.com>

Author: Copilot

frontend/src/app/_client_components/ChessGameWrapper.tsx

@@ -1,11 +1,43 @@
 'use client';
 
-import React, {useState} from 'react';
+import React, {useState, useEffect} from 'react';
 import Chessboard from "@/app/_client_components/Chessboard";
 import RightSidePanel from "@/app/_client_components/RightSidePanel";
+import {ChessService} from "@/app/_services/ChessService";
+import {ChessGame} from "@/app/_models/ChessGame";
 
-export default function ChessGameWrapper({gameInfo}: any) {
+const gameService = new ChessService();
+
+export default function ChessGameWrapper({gameInfo: initialGameInfo}: {gameInfo: ChessGame | null}) {
     const [isBotMode, setIsBotMode] = useState(false);
+    const [gameInfo, setGameInfo] = useState<ChessGame | null>(initialGameInfo);
+    
+    // If no initial game info, fetch it on the client side
+    useEffect(() => {
+        if (!gameInfo) {
+            gameService.getChessGame().then(info => {
+                if (info) {
+                    setGameInfo(info);
+                }
+            }).catch(error => {
+                console.error("Failed to fetch game info:", error);
+            });
+        }
+    }, [gameInfo]);
+    
+    // Show loading state if game info isn't available yet
+    if (!gameInfo) {
+        return (
+            <>
+                <div className="left-panel">
+                    <div>Loading chess game...</div>
+                </div>
+                <div className="right-panel">
+                    <div>Loading...</div>
+                </div>
+            </>
+        );
+    }
 
     return (
         <>

frontend/src/app/page.tsx

@@ -6,12 +6,22 @@ import {ChessGame} from "@/app/_models/ChessGame";
 import {metadata} from "@/app/layout";
 import ChessGameWrapper from "@/app/_client_components/ChessGameWrapper";
 
+// Force dynamic rendering to avoid build-time fetch issues
+export const dynamic = 'force-dynamic';
 
 export default async function Home() {
     let title: 'Chess';
     let description: 'Chess Engine';
     let gameService: ChessService = new ChessService();
-    let gameInfo: ChessGame = await gameService.getChessGame();
+    let gameInfo: ChessGame | null = null;
+    
+    try {
+        gameInfo = await gameService.getChessGame();
+    } catch (error) {
+        console.error("Failed to fetch initial game state:", error);
+        // gameInfo will remain null, client components will handle it
+    }
+    
     let currentDate = new Date();
 
     return (