Ajout de redux-persist: persistance du store

package.json

@@ -14,6 +14,7 @@
     "react-redux": "^7.2.4",
     "react-router-dom": "^5.2.0",
     "redux": "^4.1.0",
+    "redux-persist": "^6.0.0",
     "redux-thunk": "^2.3.0"
   },
   "devDependencies": {

src/main.jsx

@@ -1,7 +1,8 @@
 import React from "react";
 import ReactDOM from "react-dom";
-import store from "./redux/store/index";
 import { Provider } from "react-redux";
+import { PersistGate } from "redux-persist/integration/react";
+import { store, persistor } from "./redux/store/index";
 
 import App from "./App.jsx";
 import "./main.scss";
@@ -9,7 +10,9 @@ import "./main.scss";
 ReactDOM.render(
 	<React.StrictMode>
 		<Provider store={store}>
-			<App />
+			<PersistGate loading={null} persistor={persistor}>
+				<App />
+			</PersistGate>
 		</Provider>
 	</React.StrictMode>,
 	document.getElementById("root")

src/redux/store/index.js

@@ -1,12 +1,30 @@
-import reducer from "../reducer/index"
 import { createStore, compose, applyMiddleware } from 'redux';
 import thunk from 'redux-thunk';
+import { persistStore, persistReducer } from 'redux-persist'
+import storage from 'redux-persist/lib/storage'
+import reducer from "../reducer/index"
 
 const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
 
+const persistConfig = {
+  key: 'root',
+  storage,
+}
+
+const persistedReducer = persistReducer(persistConfig, reducer)
+
+// const store = createStore(
+//   reducer,
+//   composeEnhancer(applyMiddleware(thunk))
+// );
+
+// export default store;
+
 const store = createStore(
-  reducer,
-  composeEnhancer(applyMiddleware(thunk)),
-);
+  persistedReducer,
+  composeEnhancer(applyMiddleware(thunk))
+  );
+
+const persistor = persistStore(store);
 
-export default store;
+export { store, persistor };

yarn.lock

@@ -692,6 +692,11 @@ readdirp@~3.6.0:
   dependencies:
     picomatch "^2.2.1"
 
+redux-persist@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/redux-persist/-/redux-persist-6.0.0.tgz#b4d2972f9859597c130d40d4b146fecdab51b3a8"
+  integrity sha512-71LLMbUq2r02ng2We9S215LtPu3fY0KgaGE0k8WRgl6RkqxtGfl7HUozz1Dftwsb0D/5mZ8dwAaPbtnzfvbEwQ==
+
 redux-thunk@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"