[fix] Fix white screen when error handled by AppErrorBoundary (#5017)
[In a previous PR](https://github.com/twentyhq/twenty/pull/5008) I was fixing dark mode by calling useTheme in AppErrorBoundary while there was actually no parent ThemeProvider. This was causing a bug when an error was actually intercepted by AppErrorBoundary because theme was empty. Now I am providing the error theme in GenericErrorFallback, fallbacking to THEME_LIGHT as it can be called from outside a ThemeProvider (as it is the case today), but also reading into ThemeProvider in case we end up using this component in a part of the application where it is available, not to necessarily use THEME_LIGHT. ## How was it tested? with @thaisguigon Locally (dark mode works + error mode works (throwing an error in RecoilDebugObserver))
This commit is contained in:
@ -1,6 +1,5 @@
|
||||
import { ErrorInfo, ReactNode } from 'react';
|
||||
import { ErrorBoundary } from 'react-error-boundary';
|
||||
import { ThemeProvider, useTheme } from '@emotion/react';
|
||||
|
||||
import { GenericErrorFallback } from '@/error-handler/components/GenericErrorFallback';
|
||||
|
||||
@ -9,16 +8,12 @@ export const AppErrorBoundary = ({ children }: { children: ReactNode }) => {
|
||||
// TODO: log error to Sentry
|
||||
};
|
||||
|
||||
const theme = useTheme();
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<ErrorBoundary
|
||||
FallbackComponent={GenericErrorFallback}
|
||||
onError={handleError}
|
||||
>
|
||||
{children}
|
||||
</ErrorBoundary>
|
||||
</ThemeProvider>
|
||||
<ErrorBoundary
|
||||
FallbackComponent={GenericErrorFallback}
|
||||
onError={handleError}
|
||||
>
|
||||
{children}
|
||||
</ErrorBoundary>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user