Root cause: Trackers were using Redux state.auth.user (mock data) while
insights page was using useAuth() hook (real backend data from /me).
Since the user is logged in as andrei@cloudz.ro, AuthContext fetches
the real user with Alice child, but trackers were looking for mock
familyId 'fam_test123' which doesn't exist.
Fix: Changed all tracker pages and home page to use:
user?.families?.[0]?.familyId (from useAuth hook)
instead of:
state.auth.user?.familyId (from Redux mock)
This makes all pages consistent with the insights page approach.
Files updated:
- app/page.tsx (home)
- app/track/sleep/page.tsx
- app/track/feeding/page.tsx
- app/track/diaper/page.tsx
- app/track/activity/page.tsx
- app/track/growth/page.tsx
- app/track/medicine/page.tsx
Now all pages fetch children using the real logged-in user's familyId.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Updated all 6 tracking forms with ChildSelector component:
✅ Feeding form
✅ Sleep form
✅ Diaper form
✅ Activity form
✅ Growth form
✅ Medicine form
Changes applied to each form:
- Replace local child state with Redux state management
- Use ChildSelector component instead of custom select
- Sync selectedChildIds with Redux store
- Update API calls to use selectedChild.id
- Remove duplicate loadChildren functions
- Use Redux loading state
Build Results:
- ✅ All 38 pages compiled successfully
- ✅ No TypeScript errors
- ✅ No runtime warnings
- Bundle sizes optimized (all tracking forms 3-10 kB)
Phase 3 Activity Logging: 100% COMPLETE
- Replace local child state with Redux state management
- Use ChildSelector component instead of custom select
- Sync selectedChildIds with Redux store
- Update API calls to use selectedChild.id
- Remove loadChildren function
- Replace local child state with Redux state management
- Use ChildSelector component instead of custom select
- Sync selectedChildIds with Redux store
- Update API calls to use selectedChild.id
- Remove loadChildren function
- Replace local child state with Redux state management
- Use ChildSelector component instead of custom select
- Sync selectedChildIds with Redux store
- Update API calls to use selectedChild.id
- Remove duplicate child loading logic
- Build and test successfully
- Replace local child selector with shared ChildSelector component
- Use Redux for children state management
- Sync selected child with Redux store
- Remove duplicate child loading logic
- Maintain single child selection for feeding tracking
- Build and test successfully
**Theme-Aware Colors Across App:**
- Updated track page cards to use theme.palette colors
- Updated analytics page icons to use theme colors
- Updated login/register gradient backgrounds to use theme colors
- All colors now respond to Standard/High Contrast theme toggle
**Fixed Next Predicted Activity Section:**
- Connected to real analytics API predictions endpoint
- Fetches sleep and feeding predictions based on actual data
- Shows "Nap time in X minutes" when prediction available
- Displays formatted time using formatDistanceToNow
- Falls back to "Not enough data available for now. Keep tracking :)" when no predictions
**Multi-Language Support:**
- Added "notEnoughData" translation key to all 7 languages:
- English: "Not enough data available for now. Keep tracking :)"
- Spanish: "No hay suficientes datos disponibles por ahora. ¡Sigue rastreando! :)"
- French: "Pas assez de données disponibles pour le moment. Continuez à suivre :)"
- Portuguese: "Dados insuficientes disponíveis no momento. Continue rastreando :)"
- Chinese: "暂无足够数据。请继续记录 :)"
- German: "Derzeit nicht genügend Daten verfügbar. Weiter verfolgen :)"
- Italian: "Dati insufficienti al momento. Continua a monitorare :)"
**Color Mapping by Theme:**
*Purple Theme (Standard):*
- Feeding: Primary (#8b52ff)
- Sleep: Secondary (#ff7094)
- Diaper: Warning (amber)
- Medical: Error (red)
- Activity: Success (green)
- Growth: Primary Dark
*Peach Theme (High Contrast):*
- Feeding: Primary (#FFB6C1)
- Sleep: Secondary (#FFDAB9)
- Diaper: Warning (amber)
- Medical: Error (red)
- Activity: Success (green)
- Growth: Primary Dark
**Files Modified:**
- app/track/page.tsx - Dynamic theme colors
- app/analytics/page.tsx - Theme-aware icon colors
- app/(auth)/login/page.tsx - Gradient uses theme
- app/(auth)/register/page.tsx - Gradient uses theme
- app/page.tsx - Predictions integration
- locales/*/dashboard.json - All 7 languages
🎉 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented comprehensive form accessibility improvements across all critical forms:
**Accessibility Attributes Added:**
- aria-required="true" on all required form fields
- aria-invalid on fields with validation errors
- aria-describedby linking error messages to inputs
- Unique id attributes on FormHelperText for error association
- role="alert" on error messages for screen reader announcements
- labelId on Select components for proper label association
- noValidate on forms to use custom validation
**Forms Updated:**
1. Login Form (app/(auth)/login/page.tsx)
- Email and password fields with full ARIA support
- Error message association with aria-describedby
2. Registration Form (app/(auth)/register/page.tsx)
- All text fields: name, email, password, DOB, parental email
- Checkbox fields: Terms, Privacy, COPPA consent
- Conditional required fields for minors
3. Child Dialog (components/children/ChildDialog.tsx)
- Name, birthdate, gender fields
- Dynamic aria-invalid based on validation state
4. Tracking Forms:
- Feeding form (app/track/feeding/page.tsx)
- Child selector, side selector, bottle type
- Food description with required validation
- Sleep form (app/track/sleep/page.tsx)
- Child selector, start/end time fields
- Quality and location selectors
**WCAG 2.1 Compliance:**
- ✅ 3.3.2 Labels or Instructions (AA)
- ✅ 4.1.3 Status Messages (AA)
- ✅ 1.3.1 Info and Relationships (A)
- ✅ 3.3.1 Error Identification (A)
**Documentation:**
- Updated REMAINING_FEATURES.md
- Marked Form Accessibility Enhancement as complete
- Status: 79 features completed (57%)
🎉 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- **EULA Persistence Fix**: Fixed EULA dialog showing on every login
- Added eulaAcceptedAt/eulaVersion to AuthResponse interface
- Updated login/register/getUserById endpoints to return EULA fields
- Changed EULACheck to use refreshUser() instead of window.reload()
- **Touch Target Accessibility**: All interactive elements now meet 48x48px minimum
- Fixed 14 undersized IconButtons across 5 files
- Changed size="small" to size="medium" with minWidth/minHeight constraints
- Updated children page, AI chat, analytics cards, legal viewer
- **Alt Text for Images**: Complete image accessibility for screen readers
- Added photoAlt field to children table (Migration V009)
- PhotoUpload component now includes alt text input field
- All Avatar components have meaningful alt text
- Default alt text: "Photo of {childName}", "{userName}'s profile photo"
- **Medical Tracking Consolidation**: Unified medical page with tabs
- Medicine page now has 3 tabs: Medication, Temperature, Doctor Visit
- Backward compatibility for legacy 'medicine' activity type
- Created dedicated /track/growth page for physical measurements
- **Track Page Updates**:
- Simplified to 6 options: Feeding, Sleep, Diaper, Medical, Activity, Growth
- Fixed grid layout to 3 cards per row with minWidth: 200px
- Updated terminology from "Medicine" to "Medical"
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Updated track page cards to match home page styling with vibrant colors
- Applied consistent 140px height cards across track and insights pages
- Added mobile header bar with connection status and user menu
- Moved user menu from floating top-left to fixed header top-right
- Updated insights dashboard with home page color palette (#E91E63, #1976D2, etc.)
- Centered cards with minWidth constraints (200px for stats, 400px for charts)
- Fixed hydration mismatch by replacing JS media queries with CSS breakpoints
- Improved accessibility with viewport settings (removed zoom restrictions)
- Added UI improvements documentation
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Extract family data from registration response and add to user object
- Backend returns family separately in registration, but included in user for login
- Remove error messages for language/measurement preferences (they save correctly)
- Add detailed console logging for debugging family issues
- Improve error message when family is missing during child creation
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Added dateOfBirth, parentalEmail, and coppaConsentGiven to RegisterData interface
- Updated register function to include all required COPPA compliance fields in API payload
- Added debug logging to see registration payload
- Fixed 400 error during registration due to missing required dateOfBirth field
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Updated all Spanish (es) translation files with comprehensive translations for tracking, AI, family, insights, children, and settings pages
- Updated French (fr), Portuguese (pt), and Chinese (zh) translations to match English structure
- Added German (de) and Italian (it) language support with complete translation files
- Fixed medicine tracker route from /track/medication to /track/medicine
- Updated i18n config to support 7 languages: en, es, fr, pt, zh, de, it
- All tracking pages now fully localized: sleep, feeding, diaper, medicine, activity
- AI assistant interface fully translated with thinking messages and suggested questions
- Family management and insights pages now support all languages
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Updated getMedicineDetails() in medicine tracking page to:
- Convert ml dosages to oz when user has imperial preference
- Display non-liquid units (mg, tablets, drops) as-is
- Match the pattern used in feeding page for consistency
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented automatic unit conversions for feeding and medicine tracking:
- Created UnitInput component for automatic ml↔oz conversions
- Updated Feeding page to use UnitInput for bottle amounts
- Updated Medicine page to use UnitInput for liquid medicine dosages
- All values stored in metric (ml) in database
- Display values automatically converted based on user's measurement preference
- Supports voice input with proper unit handling
Component features:
- Automatic conversion between metric and imperial
- User preference-based display
- Consistent metric storage
- Type safety with TypeScript
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
**Pages Localized:**
- Track main page: Activity selection menu with all tracking options
- Children page: Complete localization including age formatting with pluralization
**Translation Files:**
- Enhanced tracking.json: Added trackActivity, selectActivity, and activities keys
- Created children.json for all 5 languages with comprehensive strings
- Updated i18n config to include children namespace
**Key Features:**
- Localized age calculation with proper pluralization (year/years, month/months)
- All error messages translated
- Gender labels localized
- Properly formatted age display for all languages
**Languages Supported:**
- English, Spanish, French, Portuguese, Chinese (Simplified)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Added new tracking pages:
- Medicine tracker: track medication name, dosage, unit, route, and reason
- Activity tracker: track play, exercise, walks, music, reading, tummy time, etc.
- Both pages follow existing tracker patterns with recent activities list
Voice command improvements:
- Updated voice classification to support medicine and activity types
- Added detailed extraction fields for medicine (medicineName, dosage, unit, route, reason)
- Added detailed extraction fields for activity (activityType, duration, description)
- Enhanced unknown intent dialog with manual tracker selection
- Updated tracker options to match implemented pages (removed milestone)
Backend changes:
- Added MEDICINE and ACTIVITY to ActivityType enum
- Created migration V013 to add medicine/activity to database CHECK constraint
- Updated voice service prompts to include medicine and activity extraction
Frontend changes:
- Created /track/medicine page with full CRUD operations
- Created /track/activity page with full CRUD operations
- Added Medicine card to /track page with MedicalServices icon
- Updated VoiceFloatingButton unknown dialog with 4 tracker options
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Fixed multiple issues with voice command workflow:
**Status Transition Fixes:**
- Fixed infinite loop in status update useEffect by checking if status actually needs to change
- Status now properly transitions: listening → understanding → review/close
- Added debug logging to track status changes
**UI Bug Fixes:**
- Fixed crash in diaper tracker when conditions field is undefined (voice-created activities)
- Auto-close dialog when classification returns "unknown" type
- Added optional chaining for conditions.join() in getDiaperDetails
**Changes:**
- VoiceFloatingButton: Prevent setting same status repeatedly
- VoiceFloatingButton: Close dialog on unknown classification
- Diaper page: Handle missing conditions field gracefully
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Fix login endpoint to return families as array of objects instead of strings
- Update auth interface to match /auth/me endpoint structure
- Add silence detection to voice input (auto-stop after 1.5s)
- Add comprehensive status messages to voice modal (Listening, Understanding, Saving)
- Unify voice input flow to use MediaRecorder + backend for all platforms
- Add null checks to prevent tracking page crashes from invalid data
- Wait for auth completion before loading family data in HomePage
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add URL parameter reading to diaper tracking page for voice-extracted data
- Add comprehensive server-side logging in voice controller and service
- Log request type (Web Speech API vs MediaRecorder), input text/audio, GPT calls, and classification results
- Enable automatic form pre-filling when voice commands navigate to tracking pages
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented React error boundaries to catch and handle errors gracefully:
**Core Error Handling Components:**
- Created ErrorBoundary class component with error catching and logging
- Created specialized fallback UIs (MinimalErrorFallback, DataErrorFallback,
ComponentErrorFallback, FormErrorFallback, ChartErrorFallback, ImageErrorFallback)
- Added withErrorBoundary HOC for easy component wrapping
- Created errorLogger service with Sentry integration placeholder
**Error Logging Service (errorLogger.ts):**
- Centralized error logging with severity levels (FATAL, ERROR, WARNING, INFO, DEBUG)
- Context enrichment (URL, userAgent, timestamp, environment)
- Local storage of last 10 errors in sessionStorage for debugging
- User context management (setUser, clearUser)
- Breadcrumb support for debugging trails
**App Integration:**
- Wrapped root layout with top-level ErrorBoundary for catastrophic errors
- Added NetworkStatusIndicator to main page for offline sync visibility
- Wrapped daily summary section with isolated DataErrorFallback
- Added error boundary to AI assistant page with ComponentErrorFallback
- Wrapped feeding tracking form with FormErrorFallback using withErrorBoundary HOC
- Protected analytics charts with isolated ChartErrorFallback boundaries
**Error Recovery Features:**
- Isolated error boundaries prevent cascade failures
- Retry buttons on all fallback UIs
- Error count tracking with user warnings
- Development-mode error details display
- Automatic error logging to service (when Sentry integrated)
Next: Integration with Sentry for production error tracking
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
