Next Button Not Working Properly

[a-s-f]

I am not sure whats going on with my playlist player, I keep getting:
NextButton.js:56 Uncaught ReferenceError: e is not defined

The next button changes the song but is not properly changing the "is-active" class of the song. But if I click on a song then click previous button it works as expected.

I attached my main.js file where I have the playlist player code, which come from React Static BoilerPlate. I am not sure what is going on.

import 'babel-polyfill';
import 'whatwg-fetch';
import ClassNames from 'classnames';
import React, { PropTypes, Component } from 'react';
import ReactDOM from 'react-dom';
import FastClick from 'fastclick';
import { Provider } from 'react-redux';

import store from './core/store';
import router from './core/router';
import history from './core/history';
let routes = require('./routes.json'); // Loaded with utils/routes-loader.js
const container = document.getElementById('container');
import { PlayButton, PrevButton, NextButton, Progress, Icons, Timer } from 'react-soundplayer/components';
import { SoundPlayerContainer } from 'react-soundplayer/addons';

function renderComponent(component) {
  ReactDOM.render(<Provider store={store}>{component}</Provider>, container);
}

function render(location) {
  router.resolve(routes, location)
    .then(renderComponent)
    .catch(error => router.resolve(routes, { ...location, error }).then(renderComponent));
}


history.listen(render);
render(history.getCurrentLocation());

FastClick.attach(document.body);


if (module.hot) {
  module.hot.accept('./routes.json', () => {
    routes = require('./routes.json'); // eslint-disable-line global-require
    render(history.getCurrentLocation());
  });
}

const clientId = '358b0fa53153c2425022d97d00261118';
const resolveUrl = 'https://soundcloud.com/pcmus/sets/deep-trouble';


class Player extends Component {
    constructor() {
        super();

        this.state = {
            activeIndex: 0
        };
    }

    playTrackAtIndex(playlistIndex) {
        let { soundCloudAudio } = this.props;
        this.setState({activeIndex: playlistIndex});
        soundCloudAudio.play({ playlistIndex });
    }

    nextIndex() {
        let { activeIndex } = this.state;
        let { playlist } = this.props;
        if (activeIndex >= playlist.tracks.length - 1) {
            return;
        }
        if (activeIndex || activeIndex === 0) {
            this.setState({activeIndex: ++activeIndex});
        }
    }

    prevIndex() {
        let { activeIndex } = this.state;
        if (activeIndex <= 0) {
            return;
        }
        if (activeIndex || activeIndex === 0) {
            this.setState({activeIndex: --activeIndex});
        }
    }

    renderTrackList(e) {
        let { playlist } = this.props;

        if (!playlist) {
            return <div>Loading...</div>;
        }

        let tracks = playlist.tracks.map((track, i) => {
            let classNames = ClassNames('flex button button-transparent', {
                'is-active': this.state.activeIndex === i
            });

            return (
                <button
                    key={track.id}
                    className={classNames}
                    onClick={this.playTrackAtIndex.bind(this, i)}
                >
                <img src="http://vignette3.wikia.nocookie.net/logopedia/images/d/d5/ITunes_12.2_Apple_Music.png/revision/latest?cb=20150701064004" />

                    <div className="title ">{track.title}</div>
                    <br/>
                      <br/>
                    <div className="song">{track.user.username}</div>
                </button>
            );
        });

        return (
            <div>{tracks}</div>
        );
    }

    render() {
        let { playlist, currentTime, duration } = this.props;

        return (
          <div>
          <div className="control-container">
                <div className='controls'>
                <PrevButton
                    className="backward"
                    onPrevClick={this.prevIndex.bind(this)}
                    {...this.props}
                />
                <PlayButton
                    className="play flex-none h2 button button-transparent button-grow rounded"
                    {...this.props}
                />
                <NextButton
                    className="forward"
                    onNextClick={this.nextIndex.bind(this)}
                    {...this.props}
                />

              </div>
            </div>
            <div className='info'>
               {this.renderTrackList()}
          </div>

            <div className="ipod-container">
              <div id='ipod'>
                  <div id='circle' className="center-center">
                      <div id='play-pause-button'></div>
                      <div id='play-pause-button-shadow-mask'></div>
                  </div>
                  <div id='housing' className="center-center">
                      <div id='left-bezel'>
                      </div>
                      <div id='right-bezel'>
                      </div>
                  </div>
                  <div id='buttons'>
                      <div id='button1'></div>
                      <div id='button2'></div>
                  </div>
                  <div id='shadows'>
                      <div id='shadow1'></div>
                      <div id='shadow2'></div>
                      <div id='shadow3'></div>
                  </div>
              </div>
              </div>

</div>


        );
    }
}

class SCPlay extends Component {
    render() {
        return (
            <SoundPlayerContainer    clientId={clientId}
                    resolveUrl={resolveUrl}>
                <Player />
            </SoundPlayerContainer>
        );
    }
};


ReactDOM.render(<SCPlay />, document.getElementById('app'));

[a-s-f]

it was a version issue fixed by issue #48