Problem
There is a single ErrorBoundary.js component but it may not wrap all critical routes. If a component throws during render, users could see a white screen.
What to change
- Audit all page-level components in
app/ to ensure they are wrapped with <ErrorBoundary>
- Add route-level error boundaries for: dashboard, pacts, groups, profile, and settings pages
- Include a user-friendly fallback UI with a 'Try Again' button
- Log errors to console (and optionally to an error tracking service)
Files to check
components/ErrorBoundary.js (existing)- All page files in
app/ directory
Impact
Prevents white-screen crashes for users. Graceful degradation.
Effort
~2-3 hours
Problem
There is a single
ErrorBoundary.jscomponent but it may not wrap all critical routes. If a component throws during render, users could see a white screen.What to change
app/to ensure they are wrapped with<ErrorBoundary>Files to check
components/ErrorBoundary.js(existing)app/directoryImpact
Prevents white-screen crashes for users. Graceful degradation.
Effort
~2-3 hours