🐛 Stats tab does not load #118

New Issue

2026-05-22T13:17:00+02:00

Anexim commented

2026-05-22 13:17:00 +02:00

Bug

The Stats tab fails to load when clicked.

Root Cause

StatsTab.tsx passes a large upgradeEffects object to ManaStatsSection that includes many fields not present on the ComputedEffects type (from src/lib/game/effects/upgrade-effects.types.ts). The ManaStatsSection component's ManaStatsEffects interface extends ComputedEffects with additional fields like incursionStrength, rawMana, hasSteadyStream, hasManaTorrent, hasDesperateWells, manaCascadeBonus, manaWaterfallBonus, hasFlowSurge, hasManaOverflow, hasEternalFlow.

However, the useManaStats() hook in src/lib/game/hooks/useGameDerived.ts returns these as top-level properties (e.g., hasSteadyStream, manaCascadeBonus, etc.) — they are NOT nested inside upgradeEffects. The StatsTab incorrectly spreads them into the upgradeEffects prop:

upgradeEffects={{
  ...manaStats.upgradeEffects,
  incursionStrength: manaStats.incursionStrength,  // top-level from hook
  rawMana: manaStats.maxMana,                       // top-level from hook
  hasSteadyStream: manaStats.hasSteadyStream,       // top-level from hook
  // ...etc
}}

This creates a type mismatch. The ManaStatsSection component then accesses upgradeEffects.hasSteadyStream etc. which may work at runtime but the real issue is that the ComputedEffects type doesn't declare these fields, causing TypeScript compilation errors that prevent the tab from loading.

Additionally, LoopStatsSection.tsx reads memorySlots from usePrestigeStore((s) => s.memorySlots) — if this store property is missing or undefined, it could also cause a crash.

Files Involved

src/components/game/tabs/StatsTab.tsx
src/components/game/tabs/StatsTab/ManaStatsSection.tsx
src/components/game/tabs/StatsTab/LoopStatsSection.tsx
src/lib/game/hooks/useGameDerived.ts
src/lib/game/effects/upgrade-effects.types.ts

Suggested Fix

Either:

Add the missing fields to ComputedEffects type and have useManaStats() return them inside upgradeEffects, OR
Pass the special effect flags as separate props to ManaStatsSection instead of merging them into upgradeEffects.

## Bug The Stats tab fails to load when clicked. ## Root Cause `StatsTab.tsx` passes a large `upgradeEffects` object to `ManaStatsSection` that includes many fields not present on the `ComputedEffects` type (from `src/lib/game/effects/upgrade-effects.types.ts`). The `ManaStatsSection` component's `ManaStatsEffects` interface extends `ComputedEffects` with additional fields like `incursionStrength`, `rawMana`, `hasSteadyStream`, `hasManaTorrent`, `hasDesperateWells`, `manaCascadeBonus`, `manaWaterfallBonus`, `hasFlowSurge`, `hasManaOverflow`, `hasEternalFlow`. However, the `useManaStats()` hook in `src/lib/game/hooks/useGameDerived.ts` returns these as top-level properties (e.g., `hasSteadyStream`, `manaCascadeBonus`, etc.) — they are NOT nested inside `upgradeEffects`. The `StatsTab` incorrectly spreads them into the `upgradeEffects` prop: ```tsx upgradeEffects={{ ...manaStats.upgradeEffects, incursionStrength: manaStats.incursionStrength, // top-level from hook rawMana: manaStats.maxMana, // top-level from hook hasSteadyStream: manaStats.hasSteadyStream, // top-level from hook // ...etc }} ``` This creates a type mismatch. The `ManaStatsSection` component then accesses `upgradeEffects.hasSteadyStream` etc. which may work at runtime but the real issue is that the `ComputedEffects` type doesn't declare these fields, causing TypeScript compilation errors that prevent the tab from loading. Additionally, `LoopStatsSection.tsx` reads `memorySlots` from `usePrestigeStore((s) => s.memorySlots)` — if this store property is missing or undefined, it could also cause a crash. ## Files Involved - `src/components/game/tabs/StatsTab.tsx` - `src/components/game/tabs/StatsTab/ManaStatsSection.tsx` - `src/components/game/tabs/StatsTab/LoopStatsSection.tsx` - `src/lib/game/hooks/useGameDerived.ts` - `src/lib/game/effects/upgrade-effects.types.ts` ## Suggested Fix Either: 1. Add the missing fields to `ComputedEffects` type and have `useManaStats()` return them inside `upgradeEffects`, OR 2. Pass the special effect flags as separate props to `ManaStatsSection` instead of merging them into `upgradeEffects`.

Anexim added the ai:todo label 2026-05-22 13:17:00 +02:00

n8n-gitea was assigned by Anexim

2026-05-22 13:17:00 +02:00

Anexim referenced this issue

2026-05-22 13:28:57 +02:00

📋 Bug Fix Prioritization — Ordered Task List #127

Anexim referenced this issue

2026-05-22 13:39:39 +02:00

📋 Bug Fix Prioritization — Ordered Task List #127

Anexim commented

2026-05-22 15:02:10 +02:00

✅ Fixed. Changes made:

ManaStatsSection.tsx — Changed from ManaStatsEffects extends ComputedEffects interface to a flat ManaStatsSectionProps with all special effect flags as separate props (not merged into upgradeEffects)
StatsTab.tsx — Now passes manaStats.upgradeEffects directly (pure ComputedEffects) and passes special effect flags as separate props instead of manually merging them into a single object

This eliminates the type mismatch where non-ComputedEffects fields were being spread into the upgradeEffects prop.

✅ Fixed. Changes made: 1. **ManaStatsSection.tsx** — Changed from `ManaStatsEffects extends ComputedEffects` interface to a flat `ManaStatsSectionProps` with all special effect flags as separate props (not merged into `upgradeEffects`) 2. **StatsTab.tsx** — Now passes `manaStats.upgradeEffects` directly (pure `ComputedEffects`) and passes special effect flags as separate props instead of manually merging them into a single object This eliminates the type mismatch where non-`ComputedEffects` fields were being spread into the `upgradeEffects` prop.

Anexim closed this issue

2026-05-22 18:20:41 +02:00

Anexim commented

2026-05-22 18:20:42 +02:00