Skip to content

feat(dashboard): isolate widget failures with WidgetErrorBoundary (#474)#490

Open
temisan0x wants to merge 1 commit into
Remitwise-Org:mainfrom
temisan0x:feat/dashboard-widget-error-boundary
Open

feat(dashboard): isolate widget failures with WidgetErrorBoundary (#474)#490
temisan0x wants to merge 1 commit into
Remitwise-Org:mainfrom
temisan0x:feat/dashboard-widget-error-boundary

Conversation

@temisan0x

Copy link
Copy Markdown

Summary

Adds a reusable WidgetErrorBoundary component and wraps each major dashboard widget individually, so a single widget throwing no longer blanks the entire dashboard.

Changes

  • New: components/ui/WidgetErrorBoundary.tsx — React class error boundary ("use client") that catches render errors, logs them via lib/logger.ts, and renders WidgetErrorState with a retry/reset button
  • Updated: app/dashboard/page.tsx — each of the 9 major widgets wrapped in its own boundary: StatCard ×4, QuickActions, CurrentMoneySplitWidget, MoneyDistributionWidget, RecentTransactionsWidget, SavingsByGoalWidget, BillsByType

Behaviour

  • A widget that throws renders an inline error card with "Try again" instead of crashing the page
  • Errors are logged with a generated request ID pointing to dashboard/<widgetName>
  • Retry resets boundary state and re-mounts the widget
  • Error card announces itself via role="alert" (already on WidgetErrorState); boundary wrapper uses role="region" + aria-label

Test notes

  • npx tsc --noEmit and npm run lint exit 1 on pre-existing errors in insurance/page.tsx, remittanceTrendChart.tsx, SwaggerUIWrapper.tsx, and SessionExpiryNotification.tsx — zero regressions from this diff

Closes #474

Adds WidgetErrorBoundary rendering WidgetErrorState with retry and
wraps each dashboard widget to prevent full-page crashes.

- New components/ui/WidgetErrorBoundary.tsx (class component, 'use client')
- Logs caught errors via lib/logger.ts logError + generateRequestId
- Wraps StatCard x4, QuickActions, CurrentMoneySplitWidget,
  MoneyDistributionWidget, RecentTransactionsWidget,
  SavingsByGoalWidget, BillsByType individually
- All tsc/lint failures are pre-existing, zero regressions from diff

Closes Remitwise-Org#474
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add an Error Boundary and graceful failure UI around dashboard data widgets

1 participant