<commit_before>import React, { Component } from 'react';

const UserList = () => {
  return (
    <div>
      <img src="#" alt="User Picture" />
    </div>
  );
}

export default UserList;<commit_msg>bootstrap styles and list users<commit_after>import React, { Component } from 'react';

const UserList = (props) => {
  const users = props.users.map((user) => {
    return (
       <div key={ user.cell } className="card">
          <img className="card-img-top" src={ user.picture.large } alt="User Picture" />
          <div className="card-block">
            <h4 className="card-title">{ `${ user.name.first } ${ user.name.last }`}</h4>
            <p className="card-text">{ `DOB: ${ user.dob }` }</p>
            <p className="card-text">{ `City: ${ user.location.city  }` }</p>
          </div>
      </div>
    );
  });

  return (
    <div className="users-list">
      { users }
    </div>
  )
}

export default UserList;
{'fraction_non_alphanumeric': 0.19011815252416756, 'fraction_numerical': 0.0021482277121374865, 'mean_word_length': 2.5037593984962405, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 22, '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': '636516', 'n_tokens_mistral': 306, 'n_tokens_neox': 304, 'n_words': 69}