diff --git a/package.json b/package.json index 70c063c6c..499b68422 100644 --- a/package.json +++ b/package.json @@ -193,7 +193,7 @@ "prettier": "^1.19.1", "ramda-fantasy": "^0.8.0", "raw-loader": "^0.5.1", - "react-hot-loader": "^4.12.15", + "react-hot-loader": "^4.12.21", "serve": "^11.1.0", "serve-handler": "^6.1.1", "sinon": "^4.5.0", diff --git a/source/Provider.tsx b/source/Provider.tsx index 503427681..8f8622e80 100644 --- a/source/Provider.tsx +++ b/source/Provider.tsx @@ -64,7 +64,6 @@ export default function Provider({ onStoreCreated, children }: ProviderProps) { - const { language } = useTranslation().i18n as { language: AvailableLangs } const history = useMemo( () => createBrowserHistory({ @@ -90,7 +89,10 @@ export default function Provider({ ) ) - const store = createStore(reducers, initialStore, storeEnhancer) + // Hack: useMemo is used to persist the store across hot reloads. + const store = useMemo(() => { + return createStore(reducers, initialStore, storeEnhancer) + }, []) onStoreCreated?.(store) // Remove loader diff --git a/source/sites/mon-entreprise.fr/App.tsx b/source/sites/mon-entreprise.fr/App.tsx index bbe424b0c..85a67f1bb 100644 --- a/source/sites/mon-entreprise.fr/App.tsx +++ b/source/sites/mon-entreprise.fr/App.tsx @@ -13,7 +13,7 @@ import { useTranslation } from 'react-i18next' import { useSelector } from 'react-redux' import { Route, Switch } from 'react-router-dom' import createSentryMiddleware from 'redux-sentry-middleware' -import rulesFr, { Rules } from 'Rules' +import { Rules } from 'Rules' import { configSituationSelector, situationSelector @@ -84,14 +84,10 @@ type RootProps = { rules: Rules } -function Root({ basename, rules }: RootProps) { +export default function Root({ basename, rules }: RootProps) { const { language } = useTranslation().i18n - // Hot reload rules - if (process.env.NODE_ENV !== 'production' && language === 'fr') { - rules = rulesFr - } - const paths = constructLocalizedSitePath(language as AvailableLangs) + return ( { ) } - -let ExportedApp = Root - -if (process.env.NODE_ENV !== 'production') { - const { hot } = require('react-hot-loader') - ExportedApp = hot(module)(Root) -} - -export default ExportedApp diff --git a/source/sites/mon-entreprise.fr/entry.en.tsx b/source/sites/mon-entreprise.fr/entry.en.tsx index 9161fe31b..b1cbd3b28 100644 --- a/source/sites/mon-entreprise.fr/entry.en.tsx +++ b/source/sites/mon-entreprise.fr/entry.en.tsx @@ -1,4 +1,5 @@ import 'core-js/stable' +import 'react-hot-loader' import { translateRules } from 'Engine' import React from 'react' import { render } from 'react-dom' @@ -12,11 +13,17 @@ import App from './App' i18next.addResourceBundle('en', 'translation', translations) i18next.changeLanguage('en') -let anchor = document.querySelector('#js') -render( +let Root = () => ( , - anchor + /> ) + +if (process.env.NODE_ENV !== 'production') { + const { hot } = require('react-hot-loader/root') + Root = hot(Root) +} + +const anchor = document.querySelector('#js') +render(, anchor) diff --git a/source/sites/mon-entreprise.fr/entry.fr.tsx b/source/sites/mon-entreprise.fr/entry.fr.tsx index c9b79cbfb..a50040b0b 100644 --- a/source/sites/mon-entreprise.fr/entry.fr.tsx +++ b/source/sites/mon-entreprise.fr/entry.fr.tsx @@ -1,4 +1,5 @@ import 'core-js/stable' +import 'react-hot-loader' import React from 'react' import { render } from 'react-dom' import 'regenerator-runtime/runtime' @@ -8,5 +9,12 @@ import i18next from '../../i18n' i18next.changeLanguage('fr') -let anchor = document.querySelector('#js') -render(, anchor) +let Root = () => + +if (process.env.NODE_ENV !== 'production') { + const { hot } = require('react-hot-loader/root') + Root = hot(Root) +} + +const anchor = document.querySelector('#js') +render(, anchor) diff --git a/yarn.lock b/yarn.lock index 2d5caf6cd..e724a8f29 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9674,10 +9674,10 @@ react-helmet@^6.0.0: react-fast-compare "^2.0.4" react-side-effect "^2.1.0" -react-hot-loader@^4.12.15: - version "4.12.20" - resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-4.12.20.tgz#c2c42362a7578e5c30357a5ff7afa680aa0bef8a" - integrity sha512-lPlv1HVizi0lsi+UFACBJaydtRYILWkfHAC/lyCs6ZlAxlOZRQIfYHDqiGaRvL/GF7zyti+Qn9XpnDAUvdFA4A== +react-hot-loader@^4.12.21: + version "4.12.21" + resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-4.12.21.tgz#332e830801fb33024b5a147d6b13417f491eb975" + integrity sha512-Ynxa6ROfWUeKWsTHxsrL2KMzujxJVPjs385lmB2t5cHUxdoRPGind9F00tOkdc1l5WBleOF4XEAMILY1KPIIDA== dependencies: fast-levenshtein "^2.0.6" global "^4.3.0"