fix: Fix commit detail page error boundary

[suejung-sentry]

trafficstars

Description

Customer reported issue on Commit Detail page > Coverage report > Files changed tab > Files Changed table

The issue is that the component shows a loading spinner, then after a few seconds, the whole page is replaced with an upside down umbrella error page.

This component calls the useCommit hook, which calls a useQuery (GraphQL query Commit) and useCompareTotals (GraphQL query CompareTotals). The latter of these runs the GraphQL query only when shouldPoll = commitQuery?.data?.commit?.compareWithParent?.state === 'pending'. It seems when data gets into that delicate state of the report still being pending (not yet processed), but the second hook fails for some reason (unknown why - but I see 404 with null data in the console), we end up with the error bubbling up to trigger the full page 404. The full page 404 is because useCompareTotals uses our default react-query v4 suspense: true (doc) which relies on React error boundaries for any thrown errors. The next up error boundary for this component is all the way up the stack with the full page umbrella error page. In this PR I introduced a local boundary with some error text that looks like below to render instead.

I also populate the data returned with the 404 so we can see what the cause of the error is for that zod schema violation. That can inform if we need any follow-up work to avoid this state. I had a lot of trouble getting anything to replicate this state other than the customer account, so the true test will be once we can gather more data about what's causing the failure there (my suspicion is something related to longer processing times than we see in our repos). The actual error causing this appears transient as I'm not able to consistently get commits to that state and even ones that I do see, don't stay that way across a page refresh. Anyway in the meantime, this new error state is less jarring than the full page upside down umbrella one and gives us more information about any underlying errors.

Here's a picture of the new error state (and if you open console, we can grab more logs now I hope)

Closes https://github.com/codecov/internal-issues/issues/825

[codecov-staging[bot]]

Bundle Report

Changes will increase total bundle size by 440 bytes (0.01%) :arrow_up:. This is within the configured threshold :white_check_mark:

Detailed changes

Bundle name	Size	Change
gazebo-staging-array-push	6.13MB	440 bytes (0.01%) :arrow_up:

[codecov-public-qa[bot]]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 99.17%. Comparing base (3250f25) to head (769d6c1).

:white_check_mark: All tests successful. No failed tests found.

@@           Coverage Diff           @@
##             main    #3371   +/-   ##
=======================================
  Coverage   99.17%   99.17%           
=======================================
  Files         803      803           
  Lines       14166    14166           
  Branches     3908     3903    -5     
=======================================
  Hits        14049    14049           
  Misses        108      108           
  Partials        9        9           

Files	Coverage Δ
...overage/routes/FilesChangedTab/FilesChangedTab.tsx	100.00% <ø> (ø)
src/services/commit/useCompareTotals.tsx	100.00% <ø> (ø)

Components	Coverage Δ
Assets	100.00% <ø> (ø)
Layouts	100.00% <ø> (ø)
Pages	98.96% <ø> (ø)
Services	99.45% <ø> (ø)
Shared	99.80% <ø> (ø)
UI	99.10% <ø> (ø)

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 3250f25...769d6c1. Read the comment docs.

[codecov-qa[bot]]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 99.17%. Comparing base (3250f25) to head (769d6c1). Report is 6 commits behind head on main.

:white_check_mark: All tests successful. No failed tests found.

@@           Coverage Diff           @@
##             main    #3371   +/-   ##
=======================================
  Coverage   99.17%   99.17%           
=======================================
  Files         803      803           
  Lines       14166    14166           
  Branches     3903     3903           
=======================================
  Hits        14049    14049           
  Misses        108      108           
  Partials        9        9           

Files with missing lines	Coverage Δ
...overage/routes/FilesChangedTab/FilesChangedTab.tsx	100.00% <ø> (ø)
src/services/commit/useCompareTotals.tsx	100.00% <ø> (ø)

Components	Coverage Δ
Assets	100.00% <ø> (ø)
Layouts	100.00% <ø> (ø)
Pages	98.96% <ø> (ø)
Services	99.45% <ø> (ø)
Shared	99.80% <ø> (ø)
UI	99.10% <ø> (ø)

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 3250f25...769d6c1. Read the comment docs.

