Add feedback module on error page

pull/2789/head
Jérémy Rialland 2023-08-14 12:44:15 +02:00 committed by Jérémy Rialland
parent f3b1c024d1
commit 9921b19e0b
4 changed files with 121 additions and 58 deletions

View File

@ -39,8 +39,8 @@ const FeedbackThankYouContent = () => {
</Body>
<Body>
<Trans>
Nous avons à cœur d'améliorer en continu notre site,vos remarques nous
sont donc très précieuses.
Nous avons à cœur d'améliorer en continu notre site, vos remarques
nous sont donc très précieuses.
</Trans>
</Body>
<Spacing lg />
@ -54,12 +54,14 @@ export default function FeedbackForm({
placeholder,
tags,
hideShare,
additionalData,
}: {
infoSlot?: ReactNode
description?: ReactNode
placeholder?: string
tags?: string[]
hideShare?: boolean
additionalData?: string
}) {
const url = useUrl()
const urlParams = Array.from(new URL(url).searchParams.entries()).filter(
@ -93,7 +95,10 @@ export default function FeedbackForm({
},
body: JSON.stringify({
subject: `Page : ${pathname}${subjectTags}`,
message: message + (share ? '\n\n' + url : ''),
message:
message +
(share ? '\n\n' + url : '') +
(additionalData ? '\n\n' + additionalData : ''),
email,
}),
})

View File

@ -3,11 +3,12 @@ import { ErrorBoundary } from '@sentry/react'
import i18next from 'i18next'
import { createContext, ReactNode } from 'react'
import { HelmetProvider } from 'react-helmet-async'
import { I18nextProvider, useTranslation } from 'react-i18next'
import { I18nextProvider, Trans, useTranslation } from 'react-i18next'
import { Provider as ReduxProvider } from 'react-redux'
import { BrowserRouter } from 'react-router-dom'
import logo from '@/assets/images/logo-monentreprise.svg'
import FeedbackForm from '@/components/Feedback/FeedbackForm'
import { ThemeColorsProvider } from '@/components/utils/colors'
import { DisableAnimationOnPrintProvider } from '@/components/utils/DisableAnimationContext'
import { Container, Grid } from '@/design-system/layout'
@ -43,45 +44,64 @@ export default function Provider({
<EmbededContextProvider>
<DarkModeProvider>
<DesignSystemThemeProvider>
<ErrorBoundary showDialog fallback={ErrorFallback}>
{!import.meta.env.SSR &&
import.meta.env.MODE === 'production' &&
'serviceWorker' in navigator && <ServiceWorker />}
<IframeResizer />
<OverlayProvider>
<ReduxProvider store={store}>
<ThemeColorsProvider>
<DisableAnimationOnPrintProvider>
<SiteNameContext.Provider value={basename}>
<I18nextProvider i18n={i18next}>
<BrowserRouterProvider basename={basename}>
<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}
</BrowserRouterProvider>
</I18nextProvider>
</SiteNameContext.Provider>
</DisableAnimationOnPrintProvider>
</ThemeColorsProvider>
</ReduxProvider>
</OverlayProvider>
</ErrorBoundary>
</SiteNameContext.Provider>
</DisableAnimationOnPrintProvider>
</ThemeColorsProvider>
</OverlayProvider>
</ErrorBoundary>
</BrowserRouterProvider>
</ReduxProvider>
</I18nextProvider>
</DesignSystemThemeProvider>
</DarkModeProvider>
</EmbededContextProvider>
)
}
function ErrorFallback(props: {
const ErrorFallback = (props: {
error: Error
componentStack: string | null
eventId: string | null
resetError(): void
}) {
}) => {
const { t } = useTranslation()
const additionalData = JSON.stringify(
{
name: props.error.name,
message: props.error.message,
stack: props.error.stack,
componentStack: props.componentStack,
},
null,
2
)
return (
<main style={{ height: '100vh' }}>
<Container>
<Link href="/" aria-label={t("Retourner à la page d'accueil")}>
<Link
href="/"
aria-label={t('error.back', "Retourner à la page d'accueil")}
>
<img
src={logo}
alt="Logo mon-entreprise"
@ -92,25 +112,52 @@ function ErrorFallback(props: {
}}
></img>
</Link>
<H1>Une erreur est survenue</H1>
<H1>
<Trans i18nKey="error.title">Une erreur est survenue</Trans>
</H1>
<Intro>
L'équipe technique mon-entreprise a été automatiquement prévenue.
<Trans i18nKey="error.intro">
L'équipe technique mon-entreprise a été prévenue automatiquement,
veuillez nous excuser pour la gêne occasionnée.
</Trans>
</Intro>
<Body>
Vous pouvez également nous contacter directement à l'adresse{' '}
<Link
href="mailto:contact@mon-entreprise.beta.gouv.fr"
aria-label={t(
'Envoyer un courriel à contact@mon-entreprise.beta.gouv.fr, nouvelle fenêtre'
)}
>
contact@mon-entreprise.beta.gouv.fr
</Link>{' '}
si vous souhaitez partager une remarque. Veuillez nous excuser pour la
gêne occasionnée.
</Body>
<Grid container>
<Grid item xs={12} lg={6}>
<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}
/>
</Grid>
<Grid item xs={12} lg={8}>
<Message type="info">
<H4>Cause de l'erreur :</H4>
<Body>

View File

@ -99,10 +99,6 @@ Enregistrer et continuer: Save and continue
Enregistrer et voir le résultat: Save and view results
Entreprise créée le <2><0></0></2> et domiciliée à <6><0></0></6>: Company founded on <2><0></0></2> and domiciled at <6><0></0></6>
Envoyer: Send
Envoyer un courriel à contact@mon-entreprise:
beta:
gouv:
"fr, nouvelle fenêtre": Send an e-mail to contact@mon-entreprise.beta.gouv.fr, new window
"Exemple : Des informations plus claires, un calcul détaillé...": "Example: clearer information, detailed calculation..."
Exonérations: Exemptions
ExportSimulation:
@ -187,7 +183,7 @@ Nombre de visites: Number of visits
Nombres: Numbers
Non: No
Notre équipe prend en charge votre retour.: Our team will take care of your return.
"Nous avons à cœur d'améliorer en continu notre site,vos remarques nous sont donc très précieuses.":
"Nous avons à cœur d'améliorer en continu notre site, vos remarques nous sont donc très précieuses.":
We're constantly striving to improve our site, so your feedback is very
important to us.
Nous navons pas trouvé de résultat pour cette entreprise.: No results were found for this company.
@ -246,7 +242,6 @@ Renseigner une adresse e-mail (au format nom@domaine:
Replier: Fold
Retour à la création: Back to creation
Retour à mon activité: Back to my activity
Retourner à la page d'accueil: Back to home page
Retraite complémentaire: Supplementary pension
Retraite de base: Basic pension
"Retrouver ma simulation, charger les données de ma précédente simulation.": Retrieve my simulation, load data from my previous simulation.
@ -611,6 +606,17 @@ employeur: employer
en cas d'accident pro: in the event of a professional accident
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
actions that led to this error using the form below or 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
apologize for any inconvenience caused.
placeholder: Hello, I encountered an error after clicking on...
title: An error has occurred
explications:
tableCaption: Table displaying the lines of your tax return associated with the
tax exemptions in place for each type of activity. The first column shows

View File

@ -99,11 +99,6 @@ Enregistrer et continuer: Enregistrer et continuer
Enregistrer et voir le résultat: Enregistrer et voir le résultat
Entreprise créée le <2><0></0></2> et domiciliée à <6><0></0></6>: Entreprise créée le <2><0></0></2> et domiciliée à <6><0></0></6>
Envoyer: Envoyer
Envoyer un courriel à contact@mon-entreprise:
beta:
gouv:
"fr, nouvelle fenêtre": Envoyer un courriel à
contact@mon-entreprise.beta.gouv.fr, nouvelle fenêtre
"Exemple : Des informations plus claires, un calcul détaillé...": "Exemple : Des informations plus claires, un calcul détaillé..."
Exonérations: Exonérations
ExportSimulation:
@ -193,8 +188,8 @@ Nombre de visites: Nombre de visites
Nombres: Nombres
Non: Non
Notre équipe prend en charge votre retour.: Notre équipe prend en charge votre retour.
"Nous avons à cœur d'améliorer en continu notre site,vos remarques nous sont donc très précieuses.":
Nous avons à cœur d'améliorer en continu notre site,vos remarques nous sont
"Nous avons à cœur d'améliorer en continu notre site, vos remarques nous sont donc très précieuses.":
Nous avons à cœur d'améliorer en continu notre site, vos remarques nous sont
donc très précieuses.
Nous navons pas trouvé de résultat pour cette entreprise.: Nous navons pas trouvé de résultat pour cette entreprise.
"Nouveau contenu disponible, cliquez sur recharger pour mettre à jour la page.": Nouveau contenu disponible, cliquez sur recharger pour mettre à jour la page.
@ -255,7 +250,6 @@ Renseigner une adresse e-mail (au format nom@domaine:
Replier: Replier
Retour à la création: Retour à la création
Retour à mon activité: Retour à mon activité
Retourner à la page d'accueil: Retourner à la page d'accueil
Retraite complémentaire: Retraite complémentaire
Retraite de base: Retraite de base
"Retrouver ma simulation, charger les données de ma précédente simulation.": Retrouver ma simulation, charger les données de ma précédente simulation.
@ -641,6 +635,17 @@ employeur: employeur
en cas d'accident pro: en cas d'accident pro
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
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>"
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,
veuillez nous excuser pour la gêne occasionnée.
placeholder: Bonjour, j'ai rencontré une erreur après avoir cliqué sur...
title: Une erreur est survenue
explications:
tableCaption: Tableau affichant les lignes de votre liasse fiscale associées aux
exonérations fiscales en place pour chaque type d'activité. La première