     CourseStore.off('course.loaded', @selectPeriod)
 
   componentWillReceiveProps: (nextProps) ->
+    {tab} = @context.router.getCurrentQuery()
+    unless _.isUndefined(tab)
+      tab = parseInt(tab, 10)
+      @updateTabSelectionState(tab)
     @setSortedPeriods(nextProps.periods)
 
   setSortedPeriods: (periods) ->


  selectPeriod: (courseId) ->
    if courseId is @props.courseId
      @onSelect(@state.active)

  onSelect: (key) ->
    {courseId, handleSelect} = @props
    {sortedPeriods} = @state

    period = sortedPeriods?[key]
    unless period?
      throw new Error("BUG: #{key} period does not exist for course #{courseId}. There are only #{periods.length}.")
      return

    @setState(active: key)
    handleSelect?(period, key)

  renderPeriod: (period, key) ->
    className = classnames({'is-trouble': period.is_trouble})

    {afterTabsItem} = @props
    periodsItems = _.map(sortedPeriods, @renderPeriod)

    <BS.Nav bsStyle='tabs' activeKey={active} onSelect={@onTabSelection}>
      {periodsItems}
      {afterTabsItem?()}
    </BS.Nav>
