chore: migrate ErrorBoundary component from jsx to tsx

[Damans227]

SUMMARY

PR for migrating ErrorBoundary class based react component from JSX to TSX

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TESTING INSTRUCTIONS

ADDITIONAL INFORMATION

• [TRACKER] Migrate JavaScript files to TypeScript #10004
• Enhancement (new features, refinement)
• Required feature flags:
• Changes UI
• Includes DB Migration (follow approval process in SIP-59)
  • Migration is atomic, supports rollback & is backwards-compatible
  • Confirm DB migration upgrade and downgrade tested
  • Runtime estimates and downtime expectations provided
• Introduces new feature or API
• Removes existing feature or API

SOURCES REFFERED

• Convert React Prop Types to interface in TypeScript
• componentDidCatch() - react documentation
• Type check for error and info used as state properties in react error boundary

[codecov]

Codecov Report

Merging #17908 (b36ca8b) into master (4954d52) will decrease coverage by 0.73%.
The diff coverage is 100.00%.

@@            Coverage Diff             @@
##           master   #17908      +/-   ##
==========================================
- Coverage   67.08%   66.34%   -0.74%     
==========================================
  Files        1609     1568      -41     
  Lines       64897    61502    -3395     
  Branches     6866     6241     -625     
==========================================
- Hits        43533    40803    -2730     
+ Misses      19498    19101     -397     
+ Partials     1866     1598     -268     

Flag	Coverage Δ
javascript	50.91% <100.00%> (-2.86%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
...rontend/src/components/ErrorMessage/ErrorAlert.tsx	89.47% <ø> (-1.64%)	⬇️
...onents/ErrorMessage/ErrorMessageWithStackTrace.tsx	50.00% <ø> (-16.67%)	⬇️
...et-frontend/src/components/ErrorBoundary/index.tsx	80.00% <100.00%> (ø)
superset-frontend/src/components/Slider/index.tsx	0.00% <0.00%> (-75.00%)	⬇️
.../src/explore/components/controls/HiddenControl.tsx	0.00% <0.00%> (-75.00%)	⬇️
...t-frontend/src/filters/components/GroupBy/index.ts	0.00% <0.00%> (-66.67%)	⬇️
...ntend/src/filters/components/GroupBy/buildQuery.ts	0.00% <0.00%> (-66.67%)	⬇️
...end/src/filters/components/TimeGrain/buildQuery.ts	0.00% <0.00%> (-66.67%)	⬇️
...nd/src/filters/components/TimeColumn/buildQuery.ts	0.00% <0.00%> (-66.67%)	⬇️
...ols/DateFilterControl/components/CalendarFrame.tsx	0.00% <0.00%> (-42.86%)	⬇️
... and 499 more

---

Continue to review full report at Codecov.

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

[Damans227]

@etr2460 Ptal, thx! Also, Happy New Year.

[etr2460]

2 questions and a comment

[etr2460]

is this change intentional?

[Damans227]

Yes, the typescript infers const message on line 52 as a JSX.Element.

[Damans227]

Type for copyText becomes invalid if type JSX.Element is not set. Following error gets thrown in the ErrorMessageWithStack Component and the index.tsx file eventually:

(JSX attribute) copyText?: string | undefined
Type 'Element' is not assignable to type 'string'.ts(2322)
ErrorMessageWithStackTrace.tsx(33, 3): The expected type comes from property 'copyText' which is declared here on type 'IntrinsicAttributes & Props' 

[etr2460]

Gotcha, thanks!

[etr2460]

same question here

[Damans227]

Same reason as above

[etr2460]

Gotcha, thanks!

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. For admin, please label this issue .pinned to prevent stale bot from closing the issue.