Make hot reloading work

openbis_ng_ui/src/js/index.js

 import 'regenerator-runtime/runtime'
 import React from 'react'
 import ReactDOM from 'react-dom'
+import store from './store/store.js'
 import { Provider } from 'react-redux'
 import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'
 import DragAndDropProvider from './components/common/dnd/DragAndDropProvider.jsx'
@@ -26,8 +27,7 @@ const theme = createMuiTheme({
 })
 
 const render = () => {
-  const App = require('./components/App.jsx').default
-  const store = require('./store/store.js').default
+  let App = require('./components/App.jsx').default
 
   ReactDOM.render(
     <Provider store={store}>
@@ -44,10 +44,6 @@ const render = () => {
 /* eslint-disable no-undef */
 if (module.hot) {
   module.hot.accept('./components/App.jsx', () => setTimeout(render))
-  module.hot.accept('./store/reducers/reducers.js', () => {
-    const nextRootReducer = require('./store/reducers/reducers.js').default
-    store.replaceReducer(nextRootReducer)
-  })
 }
 
 render()

openbis_ng_ui/src/js/store/actions/app.js

 export const INIT = 'INIT'
+export const CLEAR = 'CLEAR'
 export const LOGIN = 'LOGIN'
 export const LOGOUT = 'LOGOUT'
 export const SEARCH = 'SEARCH'
@@ -7,6 +8,7 @@ export const SEARCH_CHANGE = 'SEARCH_CHANGE'
 export const ERROR_CHANGE = 'ERROR_CHANGE'
 export const ROUTE_CHANGE = 'ROUTE_CHANGE'
 
+export const SET_INITIALIZED = 'SET_INITIALIZED'
 export const SET_LOADING = 'SET_LOADING'
 export const SET_SEARCH = 'SET_SEARCH'
 export const SET_SESSION = 'SET_SESSION'
@@ -17,6 +19,10 @@ export const init = () => ({
   type: INIT
 })
 
+export const clear = () => ({
+  type: CLEAR
+})
+
 export const login = (username, password) => ({
   type: LOGIN,
   payload: {
@@ -65,6 +71,13 @@ export const routeChange = route => ({
   }
 })
 
+export const setInitialized = initialized => ({
+  type: SET_INITIALIZED,
+  payload: {
+    initialized
+  }
+})
+
 export const setLoading = loading => ({
   type: SET_LOADING,
   payload: {

openbis_ng_ui/src/js/store/reducers/reducers.js

@@ -5,12 +5,26 @@ import session from './session/session.js'
 import route from './route/route.js'
 
 export default function root(state = {}, action) {
-  if (action.type === actions.INIT) {
-    state = {}
+  if (action.type === actions.CLEAR) {
+    state = {
+      initialized: state.initialized
+    }
   }
   return combineReducers({
+    initialized,
     ui,
     session,
     route
   })(state, action)
 }
+
+function initialized(state = false, action) {
+  switch (action.type) {
+    case actions.SET_INITIALIZED: {
+      return action.payload.initialized
+    }
+    default: {
+      return state
+    }
+  }
+}

openbis_ng_ui/src/js/store/reducers/ui/pages/common/page.js

@@ -6,6 +6,7 @@ export * from './browser.js'
 export function isPageAction(page, action) {
   return (
     action.type === actions.INIT ||
+    action.type === actions.CLEAR ||
     page === (action.payload && action.payload.page)
   )
 }

openbis_ng_ui/src/js/store/sagas/app.js

@@ -17,14 +17,19 @@ export default function* appSaga() {
 }
 
 function* init() {
-  try {
-    yield put(actions.setLoading(true))
-    yield call([dto, dto.init])
-    yield call([facade, facade.init])
-  } catch (e) {
-    yield put(actions.setError(e))
-  } finally {
-    yield put(actions.setLoading(false))
+  let initialized = yield select(selectors.getInitialized)
+
+  if (!initialized) {
+    try {
+      yield put(actions.setLoading(true))
+      yield call([dto, dto.init])
+      yield call([facade, facade.init])
+      yield put(actions.setInitialized(true))
+    } catch (e) {
+      yield put(actions.setError(e))
+    } finally {
+      yield put(actions.setLoading(false))
+    }
   }
 }
 
@@ -62,7 +67,7 @@ function* logout() {
   try {
     yield put(actions.setLoading(true))
     yield putAndWait(actions.apiRequest({ method: 'logout' }))
-    yield put(actions.init())
+    yield put(actions.clear())
     yield put(actions.routeChange('/'))
   } catch (e) {
     yield put(actions.setError(e))

openbis_ng_ui/src/js/store/selectors/app.js

 import routes from '../../common/consts/routes.js'
 
+export const getInitialized = state => {
+  return state.initialized
+}
+
 export const getLoading = state => {
   return state.ui.loading
 }

openbis_ng_ui/src/js/store/store.js

@@ -8,7 +8,12 @@ import history from './history.js'
 function createStoreWithMiddleware() {
   const sagaMiddleware = createSagaMiddleware()
   const composeEnhancers =
-    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose
+    (window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&
+      window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
+        trace: true,
+        traceLimit: 25
+      })) ||
+    compose
 
   let store = createStore(
     rootReducer,
@@ -23,5 +28,13 @@ function createStoreWithMiddleware() {
 
 let store = createStoreWithMiddleware()
 
+/* eslint-disable no-undef */
+if (module.hot) {
+  module.hot.accept('./reducers/reducers.js', () => {
+    const nextRootReducer = require('./reducers/reducers.js').default
+    store.replaceReducer(nextRootReducer)
+  })
+}
+
 export { createStoreWithMiddleware as createStore }
 export default store

openbis_ng_ui/webpack.config.dev.js

@@ -38,9 +38,7 @@ module.exports = {
       {
         test: /\.(js|jsx)$/,
         exclude: /node_modules/,
-        use: {
-          loader: 'babel-loader'
-        }
+        use: ['react-hot', 'babel-loader']
       },
       {
         test: /\.(css)$/,