[codecov-staging[bot]]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

:white_check_mark: All tests successful. No failed tests found.

@@           Coverage Diff           @@
##             main    #3371   +/-   ##
=======================================
  Coverage   99.17%   99.17%           
=======================================
  Files         803      803           
  Lines       14166    14166           
  Branches     3908     3903    -5     
=======================================
  Hits        14049    14049           
  Misses        108      108           
  Partials        9        9           

Files with missing lines	Coverage Δ
...overage/routes/FilesChangedTab/FilesChangedTab.tsx	100.00% <ø> (ø)
src/services/commit/useCompareTotals.tsx	100.00% <ø> (ø)

Components	Coverage Δ
Assets	100.00% <ø> (ø)
Layouts	100.00% <ø> (ø)
Pages	98.96% <ø> (ø)
Services	99.45% <ø> (ø)
Shared	99.80% <ø> (ø)
UI	99.10% <ø> (ø)

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 3250f25...769d6c1. Read the comment docs.

[codecov[bot]]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 99.17%. Comparing base (3250f25) to head (769d6c1). Report is 6 commits behind head on main.

:white_check_mark: All tests successful. No failed tests found.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #3371   +/-   ##
=======================================
  Coverage   99.17%   99.17%           
=======================================
  Files         803      803           
  Lines       14166    14166           
  Branches     3903     3908    +5     
=======================================
  Hits        14049    14049           
  Misses        108      108           
  Partials        9        9           

Files with missing lines	Coverage Δ
...overage/routes/FilesChangedTab/FilesChangedTab.tsx	100.00% <ø> (ø)
src/services/commit/useCompareTotals.tsx	100.00% <ø> (ø)

Components	Coverage Δ
Assets	100.00% <ø> (ø)
Layouts	100.00% <ø> (ø)
Pages	98.96% <ø> (ø)
Services	99.45% <ø> (ø)
Shared	99.80% <ø> (ø)
UI	99.10% <ø> (ø)

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 3250f25...769d6c1. Read the comment docs.

[codecov[bot]]

Bundle Report

Changes will increase total bundle size by 440 bytes (0.01%) :arrow_up:. This is within the configured threshold :white_check_mark:

Detailed changes

Bundle name	Size	Change
gazebo-production-array-push	6.13MB	440 bytes (0.01%) :arrow_up:

[codecov-releaser]

✅ Deploy preview for gazebo ready!

Previews expire after 1 month automatically.

Storybook

Commit	Created	Cloud	Enterprise
4de632ca476ebf0b22edaf3ef7d4d07f8c369e4b	Wed, 09 Oct 2024 07:51:02 GMT	Expired	Expired
aa7a7576c9f42274816c5fd7447ccfc69138ec21	Thu, 10 Oct 2024 07:22:36 GMT	Expired	Expired
f6e575462769d5d6abd76e32def9ee1def569684	Thu, 10 Oct 2024 07:39:32 GMT	Expired	Expired
f6e575462769d5d6abd76e32def9ee1def569684	Thu, 10 Oct 2024 07:41:09 GMT	Expired	Expired
f6e575462769d5d6abd76e32def9ee1def569684	Thu, 10 Oct 2024 07:43:02 GMT	Expired	Expired
4a37fa62c494b3e670499b168cbffbdcc8579a84	Thu, 10 Oct 2024 07:59:23 GMT	Expired	Expired
a61a22f405bd9de0b78b7502d4bf3e01d8730b76	Thu, 10 Oct 2024 22:08:40 GMT	Expired	Expired
769d6c15565cf58535da0abe0a7dd6a9af823a5b	Fri, 11 Oct 2024 01:00:26 GMT	Cloud	Enterprise

[spalmurray-codecov]

Hopefully this will show us the problem 🙏

[suejung-sentry]

This follow-up PR fixes the cause of this issue - the useCompareTotals hook doesn't run often (only polls under certain circumstances) and appears to potentially have been always failing due to mixup across the coverage vs. percentCovered keys.

Also there was an issue in ImpactedFiles should be nullable and zod schema adjusted as such

The ErrorBoundary was removed in favor of a more holistic pattern in this PR.