<commit_before>import React, {Component} from 'react'
import PropTypes from 'prop-types'
import AvailableProject from './AvailableProject'
import Messages from '../../common/messages/Messages'
import Input from '../../common/forms/Input'
import Shortcut from '../../common/Shortcut'
import Refresh from './Refresh'
import _ from 'lodash'
import styles from './available-projects.scss'
import {isBlank} from '../../common/Utils'
import VisuallyHidden from '../../common/VisuallyHidden'

const DEFAULT_STATE = {
  filter: null,
  filterErrors: null,
  disableButtons: false
}

class AvailableProjects extends Component {
  constructor(props) {
    super(props)
    this.state = {...DEFAULT_STATE}
    this.rootNode = React.createRef()
  }

  includeAll = () => {
    this.props.projects
      .filter((project) => !project.removed)
      .forEach((project) => this.props.selectProject(this.props.trayId, project.projectId, true))
  }

  excludeAll = () => {
    this.props.projects.forEach((project) => {
      this.props.selectProject(this.props.trayId, project.projectId, false)
    })
  }

  updateFilter = (evt) => {
    if (isBlank(evt.target.value)) {
      this.setState({...DEFAULT_STATE})
    } else {
      try {
        const regEx = new RegExp(evt.target.value)
        this.setState({
          filter: regEx,
          filterErrors: null,
          disableButtons: true
        })
      } catch (e) {
        this.setState({filterErrors: [`Project filter not applied, ${e.message}`]})
      }
    }
  }

  scrollToTop = () => {
    if (this.rootNode.current) {
      this.rootNode.current.scrollIntoView()
    }
  }

  refreshTray = () => {
    this.props.refreshTray(this.props.trayId)
  }

  render() {
    const filteredProjects = this.props.projects.filter((project) => {
      return this.state.filter ? `${project.name} ${project.stage || ''}`.match(this.state.filter) : true
    })

    const controls = (
      <div>
        <fieldset className={styles.toggles}>
          <legend className={styles.legend}>Available projects</legend>
          <button className={styles.includeAll}
                  onClick={this.includeAll}
                  disabled={this.state.disableButtons}
                  aria-disabled={this.state.disableButtons}
                  data-locator='include-all'>
            include all
            <Shortcut hotkeys={[`+ ${this.props.index}`, `= ${this.props.index}`]}/>
          </button>
          <button className={styles.excludeAll}
                  onClick={this.excludeAll}
                  disabled={this.state.disableButtons}
                  aria-disabled={this.state.disableButtons}>
            exclude all
            <Shortcut hotkeys={[`- ${this.props.index}`]}/>
          </button>
          <div className={styles.projectFilter}>
            <Input className={styles.projectFilterInput}
                   onChange={this.updateFilter}
                   placeholder='regular expression'>
              filter
            </Input>
          </div>
        </fieldset>
        <Messages type='error' messages={this.state.filterErrors}/>
      </div>
    )

    const buildItems = (
      <ol className={styles.buildItems}<commit_msg>includeAll & excludeAll what is visible<commit_after>import React, {Component} from 'react'
import PropTypes from 'prop-types'
import AvailableProject from './AvailableProject'
import Messages from '../../common/messages/Messages'
import Input from '../../common/forms/Input'
import Shortcut from '../../common/Shortcut'
import Refresh from './Refresh'
import _ from 'lodash'
import styles from './available-projects.scss'
import {isBlank} from '../../common/Utils'
import VisuallyHidden from '../../common/VisuallyHidden'

const DEFAULT_STATE = {
  filter: null,
  filterErrors: null
}

class AvailableProjects extends Component {
  constructor(props) {
    super(props)
    this.state = {...DEFAULT_STATE}
    this.rootNode = React.createRef()
  }

  includeAll = (projects) => () => {
    projects
      .filter((project) => !project.removed)
      .forEach((project) => this.props.selectProject(this.props.trayId, project.projectId, true))
  }

  excludeAll = (projects) => () => {
    projects
      .forEach((project) => this.props.selectProject(this.props.trayId, project.projectId, false))
  }

  updateFilter = (evt) => {
    if (isBlank(evt.target.value)) {
      this.setState({...DEFAULT_STATE})
    } else {
      try {
        const regEx = new RegExp(evt.target.value)
        this.setState({
          filter: regEx,
          filterErrors: null
        })
      } catch (e) {
        this.setState({filterErrors: [`Project filter not applied, ${e.message}`]})
      }
    }
  }

  scrollToTop = () => {
    if (this.rootNode.current) {
      this.rootNode.current.scrollIntoView()
    }
  }

  refreshTray = () => {
    this.props.refreshTray(this.props.trayId)
  }

  render() {
    const filteredProjects = this.props.projects.filter((project) => {
      return this.state.filter ? `${project.name} ${project.stage || ''}`.match(this.state.filter) : true
    })

    const controls = (
      <div>
        <fieldset className={styles.toggles}>
          <legend className={styles.legend}>Available projects</legend>
          <button className={styles.includeAll}
                  onClick={this.includeAll(filteredProjects)}
                  data-locator='include-all'>
            include all
            <Shortcut hotkeys={[`+ ${this.props.index}`, `= ${this.props.index}`]}/>
          </button>
          <button className={styles.excludeAll}
                  onClick={this.excludeAll(filteredProjects)}>
            exclude all
            <Shortcut hotkeys={[`- ${this.props.index}`]}/>
          </button>
          <div className={styles.projectFilter}>
            <Input className={styles.projectFilterInput}
                   onChange={this.updateFilter}
                   placeholder='regular expression'>
              filter
            </Input>
          </div>
        </fieldset>
        <Messages type='error' messages={this.state.filterErrors}/>
      </div>
    )

    const buildItems = (
      <ol className={styles.buildItems}
{'fraction_non_alphanumeric': 0.1450097213220998, 'fraction_numerical': 0.0, 'mean_word_length': 2.393622869708631, 'pattern_counts': {'":': 0, '<': 39, '<?xml version=': 0, '>': 57, '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': '523254', 'n_tokens_mistral': 1757, 'n_tokens_neox': 1757, 'n_words': 334}