<commit_before>var React=require('react');
var ReactDOM=require('react-dom');

var App=React.createClass({
  render:function(){
    return(
      <div>
        <div id="header"></div>
        <div className="container"></div>
      <div className="column"></div>
       <div className="column"></div>
        <div className="column"></div>
      <InboxPane/>
        </div>
    );
  }
});

var InboxPane=React.createClass({
  render:function(){
    return(
    <div id="inbox-pane">
      <h1>Inbox</h1>
      <table>
        <thead>
          <tr>
            <th>Chat Received</th>
             <th>Name</th>
             <th>Status</th>
          </tr>
        </thead>
        <tbody>
          <InboxItem/>
        </tbody>
      </table>
    </div>
    );
  }
});
var InboxItem=React.createClass({
render:function(){
  return(
    <tr>
      <td>7PM</td>
      <td><NAME> </td>
      <td>Confirmed </td>
      </tr>
  );

}<commit_msg>handling data flow and props<commit_after>var React=require('react');
var ReactDOM=require('react-dom');

var samples=require('./sample-data');
var App=React.createClass({
  getInitialState:function(){
    return{
      "humans":{},
      "store":{}
    }
  },
  loadSampleData:function(){
    this.setState(samples);
  },
  render:function(){
    return(
      <div>
        <div id="header"></div>
        <button onClick={this.loadSampleData}>Load Sample Data</button>
        <div className="container"></div>
      <div className="column"></div>
       <div className="column"></div>
        <div className="column"></div>
      <InboxPane humans={this.state.humans}/>
        </div>
    );
  }
});

var InboxPane=React.createClass({
  renderInboxItem:function(human){
    return <InboxItem key={human} index={human} details={this.props.human[human]}/>
  },
  render:function(){
    return(
    <div id="inbox-pane">
      <h1>Inbox</h1>
      <table>
        <thead>
          <tr>
            <th>Chat Received</th>
             <th>Name</th>
             <th>Status</th>
          </tr>
        </thead>
        <tbody>
          {Object.keys(this.props.humans).map(this.renderInboxItem)}
        </tbody>
      </table>
    </div>
    );
  }
});
var InboxItem=React.createClass({
sortByDate: function(a, b) {
      return a.time>b.time ? -1 : a.time<b.time ? 1 : 0;
  },
  messageSummary: function(conversations){
    var lastMessage = conversations.sort(this.sortByDate)[0];
    return lastMessage.who + ' said: "' + lastMessage.text + '" @ ' + lastMessage.time.toDateString();
  },
  render: function(){
    return (
      <tr>
        <td>{this.messageSummary(this.props.details.conversations)}</td>
        <td>{this.props.index}</td>
        <td>{this.props.details.orders.sort(this.sortByDate)[0].status}</td>
      </tr>
    )
  }
{'fraction_non_alphanumeric': 0.18478650879081449, 'fraction_numerical': 0.003588087549336204, 'mean_word_length': 2.315101070154578, 'pattern_counts': {'":': 2, '<': 87, '<?xml version=': 0, '>': 87, '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': '3331927', 'n_tokens_mistral': 937, 'n_tokens_neox': 935, 'n_words': 147}