[priority: 4] Recreate Golemancy Tab — Golem Loadout Configuration #88

Closed
opened 2026-05-19 10:45:24 +02:00 by Anexim · 3 comments
Owner

Summary

Recreate the Golemancy tab that was deleted in commit fe0f2a0. This tab should allow the player to configure a golem "loadout" — selecting which golems to summon based on available mana types.

Context

  • Golem data exists in src/lib/game/data/golems/ (10 golems across 3 tiers):
    • Base: earthGolem
    • Elemental: steel (metal), crystal, sand
    • Hybrid: lava, galvanic, obsidian, prism, quicksilver, voidstone
  • Golem state lives in combatStore.tsgolemancy: { enabledGolems, summonedGolems, lastSummonFloor }
  • GolemDef has: id, name, description, baseManaType, summonCost, maintenanceCost, damage, attackSpeed, hp, armorPierce, isAoe, aoeTargets, unlockCondition, tier
  • Golem unlock conditions reference attunement levels and mana types
  • Helper functions in data/golems/utils.ts: isGolemUnlocked(), getUnlockedGolems(), canAffordGolemSummon(), etc.

Requirements

  • Create src/components/game/tabs/GolemancyTab.tsx
  • Show all golems organized by tier (base, elemental, hybrid)
  • For each golem display:
    • Name, description, and tier badge
    • Base mana type with element color
    • Stats: damage, attack speed, HP, armor pierce, AoE info
    • Summon cost (mana types and amounts)
    • Maintenance cost per tick
    • Unlock requirements
  • Allow the player to enable/disable golems in their loadout
  • Enabled golems are automatically summoned when entering the spire (if the player can afford the summon cost)
  • Key rule: Only "solid" mana types can form golems — Earth, Metal, Crystal, and higher-tier ones. The higher the tier, the better the golem.
  • Show which golems are currently summoned with their remaining duration
  • Use shared UI components from src/components/ui/
  • Use Tailwind CSS from the global design token system (no SCSS)
  • Add to src/components/game/tabs/index.ts barrel export
  • Add tab trigger and content to src/app/page.tsx with lazy loading pattern
  • Add DebugName wrapper
  • Write tests

Architecture Notes

  • Follow the existing lazy-loaded tab pattern
  • Use Zustand store selectors
  • Keep under 400 lines; split into sub-components if needed
## Summary Recreate the Golemancy tab that was deleted in commit `fe0f2a0`. This tab should allow the player to configure a golem "loadout" — selecting which golems to summon based on available mana types. ## Context - Golem data exists in `src/lib/game/data/golems/` (10 golems across 3 tiers): - Base: earthGolem - Elemental: steel (metal), crystal, sand - Hybrid: lava, galvanic, obsidian, prism, quicksilver, voidstone - Golem state lives in `combatStore.ts` → `golemancy: { enabledGolems, summonedGolems, lastSummonFloor }` - `GolemDef` has: `id`, `name`, `description`, `baseManaType`, `summonCost`, `maintenanceCost`, `damage`, `attackSpeed`, `hp`, `armorPierce`, `isAoe`, `aoeTargets`, `unlockCondition`, `tier` - Golem unlock conditions reference attunement levels and mana types - Helper functions in `data/golems/utils.ts`: `isGolemUnlocked()`, `getUnlockedGolems()`, `canAffordGolemSummon()`, etc. ## Requirements - Create `src/components/game/tabs/GolemancyTab.tsx` - Show all golems organized by tier (base, elemental, hybrid) - For each golem display: - Name, description, and tier badge - Base mana type with element color - Stats: damage, attack speed, HP, armor pierce, AoE info - Summon cost (mana types and amounts) - Maintenance cost per tick - Unlock requirements - Allow the player to enable/disable golems in their loadout - Enabled golems are automatically summoned when entering the spire (if the player can afford the summon cost) - **Key rule**: Only "solid" mana types can form golems — Earth, Metal, Crystal, and higher-tier ones. The higher the tier, the better the golem. - Show which golems are currently summoned with their remaining duration - Use shared UI components from `src/components/ui/` - Use Tailwind CSS from the global design token system (no SCSS) - Add to `src/components/game/tabs/index.ts` barrel export - Add tab trigger and content to `src/app/page.tsx` with lazy loading pattern - Add `DebugName` wrapper - Write tests ## Architecture Notes - Follow the existing lazy-loaded tab pattern - Use Zustand store selectors - Keep under 400 lines; split into sub-components if needed
Anexim added the ai:blocked label 2026-05-19 10:45:24 +02:00
n8n-gitea was assigned by Anexim 2026-05-19 10:45:24 +02:00
Anexim added ai:todo and removed ai:blocked labels 2026-05-19 22:10:08 +02:00
Author
Owner

