From 8a4a594dd0232a8aaf0f5a44ee158b8132a27376 Mon Sep 17 00:00:00 2001
From: Jordan Eldredge <jordan@jordaneldredge.com>
Date: Thu, 2 May 2019 16:52:43 -0700
Subject: [PATCH] Change nesting to preserve playlist styling

The `#playlist-window` div is a flex container so it needs to be the direct parent.
---
 .../__snapshots__/index.test.js.snap          | 32 +++++++++----------
 js/components/PlaylistWindow/index.tsx        | 20 ++++++------
 2 files changed, 26 insertions(+), 26 deletions(-)

diff --git a/js/components/PlaylistWindow/__snapshots__/index.test.js.snap b/js/components/PlaylistWindow/__snapshots__/index.test.js.snap
index d99b6064..4adf105d 100644
--- a/js/components/PlaylistWindow/__snapshots__/index.test.js.snap
+++ b/js/components/PlaylistWindow/__snapshots__/index.test.js.snap
@@ -2,32 +2,32 @@
 
 exports[`PlaylistWindow renders to snapshot 1`] = `
 <div
-  className="window draggable"
-  id="playlist-window"
-  onDragEnter={[Function]}
-  onDragOver={[Function]}
-  onDragStart={[Function]}
-  onDrop={[Function]}
-  onWheel={[Function]}
+  onFocus={[Function]}
   style={
     Object {
-      "backgroundColor": "#000000",
-      "color": "#00FF00",
-      "fontFamily": "Arial, Arial, sans-serif",
-      "height": "116px",
-      "width": "275px",
+      "height": "100%",
+      "width": "100%",
     }
   }
+  tabIndex={-1}
 >
   <div
-    onFocus={[Function]}
+    className="window draggable"
+    id="playlist-window"
+    onDragEnter={[Function]}
+    onDragOver={[Function]}
+    onDragStart={[Function]}
+    onDrop={[Function]}
+    onWheel={[Function]}
     style={
       Object {
-        "height": "100%",
-        "width": "100%",
+        "backgroundColor": "#000000",
+        "color": "#00FF00",
+        "fontFamily": "Arial, Arial, sans-serif",
+        "height": "116px",
+        "width": "275px",
       }
     }
-    tabIndex={-1}
   >
     <div
       className="playlist-top draggable"
diff --git a/js/components/PlaylistWindow/index.tsx b/js/components/PlaylistWindow/index.tsx
index 40033c84..78a15104 100644
--- a/js/components/PlaylistWindow/index.tsx
+++ b/js/components/PlaylistWindow/index.tsx
@@ -103,14 +103,14 @@ class PlaylistWindow extends React.Component<Props> {
     const showSpacers = playlistSize[0] % 2 === 0;
 
     return (
-      <DropTarget
-        id="playlist-window"
-        className={classes}
-        style={style}
-        handleDrop={this._handleDrop}
-        onWheel={this.props.scrollVolume}
-      >
-        <FocusTarget windowId={WINDOWS.PLAYLIST}>
+      <FocusTarget windowId={WINDOWS.PLAYLIST}>
+        <DropTarget
+          id="playlist-window"
+          className={classes}
+          style={style}
+          handleDrop={this._handleDrop}
+          onWheel={this.props.scrollVolume}
+        >
           <div className="playlist-top draggable" onDoubleClick={toggleShade}>
             <div className="playlist-top-left draggable" />
             {showSpacers && (
@@ -170,8 +170,8 @@ class PlaylistWindow extends React.Component<Props> {
               <PlaylistResizeTarget />
             </div>
           </div>
-        </FocusTarget>
-      </DropTarget>
+        </DropTarget>
+      </FocusTarget>
     );
   }
 }