2021-11-30 15:09:05 +00:00
|
|
|
import { OverlayProvider } from '@react-aria/overlays'
|
2021-05-03 11:28:31 +00:00
|
|
|
import { ErrorBoundary } from '@sentry/react'
|
2019-12-18 21:32:26 +00:00
|
|
|
import { ThemeColorsProvider } from 'Components/utils/colors'
|
2021-08-26 14:06:37 +00:00
|
|
|
import { DisableAnimationOnPrintProvider } from 'Components/utils/DisableAnimationContext'
|
2021-11-03 07:33:48 +00:00
|
|
|
import { IsEmbeddedProvider } from 'Components/utils/embeddedContext'
|
2020-04-23 07:30:03 +00:00
|
|
|
import { SitePathProvider, SitePaths } from 'Components/utils/SitePathsContext'
|
2021-11-30 15:09:05 +00:00
|
|
|
import { GlobalStyle } from 'DesignSystem/global-style'
|
|
|
|
|
import { Container } from 'DesignSystem/layout'
|
|
|
|
|
import DesignSystemThemeProvider from 'DesignSystem/root'
|
|
|
|
|
import { H1 } from 'DesignSystem/typography/heading'
|
|
|
|
|
import { Link } from 'DesignSystem/typography/link'
|
|
|
|
|
import { Body, Intro } from 'DesignSystem/typography/paragraphs'
|
2020-04-05 21:19:02 +00:00
|
|
|
import { createBrowserHistory } from 'history'
|
2019-02-04 09:22:24 +00:00
|
|
|
import i18next from 'i18next'
|
2021-11-03 07:33:48 +00:00
|
|
|
import 'iframe-resizer'
|
2021-12-29 17:21:02 +00:00
|
|
|
import logo from 'Images/logo-monentreprise.svg'
|
2022-01-26 08:53:15 +00:00
|
|
|
import React, { createContext, useEffect, useMemo, useState } from 'react'
|
2021-10-26 15:27:48 +00:00
|
|
|
import { HelmetProvider } from 'react-helmet-async'
|
2020-05-08 10:04:00 +00:00
|
|
|
import { I18nextProvider } from 'react-i18next'
|
2019-02-04 09:22:24 +00:00
|
|
|
import { Provider as ReduxProvider } from 'react-redux'
|
|
|
|
|
import { Router } from 'react-router-dom'
|
2019-11-10 15:57:44 +00:00
|
|
|
import reducers, { RootState } from 'Reducers/rootReducer'
|
2021-02-10 17:11:10 +00:00
|
|
|
import {
|
|
|
|
|
applyMiddleware,
|
|
|
|
|
compose,
|
|
|
|
|
createStore,
|
|
|
|
|
Middleware,
|
|
|
|
|
PreloadedState,
|
|
|
|
|
Store,
|
|
|
|
|
} from 'redux'
|
|
|
|
|
// ATInternet Tracking
|
|
|
|
|
import { TrackingContext } from './ATInternetTracking'
|
|
|
|
|
import { createTracker } from './ATInternetTracking/Tracker'
|
2022-01-31 07:34:14 +00:00
|
|
|
import * as safeLocalStorage from './storage/safeLocalStorage'
|
2020-04-25 13:27:34 +00:00
|
|
|
import { inIframe } from './utils'
|
2018-05-24 16:28:37 +00:00
|
|
|
|
2018-08-23 14:42:47 +00:00
|
|
|
if (
|
2021-12-29 17:21:02 +00:00
|
|
|
!import.meta.env.SSR &&
|
2021-12-27 10:27:57 +00:00
|
|
|
import.meta.env.MODE === 'production' &&
|
2018-08-23 14:42:47 +00:00
|
|
|
'serviceWorker' in navigator &&
|
|
|
|
|
!inIframe()
|
|
|
|
|
) {
|
2018-07-04 17:45:43 +00:00
|
|
|
window.addEventListener('load', () => {
|
|
|
|
|
navigator.serviceWorker
|
2018-07-05 09:54:41 +00:00
|
|
|
.register('/sw.js')
|
2020-12-01 09:17:27 +00:00
|
|
|
.then((registration) => {
|
🔥 Migration vers TypeScript
Outils
======
Ce commit retire le tooling de Flow, et ajoute le support de TypeScript
pour les fichiers .ts et .tsx. Il n'est pas nécessaire de tout migrer
d'un coup ce qui facilite la transition. On garde en effet le
compilateur Babel avec un preset TypeScript (ce qui permet donc de
retirer à la fois les types Flow et TypeScript) plutôt que d'utiliser le
compilateur standard pour la conversion du code. Cela permet aussi de
mieux s'intégrer avec d'autres outils, notamment les test-runners.
Ajout d'une nouvelle commande `yarn run type-check`, intégrée dans
CircleCI.
Par ailleurs ajout du support de l'opérateur ?? pour donner des valeurs
par défaut (nullish-coalescing-operator).
Typage des libraires tierces
============================
Les principales libraires que nous utilisons ont un typage TypeScript de
bon niveau, ce qui facilite l'intégration. J'ai mis à jour react-i18next
et i18next afin de corriger un problème de typage.
Typage du code
==============
Le typage est loin d'être complet dans ce commit, en particulier il
manque les types relatifs au state Redux, ainsi qu'au moteur (règle,
explication). Néanmoins le typage des contextes fonctionne, en
particulier sitePaths (avec un type récursif non trivial !) qui a déjà
permis de détecter un lien mort.
Le typage des "paths" (Components/, Règles/, etc.) fonctionne bien, y
compris avec l'auto-complétion automatique des import par Typescript.
TypeScript se révèle déjà bien agréable dans VSCode (auto-complétion,
refacto, etc.) ! Reste à migrer progressivement le reste du code !
2019-10-26 16:21:09 +00:00
|
|
|
// eslint-disable-next-line no-console
|
2018-07-04 17:45:43 +00:00
|
|
|
console.log('SW registered: ', registration)
|
|
|
|
|
})
|
2020-12-01 09:17:27 +00:00
|
|
|
.catch((registrationError) => {
|
🔥 Migration vers TypeScript
Outils
======
Ce commit retire le tooling de Flow, et ajoute le support de TypeScript
pour les fichiers .ts et .tsx. Il n'est pas nécessaire de tout migrer
d'un coup ce qui facilite la transition. On garde en effet le
compilateur Babel avec un preset TypeScript (ce qui permet donc de
retirer à la fois les types Flow et TypeScript) plutôt que d'utiliser le
compilateur standard pour la conversion du code. Cela permet aussi de
mieux s'intégrer avec d'autres outils, notamment les test-runners.
Ajout d'une nouvelle commande `yarn run type-check`, intégrée dans
CircleCI.
Par ailleurs ajout du support de l'opérateur ?? pour donner des valeurs
par défaut (nullish-coalescing-operator).
Typage des libraires tierces
============================
Les principales libraires que nous utilisons ont un typage TypeScript de
bon niveau, ce qui facilite l'intégration. J'ai mis à jour react-i18next
et i18next afin de corriger un problème de typage.
Typage du code
==============
Le typage est loin d'être complet dans ce commit, en particulier il
manque les types relatifs au state Redux, ainsi qu'au moteur (règle,
explication). Néanmoins le typage des contextes fonctionne, en
particulier sitePaths (avec un type récursif non trivial !) qui a déjà
permis de détecter un lien mort.
Le typage des "paths" (Components/, Règles/, etc.) fonctionne bien, y
compris avec l'auto-complétion automatique des import par Typescript.
TypeScript se révèle déjà bien agréable dans VSCode (auto-complétion,
refacto, etc.) ! Reste à migrer progressivement le reste du code !
2019-10-26 16:21:09 +00:00
|
|
|
// eslint-disable-next-line no-console
|
2018-07-04 17:45:43 +00:00
|
|
|
console.log('SW registration failed: ', registrationError)
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
}
|
2018-07-12 08:09:41 +00:00
|
|
|
|
2020-04-16 14:30:53 +00:00
|
|
|
type SiteName = 'mon-entreprise' | 'infrance' | 'publicodes'
|
|
|
|
|
|
|
|
|
|
export const SiteNameContext = createContext<SiteName | null>(null)
|
|
|
|
|
|
2020-04-05 21:19:02 +00:00
|
|
|
export type ProviderProps = {
|
2020-04-16 14:30:53 +00:00
|
|
|
basename: SiteName
|
2020-04-05 21:19:02 +00:00
|
|
|
children: React.ReactNode
|
2020-04-12 21:30:58 +00:00
|
|
|
sitePaths?: SitePaths
|
2020-12-01 18:10:34 +00:00
|
|
|
initialStore?: PreloadedState<RootState>
|
2020-04-12 21:30:58 +00:00
|
|
|
onStoreCreated?: (store: Store) => void
|
|
|
|
|
reduxMiddlewares?: Array<Middleware>
|
2019-11-10 15:57:44 +00:00
|
|
|
}
|
|
|
|
|
|
2020-04-05 21:19:02 +00:00
|
|
|
export default function Provider({
|
|
|
|
|
basename,
|
2021-01-08 17:44:01 +00:00
|
|
|
reduxMiddlewares = [],
|
2020-04-05 21:19:02 +00:00
|
|
|
initialStore,
|
|
|
|
|
onStoreCreated,
|
2020-05-08 10:04:00 +00:00
|
|
|
children,
|
2020-12-01 09:17:27 +00:00
|
|
|
sitePaths = {} as SitePaths,
|
2020-04-05 21:19:02 +00:00
|
|
|
}: ProviderProps) {
|
2021-12-29 17:21:02 +00:00
|
|
|
const storeEnhancer = compose(applyMiddleware(...reduxMiddlewares))
|
2020-04-23 13:59:43 +00:00
|
|
|
|
2020-05-05 00:20:50 +00:00
|
|
|
// Hack: useMemo is used to persist the store across hot reloads.
|
|
|
|
|
const store = useMemo(() => {
|
|
|
|
|
return createStore(reducers, initialStore, storeEnhancer)
|
|
|
|
|
}, [])
|
2020-04-05 21:19:02 +00:00
|
|
|
onStoreCreated?.(store)
|
2019-03-19 17:50:16 +00:00
|
|
|
|
2020-04-05 21:19:02 +00:00
|
|
|
return (
|
2022-01-26 09:38:58 +00:00
|
|
|
<DesignSystemThemeProvider>
|
|
|
|
|
<GlobalStyle />
|
|
|
|
|
<ErrorBoundary
|
|
|
|
|
showDialog
|
|
|
|
|
fallback={
|
2021-12-29 17:21:02 +00:00
|
|
|
<Container>
|
2022-02-03 16:52:40 +00:00
|
|
|
<Link href={sitePaths.index}>
|
2021-12-29 17:21:02 +00:00
|
|
|
<img
|
|
|
|
|
src={logo}
|
|
|
|
|
alt="logo service mon-entreprise urssaf"
|
|
|
|
|
style={{
|
|
|
|
|
maxWidth: '200px',
|
|
|
|
|
width: '100%',
|
|
|
|
|
marginTop: '1rem',
|
|
|
|
|
}}
|
|
|
|
|
></img>
|
|
|
|
|
</Link>
|
|
|
|
|
<H1>Une erreur est survenue</H1>
|
|
|
|
|
<Intro>
|
|
|
|
|
L'équipe technique mon-entreprise a été automatiquement prévenue.
|
|
|
|
|
</Intro>
|
|
|
|
|
<Body>
|
|
|
|
|
Vous pouvez également nous contacter directement à l'adresse{' '}
|
|
|
|
|
<Link href="mailto:contact@mon-entreprise.beta.gouv.fr">
|
|
|
|
|
contact@mon-entreprise.beta.gouv.fr
|
|
|
|
|
</Link>{' '}
|
|
|
|
|
si vous souhaitez partager une remarque. Veuillez nous excuser
|
|
|
|
|
pour la gêne occasionnée.
|
|
|
|
|
</Body>
|
|
|
|
|
</Container>
|
2022-01-26 09:38:58 +00:00
|
|
|
}
|
|
|
|
|
>
|
2022-01-25 17:41:44 +00:00
|
|
|
<OverlayProvider>
|
2022-01-26 09:38:58 +00:00
|
|
|
<ReduxProvider store={store}>
|
|
|
|
|
<IsEmbeddedProvider>
|
|
|
|
|
<ThemeColorsProvider>
|
2021-12-29 17:21:02 +00:00
|
|
|
<DisableAnimationOnPrintProvider>
|
|
|
|
|
<SiteNameContext.Provider value={basename}>
|
|
|
|
|
<SitePathProvider value={sitePaths}>
|
|
|
|
|
<I18nextProvider i18n={i18next}>
|
2022-01-31 07:28:31 +00:00
|
|
|
<BrowserRouterProvider basename={basename}>
|
|
|
|
|
<>{children}</>
|
|
|
|
|
</BrowserRouterProvider>
|
2021-12-29 17:21:02 +00:00
|
|
|
</I18nextProvider>
|
|
|
|
|
</SitePathProvider>
|
|
|
|
|
</SiteNameContext.Provider>
|
|
|
|
|
</DisableAnimationOnPrintProvider>
|
2022-01-26 09:38:58 +00:00
|
|
|
</ThemeColorsProvider>
|
|
|
|
|
</IsEmbeddedProvider>
|
|
|
|
|
</ReduxProvider>
|
|
|
|
|
</OverlayProvider>
|
|
|
|
|
</ErrorBoundary>
|
|
|
|
|
</DesignSystemThemeProvider>
|
2020-04-05 21:19:02 +00:00
|
|
|
)
|
2018-07-12 08:09:41 +00:00
|
|
|
}
|
2021-12-29 17:21:02 +00:00
|
|
|
|
|
|
|
|
function BrowserRouterProvider({
|
|
|
|
|
children,
|
|
|
|
|
basename,
|
|
|
|
|
}: {
|
|
|
|
|
children: React.ReactNode
|
|
|
|
|
basename: string
|
|
|
|
|
}) {
|
|
|
|
|
// The server rouer is only provided in the entry-server file
|
|
|
|
|
if (import.meta.env.SSR) {
|
|
|
|
|
return <>{children}</>
|
|
|
|
|
}
|
|
|
|
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
|
|
|
const history = useMemo(
|
|
|
|
|
() =>
|
|
|
|
|
createBrowserHistory({
|
|
|
|
|
basename: import.meta.env.MODE === 'production' ? '' : basename,
|
|
|
|
|
}),
|
|
|
|
|
[basename]
|
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
const ATTracker = createTracker(
|
|
|
|
|
import.meta.env.VITE_AT_INTERNET_SITE_ID,
|
|
|
|
|
safeLocalStorage.getItem('tracking:do_not_track') === '1' ||
|
|
|
|
|
navigator.doNotTrack === '1'
|
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
return (
|
2022-01-31 07:28:31 +00:00
|
|
|
<HelmetProvider>
|
|
|
|
|
<TrackingContext.Provider
|
|
|
|
|
value={
|
|
|
|
|
new ATTracker({
|
|
|
|
|
language: i18next.language as 'fr' | 'en',
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Router history={history}>
|
|
|
|
|
<>{children}</>
|
|
|
|
|
</Router>
|
|
|
|
|
</TrackingContext.Provider>
|
|
|
|
|
</HelmetProvider>
|
2021-12-29 17:21:02 +00:00
|
|
|
)
|
|
|
|
|
}
|
