<commit_before>import './MusicChartSelectorItem.scss'

import Icon from 'react-fa'
import React from 'react'
import PropTypes from 'prop-types'
import c from 'classnames'

class MusicChartSelectorItem extends React.Component {
  static propTypes = {
    chart: PropTypes.object.isRequired,
    isSelected: PropTypes.bool,
    isReplayable: PropTypes.bool,
    isTutorial: PropTypes.number,
    onChartClick: PropTypes.func.isRequired,
  }

  render() {
    let classes = c('MusicChartSelectorItem', {
      'is-active': this.props.isSelected,
      'is-replayable': this.props.isReplayable,
      'is-tutorial': this.props.isTutorial,
      'is-insane': this.props.chart.info.difficulty >= 5,
      'is-5keys': this.props.chart.keys === '5K',
    })
    return (
      <li
        className={classes}
        onClick={this.handleClick}
        data-testid={this.props.isSelected ? 'play-selected-chart' : undefined}
      >
        {this.props.isTutorial ? (
          this.props.chart.keys === '5K' ? (
            'Start Tutorial (5 keys)'
          ) : (
            'Start Tutorial (7 keys)'
          )
        ) : (
          <span className='MusicChartSelectorItemのlevel'>
            {this.props.chart.info.level}
          </span>
        )}
        <span className='MusicChartSelectorItemのplay'>
          <Icon name='play' />
        </span>
      </li>
    )
  }

  handleClick = () => {
    this.props.onChartClick(this.props.chart)
  }<commit_msg>:ok_hand: Reduce complexity in MusicChartSelectorItem<commit_after>import './MusicChartSelectorItem.scss'

import Icon from 'react-fa'
import React from 'react'
import PropTypes from 'prop-types'
import c from 'classnames'

class MusicChartSelectorItem extends React.Component {
  static propTypes = {
    chart: PropTypes.object.isRequired,
    isSelected: PropTypes.bool,
    isReplayable: PropTypes.bool,
    isTutorial: PropTypes.number,
    onChartClick: PropTypes.func.isRequired,
  }

  render() {
    let classes = c('MusicChartSelectorItem', {
      'is-active': this.props.isSelected,
      'is-replayable': this.props.isReplayable,
      'is-tutorial': this.props.isTutorial,
      'is-insane': this.props.chart.info.difficulty >= 5,
      'is-5keys': this.props.chart.keys === '5K',
    })
    return (
      <li
        className={classes}
        onClick={this.handleClick}
        data-testid={this.props.isSelected ? 'play-selected-chart' : undefined}
      >
        {this.renderText()}
        <span className='MusicChartSelectorItemのplay'>
          <Icon name='play' />
        </span>
      </li>
    )
  }
  renderText() {
    if (this.props.isTutorial) {
      const gameMode = this.props.chart.keys === '5K' ? '5 keys' : '7 keys'
      return `Start Tutorial (${gameMode})`
    }
    return (
      <span className='MusicChartSelectorItemのlevel'>
        {this.props.chart.info.level}
      </span>
    )
  }
  handleClick = () => {
    this.props.onChartClick(this.props.chart)
  }
{'fraction_non_alphanumeric': 0.13515335355578026, 'fraction_numerical': 0.004044489383215369, 'mean_word_length': 2.610705596107056, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 21, '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': '1441958', 'n_tokens_mistral': 941, 'n_tokens_neox': 938, 'n_words': 170}