AOSSIE-Org / AOSSIE-Org/EduAid

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

Ouverte
#495 1 commentaire 0 réactions 0 personnes assignées Voir sur GitHub
enhancement
Langage dominant
JavaScript
Étoiles
171
Forks
425
Métriques de merge des PR
Aucune PR mergée en 30 j

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

Guide de contribution

Aucun guide de contribution indexé pour ce dépôt

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.