Merge pull request #2218 from lindapaiste/fix/hot-reload

Enable hot reloading - Fixes #2134

.babelrc

@@ -51,7 +51,16 @@
  "development": {
  "plugins": [
  "babel-plugin-styled-components",
- "react-hot-loader/babel"
+ "react-refresh/babel"
+ ],
+ "presets": [
+ [
+ "@babel/preset-react",
+ {
+ "development": true,
+ "runtime": "automatic"
+ }
+ ]
  ]
  }
  },

client/index.jsx

@@ -1,6 +1,5 @@
 import React, { Suspense } from 'react';
 import { render } from 'react-dom';
-import { hot } from 'react-hot-loader/root';
 import { Provider } from 'react-redux';
 import { Router } from 'react-router-dom';
 
@@ -30,11 +29,9 @@ const App = () => (
  </Provider>
 );
 
-const HotApp = hot(App);
-
 render(
  <Suspense fallback={<Loader />}>
- <HotApp />
+ <App />
  </Suspense>,
  document.getElementById('root')
 );

client/modules/Preview/previewIndex.jsx

@@ -1,6 +1,5 @@
 import React, { useReducer, useState, useEffect } from 'react';
 import { render } from 'react-dom';
-import { hot } from 'react-hot-loader/root';
 import { createGlobalStyle } from 'styled-components';
 import {
  registerFrame,
@@ -73,6 +72,4 @@ const App = () => {
  );
 };
 
-const HotApp = hot(App);
-
-render(<HotApp />, document.getElementById('root'));
+render(<App />, document.getElementById('root'));