112 lines
3.8 KiB
Markdown
112 lines
3.8 KiB
Markdown
# Task 17: Fix Skill Requirement Display Bug (undefined Lv.[object Object])
|
|
|
|
## Summary
|
|
|
|
This bug causes skills to display "Requires: [Skill Name] Lv.[object Object]" instead of the proper level requirement. The root cause is that `cost` objects are incorrectly placed INSIDE the `req` (requirements) object in `skills.ts`, causing the rendering code to iterate over the cost object as if it were a skill requirement.
|
|
|
|
## Root Cause
|
|
|
|
In `/home/user/repos/Mana-Loop/src/lib/game/constants/skills.ts`, several skill entries have the `cost` property incorrectly nested inside the `req` object.
|
|
|
|
### Correct Format (cost OUTSIDE req):
|
|
```typescript
|
|
researchFireSpells: {
|
|
name: "Fire Spell Research",
|
|
desc: "...",
|
|
cat: "effectResearch",
|
|
max: 1,
|
|
base: 300,
|
|
studyTime: 6,
|
|
req: { enchanting: 2 },
|
|
cost: { type: 'element', element: 'fire', amount: 100 },
|
|
attunementReq: { enchanter: 1 }
|
|
}
|
|
```
|
|
|
|
### Malformed Format (cost INSIDE req - BUG):
|
|
```typescript
|
|
researchLifeDeathSpells: {
|
|
name: "Death Research",
|
|
desc: "...",
|
|
cat: "effectResearch",
|
|
max: 1,
|
|
base: 400,
|
|
studyTime: 8,
|
|
req: { enchanting: 3 , cost: { type: 'element', element: 'death', amount: 100 }}, // BUG: cost inside req
|
|
attunementReq: { enchanter: 2 }
|
|
}
|
|
```
|
|
|
|
## Malformed Skill Entries
|
|
|
|
The following skills have `cost` incorrectly placed inside `req` (lines in skills.ts):
|
|
|
|
1. **researchLifeDeathSpells** (line 51)
|
|
2. **researchAdvancedFire** (line 54)
|
|
3. **researchAdvancedWater** (line 55)
|
|
4. **researchAdvancedAir** (line 56)
|
|
5. **researchAdvancedEarth** (line 57)
|
|
6. **researchAdvancedLight** (line 58)
|
|
7. **researchAdvancedDark** (line 59)
|
|
8. **researchMasterFire** (line 62)
|
|
9. **researchMasterWater** (line 63)
|
|
10. **researchMasterEarth** (line 64)
|
|
11. **researchMetalSpells** (line 86)
|
|
12. **researchSandSpells** (line 87)
|
|
13. **researchLightningSpells** (line 88)
|
|
14. **researchAdvancedMetal** (line 91)
|
|
15. **researchAdvancedSand** (line 92)
|
|
16. **researchAdvancedLightning** (line 93)
|
|
17. **researchMasterMetal** (line 96)
|
|
18. **researchMasterSand** (line 97)
|
|
19. **researchMasterLightning** (line 98)
|
|
|
|
Total: **19 malformed skill entries**
|
|
|
|
## How Skill Requirements are Rendered
|
|
|
|
In `/home/user/repos/Mana-Loop/src/components/game/tabs/SkillsTab.tsx` (lines 233-235):
|
|
|
|
```tsx
|
|
{!prereqMet && def.req && (
|
|
<div className="text-xs text-red-400 mt-1">
|
|
Requires: {Object.entries(def.req).map(([r, rl]) => `${SKILLS_DEF[r]?.name} Lv.${rl}`).join(', ')}
|
|
</div>
|
|
)}
|
|
```
|
|
|
|
The code expects `def.req` to be `Record<string, number>` (skill ID -> required level). When `cost` is inside `req`, the iteration produces entries like:
|
|
- `[ "enchanting", 3 ]` → "Enchanting Lv.3" ✓
|
|
- `[ "cost", { type: 'element', ... } ]` → "undefined Lv.[object Object]" ✗
|
|
|
|
## The Fix
|
|
|
|
For each malformed entry in `skills.ts`, move the `cost` property OUT of the `req` object:
|
|
|
|
**Before:**
|
|
```typescript
|
|
req: { enchanting: 3 , cost: { type: 'element', element: 'death', amount: 100 }}
|
|
```
|
|
|
|
**After:**
|
|
```typescript
|
|
req: { enchanting: 3 }, cost: { type: 'element', element: 'death', amount: 100 }
|
|
```
|
|
|
|
## Files to Modify
|
|
|
|
1. `/home/user/repos/Mana-Loop/src/lib/game/constants/skills.ts` - Fix 19 malformed skill entries
|
|
|
|
## No Changes Needed In
|
|
|
|
- `/home/user/repos/Mana-Loop/src/components/game/tabs/SkillsTab.tsx` - Rendering code is correct
|
|
- `/home/user/repos/Mana-Loop/src/lib/game/formatting.ts` - Not related to this bug
|
|
- `/home/user/repos/Mana-Loop/src/lib/game/types/skills.ts` - Type definitions are correct
|
|
|
|
## Steps to Fix
|
|
|
|
1. Edit `/home/user/repos/Mana-Loop/src/lib/game/constants/skills.ts`
|
|
2. For each of the 19 malformed entries, move `cost` from inside `req` to be a separate property
|
|
3. Verify the fix by checking that `Object.entries(def.req)` only returns skill ID/level pairs
|
|
4. Run typecheck and lint to confirm no errors
|