From 11f674d542ea5e4e88bd60ff1068451805d9766e Mon Sep 17 00:00:00 2001
From: Thomas Hallock <thomas@evolutioniq.com>
Date: Sun, 2 Nov 2025 12:24:22 -0600
Subject: [PATCH] feat(rithmomachia): guide defaults to docked right on open
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Change guide opening behavior:
- Created handleOpenGuide() function
- Sets guideDocked=true and guideDockSide='right' when opening
- Guide now opens docked to the right side by default
- No need to drag and dock manually on first open
- Provides better initial UX with guide immediately in workspace

User can still undock or drag to left side if preferred.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../rithmomachia/components/RithmomachiaGame.tsx     | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/arcade-games/rithmomachia/components/RithmomachiaGame.tsx b/apps/web/src/arcade-games/rithmomachia/components/RithmomachiaGame.tsx
index 85a0d831..376e710c 100644
--- a/apps/web/src/arcade-games/rithmomachia/components/RithmomachiaGame.tsx
+++ b/apps/web/src/arcade-games/rithmomachia/components/RithmomachiaGame.tsx
@@ -94,6 +94,14 @@ export function RithmomachiaGame() {
     return badges
   }, [whitePlayerId, blackPlayerId])
 
+  const handleOpenGuide = () => {
+    console.log('[RithmomachiaGame] handleOpenGuide called')
+    setIsGuideOpen(true)
+    setGuideDocked(true) // Default to docked on right
+    setGuideDockSide('right')
+    console.log('[RithmomachiaGame] Guide opened in docked right position')
+  }
+
   const handleDock = (side: 'left' | 'right') => {
     console.log('[RithmomachiaGame] handleDock called', { side })
     setGuideDockSide(side)
@@ -144,8 +152,8 @@ export function RithmomachiaGame() {
           height: '100%',
         })}
       >
-        {state.gamePhase === 'setup' && <SetupPhase onOpenGuide={() => setIsGuideOpen(true)} />}
-        {state.gamePhase === 'playing' && <PlayingPhase onOpenGuide={() => setIsGuideOpen(true)} />}
+        {state.gamePhase === 'setup' && <SetupPhase onOpenGuide={handleOpenGuide} />}
+        {state.gamePhase === 'playing' && <PlayingPhase onOpenGuide={handleOpenGuide} />}
         {state.gamePhase === 'results' && <ResultsPhase />}
       </main>
     </div>