import * as React from "react";
import { render } from "react-dom";
import { BrowserRouter as Router } from "react-router-dom";
import App from "./App";
import { applyMiddleware, createStore, compose } from "redux";
import { Provider } from "react-redux";
import { createEpicMiddleware } from "redux-observable";
import { ApolloClient, ApolloProvider, InMemoryCache } from "@apollo/client";
import reducer from "./reducer";
import moment from "moment";
import rootEpic from "./epics";

moment.locale("ru");

const epicMiddleware = createEpicMiddleware();

const composeEnhancers: typeof compose =
  window["__REDUX_DEVTOOLS_EXTENSION_COMPOSE__"] || compose;
const enhancer = composeEnhancers(applyMiddleware(epicMiddleware));

const store = createStore(reducer, enhancer);

epicMiddleware.run(rootEpic);

const client = new ApolloClient({
  uri: `/graphql/`,
  cache: new InMemoryCache(),
});

render(
  <ApolloProvider client={client}>
    <Provider store={store}>
      <Router>
        <App />
      </Router>
    </Provider>
  </ApolloProvider>,
  document.getElementById("app")
);