User List HoC

user_list_hoc.jsx

var UserList = React.createClass({
  propTypes: {
    onSelect: React.PropTypes.func.isRequired,
    selection: React.PropTypes.object.isRequired,
  },
  
  getInitialState() {
    return {
      users: [],
    };
  },
  
  fetchUsers() {
    // Hit API, get users, and set to users on state.
    // Assume unsharable for... reasons.
  },
  
  renderUsers() {
    return users.map(function(user) {
      return(
        <tr>
          <td>
            <input type="checkbox" onClick={this.props.onSelect(user)} checked={this.props.selection.has(user)} />
          </td>
          <td>user.name</td>
          <td>user.id</td>
          <td>user.numberOfBadges</td>
        </tr>
      );
    });
  },

  render() {
    return (
      <table>
        <thead>
          <tr>
            <th></th>
            <th>"Name"</th>
            <th>"ID"</th>
            <th>"# of Badges"</th>
          </tr>
        </thead>
        <tbody>
          this.renderUsers();
        </tbody>
      </table>
    );
  },
});

export default UserList;