CatchError in Connect: Provide theme when rendering caught error

[ravicious]

Fixes part of #36936.

CatchError acts as an error boundary. When it catches an error, it renders Failed from design/CardError.

However, since about v13, Failed assumes that a theme is provided through ThemeProvider. CatchError is rendered at a place in the hierarchy where ThemeProvider is not available. This resulted in CatchError crashing whenever it attempted to render a caught error.

teleport/web/packages/teleterm/src/ui/App.tsx

Lines 34 to 42 in 1548a43

	export const App: React.FC<{ ctx: AppContext }> = ({ ctx }) => {
	return (
	<StyledApp>
	<CatchError>
	<DndProvider backend={HTML5Backend}>
	<AppContextProvider value={ctx}>
	<ThemeProvider>
	<AppInitializer />
	</ThemeProvider>

We already had a problem like this with FailedApp which is rendered when an error is caught during the boot procedure of the app. We fixed that problem by using StaticThemeProvider within FailedApp (#29046). That provider always returns the dark theme.

This PR moves FailedApp to a separate file so that it can be used in both CatchError and boot.tsx. It then reuses FailedApp in CatchError so that the theme is provided when rendering a caught error. It also adds regression tests to make sure that CatchError and FailedApp are rendered properly when ThemeProvider is not available.

[ravicious]

FailedApp is equivalent to Failed, but it also adds StyledApp and StaticThemeProvider.

[ravicious]

Hmm, actually that's bad because in case of an error we render StyledApp twice (one time in App and one time in CatchError). I'm just going to move CatchError to the top of the hierarchy in App then.

[gzdunek]

Could we also convert this file to TS while we are there?

[ravicious]

I'd rather spend time elsewhere since this is used only in a single place. I tried to quickly do mv web/packages/teleterm/src/ui/components/CatchError/CatchError.{j,t}sx, but there are issues with how children are typed in Props.

[public-teleport-github-review-bot]

@ravicious See the table below for backport results.

Branch	Result
branch/v13	Create PR
branch/v14	Create PR
branch/v15	Create PR