Refacto Redux store creation

site/source/App.tsx

@@ -40,19 +40,6 @@ import Provider, { ProviderProps } from './Provider'
 import redirects from './redirects'
 import { RootState } from './reducers/rootReducer'
 import { constructLocalizedSitePath } from './sitePaths'
-import {
-	retrievePersistedChoixStatutJuridique,
-	setupChoixStatutJuridiquePersistence,
-} from './storage/persistChoixStatutJuridique'
-import {
-	retrievePersistedCompanySituation,
-	setupCompanySituationPersistence,
-} from './storage/persistCompanySituation'
-import {
-	retrievePersistedDRISituation,
-	setupDRISituationPersistence,
-} from './storage/persistDRISituation'
-import { setupSimulationPersistence } from './storage/persistSimulation'
 
 type RootProps = {
 	basename: ProviderProps['basename']
@@ -78,21 +65,7 @@ export default function Root({
 
 	return (
 		<StrictMode>
-			<Provider
-				basename={basename}
-				sitePaths={paths}
-				onStoreCreated={(store) => {
-					setupChoixStatutJuridiquePersistence(store)
-					setupCompanySituationPersistence(store)
-					setupDRISituationPersistence(store)
-					setupSimulationPersistence(store)
-				}}
-				initialStore={{
-					choixStatutJuridique: retrievePersistedChoixStatutJuridique(),
-					companySituation: retrievePersistedCompanySituation(),
-					DRISituation: retrievePersistedDRISituation(),
-				}}
-			>
+			<Provider basename={basename} sitePaths={paths}>
 				<EngineProvider value={engine}>
 					<Router />
 				</EngineProvider>

site/source/Provider.tsx

@@ -1,5 +1,5 @@
 import { OverlayProvider } from '@react-aria/overlays'
-import { ErrorBoundary, createReduxEnhancer } from '@sentry/react'
+import { ErrorBoundary } from '@sentry/react'
 import { ThemeColorsProvider } from '@/components/utils/colors'
 import { DisableAnimationOnPrintProvider } from '@/components/utils/DisableAnimationContext'
 import { IsEmbeddedProvider } from '@/components/utils/embeddedContext'
@@ -22,22 +22,13 @@ import { HelmetProvider } from 'react-helmet-async'
 import { I18nextProvider } from 'react-i18next'
 import { Provider as ReduxProvider } from 'react-redux'
 import { Router } from 'react-router-dom'
-import reducers, { RootState } from '@/reducers/rootReducer'
-import { composeWithDevToolsDevelopmentOnly } from '@redux-devtools/extension'
-import {
-	applyMiddleware,
-	createStore,
-	Middleware,
-	PreloadedState,
-	Store,
-	StoreEnhancer,
-} from 'redux'
+import { inIframe } from './utils'
+import { store } from './store'
+import * as safeLocalStorage from './storage/safeLocalStorage'
 
 // ATInternet Tracking
 import { TrackingContext } from './ATInternetTracking'
 import { createTracker } from './ATInternetTracking/Tracker'
-import * as safeLocalStorage from './storage/safeLocalStorage'
-import { inIframe } from './utils'
 
 if (
 	!import.meta.env.SSR &&
@@ -63,40 +54,17 @@ type SiteName = 'mon-entreprise' | 'infrance' | 'publicodes'
 
 export const SiteNameContext = createContext<SiteName | null>(null)
 
-const composeEnhancers = composeWithDevToolsDevelopmentOnly(
-	import.meta.env.VITE_REDUX_TRACE ? { trace: true, traceLimit: 25 } : {}
-)
-
-const sentryReduxEnhancer = createReduxEnhancer({}) as StoreEnhancer
-
 export type ProviderProps = {
 	basename: SiteName
 	children: ReactNode
 	sitePaths?: SitePaths
-	initialStore?: PreloadedState<RootState>
-	onStoreCreated?: (store: Store) => void
-	reduxMiddlewares?: Array<Middleware>
 }
 
 export default function Provider({
 	basename,
-	reduxMiddlewares = [],
-	initialStore,
-	onStoreCreated,
 	children,
 	sitePaths = {} as SitePaths,
 }: ProviderProps): JSX.Element {
-	const storeEnhancer = composeEnhancers(
-		applyMiddleware(...reduxMiddlewares),
-		sentryReduxEnhancer
-	)
-
-	// Hack: useMemo is used to persist the store across hot reloads.
-	const store = useMemo(() => {
-		return createStore(reducers, initialStore, storeEnhancer)
-	}, [])
-	onStoreCreated?.(store)
-
 	useIframeResizer()
 
 	return (

site/source/store.ts

@@ -0,0 +1,38 @@
+import reducers from '@/reducers/rootReducer'
+import { composeWithDevToolsDevelopmentOnly } from '@redux-devtools/extension'
+import { createReduxEnhancer } from '@sentry/react'
+import { applyMiddleware, createStore, StoreEnhancer } from 'redux'
+import {
+	retrievePersistedChoixStatutJuridique,
+	setupChoixStatutJuridiquePersistence,
+} from './storage/persistChoixStatutJuridique'
+import {
+	retrievePersistedCompanySituation,
+	setupCompanySituationPersistence,
+} from './storage/persistCompanySituation'
+import {
+	retrievePersistedDRISituation,
+	setupDRISituationPersistence,
+} from './storage/persistDRISituation'
+import { setupSimulationPersistence } from './storage/persistSimulation'
+
+const initialStore = {
+	choixStatutJuridique: retrievePersistedChoixStatutJuridique(),
+	companySituation: retrievePersistedCompanySituation(),
+	DRISituation: retrievePersistedDRISituation(),
+}
+
+const composeEnhancers = composeWithDevToolsDevelopmentOnly(
+	import.meta.env.VITE_REDUX_TRACE ? { trace: true, traceLimit: 25 } : {}
+)
+
+const sentryReduxEnhancer = createReduxEnhancer({}) as StoreEnhancer
+
+const storeEnhancer = composeEnhancers(applyMiddleware(), sentryReduxEnhancer)
+
+export const store = createStore(reducers, initialStore, storeEnhancer)
+
+setupChoixStatutJuridiquePersistence(store)
+setupCompanySituationPersistence(store)
+setupDRISituationPersistence(store)
+setupSimulationPersistence(store)