# ModernCharacterSheet Issues and Fixes Plan

## Issues Identified

### 1. Old Character Sheet Box Still Visible
- **Problem**: The original CharacterSheet5e component is still rendering underneath the new ModernCharacterSheet
- **Root Cause**: Both components are being rendered simultaneously in CharacterBar.tsx
- **Fix Location**: `/var/www/html/dungeon/client/src/components/CharacterBar.tsx`
- **Solution**: Remove or conditionally hide the old CharacterSheet5e when ModernCharacterSheet is active

### 2. Skills Showing ALL Skills Instead of Just Proficient Ones
- **Problem**: The skills tab is displaying every D&D skill rather than just the ones the character is proficient in
- **Current Behavior**: Shows all 18 skills with proficiency indicators
- **Expected Behavior**: Should show only proficient skills, or clearly separate proficient vs non-proficient
- **Fix Location**: `/var/www/html/dungeon/client/src/components/ModernCharacterSheet.tsx` - Skills tab section
- **Solution**: Filter skills to show only proficient ones, or reorganize display to separate proficient/non-proficient

### 3. Hit Points Display Error (12/120 instead of 12/12)
- **Problem**: Max hit points showing as 120 instead of the correct value (12)
- **Root Cause**: Likely a data mapping issue in the character data fetching/processing
- **Investigation Needed**: 
  - Check if `max_hit_points` vs `maxHitPoints` field mapping is correct
  - Verify the character data structure from API response
  - Check if there's a calculation error in the data processing
- **Fix Location**: `/var/www/html/dungeon/client/src/components/ModernCharacterSheet.tsx` - fetchCharacterData function
- **Solution**: Debug the character data mapping to ensure correct max HP value

### 4. Druid Spellbook Slow Loading
- **Problem**: Long delay when clicking to open spellbook for druids
- **Root Cause**: Likely multiple API calls or inefficient spell data fetching
- **Investigation Needed**:
  - Check if spell auto-population is running unnecessarily
  - Verify if there are multiple concurrent API calls
  - Check for any loops in spell data processing
- **Fix Location**: `/var/www/html/dungeon/client/src/components/ModernCharacterSheet.tsx` - spell fetching logic
- **Solution**: Optimize spell data fetching and add loading states

## Implementation Plan

### Phase 1: Remove Duplicate Character Sheet (High Priority)
1. **File**: `CharacterBar.tsx`
2. **Action**: Locate where both CharacterSheet5e and ModernCharacterSheet are rendered
3. **Implementation**: 
   - Remove the old CharacterSheet5e rendering
   - Ensure only ModernCharacterSheet is displayed
   - Test that no functionality is lost

### Phase 2: Fix Hit Points Display (High Priority)
1. **File**: `ModernCharacterSheet.tsx`
2. **Debug Steps**:
   - Add console.log to inspect raw character data from API
   - Check the field mapping in fetchCharacterData function
   - Verify max_hit_points vs maxHitPoints handling
   - Test with multiple characters to see if issue is consistent
3. **Implementation**:
   - Fix the field mapping for max hit points
   - Ensure proper fallback values
   - Test editable HP inputs work correctly

### Phase 3: Optimize Skills Display (Medium Priority)
1. **File**: `ModernCharacterSheet.tsx` - Skills tab
2. **Options**:
   - **Option A**: Show only proficient skills
   - **Option B**: Group skills into "Proficient" and "Other" sections
   - **Option C**: Add a toggle to show/hide non-proficient skills
3. **Recommended**: Option B - group into sections for better UX
4. **Implementation**:
   - Filter skills by proficiency
   - Create separate display sections
   - Style proficient skills prominently

### Phase 4: Optimize Spellbook Loading (Medium Priority)
1. **File**: `ModernCharacterSheet.tsx` - spell fetching logic
2. **Debug Steps**:
   - Add timing logs to spell fetching functions
   - Check if multiple API calls are happening
   - Verify spell auto-population logic
3. **Implementation**:
   - Add loading spinner for spell data
   - Optimize API calls to prevent duplicates
   - Cache spell data to avoid re-fetching

### Phase 5: Code Cleanup (Low Priority)
1. **Remove unused imports** identified in TypeScript errors:
   - Remove unused React import
   - Remove unused DND_CONDITIONS, SPELLS, Equipment imports
   - Remove unused variables like isRestMode
2. **Fix TypeScript issues**:
   - Add proper typing for spell slot indexing
   - Fix parameter types for equipment and proficiency mapping
   - Add features property to Character interface if needed

## Testing Plan

### Test Cases
1. **Character Sheet Display**:
   - Verify only one character sheet modal appears
   - Check all tabs load correctly
   - Confirm no duplicate UI elements

2. **Hit Points**:
   - Test with multiple characters of different levels
   - Verify current/max HP display correctly
   - Test DM editing functionality

3. **Skills**:
   - Check with characters having different skill proficiencies
   - Verify skill modifiers calculate correctly
   - Test display for characters with no proficiencies

4. **Spells**:
   - Test loading time for different spellcaster classes
   - Verify spell preparation mechanics work
   - Check auto-populate functionality

### Browser Testing
- Test in Firefox (primary issue browser)
- Verify Chrome compatibility
- Check mobile responsiveness

## Files to Modify

1. **Primary**: `/var/www/html/dungeon/client/src/components/CharacterBar.tsx`
2. **Primary**: `/var/www/html/dungeon/client/src/components/ModernCharacterSheet.tsx`
3. **Secondary**: `/var/www/html/dungeon/client/src/App.css` (if styling changes needed)

## Notes
- API rate limiting at 429 errors - wait before implementing
- Focus on one issue at a time to avoid overwhelming the API
- Test thoroughly with different character types (spellcasters vs non-spellcasters)
- Consider adding more loading states for better UX during API calls

## Current Status
- ModernCharacterSheet is functional and displaying character data
- Spells tab integration with spellbook system is working
- Combat features and equipment tabs are operational
- Main issues are UI/UX polish and data display accuracy