import React from 'react';
import ReactDOM from 'react-dom';

import { Provider } from 'react-redux';
import configureStore from './configureStore.js';

import App from './App.js';

const page = document.getElementById('homepage--page');

if (page) {
  const store = configureStore();

  const settings = JSON.parse(document.getElementById('homepageSettings').textContent);
  const { feedUrl, subredditUrl, timelineUrl, categoriesUrl } = settings;

  const app = (
    <Provider store={store}>
      <App
        feedUrl={feedUrl.substring(1, feedUrl.length - 3)}
        subredditUrl={subredditUrl.substring(1, subredditUrl.length - 3)}
        timelineUrl={timelineUrl.substring(1, timelineUrl.length - 3)}
        categoriesUrl={categoriesUrl.substring(1, categoriesUrl.length - 3)}
        timezone={settings.timezone}
        autoMarking={settings.autoMarking}
      />
    </Provider>
  );

  ReactDOM.render(app, page);
}
