import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter } from "react-router-dom";
import { createStore, applyMiddleware } from "redux";
import createSagaMiddleware from "redux-saga";
import { Provider } from "react-redux";
import { createLogger } from "redux-logger";

import rootReducer from "./reducers";
import rootSaga from "./sagas";
import App from "./components/App";
import { unregister } from "./registerServiceWorker";

const sagaMiddleware = createSagaMiddleware();
const debugLogger = createLogger();
const store = createStore(
  rootReducer,
  applyMiddleware(debugLogger, sagaMiddleware)
);
const supportsHistory = "pushState" in window.history;

sagaMiddleware.run(rootSaga);

const rootElement = document.getElementById("root");

ReactDOM.render(
  <Provider store={store}>
    <BrowserRouter forceRefresh={!supportsHistory}>
      <App />
    </BrowserRouter>
  </Provider>,
  rootElement
);

// hot module reloading
if (module.hot) {
  module.hot.accept("./components/App", () => {
    const NextApp = require("./components/App").default;
    ReactDOM.render(
      <Provider store={store}>
        <BrowserRouter forceRefresh={!supportsHistory}>
          <NextApp />
        </BrowserRouter>
      </Provider>,
      rootElement
    );
  });
}

// no service worker functionality for now
unregister();