<commit_before>import React, { PropTypes } from 'react'
import AppLayout from 'layouts/AppLayout'
import PaddedList from 'components/PaddedList'
import QueueItem from './QueueItem'

class QueueView extends React.Component {
  static propTypes = {
    queue: PropTypes.object.isRequired,
    artists: PropTypes.object.isRequired,
    songs: PropTypes.object.isRequired,
    errors: PropTypes.object,
    curId: PropTypes.number,
    curPos: PropTypes.number,
    isAtQueueEnd: PropTypes.bool.isRequired,
    user: PropTypes.object.isRequired,
    // actions
    requestPlay: PropTypes.func.isRequired,
    requestPlayNext: PropTypes.func.isRequired,
    requestPause: PropTypes.func.isRequired,
  }

  rowRenderer = this.rowRenderer.bind(this)
  rowHeight = this.rowHeight.bind(this)
  setRef = this.setRef.bind(this)

  componentDidUpdate(prevProps) {
    // nuclear option
    this.ref.recomputeRowHeights()
    this.ref.forceUpdate()
  }

  render() {
    return (
      <AppLayout title="Queue">
        {(style) => (
          <PaddedList
            {...style}
            queuedSongIds={this.props.queue.result} // pass-through forces List refresh
            rowCount={this.props.queue.result.length}
            rowHeight={this.rowHeight}
            rowRenderer={this.rowRenderer}
            onRef={this.setRef}
          />
        )}
      </AppLayout>
    )
  }

  rowRenderer({index, key, style}) {
    const item = this.props.queue.entities[this.props.queue.result[index]]
    const song = this.props.songs.entities[item.songId]
    const queueId = item.queueId

    const isActive = (queueId === this.props.curId) && !this.props.isAtQueueEnd
    const isUpcoming = queueId > this.props.curId
    const isOwner = item.userId === this.props.user.userId
    const isAdmin = this.props.user.isAdmin === 1

    return (
      <QueueItem
        artist={this.props.artists.entities[song.artistId].name}
        title={song.title}<commit_msg>Pass extra props to force List redraw instead of using componentDidUpdate()<commit_after>import React, { PropTypes } from 'react'
import AppLayout from 'layouts/AppLayout'
import PaddedList from 'components/PaddedList'
import QueueItem from './QueueItem'

class QueueView extends React.Component {
  static propTypes = {
    queue: PropTypes.object.isRequired,
    artists: PropTypes.object.isRequired,
    songs: PropTypes.object.isRequired,
    errors: PropTypes.object,
    curId: PropTypes.number,
    curPos: PropTypes.number,
    isAtQueueEnd: PropTypes.bool.isRequired,
    user: PropTypes.object.isRequired,
    // actions
    requestPlay: PropTypes.func.isRequired,
    requestPlayNext: PropTypes.func.isRequired,
    requestPause: PropTypes.func.isRequired,
  }

  rowRenderer = this.rowRenderer.bind(this)
  rowHeight = this.rowHeight.bind(this)
  setRef = this.setRef.bind(this)

  render() {
    return (
      <AppLayout title="Queue">
        {(style) => (
          <PaddedList
            {...style}
            rowCount={this.props.queue.result.length}
            rowHeight={this.rowHeight}
            rowRenderer={this.rowRenderer}
            onRef={this.setRef}
            queuedSongIds={this.props.queue.result} // pass-through forces List refresh
            curId={this.props.curId} // pass-through forces List refresh
            curPos={this.props.curPos} // pass-through forces List refresh
            errors={this.props.errors} // pass-through forces List refresh
          />
        )}
      </AppLayout>
    )
  }

  rowRenderer({index, key, style}) {
    const item = this.props.queue.entities[this.props.queue.result[index]]
    const song = this.props.songs.entities[item.songId]
    const queueId = item.queueId

    const isActive = (queueId === this.props.curId) && !this.props.isAtQueueEnd
    const isUpcoming = queueId > this.props.curId
    const isOwner = item.userId === this.props.user.userId
    const isAdmin = this.props.user.isAdmin === 1

    return (
      <QueueItem
        artist={this.props.artists.entities[song.artistId].name}
        title={song.title}
{'fraction_non_alphanumeric': 0.11515748031496063, 'fraction_numerical': 0.0004921259842519685, 'mean_word_length': 2.897411313518696, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 13, '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': '2637004', 'n_tokens_mistral': 1218, 'n_tokens_neox': 1231, 'n_words': 233}