<commit_before><!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8"/>
  <title>React - First Component</title>
  <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
  <!-- Container Node -->
  <div id="app"></div>

  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/JSXTransformer.js"></script>
  <script type="text/jsx">
  /** @jsx React.DOM */
    var MessageBox = React.createClass({
      handleAdd: function(e){
        console.log(e.target);
      },
      getInitialState: function(){
        return {
          isVisible: true,
          titleMessage: 'What is up?',
          messages: [
            'I love this world!',
            'Coffee flavored ice cream is underrated.',
            'My spoon is too big.',
            'Tuesday is evening. Did you bring your coat?',
            'I am a banana.'
          ]
        }
      },
      render: function(){
        var inlineStyles = {
          display: this.state.isVisible ? 'block' : 'none'
        };

        var messages = this.state.messages.map(function(message){
          return <SubMessage message={message}/>
        });

        return (
          <div className="container jumbotron" style={inlineStyles}>
            <h1>{this.state.titleMessage}</h1>
            <input type="text"/>
            <button className="btn btn-primary" onClick={this.handleAdd}>Add</button>
            {messages}
          </div>
        );
      }
    });

    var SubMessage = React.createClass({
      getDefaultProps: function(){
        return {
          message: 'It is good to see you!'
        }
      },
      render: function(){
        return (
          <div>{this.props.message}</div>
        );
      }
    });

    var reactComponent = React.render(
      <MessageBox/>,
      document.getElementById("app"),
      function(){
        console.log("Hello World!");
      }
    );
  </script>
</body>
</html><commit_msg>button action adds to list<commit_after><!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8"/>
  <title>React - First Component</title>
  <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
  <!-- Container Node -->
  <div id="app"></div>

  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/JSXTransformer.js"></script>
  <script type="text/jsx">
  /** @jsx React.DOM */
    var MessageBox = React.createClass({
      handleAdd: function(e){
        // console.log(e.target);
        var newMessage = this.refs.newMessage.getDOMNode().value;
        var newMessages = this.state.messages.concat([newMessage]);
        this.setState({
          messages: newMessages
        });
      },
      getInitialState: function(){
        return {
          isVisible: true,
          titleMessage: 'What is up?',
          messages: [
            'I love this world!',
            'Coffee flavored ice cream is underrated.',
            'My spoon is too big.',
            'Tuesday is evening. Did you bring your coat?',
            'I am a banana.'
          ]
        }
      },
      render: function(){
        var inlineStyles = {
          display: this.state.isVisible ? 'block' : 'none'
        };

        var messages = this.state.messages.map(function(message){
          return <SubMessage message={message}/>
        });

        return (
          <div className="container jumbotron" style={inlineStyles}>
            <h1>{this.state.titleMessage}</h1>
            <input type="text" ref="newMessage"/>
            <button className="btn btn-primary" onClick={this.handleAdd}>Add</button>
            {messages}
          </div>
        );
      }
    });

    var SubMessage = React.createClass({
      getDefaultProps: function(){
        return {
          message: 'It is good to see you!'
        }
      },
      render: function(){
        return (
          <div>{this.props.message}</div>
        );
      }
    });

    var reactComponent = React.render(
      <MessageBox/>,
      document.getElementById("app"),
      function(){
        console.log("Hello World!");
      }
    );
  </script>
</body>
</html>
{'fraction_non_alphanumeric': 0.15768463073852296, 'fraction_numerical': 0.006209802616988246, 'mean_word_length': 2.053486797562627, 'pattern_counts': {'":': 0, '<': 65, '<?xml version=': 0, '>': 65, 'https://': 6, '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': '441265', 'n_tokens_mistral': 1362, 'n_tokens_neox': 1325, 'n_words': 271}