<commit_before>import React, { Component } from 'react';
import Chooser from './Chooser';
import Pokemon from './Pokemon';

// Pokédex data
import pokedex from './_pokedex';

// Styles
import './App.css';

var family = [
    pokedex.miles,
    pokedex.holli,
    pokedex.ian,
    pokedex.ainsley
];

class App extends Component {
    constructor(props) {
        super(props);
        this.state = { chosenValue: 'none', caught: [], evolved: [], family: family };

        this.handleChoice = this.handleChoice.bind(this);
    }

    handleChoice(newValue, e) {
        if ( e ) {
            e.preventDefault();
        }

        this.setState({
            chosenValue: newValue
        });
    }

    componentDidMount() {}

    componentWillUnmount() {}

    render() {
        const chosenValue = this.state.chosenValue;

        return (
            <div className="app">
                <Chooser
                    choices={this.state.family}
                    chosenValue={chosenValue}
                    caught={this.state.caught}
                    // evolved={this.state.evolved}
                    handleChoice={this.handleChoice} />

                {(chosenValue !== 'none') ?
                    <div>
                        <Pokemon pokemon={pokedex[chosenValue]} />
                        <a href="#close" title="Close" onClick={(e) => this.handleChoice('none', e)}>Close</a>
                    </div>
                : ''}
            </div>
        );
    }
}

export default App;
<commit_msg>Add comments to App component<commit_after>import React, { Component } from 'react';

// React Components
import Chooser from './Chooser';
import Pokemon from './Pokemon';

// Pokédex data
import pokedex from './_pokedex';

// Styles
import './App.css';

// Create our family of Pokémon
var family = [
    pokedex.miles,
    pokedex.holli,
    pokedex.ian,
    pokedex.ainsley
];

// Define our component
class App extends Component {
    constructor(props) {
        super(props);

        // Initialize our state
        this.state = {
            chosenValue: 'none',
            caught: [],
            evolved: [],
            family: family
        };

        // Bind our handlers to our class
        this.handleChoice = this.handleChoice.bind(this);
    }

    // Handle people choosing a Pokémon
    handleChoice(newValue, e) {
        if ( e ) {
            e.preventDefault();
        }

        // Set the chosenValue state to newValue
        this.setState({
            chosenValue: newValue
        });
    }

    componentDidMount() {}

    componentWillUnmount() {}

    render() {
        const chosenValue = this.state.chosenValue;

        return (
            <div className="app">
                // Create a Chooser
                <Chooser
                    choices={this.state.family}
                    chosenValue={chosenValue}
                    caught={this.state.caught}
                    // evolved={this.state.evolved}
                    handleChoice={this.handleChoice} />

                {(chosenValue !== 'none') ?
                    <div>
                        // Create a Pokémon
                        <Pokemon pokemon={pokedex[chosenValue]} />

                        // And a close button
                        <a className="app--close" href="#close" title="Close" onClick={(e) => this.handleChoice('none', e)}>Close</a>
                    </div>
                : ''}
            </div>
        );
    }
}

export default App;

{'fraction_non_alphanumeric': 0.12403763900769889, 'fraction_numerical': 0.0, 'mean_word_length': 1.503925767309065, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 21, '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': '2579513', 'n_tokens_mistral': 990, 'n_tokens_neox': 942, 'n_words': 209}