<commit_before>import React, { Component } from 'react';
import { connect } from 'react-redux';
// Actions
import { showModal, getUsers, deleteUser } from '../../actions/user';
// Components
import User from '../../components/users/User';
import UserModal from '../../components/users/UserModal';
import { Button } from 'react-bootstrap';
import FontAwesome from 'react-fontawesome';

class UserContainer extends Component {
  componentWillMount(){
    this.props.getUsers();
  }

  show = (event, user = {}) => {this.props.showModal(user);}
  destroy = id => {this.props.deleteUser(id)}

  render(){
    const users = this.props.users.map((user, index) => <User user={user} key={index} onEdit={this.show} onDelete={this.destroy}/>)
    return (
      <div className="page-users">
        <h1 id="title">Users</h1>
        {users.length ?
        <Button className="create-route-btn" onClick={this.show} >
          Create User <FontAwesome name="plus"/>
        </Button>
        : <div className="alert alert-danger">You Cannot Edit Users</div>}
        <div id="users-list">{users}</div>
        {this.props.showUserModal && <UserModal /> /* re render the route so that it updates*/}
      </div>
    )
  }
}

function mapStateToProps(state, ownProps){<commit_msg>import usercss<commit_after>import React, { Component } from 'react';
import { connect } from 'react-redux';
// Actions
import { showModal, getUsers, deleteUser } from '../../actions/user';
// Components
import User from '../../components/users/User';
import UserModal from '../../components/users/UserModal';
import { Button } from 'react-bootstrap';
import FontAwesome from 'react-fontawesome';

import '../../styles/users/user.css';

class UserContainer extends Component {
  componentWillMount(){
    this.props.getUsers();
  }

  show = (event, user = {}) => {this.props.showModal(user);}
  destroy = id => {this.props.deleteUser(id)}

  render(){
    const users = this.props.users.map((user, index) => <User user={user} key={index} onEdit={this.show} onDelete={this.destroy}/>)
    return (
      <div className="page-users">
        <h1 id="title">Users</h1>
        {users.length ?
        <Button className="create-route-btn" onClick={this.show} >
          Create User <FontAwesome name="plus"/>
        </Button>
        : <div className="alert alert-danger">You Cannot Edit Users</div>}
        <div id="users-list">{users}</div>
        {this.props.showUserModal && <UserModal /> /* re render the route so that it updates*/}
      </div>
    )
  }
}

function mapStateToProps(state, ownProps){
{'fraction_non_alphanumeric': 0.17094017094017094, 'fraction_numerical': 0.001554001554001554, 'mean_word_length': 3.3204697986577183, 'pattern_counts': {'":': 0, '<': 29, '<?xml version=': 0, '>': 35, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1208722', 'n_tokens_mistral': 775, 'n_tokens_neox': 770, 'n_words': 188}