Binding Actions to App

When you want to bind the actions to the App, you use this to wrap items. This will create a "main" with all the actions available on it to perform actions.

import { bindActionCreators } from 'redux';
import { connnect } from 'react-redux'
import * as actionCreators from '../actions;
import Main from './Main';

function mapStateToProps(state) {
  return {
    posts: state.posts,
    comments: state.comments 
  }
}

function mapDispatchToProps(dispatch) {
  return bindActionCreators(actionCreators, dispatch);
}

const App = connect(mapStateToProps, mapDispatchToProps)(Main);

Then, this needs to be in your route instead of Main (in router.js)

import { Router, Route, IndexRoute, browserHistory } from 'react-router';
import { Provider } from 'react-redux';
import store, { history } from './store';

const router = (
  <Provider store={store}>
    <Router history={history}>
      <Route exact path="/" component={Main} />
      <Route exact path="/" component={PhotoGrid} />
      <Route exact path="/view/:postId" component={Single}>
    </Router>
  </Provider>
)

render(router, document.getElementById('root'));