very basic tab sorting

src/packages/tabs/src/tab.coffee

@@ -4,7 +4,7 @@ fs = require 'fs'
 module.exports =
 class Tab extends View
   @content: (editSession) ->
-    @li class: 'tab', =>
+    @li class: 'tab sortable', =>
       @span class: 'file-name', outlet: 'fileName'
       @span class: 'close-icon'
 

src/packages/tabs/src/tabs-view.coffee

@@ -1,11 +1,9 @@
 $ = require 'jquery'
-{View} = require 'space-pen'
+SortableView = require 'sortable-view'
 Tab = require 'tabs/src/tab'
 
 module.exports =
-class Tabs extends View
-  dndType: 'text/x-atom-tab'
-
+class Tabs extends SortableView
   @activate: (rootView) ->
     rootView.eachEditor (editor) =>
       @prependToEditorPane(rootView, editor) if editor.attached
@@ -18,6 +16,8 @@ class Tabs extends View
     @ul class: 'tabs'
 
   initialize: (@editor) ->
+    super
+
     for editSession, index in @editor.editSessions
       @addTabForEditSession(editSession)
 
@@ -35,26 +35,6 @@ class Tabs extends View
       @editor.destroyEditSessionIndex(index)
       false
 
-    @on 'dragstart', '.tab', @onDragStart
-    @on 'dragend',   '.tab', @onDragEnd
-    @on 'dragenter', '.tab', @onDragEnter
-    @on 'dragleave', '.tab', @onDragLeave
-
-  onDragStart: (event) =>
-    $(event.target).addClass 'is-dragging'
-
-  onDragEnd: (event) =>
-    $(event.target).removeClass 'is-dragging'
-
-  onDragEnter: (event) =>
-    el = $(event.target)
-    el = el.closest('.tab') if !el.hasClass('tab')
-    el.addClass 'is-drop-target'
-
-  onDragLeave: (event) =>
-    el = $(event.target)
-    el.removeClass 'is-drop-target' if el.hasClass 'tab'
-
   addTabForEditSession: (editSession) ->
     @append(new Tab(editSession, @editor))