fix(drag-drop): Restore support for thread dragging

internal_packages/account-sidebar/lib/sidebar-item.coffee

@@ -80,25 +80,32 @@ class SidebarItem
       selected: isItemSelected(perspective)
       collapsed: isItemCollapsed(id) ? true
       counterStyle: counterStyle
-      dataTransferType: 'nylas-threads-data'
       onDelete: if opts.deletable then onDeleteItem else undefined
       onEdited: if opts.editable then onEditItem else undefined
       onCollapseToggled: toggleItemCollapsed
+
       onDrop: (item, event) ->
-        jsonString = event.dataTransfer.getData(item.dataTransferType)
+        jsonString = event.dataTransfer.getData('nylas-threads-data')
-        data = Utils.jsonParse(jsonString)
+        jsonData = null
-        return unless data
+        try
-        item.perspective.receiveThreads(data.threadIds)
+          jsonData = JSON.parse(jsonString)
+        catch err
+          console.error("JSON parse error: #{err}")
+        return unless jsonData
+        item.perspective.receiveThreads(jsonData.threadIds)
+
       shouldAcceptDrop: (item, event) ->
         target = item.perspective
         current = FocusedPerspectiveStore.current()
-        jsonString = event.dataTransfer.getData(item.dataTransferType)
+        return false unless event.dataTransfer.types.includes('nylas-threads-data')
-        data = Utils.jsonParse(jsonString)
-        return false unless data
-        return false unless target
         return false if target.isEqual(current)
-        return false unless target.canReceiveThreadsFromAccountIds(data.accountIds)
+
-        return item.dataTransferType in event.dataTransfer.types
+        # We can't inspect the drag payload until drop, so we use a dataTransfer
+        # type to encode the account IDs of threads currently being dragged.
+        accountsType = event.dataTransfer.types.find((t) => t.startsWith('nylas-accounts='))
+        accountIds = (accountsType || "").replace('nylas-accounts=', '').split(',')
+        return target.canReceiveThreadsFromAccountIds(accountIds)
+
       onSelect: (item) ->
         Actions.focusMailboxPerspective(item.perspective)
     }, opts)

internal_packages/preferences/lib/tabs/update-channel-section.jsx

@@ -70,7 +70,7 @@ class UpdateChannelSection extends React.Component {
         >
           {
             available.map((channel) => {
-              return (<option value={channel.name}>
+              return (<option value={channel.name} key={channel.name}>
                 {channel.name[0].toUpperCase() + channel.name.substr(1)}
               </option>);
             })

internal_packages/thread-list/lib/thread-list.cjsx

@@ -197,7 +197,8 @@ class ThreadList extends React.Component
 
     canvas = CanvasUtils.canvasWithThreadDragImage(data.threadIds.length)
     event.dataTransfer.setDragImage(canvas, 10, 10)
-    event.dataTransfer.setData('nylas-threads-data', JSON.stringify(data))
+    event.dataTransfer.setData("nylas-threads-data", JSON.stringify(data))
+    event.dataTransfer.setData("nylas-accounts=#{data.accountIds.join(',')}", "1")
     return
 
   _onDragEnd: (event) =>

src/canvas-utils.coffee

@@ -3,11 +3,13 @@ ThreadDragImage.src = """data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgC
 
 DragCanvas = document.createElement("canvas")
 DragCanvas.style.position = "absolute"
+DragCanvas.style.zIndex = 0
 document.body.appendChild(DragCanvas)
 
 PercentLoadedCache = {}
 PercentLoadedCanvas = document.createElement("canvas")
 PercentLoadedCanvas.style.position = "absolute"
+PercentLoadedCanvas.style.zIndex = 0
 document.body.appendChild(PercentLoadedCanvas)
 
 SystemTrayCanvas = document.createElement("canvas")

src/flux/models/utils.coffee

@@ -514,15 +514,6 @@ Utils =
         fn.apply(@, [fnFinished, fnReinvoked, arguments...])
     fnRun
 
-  # Parse json without throwing an error. Logs a sensible message to indicate
-  # the error occurred while parsing
-  jsonParse: (jsonString) =>
-    data = null
-    try
-      data = JSON.parse(jsonString)
-    catch err
-      console.error("JSON parse error: #{err}")
-    return data
 
   hueForString: (str='') ->
     str.split('').map((c) -> c.charCodeAt()).reduce((n,a) -> n+a) % 360