<commit_before>import React from 'react';


export default class ParkList extends React.Component {
    constructor(props) {
        super(props);
    }

    selectPark(park) {
        this.props.onSelectPark(park);
    }

    render() {
        var parkList = this.props.parks.map((park) => {
            return (
                <div className='row u-clickable' onClick={() => this.selectPark(park)} key={park.park_id}>
                    <div className='name ten columns'>{park.name}</div>
                    <div className='id two columns'>{park.park_id}</div>
                </div>
            );
        });
        return (
            <div>
                <div className='row'>
                    <select>
                        <option defaultValue>Neighborhood</option>
                        <option>Downtown</option>
                        <option>Hyde Park</option>
                    </select>
                    <select>
                        <option defaultValue>Activity</option>
                        <option>BBQ Pit</option>
                        <option>Restroom</option>
                    </select>
                    <input type='text' placeholder='Name' />
                </div>
                {parkList}
            </div>
        );
    }
}

ParkList.propTypes = {
    parks:  React.PropTypes.array.isRequired,
    onSelectPark:  React.PropTypes.func.isRequired,
};
<commit_msg>add headings to park list<commit_after>import React from 'react';


export default class ParkList extends React.Component {
    constructor(props) {
        super(props);
    }

    selectPark(park) {
        this.props.onSelectPark(park);
    }

    render() {
        var parkList = this.props.parks.map((park) => {
            return (
                <div className='row u-clickable' onClick={() => this.selectPark(park)} key={park.park_id}>
                    <div className='name ten columns'>{park.name}</div>
                    <div className='id two columns'>{park.park_id}</div>
                </div>
            );
        });
        return (
            <div>
                <div className='row'>
                    <select>
                        <option defaultValue>Neighborhood</option>
                        <option>Downtown</option>
                        <option>Hyde Park</option>
                    </select>
                    <select>
                        <option defaultValue>Activity</option>
                        <option>BBQ Pit</option>
                        <option>Restroom</option>
                    </select>
                    <input type='text' placeholder='Name' />
                </div>
                <div className='row'>
                    <div className='ten columns'><h6>Park Name</h6></div>
                    <div className='two columns'><h6>Park ID</h6></div>
                </div>
                {parkList}
            </div>
        );
    }
}

ParkList.propTypes = {
    parks:  React.PropTypes.array.isRequired,
    onSelectPark:  React.PropTypes.func.isRequired,
};

{'fraction_non_alphanumeric': 0.12324747310074992, 'fraction_numerical': 0.0013042060645582002, 'mean_word_length': 1.3189720332577475, 'pattern_counts': {'":': 0, '<': 67, '<?xml version=': 0, '>': 71, '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': '7037610', 'n_tokens_mistral': 833, 'n_tokens_neox': 774, 'n_words': 141}