import React, { Component } from 'react';
import UserList from '../components/user_list';

class UserSection extends Component {
  constructor() {
    super();
    this.state = {};
  }

  render() {
    return (
      <div>
        <UserList />
      </div>
    );
  };
}

export default UserSection;
import React, { Component } from 'react';
import UserList from '../components/user_list';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { retrieveUsersAction } from '../actions/retrieve_users_action';

class UserSection extends Component {
  constructor() {
    super();
    this.state = {
      users: []
    };
  }

  componentDidMount() {
    this.props.retrieveUsersAction();
  }

  render() {
    return (
      <div>
        <UserList users={ this.props.users } />
      </div>
    );
  };
}

function mapStateToProps({ users }) {
  return { users };
}

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

export default connect(mapStateToProps, mapDispatchToProps)(UserSection);
connect component to redux