{"size": 982, "ext": "js", "max_stars_repo_path": "src/components/FilterList.js", "max_stars_repo_name": "pagoenka/phonecatrrs", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/FilterList.js", "max_issues_repo_name": "pagoenka/phonecatrrs", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/FilterList.js", "max_forks_repo_name": "pagoenka/phonecatrrs", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 39.28, "max_line_length": 86, "alphanum_fraction": 0.4460285132}
import React, {Component} from 'react';

export default class FilterList extends Component {
    render() {
        const { onSearchPhone, onSortPhone } = this.props;
        return (
            <div className="col-sm-3 col-md-3 col-lg-3">
                <form>
                    <div className="form-group">
                        <label>Search:</label>
                        <input type="text" className="form-control" name='searchQuery'
                               onChange={onSearchPhone}/>
                    </div>
                    <div className="form-group">
                        <label>Sort By:</label>
                        <select className="form-control" onChange={onSortPhone}>
                            <option value='alphabetically'>Alphabetically</option>
                            <option value='newest'>Newest</option>
                        </select>
                    </div>
                </form>
            </div>
        )
    };
}