Implement Plan page with phase overview and exercise reference (P2.13)

Add comprehensive training plan reference page that displays:
- Current phase status (day, phase name, training type, weekly limit)
- Phase overview cards for all 5 cycle phases with weekly intensity limits
- Strength training exercises reference with sets and reps
- Rebounding techniques organized by phase
- Weekly training guidelines for each phase

The page fetches cycle data from /api/cycle/current and highlights
the current phase. Implements full TDD with 16 tests covering loading
states, error handling, phase display, and exercise reference sections.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-11 08:56:52 +00:00
parent b2915bca9c
commit 39198fdf8c
3 changed files with 619 additions and 17 deletions

View File

@@ -4,7 +4,7 @@ This file is maintained by Ralph. Run `./ralph-sandbox.sh plan 3` to generate ta
## Current State Summary
### Overall Status: 609 tests passing across 34 test files
### Overall Status: 625 tests passing across 35 test files
### Library Implementation
| File | Status | Gap Analysis |
@@ -61,7 +61,7 @@ This file is maintained by Ralph. Run `./ralph-sandbox.sh plan 3` to generate ta
| Settings/Garmin (`/settings/garmin`) | **COMPLETE** | Token management UI, connection status, disconnect functionality, 27 tests |
| Calendar (`/calendar`) | **COMPLETE** | MonthView with navigation, ICS subscription section, token regeneration, 23 tests |
| History (`/history`) | **COMPLETE** | Table view with date filtering, pagination, decision styling, 26 tests |
| Plan (`/plan`) | **NOT IMPLEMENTED** | Placeholder only - shows heading and placeholder text, needs phase details display |
| Plan (`/plan`) | **COMPLETE** | Phase overview, training guidelines, rebounding techniques, 16 tests |
### Components
| Component | Status | Notes |
@@ -116,6 +116,7 @@ This file is maintained by Ralph. Run `./ralph-sandbox.sh plan 3` to generate ta
| `src/components/dashboard/override-toggles.test.tsx` | **MISSING** - Needs tests for toggle state and callbacks |
| `src/components/dashboard/mini-calendar.test.tsx` | **EXISTS** - 23 tests (calendar grid, phase colors, navigation, legend) |
| `src/components/calendar/day-cell.test.tsx` | **MISSING** - Needs tests for phase coloring, click handler |
| `src/app/plan/page.test.tsx` | **EXISTS** - 16 tests (loading states, error handling, phase display, exercise reference, rebounding techniques) |
| E2E tests | **AUTHORIZED SKIP** - Per specs/testing.md |
### Critical Business Rules (from Spec)
@@ -447,18 +448,18 @@ Full feature set for production use.
- **Why:** Users want to review their training history
- **Depends On:** P2.8
### P2.13: Plan Page Implementation
- [ ] Phase-specific training plan view
- **Current State:** Placeholder only - shows "Exercise Plan" heading and placeholder text, no actual content
### P2.13: Plan Page Implementation ✅ COMPLETE
- [x] Phase-specific training plan view
- **Files:**
- `src/app/plan/page.tsx` - Current phase details, upcoming phases, limits
- `src/app/plan/page.tsx` - Phase overview, training guidelines, exercise reference, rebounding techniques
- **Tests:**
- Component tests: phase info display, limits shown correctly
- **Features Needed:**
- Current phase details (name, day range, characteristics)
- Upcoming phases preview
- Phase-specific training limits and recommendations
- Integration with cycle.ts utilities
- `src/app/plan/page.test.tsx` - 16 tests covering loading states, error handling, phase display, exercise reference, rebounding techniques
- **Features Implemented:**
- Current phase status display (day, phase name, training type, weekly limit)
- Phase overview cards for all 5 phases with weekly intensity minute limits
- Strength training exercises reference with descriptions
- Rebounding techniques organized by phase (follicular and luteal)
- Weekly guidelines for each phase with training goals
- **Why:** Users want detailed training guidance
- **Depends On:** P0.4, P1.3
@@ -795,7 +796,6 @@ P4.* UX Polish ────────> After core functionality complete
| Priority | Task | Effort | Notes |
|----------|------|--------|-------|
| Medium | P2.13 Plan Page | Medium | Placeholder exists, needs content |
| Medium | P2.18 OIDC Auth | Large | Production auth requirement |
| Medium | P3.11 Component Tests | Medium | 5 components need tests |
| Low | P3.7 Error Handling | Small | Polish |
@@ -860,13 +860,14 @@ P4.* UX Polish ────────> After core functionality complete
- [x] **GET /api/health** - Health check endpoint with PocketBase connectivity check, 14 tests (P2.15)
- [x] **GET /metrics** - Prometheus metrics endpoint with counters, gauges, histograms, 33 tests (18 lib + 15 route) (P2.16)
### Pages (6 complete, 1 placeholder)
### Pages (7 complete)
- [x] **Login Page** - Email/password form with PocketBase auth, error handling, loading states, redirect, 14 tests (P1.6)
- [x] **Dashboard Page** - Complete daily interface with /api/today integration, DecisionCard, DataPanel, NutritionPanel, OverrideToggles, 23 tests (P1.7)
- [x] **Settings Page** - Form for cycleLength, notificationTime, timezone with validation, loading states, error handling, 28 tests (P2.9)
- [x] **Settings/Garmin Page** - Token input form, connection status, expiry warnings, disconnect functionality, 27 tests (P2.10)
- [x] **Calendar Page** - MonthView with navigation controls, ICS subscription section with URL display, copy button, token regeneration, 23 tests (P2.11)
- [x] **History Page** - Table view of DailyLogs with date filtering, pagination, decision styling, 26 tests (P2.12)
- [x] **Plan Page** - Phase overview, training guidance, exercise reference, rebounding techniques, 16 tests (P2.13)
### Test Infrastructure
- [x] **test-setup.ts** - Global test setup with @testing-library/jest-dom matchers and cleanup