AOSSIE-Org / AOSSIE-Org/EduAid

[FEATURE]: Implement Global React Error Boundary and Fallback UI in eduaid_web

Open
#495 1 comment 0 reactions 0 assignees View on GitHub
enhancement
Dominant language
JavaScript
Stars
171
Forks
425
PR merge metrics
No merged PRs in 30d

Description

### Feature and its Use Cases

This feature proposes implementing a reusable Global React Error Boundary component in the eduaid_web frontend to prevent full-application crashes caused by runtime errors in individual components.

What is the feature?

The feature involves creating a centralized ErrorBoundary component and wrapping the main application routes (in App.js) with it. If any child component throws a runtime error during rendering, lifecycle methods, or effects, the Error Boundary will catch it and render a fallback UI instead of crashing the entire application.

How would users benefit from it?

Currently, if a component such as Output.jsx or Text_Input.jsx encounters an unexpected error (for example, due to malformed backend responses or undefined data), the entire UI can break.

With a Global Error Boundary:

- The app will not fully crash.
- Users will see a clean fallback UI instead of a blank screen.
- We can optionally provide a “Retry” or “Go Back” action.
- Overall user trust and application stability will improve.

What scenarios would this feature address?

- Backend returns unexpected or malformed JSON.
- A component attempts to access properties of undefined.
- Rendering errors caused by edge-case inputs (e.g., complex Unicode input).
- Future regressions that accidentally introduce runtime errors.

This improves frontend resilience and aligns with improving overall stability and user experience.

### Additional Context

This implementation will not redesign existing pages or change backend logic. It focuses purely on improving frontend stability by introducing a reusable and scalable error handling mechanism.

### Code of Conduct

- [x] I have joined the [Discord server](https://discord.gg/hjUhu33uAn) and will post updates there
- [x] I have searched existing issues to avoid duplicates

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.