Mana-Loop/docs/PLAN-SpireTab-refresh.md

PLAN: SpireTab Refresh & Casting Fixes

Phase 1: Fix Cast Bar Not Updating

1. Audit SpireTab.tsx cast progress subscription
   • Check if useCombatStore((s) => s.castProgress) is properly subscribed
   • Verify the progress bar component receives the latest castProgress value
2. Check combatStore.ts for castProgress updates
   • Ensure processCombatTick() properly updates castProgress in state
   • Verify set({ castProgress }) is called with correct value (0-1 range)
3. Fix Zustand subscription if broken
   • Use useCombatStore((s) => s.castProgress) with proper selector
   • Ensure component re-renders when castProgress changes

Phase 2: Fix Casting Not Costing Mana

1. Audit combat-actions.ts mana deduction
   • Verify deductSpellCost() is called when spell completes
   • Check canAffordSpellCost() is checked before casting starts
2. Ensure rawMana/elements state updates
   • Confirm deductSpellCost() returns updated state
   • Verify combatStore passes correct state to processCombatTick()
3. Test with modular stores only
   • Use useManaStore from stores/manaStore (not legacy)
   • Verify deductSpellCost from utils/ (not legacy store-modules/)

Phase 3: Make SpireTab Full-Screen (No Study/Crafting)

1. Remove study components when simpleMode=true
   • In SpireTab.tsx, conditionally render study progress ONLY if !simpleMode
   • Remove currentStudyTarget subscription when in spire mode
2. Remove crafting progress components
   • Conditionally render crafting progress ONLY if !simpleMode
   • Remove designProgress, preparationProgress, etc. when in spire
3. Add "Climb Down to Exit" button
   • Add button in FloorControls.tsx or SpireTab.tsx
   • Button calls exitSpireMode() from combatStore
   • Visible only when simpleMode=true (in spire)

Phase 4: Refresh SpireTab Layout

1. Reorganize component sections
   • Clear order: SpireHeader → Combat Info → Floor Controls → Activity Log
   • Remove redundant elements (duplicated stats, etc.)
2. Improve visual hierarchy
   • Use consistent card layouts
   • Proper spacing between sections
   • Clear headings for each section
3. Clean up confusing elements
   • Remove any UI that's irrelevant to spire (study, crafting, etc.)
   • Simplify floor controls for combat focus

Phase 5: Enforce Modular Stores Only

1. Audit all imports in modified files
   • SpireTab.tsx: Ensure NO imports from store.ts or store-modules/
   • combat-actions.ts: Use utils/ for helpers
   • combatStore.ts: Already uses modular stores (verify)
2. Replace any legacy imports
   • Search for @/lib/game/store or @/lib/game/store-modules in modified files
   • Replace with @/lib/game/stores/ or @/lib/game/utils/

Phase 6: Add Regression Tests

1. Create spire-tab-refresh.test.ts
   • Test cast progress updates during combat ticks
   • Test mana costs deducted when spells cast
   • Test simpleMode hides study/crafting components
   • Test "Climb Down" button exits spire mode
2. Add to stores/__tests__/ directory
   • Follow existing test patterns (Vitest)
   • Mock store state as needed
   • Assert acceptance criteria from SPEC

Files to Modify (Summary)

File	Changes
src/components/game/tabs/SpireTab.tsx	Fix cast bar, remove study/crafting in spire, refresh layout
src/components/game/tabs/FloorControls.tsx	Add "Climb Down" button
src/lib/game/stores/combat-actions.ts	Verify mana deduction logic
src/lib/game/stores/combatStore.ts	Ensure castProgress updates correctly
src/lib/game/stores/__tests__/spire-tab-refresh.test.ts	New regression tests

Verification Before Implementation

• ☑ All SPEC acceptance criteria mapped to plan items above
• ☑ No legacy store imports in plan
• ☑ All files <400 lines (combat-actions.ts is 117 lines, OK)
• ☑ Tests planned for all fixed issues