Reorder course sort by newest terms

Fixes CNVS-32660

Test Plan:
* As an admin with multiple courses in various
  terms across different dates
* Go to any course
* Go to that course's settings
* Click "Import content into this course"
* Select "Copy a Canvas Course"
* The dropdown that appears should be prefilled
  with courses in order from newest to oldest
  terms, then alphabetically by course

Change-Id: I11d5af9da3dd6f779b816d7fd0f43b79afa8dc35
Reviewed-on: https://gerrit.instructure.com/95564
Tested-by: Jenkins
Reviewed-by: Clay Diffrient <cdiffrient@instructure.com>
QA-Review: Deepeeca Soundarrajan <dsoundarrajan@instructure.com>
Product-Review: Chris Ward <cward@instructure.com>

Author: Dan Minkevitch

app/coffeescripts/views/content_migrations/subviews/CourseFindSelectView.coffee

@@ -3,12 +3,13 @@ define [
   'Backbone'
   'underscore'
   'i18n!content_migrations'
+  'compiled/util/natcompare'
   'jst/content_migrations/subviews/CourseFindSelect'
   'jst/courses/autocomplete_item'
   'jquery.ajaxJSON'
   'jquery.disableWhileLoading'
   'jqueryui/autocomplete'
-], ($, Backbone, _, I18n, template, autocompleteItemTemplate) ->
+], ($, Backbone, _, I18n, natcompare, template, autocompleteItemTemplate) ->
   class CourseFindSelectView extends Backbone.View
     @optionProperty 'current_user_id', 'show_select'
     template: template
@@ -28,7 +29,14 @@ define [
       @$el.disableWhileLoading dfd
       dfd.done (data) =>
         @courses = data
-        @coursesByTerms = _.groupBy data, (course) -> course.term
+        @coursesByTerms = _.chain(@courses)
+          .groupBy((course) ->
+            course.term
+          ).map((value, key) ->
+            {term: key, courses: value.sort(natcompare.byKey('label'))}
+          ).sort((a, b) ->
+            new Date(b.courses[0].enrollment_start) - new Date(a.courses[0].enrollment_start)
+          ).value()
         super
 
     afterRender: ->

app/views/jst/content_migrations/subviews/CourseFindSelect.handlebars

@@ -4,13 +4,13 @@
   {{#if show_select}}
     <select id="courseSelect" class="span3">
       <option value="default">{{#t "select_default"}}Select a course{{/t}}</option>
-       {{#eachProp terms}}
-       <optgroup label="{{property}}">
-           {{#each value}}
+       {{#each terms}}
+       <optgroup label="{{term}}">
+           {{#each courses}}
              <option value="{{id}}">{{label}}</option>
            {{/each}}
          </optgroup>
-       {{/eachProp}}
+       {{/each}}
     </select>
     {{#t "or"}}or{{/t}}
   {{/if}}
@@ -25,5 +25,3 @@
     {{#t 'include_completed_courses'}}Include completed courses{{/t}}
   </label>
 </div>
-
-

spec/coffeescripts/views/content_migrations/subviews/CourseFindSelectViewSpec.coffee

@@ -1,12 +1,55 @@
 define [
   'Backbone'
   'compiled/views/content_migrations/subviews/CourseFindSelectView'
-], (Backbone, CourseFindSelectView) ->
-  module 'CourseFindSelectView: #setSourceCourseId'
+  'helpers/fakeENV'
+  'underscore'
+], (Backbone, CourseFindSelectView, fakeENV, _) ->
+  module 'CourseFindSelectView: #setSourceCourseId',
+    setup: ->
+      fakeENV.setup()
+      @url = '/users/101/manageable_courses'
+      @server = sinon.fakeServer.create()
+      @courses = [
+        {
+          "id": 5,
+          "term": "Default Term",
+          "label": "A",
+          "enrollment_start": null
+        },
+        {
+          "id": 4,
+          "term": "Spring 2016",
+          "label": "B",
+          "enrollment_start": "2016-01-01T07:00:00Z"
+        },
+        {
+          "id": 3,
+          "term": "Spring 2016",
+          "label": "A",
+          "enrollment_start": "2016-01-01T07:00:00Z"
+        },
+        {
+          "id": 2,
+          "term": "Fall 2016",
+          "label": "B",
+          "enrollment_start": "2016-10-01T09:00:00Z"
+        },
+        {
+          "id": 1,
+          "term": "Fall 2016",
+          "label": "A",
+          "enrollment_start": "2016-10-01T09:00:00Z"
+        }
+      ]
+      @server.respondWith('GET', @url, [200, { "Content-Type": "application/json" }, JSON.stringify(@courses)])
+
+    teardown: ->
+      fakeENV.teardown()
+      @server.restore()
+
   test 'Triggers "course_changed" when course is found by its id', ->
     courseFindSelectView = new CourseFindSelectView
-                           model: new Backbone.Model
-
+      model: new Backbone.Model
 
     course = {id: 42}
     courseFindSelectView.courses = [course]
@@ -16,3 +59,27 @@ define [
     courseFindSelectView.setSourceCourseId 42
 
     ok sinonSpy.calledWith('course_changed', course), "Triggered course_changed with a course"
+
+  test 'Sorts courses by most recent term to least, then alphabetically', ->
+    courseFindSelectView = new CourseFindSelectView
+      model: new Backbone.Model,
+      current_user_id: 101
+
+    courseFindSelectView.courses = @courses
+    courseFindSelectView.render()
+    @server.respond()
+
+    # Gets the array of arrays (terms) of course objects
+    sortedCourses = courseFindSelectView.toJSON().terms
+
+    # Gets the courses in grouped arrays
+    # with each group corresponding to the term,
+    # then flattens by ID in the order they
+    # should be in
+    groupedIds = sortedCourses.map((item) -> item.courses.map((course) -> course.id))
+    result = [].concat.apply([], groupedIds)
+
+    # Array of ordered IDs from @courses
+    expected = [1, 2, 3, 4, 5]
+
+    ok _.isEqual(result, expected)