<commit_before>import React from 'react';
import { Link } from 'react-router';

function isMatch(term, props) {
  var lowerCaseTerm = term.toLowerCase();
  return (object) => {
    return Object.keys(object)
      .filter((prop) => props.indexOf(prop) >= 0)
      .map((prop) => object[prop].toString().toLowerCase())
      .filter((val) => val.indexOf(lowerCaseTerm) >= 0)
      .length > 0;
  }
}

export default class SearchableList extends React.Component {
  constructor(props) {
    super(props);
    this.state = { searchTerm: '' };
  }

  changeSearchTerm(evt) {
    this.setState({ searchTerm: evt.target.value });
  }
  
  componentDidMount() {
    this.searchInput.focus();
  }

  render() {
    return (
      <div>
        <div className="search">
           <input type="text"
                  placeholder={this.props.searchPlaceholder}
                  value={this.state.searchTerm}
                  onChange={this.changeSearchTerm.bind(this)}
                  ref={(input) => { this.searchInput = input; }}/>
        </div>
        <div className="overview">
        <ul>
        {
          this.props.listItems
            .filter(isMatch(this.state.searchTerm, this.props.searchFields))
            .map(listItem => this.props.renderItem(listItem))
        }
        </ul>
        </div>
      </div>
    );<commit_msg>Don't focus search field on mobile devices<commit_after>import React from 'react';
import { Link } from 'react-router';

function isMatch(term, props) {
  var lowerCaseTerm = term.toLowerCase();
  return (object) => {
    return Object.keys(object)
      .filter((prop) => props.indexOf(prop) >= 0)
      .map((prop) => object[prop].toString().toLowerCase())
      .filter((val) => val.indexOf(lowerCaseTerm) >= 0)
      .length > 0;
  }
}

function isMobileDevice() {
  return (typeof window.orientation !== "undefined") ||
         (navigator.userAgent.indexOf('IEMobile') !== -1);
}

export default class SearchableList extends React.Component {
  constructor(props) {
    super(props);
    this.state = { searchTerm: '' };
  }

  changeSearchTerm(evt) {
    this.setState({ searchTerm: evt.target.value });
  }
  
  componentDidMount() {
    if (!isMobileDevice()) {
      this.searchInput.focus();
    }
  }

  render() {
    return (
      <div>
        <div className="search">
           <input type="text"
                  placeholder={this.props.searchPlaceholder}
                  value={this.state.searchTerm}
                  onChange={this.changeSearchTerm.bind(this)}
                  ref={(input) => { this.searchInput = input; }}/>
        </div>
        <div className="overview">
        <ul>
        {
          this.props.listItems
            .filter(isMatch(this.state.searchTerm, this.props.searchFields))
            .map(listItem => this.props.renderItem(listItem))
        }
        </ul>
        </div>
      </div>
    );
{'fraction_non_alphanumeric': 0.15158839779005526, 'fraction_numerical': 0.0024171270718232043, 'mean_word_length': 2.2845804988662133, 'pattern_counts': {'":': 0, '<': 21, '<?xml version=': 0, '>': 39, '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': '5915711', 'n_tokens_mistral': 867, 'n_tokens_neox': 861, 'n_words': 154}