From af2ea1c39e75e9e406f742bf0f4b49a8cbb5a124 Mon Sep 17 00:00:00 2001
From: Stefan <stefan@kaproblem.com>
Date: Thu, 27 Nov 2025 09:52:36 +0100
Subject: [PATCH] fix: Resolve build errors after merging feature branches

- Fix TypeScript errors in analysis page with non-null assertions
- Fix Chessboard component API usage to use options prop
- Fix Analyze Game button placement to be always visible
---
 src/app/analysis/page.tsx      | 21 +++++++++++++--------
 src/components/StartScreen.tsx | 27 ++++++++++++++-------------
 2 files changed, 27 insertions(+), 21 deletions(-)

diff --git a/src/app/analysis/page.tsx b/src/app/analysis/page.tsx
index eee3ecf..b3a5379 100644
--- a/src/app/analysis/page.tsx
+++ b/src/app/analysis/page.tsx
@@ -212,9 +212,9 @@ export default function AnalysisPage() {
             try {
                 const model = getGenAIModel(apiKey, "gemini-2.5-flash");
                 const delta = details.cpLoss ?? 0;
-                const evalBefore = details.evalBefore.score / 100;
-                const evalAfter = details.evalAfter.score / 100;
-                const mateInfo = details.evalAfter.mate !== null ? `Mate in ${details.evalAfter.mate}` : "No mate detected";
+                const evalBefore = details.evalBefore!.score / 100;
+                const evalAfter = details.evalAfter!.score / 100;
+                const mateInfo = details.evalAfter!.mate !== null ? `Mate in ${details.evalAfter!.mate}` : "No mate detected";
                 const tactics = (details.missedTactics || [])
                     .filter(t => t.tactic_type !== "none")
                     .map(t => `${t.tactic_type}${t.material_delta ? ` (~${(t.material_delta / 100).toFixed(1)} pawns)` : ""}`)
@@ -231,7 +231,7 @@ DATA:
 - Move played (SAN): ${step.san}
 - Evaluation before move: ${evalBefore.toFixed(2)} pawns
 - Evaluation after move: ${evalAfter.toFixed(2)} pawns
-- Best move suggestion: ${details.bestMoveSan ?? details.evalBefore.bestMove}
+- Best move suggestion: ${details.bestMoveSan ?? details.evalBefore!.bestMove}
 - Evaluation shift (centipawns): ${delta}
 - Opening context: ${openingInfo ? `${openingInfo.name} (${openingInfo.eco})` : "Unknown"}
 - Missed tactics: ${tactics}
@@ -342,10 +342,15 @@ INSTRUCTIONS:
 
                             <div className="bg-gray-50 dark:bg-gray-900 rounded-xl p-4 flex flex-col items-center gap-3 border border-gray-200 dark:border-gray-700">
                                 <Chessboard
-                                    position={currentFen}
-                                    boardOrientation={orientation}
-                                    arePiecesDraggable={false}
-                                    customBoardStyle={{ borderRadius: "12px", boxShadow: "0 8px 30px rgba(0,0,0,0.12)" }}
+                                    options={{
+                                        position: currentFen,
+                                        boardOrientation: orientation,
+                                        allowDragging: false,
+                                        darkSquareStyle: { backgroundColor: '#779954' },
+                                        lightSquareStyle: { backgroundColor: '#e9edcc' },
+                                        animationDurationInMs: 200,
+                                        boardStyle: { borderRadius: "12px", boxShadow: "0 8px 30px rgba(0,0,0,0.12)" }
+                                    }}
                                 />
                                 <div className="flex items-center gap-4">
                                     <button
diff --git a/src/components/StartScreen.tsx b/src/components/StartScreen.tsx
index 1794786..286e749 100644
--- a/src/components/StartScreen.tsx
+++ b/src/components/StartScreen.tsx
@@ -319,20 +319,21 @@ export default function StartScreen({ onStartGame, onResumeGame, savedGames, onD
                                         </button>
                                     )}
                                 </div>
-
-                                <div className="border-t border-gray-200 dark:border-gray-700 pt-6">
-                                    <p className="text-sm font-bold text-gray-700 dark:text-gray-300 mb-3 uppercase tracking-wide">
-                                        {t.start.analyzeGame}
-                                    </p>
-                                    <button
-                                        onClick={() => router.push("/analysis")}
-                                        className="w-full py-4 px-4 bg-purple-600 text-white rounded-xl hover:bg-purple-700 font-semibold shadow-lg transition-transform transform hover:scale-[1.02] flex items-center justify-center gap-2"
-                                    >
-                                        <Brain size={18} />
-                                        {t.start.analyzeGame}
-                                    </button>
-                                </div>
                             )}
+
+                            {/* Analysis Mode - Always Visible */}
+                            <div className="border-t border-gray-200 dark:border-gray-700 pt-6">
+                                <p className="text-sm font-bold text-gray-700 dark:text-gray-300 mb-3 uppercase tracking-wide">
+                                    {t.start.analyzeGame}
+                                </p>
+                                <button
+                                    onClick={() => router.push("/analysis")}
+                                    className="w-full py-4 px-4 bg-purple-600 text-white rounded-xl hover:bg-purple-700 font-semibold shadow-lg transition-transform transform hover:scale-[1.02] flex items-center justify-center gap-2"
+                                >
+                                    <Brain size={18} />
+                                    {t.start.analyzeGame}
+                                </button>
+                            </div>
                         </div>
                     </div>
                 </div>