<commit_before>import React, {PropTypes, Component} from 'react'
import {connect} from 'react-redux'
import createImmutableSelector from '../../../../utils/ImmutableSelect'
import {fromJS} from 'immutable'
import R from 'ramda'
import * as Constants from '../../../../constants/ComponentTypes'
import {fetchAudiences, selectAudience} from '../../../../actions/Audience'
import {Drawer} from '../../../../components/Drawer'
import {List} from '../../../../components/List'
import {ListItemLink} from '../../../../components/list/ListItem';
import {Icon} from '../../../../components/Icon'
import CreateAudience from './CreateAudience'

const filterAudiences = (audiences, exerciseId) => {
  let filterByExercise = n => n.audience_exercise === exerciseId
  let filteredAudiences = R.filter(filterByExercise, audiences.toJS())
  filteredAudiences = fromJS(filteredAudiences)
  filteredAudiences = filteredAudiences.sort(
    (a, b) => a.get('audience_name').localeCompare(b.get('audience_name'))
  )
  return filteredAudiences
}

class AudienceNav extends Component {
  componentDidMount() {
    this.props.fetchAudiences(this.props.exerciseId);
  }

  handleChangeAudience(audienceId) {
    this.props.selectAudience(this.props.exerciseId, audienceId)
  }

  componentWillReceiveProps(nextProps) {
    let audiences = filterAudiences(nextProps.audiences, nextProps.exerciseId)
    if(nextProps.currentAudience === undefined && audiences.count() > 0) {
      this.props.selectAudience(nextProps.exerciseId, audiences.keySeq().first())
    }
  }

  render() {
    return (
      <Drawer width={300} docked={true} open={true} openSecondary={true} zindex={50}>
        <CreateAudience exerciseId={this.props.exerciseId}/>
        <List>
          {this.props.audiences.toList().map(audience => {
            return (
              <ListItemLink
                key={audience.get('audience_id')}
                active={this.props.currentAudience === audience.get('audience_id')}
                onClick={this.handleChangeAudience.bind(this, audience.get('audience_id'))}
                label={audience.get('audience_name')}
                leftIcon={<Icon name={Constants.ICON_NAME_SOCIAL_GROUP}/>}
              />
            )
          })}
        </List>
      </Drawer>
    );
  }
}

AudienceNav.propTypes = {
  exerciseId: PropTypes.string,
  currentAudience: PropTypes.string,
  audiences: PropTypes.object,
  fetchAudiences: PropTypes.func,
  selectAudience: PropTypes.func
}

const filteredAudiences = createImmutableSelector(
  (state, props) => filterAudiences(state.application.getIn(['entities', 'audiences']), props.exerciseId),
  audiences => audiences)

const select = (state, props) => {
  return {
    audiences: filteredAudiences(state, props),
    currentAudience: state.application.getIn(['ui', 'states', 'current_audiences', props.exerciseId])
  }<commit_msg>Audiences select no longer on immutableComparison<commit_after>import React, {PropTypes, Component} from 'react'
import {connect} from 'react-redux'
import {fromJS} from 'immutable'
import R from 'ramda'
import * as Constants from '../../../../constants/ComponentTypes'
import {fetchAudiences, selectAudience} from '../../../../actions/Audience'
import {Drawer} from '../../../../components/Drawer'
import {List} from '../../../../components/List'
import {ListItemLink} from '../../../../components/list/ListItem';
import {Icon} from '../../../../components/Icon'
import CreateAudience from './CreateAudience'

class AudienceNav extends Component {
  componentDidMount() {
    this.props.fetchAudiences(this.props.exerciseId);
  }

  handleChangeAudience(audienceId) {
    this.props.selectAudience(this.props.exerciseId, audienceId)
  }

  componentWillReceiveProps(nextProps) {
    let audiences = filterAudiences(nextProps.audiences, nextProps.exerciseId)
    if(nextProps.currentAudience === undefined && audiences.count() > 0) {
      this.props.selectAudience(nextProps.exerciseId, audiences.keySeq().first())
    }
  }

  render() {
    return (
      <Drawer width={300} docked={true} open={true} openSecondary={true} zindex={50}>
        <CreateAudience exerciseId={this.props.exerciseId}/>
        <List>
          {this.props.audiences.toList().map(audience => {
            return (
              <ListItemLink
                key={audience.get('audience_id')}
                active={this.props.currentAudience === audience.get('audience_id')}
                onClick={this.handleChangeAudience.bind(this, audience.get('audience_id'))}
                label={audience.get('audience_name')}
                leftIcon={<Icon name={Constants.ICON_NAME_SOCIAL_GROUP}/>}
              />
            )
          })}
        </List>
      </Drawer>
    );
  }
}

AudienceNav.propTypes = {
  exerciseId: PropTypes.string,
  currentAudience: PropTypes.string,
  audiences: PropTypes.object,
  fetchAudiences: PropTypes.func,
  selectAudience: PropTypes.func
}

const filterAudiences = (audiences, exerciseId) => {
  let filterByExercise = n => n.audience_exercise === exerciseId
  let filteredAudiences = R.filter(filterByExercise, audiences.toJS())
  filteredAudiences = fromJS(filteredAudiences)
  filteredAudiences = filteredAudiences.sort(
    (a, b) => a.get('audience_name').localeCompare(b.get('audience_name'))
  )
  return filteredAudiences
}

const select = (state, props) => {
  return {
    audiences: filterAudiences(state.application.getIn(['entities', 'audiences']), props.exerciseId),
    currentAudience: state.application.getIn(['ui', 'states', 'current_audiences', props.exerciseId])
  }
{'fraction_non_alphanumeric': 0.15124395919097905, 'fraction_numerical': 0.0021478432074458565, 'mean_word_length': 3.4704, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 31, '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': '3870742', 'n_tokens_mistral': 1681, 'n_tokens_neox': 1640, 'n_words': 296}