[NEW] Fallback Error component for Engagement Dashboard widgets
Proposed changes (including videos or screenshots)
As proposed, was added a fallback component to catch errors at Engagement Dashboard widgets individually.
It used an Error boundary to catch react-query errors, due to this scenario was necessary to install and use the library react-error-boundary that implements everything and more compared to our ErrorBoundary component, the main reason was to capture Query errors and the implementation with react-query library.
Issue(s)
Steps to test or reproduce
1 - Login as an Admin in an Enterprise Edition Rocket.chat 2 - Go to administration > Engagement Dashboard 3 - Simulate an error direct in the code or with the browser Network tab 4 - You should be able to see the fallback component and a button to refetch the query
Further comments
TODO:
- [x] Add e2e tests to engagement dashboard page/widgets to simulate an error and refetch the query
- [x] Remove old ErrorBoundary component and replace with the new library react-error-boundary
Codecov Report
Merging #26441 (32beca4) into develop (fe26bce) will decrease coverage by
0.03%. The diff coverage isn/a.
:exclamation: Current head 32beca4 differs from pull request most recent head c5171b8. Consider uploading reports for the commit c5171b8 to get more accurate results
@@ Coverage Diff @@
## develop #26441 +/- ##
===========================================
- Coverage 38.54% 38.50% -0.04%
===========================================
Files 758 758
Lines 18827 18816 -11
Branches 1453 1459 +6
===========================================
- Hits 7256 7246 -10
+ Misses 11355 11350 -5
- Partials 216 220 +4
| Flag | Coverage Δ | |
|---|---|---|
| e2e | 38.50% <ø> (-0.04%) |
:arrow_down: |
Flags with carried forward coverage won't be shown. Click here to find out more.