From e33c10b61ea07d1bd63b850938e98929e542ab0b Mon Sep 17 00:00:00 2001
From: Ben Gotow <bengotow@gmail.com>
Date: Tue, 20 Sep 2016 15:48:15 -0700
Subject: [PATCH] fix(drag-drop): Restore support for thread dragging

---
 .../account-sidebar/lib/sidebar-item.coffee   | 29 ++++++++++++-------
 .../lib/tabs/update-channel-section.jsx       |  2 +-
 .../thread-list/lib/thread-list.cjsx          |  3 +-
 src/canvas-utils.coffee                       |  2 ++
 src/flux/models/utils.coffee                  |  9 ------
 5 files changed, 23 insertions(+), 22 deletions(-)

diff --git a/internal_packages/account-sidebar/lib/sidebar-item.coffee b/internal_packages/account-sidebar/lib/sidebar-item.coffee
index 3d178589c..0e0c55051 100644
--- a/internal_packages/account-sidebar/lib/sidebar-item.coffee
+++ b/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)
-        data = Utils.jsonParse(jsonString)
-        return unless data
-        item.perspective.receiveThreads(data.threadIds)
+        jsonString = event.dataTransfer.getData('nylas-threads-data')
+        jsonData = null
+        try
+          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)
-        data = Utils.jsonParse(jsonString)
-        return false unless data
-        return false unless target
+        return false unless event.dataTransfer.types.includes('nylas-threads-data')
         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)
diff --git a/internal_packages/preferences/lib/tabs/update-channel-section.jsx b/internal_packages/preferences/lib/tabs/update-channel-section.jsx
index 9d8cda528..9434c821b 100644
--- a/internal_packages/preferences/lib/tabs/update-channel-section.jsx
+++ b/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>);
             })
diff --git a/internal_packages/thread-list/lib/thread-list.cjsx b/internal_packages/thread-list/lib/thread-list.cjsx
index 69ddd0e7b..31d6f68b3 100644
--- a/internal_packages/thread-list/lib/thread-list.cjsx
+++ b/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) =>
diff --git a/src/canvas-utils.coffee b/src/canvas-utils.coffee
index 29f2a1ca7..f9d82ed79 100644
--- a/src/canvas-utils.coffee
+++ b/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")
diff --git a/src/flux/models/utils.coffee b/src/flux/models/utils.coffee
index fbb27136a..1fff4ab86 100644
--- a/src/flux/models/utils.coffee
+++ b/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