<commit_before>/**
 * Created by Dmitri on 12/11/2014.
 */

var React = require('react');

var TodoItems = React.createClass({

    render: function() {
        return (
            <ul>
                {this.props.items.map(function(item, i) {
                    return (
                        <li key={i}>{item}</li>
                    );
                })}
            </ul>
        );
    }
});

var TodoApp = React.createClass({

    getInitialState: function() {
        return {items: []};
    },

    handleClick: function() {
        var newTask =
            this.refs['newTask'].getDOMNode().value;
        if (newTask) {
            var updatedItems = this.state.items.concat([newTask]);
            this.setState(updatedItems);
            this.cleanUpTextField();
        }
    },

    cleanUpTextField: function() {
        this.refs['newTask'].getDOMNode().value = '';
    },

    render: function() {
        return (
            <div>
                <TodoItems items={this.state.items} />
                <input type="text" ref='newTask' />
                <button onClick={this.handleClick}>Add Task</button>
            </div>
        );
    }
});

React.render(
    <TodoApp />,
    document.getElementById('main')
);<commit_msg>Adding remove functionality<commit_after>/**
 * Created by Dmitri on 12/11/2014.
 */

var React = require('react');

var TodoItems = React.createClass({

    /**
     * Invoking a callback(passed via props) in order to remove item from a 'model'
     * @param index item to be removed
     * @returns {function(this:TodoItems)}
     */
    handleDelete: function(index) {
        return function() {
            this.props.onDelete(index);
        }.bind(this);
    },

    render: function() {
        var onDelete = this.handleDelete;
        return (
            <ul>
                {this.props.items.map(function(item, i) {
                    return (
                        <li key={i}>
                            {item}
                            <button className="btn btn-danger" onClick={onDelete(i)}>x</button>
                        </li>
                    );
                })}
            </ul>
        );
    }
});

var TodoApp = React.createClass({

    getInitialState: function() {
        return {items: []};
    },

    handleClick: function() {
        var newTask =
            this.refs['newTask'].getDOMNode().value;
        if (newTask) {
            var updatedItems = this.state.items.concat([newTask]);
            this.setState({items: updatedItems});
            this.cleanUpTextField();
        }
    },

    cleanUpTextField: function() {
        this.refs['newTask'].getDOMNode().value = '';
    },

    /**
     * Removes an Item from a list of Items
     * @param index index or an item to be removed
     */
    handleDelete: function(index) {
        var updatedItems = this.state.items.splice(0);
        updatedItems.splice(index, 1);
        this.setState({items: updatedItems});
    },

    render: function() {
        return (
            <div>
                <TodoItems items={this.state.items} onDelete={this.handleDelete} />
                <input type="text" ref='newTask' />
                <button onClick={this.handleClick}>Add Task</button>
            </div>
        );
    }
});

React.render(
    <TodoApp />,
    document.getElementById('main')
);
{'fraction_non_alphanumeric': 0.14166914166914166, 'fraction_numerical': 0.005346005346005346, 'mean_word_length': 1.5947611710323575, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 27, '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': '4246070', 'n_tokens_mistral': 982, 'n_tokens_neox': 933, 'n_words': 186}