{"size": 2796, "ext": "js", "max_stars_repo_path": "frontend/components/Search/FilterMenu.js", "max_stars_repo_name": "viktorfa/F033583-project", "max_stars_repo_stars_event_min_datetime": "2020-04-08T07:10:29.000Z", "max_stars_repo_stars_event_max_datetime": "2022-02-25T04:39:56.000Z", "max_issues_repo_path": "frontend/components/Search/FilterMenu.js", "max_issues_repo_name": "viktorfa/F033583-project", "max_issues_repo_issues_event_min_datetime": "2021-03-31T18:43:39.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-02T14:54:47.000Z", "max_forks_repo_path": "frontend/components/Search/FilterMenu.js", "max_forks_repo_name": "viktorfa/F033583-project", "max_forks_repo_forks_event_min_datetime": "2018-03-02T06:08:51.000Z", "max_forks_repo_forks_event_max_datetime": "2020-05-19T13:50:00.000Z"}
{"max_stars_count": 2, "max_issues_count": 3, "max_forks_count": 2, "avg_line_length": 31.7727272727, "max_line_length": 75, "alphanum_fraction": 0.55472103}
/**
 * React Static Boilerplate
 * https://github.com/kriasoft/react-static-boilerplate
 *
 * Copyright © 2015-present Kriasoft, LLC. All rights reserved.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE.txt file in the root directory of this source tree.
 */

import React from 'react';
import {isNumber} from '../../core/util';

class FilterMenu extends React.Component {

  constructor(props) {
    super(props);
  }

  handleChange(event, field) {
    const name = event.target.name;
    const value = event.target.value;
    this.props.handleChange(field, name, value, this.props.state.filters)
  }

  handleYearFilterChange(event) {
    this.handleChange(event, 'year');
  }

  handleRatingFilterChange(event) {
    this.handleChange(event, 'rating');
  }

  render() {
    return (
      <div className="mdl-grid">
        <div className="mdl-cell--6-col">
          <h4>Year released</h4>
          <form onSubmit={(event) => {
            event.preventDefault();
          }}
                onChange={(event) => this.handleYearFilterChange(event)}>
            <div className="form-group mdl-textfield mdl-js-textfield">
              <label htmlFor="gte">After</label>
              <input type="number" name="gte" placeholder="1900"
                     value={this.props.state.filters.year.gte}
                     className="mdl-textfield__input"
              />
            </div>
            <div className="form-group mdl-textfield mdl-js-textfield">
              <label htmlFor="lte">Before</label>
              <input type="number" name="lte" placeholder="2017"
                     value={this.props.state.filters.year.lte}
                     className="mdl-textfield__input"
              />
            </div>
          </form>
        </div>
        <div className="mdl-cell--6-col">
          <h4>Rating</h4>
          <form onSubmit={(event) => {
            event.preventDefault();
          }}
                onChange={(event) => this.handleRatingFilterChange(event)}>
            <div className="form-group mdl-textfield mdl-js-textfield">
              <label htmlFor="gte">Min</label>
              <input type="number" name="gte" placeholder="0"
                     value={this.props.state.filters.rating.gte}
                     className="mdl-textfield__input"
              />
            </div>
            <div className="form-group mdl-textfield mdl-js-textfield">
              <label htmlFor="lte">Max</label>
              <input type="number" name="lte" placeholder="10"
                     value={this.props.state.filters.rating.lte}
                     className="mdl-textfield__input"
              />
            </div>
          </form>
        </div>
      </div>

    );
  }
}

export default FilterMenu;
