Skip to content

[Modifications] Consolidate the three ErrorBoundary implementations #1022

Description

@RUKAYAT-CODER

Overview

Three error boundaries exist: src/components/common/ErrorBoundary.tsx, src/components/common/ScreenErrorBoundary.tsx and components/ErrorBoundary/RetryErrorBoundary.tsx (with DefaultErrorFallback.tsx). app/_layout.tsx uses RetryErrorBoundary and ErrorBoundary; the unreachable App.tsx referenced ScreenErrorBoundary without importing it. Three implementations means three different reporting behaviours, three fallback UIs, and no single place to add a recovery action or a Sentry tag.

Specifications

Features:

  • One error-boundary component with retry, fallback and reporting as options
  • A consistent fallback UI
  • A single reporting path into Sentry with boundary-name tagging

Tasks:

  • Compare the three implementations and their reporting behaviour
  • Merge into one component with a props-driven surface
  • Update app/_layout.tsx and all consumers
  • Consolidate src/__tests__/components/ScreenErrorBoundary.test.tsx and tests/components/RetryErrorBoundary.test.tsx
  • Update docs/error-boundary-retry-strategy.md

Impacted Files:

  • src/components/common/ErrorBoundary.tsx
  • src/components/common/ScreenErrorBoundary.tsx
  • components/ErrorBoundary/RetryErrorBoundary.tsx
  • app/_layout.tsx
  • docs/error-boundary-retry-strategy.md

Acceptance Criteria

  • One error boundary remains
  • All caught errors reach Sentry with a boundary tag
  • The fallback UI is consistent across the app

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions