Add ErrorBoundary without feedback form

pull/2791/head
Jérémy Rialland 2023-08-14 17:24:12 +02:00 committed by Jérémy Rialland
parent 1aafada713
commit 7de4b5c0d1
4 changed files with 96 additions and 64 deletions

View File

@ -62,13 +62,13 @@ export default function Root({
return (
<StrictMode>
<Provider basename={basename}>
<EngineProvider value={engine}>
<EngineProvider value={engine}>
<Provider basename={basename}>
<Redirections>
<Router />
</Redirections>
</EngineProvider>
</Provider>
</Provider>
</EngineProvider>
</StrictMode>
)
}

View File

@ -44,32 +44,37 @@ export default function Provider({
<EmbededContextProvider>
<DarkModeProvider>
<DesignSystemThemeProvider>
<I18nextProvider i18n={i18next}>
<ReduxProvider store={store}>
<BrowserRouterProvider basename={basename}>
<ErrorBoundary
fallback={(errorData) => (
// eslint-disable-next-line react/jsx-props-no-spreading
<ErrorFallback {...errorData} />
)}
>
{!import.meta.env.SSR &&
import.meta.env.MODE === 'production' &&
'serviceWorker' in navigator && <ServiceWorker />}
<IframeResizer />
<OverlayProvider>
<ThemeColorsProvider>
<DisableAnimationOnPrintProvider>
<SiteNameContext.Provider value={basename}>
{children}
</SiteNameContext.Provider>
</DisableAnimationOnPrintProvider>
</ThemeColorsProvider>
</OverlayProvider>
</ErrorBoundary>
</BrowserRouterProvider>
</ReduxProvider>
</I18nextProvider>
<ErrorBoundary
// eslint-disable-next-line react/jsx-props-no-spreading
fallback={(errorData) => <ErrorFallback {...errorData} />}
>
<I18nextProvider i18n={i18next}>
<ReduxProvider store={store}>
<BrowserRouterProvider basename={basename}>
<ErrorBoundary
fallback={(errorData) => (
// eslint-disable-next-line react/jsx-props-no-spreading
<ErrorFallback {...errorData} showFeedbackForm />
)}
>
{!import.meta.env.SSR &&
import.meta.env.MODE === 'production' &&
'serviceWorker' in navigator && <ServiceWorker />}
<IframeResizer />
<OverlayProvider>
<ThemeColorsProvider>
<DisableAnimationOnPrintProvider>
<SiteNameContext.Provider value={basename}>
{children}
</SiteNameContext.Provider>
</DisableAnimationOnPrintProvider>
</ThemeColorsProvider>
</OverlayProvider>
</ErrorBoundary>
</BrowserRouterProvider>
</ReduxProvider>
</I18nextProvider>
</ErrorBoundary>
</DesignSystemThemeProvider>
</DarkModeProvider>
</EmbededContextProvider>
@ -81,6 +86,7 @@ const ErrorFallback = (props: {
componentStack: string | null
eventId: string | null
resetError(): void
showFeedbackForm?: boolean
}) => {
const { t } = useTranslation()
@ -123,38 +129,58 @@ const ErrorFallback = (props: {
</Intro>
<Grid container spacing={3}>
<Grid item xs={12} lg={8}>
<FeedbackForm
infoSlot={
<Trans i18nKey="error.body">
<Body>
Si vous souhaitez nous aider à corriger ce problème, vous
pouvez décrire les actions ont conduit à cette erreur via le
formulaire ci-dessous ou à l'adresse :{' '}
<Link
href="mailto:contact@mon-entreprise.beta.gouv.fr"
aria-label={t(
'error.contact',
'Envoyer un courriel à contact@mon-entreprise.beta.gouv.fr, nouvelle fenêtre'
)}
>
contact@mon-entreprise.beta.gouv.fr
</Link>
.
</Body>
</Trans>
}
description={
<Trans i18nKey="error.description">
Décrivez les actions qui ont conduit à cette erreur :
</Trans>
}
placeholder={t(
'error.placeholder',
`Bonjour, j'ai rencontré une erreur après avoir cliqué sur...`
)}
tags={['error']}
additionalData={additionalData}
/>
{props.showFeedbackForm ? (
<FeedbackForm
infoSlot={
<Trans i18nKey="error.body0">
<Body>
Si vous souhaitez nous aider à corriger ce problème, vous
pouvez décrire les actions ont conduit à cette erreur via
le formulaire ci-dessous ou à l'adresse :{' '}
<Link
href="mailto:contact@mon-entreprise.beta.gouv.fr"
aria-label={t(
'error.contact',
'Envoyer un courriel à contact@mon-entreprise.beta.gouv.fr, nouvelle fenêtre'
)}
>
contact@mon-entreprise.beta.gouv.fr
</Link>
.
</Body>
</Trans>
}
description={
<Trans i18nKey="error.description">
Décrivez les actions qui ont conduit à cette erreur :
</Trans>
}
placeholder={t(
'error.placeholder',
`Bonjour, j'ai rencontré une erreur après avoir cliqué sur...`
)}
tags={['error']}
additionalData={additionalData}
/>
) : (
<Trans i18nKey="error.body1">
<Body>
Si vous souhaitez nous aider à corriger ce problème, vous
pouvez décrire les actions ont conduit à cette erreur à
l'adresse :{' '}
<Link
href="mailto:contact@mon-entreprise.beta.gouv.fr"
aria-label={t(
'error.contact',
'Envoyer un courriel à contact@mon-entreprise.beta.gouv.fr, nouvelle fenêtre'
)}
>
contact@mon-entreprise.beta.gouv.fr
</Link>
.
</Body>
</Trans>
)}
</Grid>
<Grid item xs={12} lg={8}>

View File

@ -603,9 +603,12 @@ en incluant: including
en titres-restaurant: in meal vouchers
error:
back: Back to home page
body: <0>If you would like to help us correct this problem, please describe the
body0: <0>If you would like to help us correct this problem, please describe the
actions that led to this error using the form below or at
<2>contact@mon-entreprise.beta.gouv.fr</2>.</0>
body1: <0>If you would like to help us correct this problem, please describe the
actions that led to this error at
<2>contact@mon-entreprise.beta.gouv.fr</2>.</0>
contact: Send an e-mail to contact@mon-entreprise.beta.gouv.fr, new window
description: "Describe the actions that led to this error:"
intro: The mon-entreprise technical team has been notified automatically. We

View File

@ -632,9 +632,12 @@ en incluant: en incluant
en titres-restaurant: en titres-restaurant
error:
back: Retourner à la page d'accueil
body: "<0>Si vous souhaitez nous aider à corriger ce problème, vous pouvez
body0: "<0>Si vous souhaitez nous aider à corriger ce problème, vous pouvez
décrire les actions ont conduit à cette erreur via le formulaire ci-dessous
ou à l'adresse : <2>contact@mon-entreprise.beta.gouv.fr</2>.</0>"
body1: "<0>Si vous souhaitez nous aider à corriger ce problème, vous pouvez
décrire les actions ont conduit à cette erreur à l'adresse :
<2>contact@mon-entreprise.beta.gouv.fr</2>.</0>"
contact: Envoyer un courriel à contact@mon-entreprise.beta.gouv.fr, nouvelle fenêtre
description: "Décrivez les actions qui ont conduit à cette erreur :"
intro: L'équipe technique mon-entreprise a été prévenue automatiquement,