Starting work on GolemancyTab. I've read all the golem data, store state, and existing tab patterns. Building the tab now.

Starting work on GolemancyTab. I've read all the golem data, store state, and existing tab patterns. Building the tab now.
Author
Owner

GolemancyTab completed and pushed. Summary of changes:

  • GolemancyTab.tsx (340 lines): Full golem loadout configuration tab with tier-based organization (Base/Elemental/Hybrid), golem cards showing stats/costs/unlock conditions, enable/disable toggle, affordability checks, and summoned/queued status indicators.
  • GolemancyTab.test.ts (149 lines): 17 tests covering module exports, barrel integration, golem data integrity, utility functions, combat store state, and file size limit.
  • tabs/index.ts: Added GolemancyTab barrel export.
  • page.tsx: Added lazy-loaded GolemancyTab import and "🗿 Golemancy" tab trigger with Suspense/ErrorBoundary wrapper.

All tests pass, pre-commit checks pass, no new type errors introduced.

GolemancyTab completed and pushed. Summary of changes: - **GolemancyTab.tsx** (340 lines): Full golem loadout configuration tab with tier-based organization (Base/Elemental/Hybrid), golem cards showing stats/costs/unlock conditions, enable/disable toggle, affordability checks, and summoned/queued status indicators. - **GolemancyTab.test.ts** (149 lines): 17 tests covering module exports, barrel integration, golem data integrity, utility functions, combat store state, and file size limit. - **tabs/index.ts**: Added GolemancyTab barrel export. - **page.tsx**: Added lazy-loaded GolemancyTab import and "🗿 Golemancy" tab trigger with Suspense/ErrorBoundary wrapper. All tests pass, pre-commit checks pass, no new type errors introduced.
Author
Owner

Ticket 88 — Golemancy Tab Complete

Files changed (7 files, +503/-3):

File Lines Purpose
src/components/game/tabs/GolemancyTab.tsx 340 Main tab component with GolemCard sub-component
src/components/game/tabs/GolemancyTab.test.ts 149 17 tests (exports, data, utils, store, file size)
src/components/game/tabs/index.ts +1 Barrel export
src/app/page.tsx +12 Lazy import + tab trigger + TabsContent
docs/project-structure.txt auto Updated by pre-commit hook
docs/dependency-graph.json auto Updated by pre-commit hook
docs/circular-deps.txt auto Updated by pre-commit hook

Key design decisions:

  • GolemCard is a React.memo sub-component to avoid re-renders across tier switches
  • Tier grouping: Base (T1), Elemental (T2), Hybrid (T3-T4) — matches the golem data model
  • Uses useShallow selectors on combat/attunement/mana stores to minimize re-renders
  • DebugName wrapper for debug mode visibility
  • All styling via Tailwind CSS design tokens (no SCSS)
  • File size: 340 lines (under 400 limit )
✅ **Ticket 88 — Golemancy Tab Complete** ### Files changed (7 files, +503/-3): | File | Lines | Purpose | |------|-------|---------| | `src/components/game/tabs/GolemancyTab.tsx` | 340 | Main tab component with GolemCard sub-component | | `src/components/game/tabs/GolemancyTab.test.ts` | 149 | 17 tests (exports, data, utils, store, file size) | | `src/components/game/tabs/index.ts` | +1 | Barrel export | | `src/app/page.tsx` | +12 | Lazy import + tab trigger + TabsContent | | `docs/project-structure.txt` | auto | Updated by pre-commit hook | | `docs/dependency-graph.json` | auto | Updated by pre-commit hook | | `docs/circular-deps.txt` | auto | Updated by pre-commit hook | ### Key design decisions: - **GolemCard** is a `React.memo` sub-component to avoid re-renders across tier switches - Tier grouping: Base (T1), Elemental (T2), Hybrid (T3-T4) — matches the golem data model - Uses `useShallow` selectors on combat/attunement/mana stores to minimize re-renders - `DebugName` wrapper for debug mode visibility - All styling via Tailwind CSS design tokens (no SCSS) - File size: 340 lines (under 400 limit ✅)
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Anexim/Mana-Loop#88