<commit_before>import React, { Component, PropTypes } from 'react';

/*
 * A component implementing a simple facet list.
 *
 * props should be like:
 *    onSetFilter = callback function for setting a filter
 *    multiselect = true|false (defaults to false)
 *    facets = [
 *        { label, filter, selected }
 *    ]
 *
 * filter should be unique for each facet
 */

class FacetList extends Component {
  render() {
    const facets = this.props.facets;
    const multiselect = this.props.multiselect;
    let facitems = null;
    /*
     * the <li> elements are different depending on whether we have multiselect
     * facets. If so, we use checkboxes to make this obvious. Otherwise, we
     * use links.
     */
    if (multiselect) {
      facitems = facets.map((x) => {
        const key = "facet_" + x.filter;
        const handler = (event) => {
          event.preventDefault();
          this.setFilter(event.target.value, event.target.checked);
        };
        return <li key={key}>
          <input id={key} type="checkbox" onChange={handler}
           value={x.filter} checked={x.selected}/>{" "}
          <label for={key}>{x.label}</label>
        </li>;
      });
    } else {
      facitems = facets.map((x) => {
        const key = "facet_" + x.filter;
        if (x.selected) {
          return <li key={key}><label className="app_bold">{x.label}</label></li>;
        } else {
          const handler = (event) => {
            event.preventDefault();
            this.setFilter(x.filter, true);
          };
          return <li key={key}>
            <a href="#" onClick={handler}><label>{x.label}</label></a>
          </li>;
        }
      });
    }

    /*
     * the "any" link should only be active when a facet is selected
     */
    const any = facets.find(x => x.selected) === undefined ?
      <em>any</em> :
      <a href="#"><em>any</em></a>;

    return <ul className="app_ul">
      {facitems}
      <li>{any}</li>
    </ul>;
  }

  setFilter(filter, apply) {
    if (this.props.onSetFilter) {
      this.props.onSetFilter(filter, apply);
    }
  }
}

FacetList.propTypes = {
  multiselect: PropTypes.bool,
  facets: PropTypes.arrayOf(PropTypes.shape({
    label: PropTypes.string,
    filter: PropTypes.string,
    selected: PropTypes.bool
  })),
  onSetFilter: PropTypes.func
};

export default FacetList;<commit_msg>wired up *any* link<commit_after>import React, { Component, PropTypes } from 'react';

/*
 * A component implementing a simple facet list.
 *
 * props should be like:
 *    onSetFilter = callback function for setting a filter
 *    multiselect = true|false (defaults to false)
 *    facets = [
 *        { label, filter, selected }
 *    ]
 *
 * filter should be unique for each facet
 */

class FacetList extends Component {
  render() {
    const facets = this.props.facets;
    const multiselect = this.props.multiselect;
    let facitems = null;
    /*
     * the <li> elements are different depending on whether we have multiselect
     * facets. If so, we use checkboxes to make this obvious. Otherwise, we
     * use links.
     */
    if (multiselect) {
      facitems = facets.map((x) => {
        const key = "facet_" + x.filter;
        const handler = (event) => {
          event.preventDefault();
          this.setFilter(event.target.value, event.target.checked);
        };
        return <li key={key}>
          <input id={key} type="checkbox" onChange={handler}
           value={x.filter} checked={x.selected}/>{" "}
          <label for={key}>{x.label}</label>
        </li>;
      });
    } else {
      facitems = facets.map((x) => {
        const key = "facet_" + x.filter;
        if (x.selected) {
          return <li key={key}><label className="app_bold">{x.label}</label></li>;
        } else {
          const handler = (event) => {
            event.preventDefault();
            this.setFilter(x.filter, true);
          };
          return <li key={key}>
            <a href="#" onClick={handler}><label>{x.label}</label></a>
          </li>;
        }
      });
    }

    /*
     * the "any" link should only be active when a facet is selected
     */
    const any = facets.find(x => x.selected) === undefined ?
      <em>any</em> :
      <a href="#" onClick={this.unsetAll.bind(this)}><em>any</em></a>;

    return <ul className="app_ul">
      {facitems}
      <li>{any}</li>
    </ul>;
  }

  setFilter(filter, apply) {
    if (this.props.onSetFilter) {
      this.props.onSetFilter(filter, apply);
    }
  }

  unsetAll(event) {
    event.preventDefault();
    this.props.facets.forEach((fac) => {
      if (fac.selected) {
        console.log("unsetting " + fac.filter);
        this.setFilter(fac.filter, false);
      }
    });
  }
}

FacetList.propTypes = {
  multiselect: PropTypes.bool,
  facets: PropTypes.arrayOf(PropTypes.shape({
    label: PropTypes.string,
    filter: PropTypes.string,
    selected: PropTypes.bool
  })),
  onSetFilter: PropTypes.func
};

export default FacetList;
{'fraction_non_alphanumeric': 0.14965986394557823, 'fraction_numerical': 0.0, 'mean_word_length': 2.2609262883235486, 'pattern_counts': {'":': 0, '<': 55, '<?xml version=': 0, '>': 66, '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': '5807003', 'n_tokens_mistral': 1557, 'n_tokens_neox': 1550, 'n_words': 372}