import React from 'react'
import ReactDOM from 'react-dom'
import createBrowserHistory from 'history/lib/createBrowserHistory'
import { Router, useRouterHistory } from 'react-router'
import { syncHistoryWithStore } from 'react-router-redux'
import createStore from './store/createStore'
import { Provider } from 'react-redux'

const MOUNT_ELEMENT = document.getElementById('root')

// Configure history for react-router
const browserHistory = useRouterHistory(createBrowserHistory)({
  basename: __BASENAME__
})

// Create redux store and sync with react-router-redux. We have installed the
// react-router-redux reducer under the key "router" in src/routes/index.js,
// so we need to provide a custom `selectLocationState` to inform
// react-router-redux of its location.
const store = createStore(window.__INITIAL_STATE__, browserHistory)
const history = syncHistoryWithStore(browserHistory, store, {
  selectLocationState: (state) => state.router
})

let render = (key = null) => {
  const routes = require('./routes/index').default(store)
  const App = (
    <Provider store={store}>
      <div style={{ height: '100%' }}>
        <Router history={history} children={routes} key={key} />
      </div>
    </Provider>
  )
  ReactDOM.render(App, MOUNT_ELEMENT)
}

// Enable HMR and catch runtime errors in RedBox
// This code is excluded from production bundle
if (__DEV__ && module.hot) {
  const renderApp = render
  const renderError = (error) => {
    const RedBox = require('redbox-react')

    ReactDOM.render(<RedBox error={error} />, MOUNT_ELEMENT)
  }
  render = () => {
    try {
      renderApp(Math.random())
    } catch (error) {
      renderError(error)
    }
  }
  module.hot.accept(['./routes/index'], () => render())
}

// Use Redux DevTools chrome extension
if (__DEBUG__) {
  if (window.devToolsExtension) window.devToolsExtension.open()
}

render()

@@ -324,193 +324,400 @@
 x'%0A%0A
-const MOUNT_ELEMENT = document.getElementById('root')%0A%0A// Configure history for react-router%0Aconst browserHistory = useRouterHistory(createBrowserHistory)(%7B%0A  basename: __BASENAME__%0A%7D)%0A
+// ========================================================%0A// Browser History Setup%0A// ========================================================%0Aconst browserHistory = useRouterHistory(createBrowserHistory)(%7B%0A  basename: __BASENAME__%0A%7D)%0A%0A// ========================================================%0A// Store and History Instantiation%0A// ========================================================
 %0A// 
@@ -983,28 +983,23 @@
 nst 
-store = createStore(
+initialState = 
 wind
@@ -1003,16 +1003,17 @@
 indow.__
+_
 INITIAL_
@@ -1019,16 +1019,55 @@
 _STATE__
+%0Aconst store = createStore(initialState
 , browse
@@ -1189,16 +1189,443 @@
 ter%0A%7D)%0A%0A
+// ========================================================%0A// Developer Tools Setup%0A// ========================================================%0Aif (__DEBUG__) %7B%0A  if (window.devToolsExtension) %7B%0A    window.devToolsExtension.open()%0A  %7D%0A%7D%0A%0A// ========================================================%0A// Render Setup%0A// ========================================================%0Aconst MOUNT_NODE = document.getElementById('root')%0A%0A
 let rend
@@ -1916,23 +1916,20 @@
 , MOUNT_
-ELEMENT
+NODE
 )%0A%7D%0A%0A// 
@@ -2213,15 +2213,12 @@
 UNT_
-ELEMENT
+NODE
 )%0A  
@@ -2402,127 +2402,131 @@
 %0A// 
-Use Redux DevTools chrome extension%0Aif (__DEBUG__) %7B%0A  if (window.devToolsExtension) window.devToolsExtension.open()%0A%7D%0A
+========================================================%0A// Go!%0A// ========================================================
 %0Aren

improve readability of entry point