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

class TodoItem extends Component {
    constructor(props) {
        super(props);
    
        this.state = {
            editionModeEnabled: false
        };
    }

    render() {
        const { todo } = this.props;

        return (
            <li className={this.getLiCssClasses()}>{this.renderContent()}</li>
        );
    }

    getLiCssClasses() {
        return this.props.todo.completed ? 'completed' : '';
    }

    renderContent() {
        const { todo } = this.props;
        const { editionModeEnabled } = this.state;

        return editionModeEnabled
            ? <input
                className="edit"
                defaultValue={todo.description}
                onKeyUp={this.handleKeyUp.bind(this)} 
              />
            : (
                <div onDoubleClick={() => this.setEditionMode(true)}>
                    <input
                        className="toggle"
                        type="checkbox"
                        checked={todo.completed}
                        onChange={this.handleOnChange.bind(this)}
                    />
                    <label>{todo.description}</label>
                    <button
                        className="destroy"
                        onClick={this.handleOnClickRemoveIcon.bind(this)}
                    ></button>
                </div>
            );
    }

    handleKeyUp(e) {
        console.log(e.keyCode);
    }

    handleOnChange(e) {
        const { todo, onToggleCheckbox } = this.props;
        const completed = e.target.checked;

        onToggleCheckbox(todo.id, completed);
    }

    handleOnClickRemoveIcon() {
        const { todo, onClickRemoveIcon } = this.props;

        onClickRemoveIcon(todo.id);
    }

    setEditionMode(isEnabled) {
        this.setState({ editionModeEnabled: isEnabled });
    }
}

TodoItem.propTypes = {
    todo: PropTypes.shape({
        id: PropTypes.number,
        description: PropTypes.string,
        completed: PropTypes.bool
    }),
    onToggleCheckbox: PropTypes.func.isRequired,
    onClickRemoveIcon: PropTypes.func.isRequired
};

export {
    TodoItem
}
<commit_msg>exiting edition mode when pressing ESC<commit_after>import React, { Component, PropTypes } from 'react'

class TodoItem extends Component {
    constructor(props) {
        super(props);
    
        this.state = {
            editionModeEnabled: false
        };
    }

    render() {
        const { todo } = this.props;

        return (
            <li className={this.getLiCssClasses()}>{this.renderContent()}</li>
        );
    }

    getLiCssClasses() {
        return this.props.todo.completed ? 'completed' : '';
    }

    renderContent() {
        const { todo } = this.props;
        const { editionModeEnabled } = this.state;

        return editionModeEnabled
            ? <input
                className="edit"
                defaultValue={todo.description}
                onKeyUp={this.handleKeyUp.bind(this)} 
              />
            : (
                <div onDoubleClick={() => this.setEditionMode(true)}>
                    <input
                        className="toggle"
                        type="checkbox"
                        checked={todo.completed}
                        onChange={this.handleOnChange.bind(this)}
                    />
                    <label>{todo.description}</label>
                    <button
                        className="destroy"
                        onClick={this.handleOnClickRemoveIcon.bind(this)}
                    ></button>
                </div>
            );
    }

    handleKeyUp(e) {
        if (e.keyCode === 27) {
            this.setEditionMode(false);
        }
    }

    handleOnChange(e) {
        const { todo, onToggleCheckbox } = this.props;
        const completed = e.target.checked;

        onToggleCheckbox(todo.id, completed);
    }

    handleOnClickRemoveIcon() {
        const { todo, onClickRemoveIcon } = this.props;

        onClickRemoveIcon(todo.id);
    }

    setEditionMode(isEnabled) {
        this.setState({ editionModeEnabled: isEnabled });
    }
}

TodoItem.propTypes = {
    todo: PropTypes.shape({
        id: PropTypes.number,
        description: PropTypes.string,
        completed: PropTypes.bool
    }),
    onToggleCheckbox: PropTypes.func.isRequired,
    onClickRemoveIcon: PropTypes.func.isRequired
};

export {
    TodoItem
}

{'fraction_non_alphanumeric': 0.11021324354657688, 'fraction_numerical': 0.0004489337822671156, 'mean_word_length': 1.5638665132336018, 'pattern_counts': {'":': 0, '<': 23, '<?xml version=': 0, '>': 25, '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': '1531316', 'n_tokens_mistral': 1219, 'n_tokens_neox': 1181, 'n_words': 188}