import ReactDOM from 'react-dom'
import { createStore, applyMiddleware } from 'redux'
import getRootEpic from '../../store/epics/root.epic'
import {createEpicMiddleware} from 'redux-observable'
import reduxLogger from 'redux-logger'
import { Provider } from 'react-redux'
import MainApp from './main-app.component'
import { BrowserRouter } from 'react-router-dom'
import appReducers from '../../store/reducers'
import { CookiesProvider } from 'react-cookie'

const hydrateData = window.__HYDRATE_DATA__
delete window.__HYDRATE_DATA__

const store = createStore(
  appReducers,
  hydrateData,
  applyMiddleware(reduxLogger, createEpicMiddleware(getRootEpic()))
)

ReactDOM.hydrate(
   <Provider store={store}>
    <BrowserRouter>
      <CookiesProvider>
        <MainApp />
      </CookiesProvider>
    </BrowserRouter>
   </Provider>,
  document
)