From 2b91e8a0dfc17d9cd044b8c043803ff83f37c8a1 Mon Sep 17 00:00:00 2001
From: Jordan Eldredge <jordan@jordaneldredge.com>
Date: Wed, 10 Oct 2018 20:34:41 -0700
Subject: [PATCH] Type playlist shade

---
 .../{PlaylistShade.js => PlaylistShade.tsx}   | 33 +++++++++++++++----
 1 file changed, 27 insertions(+), 6 deletions(-)
 rename js/components/PlaylistWindow/{PlaylistShade.js => PlaylistShade.tsx} (76%)

diff --git a/js/components/PlaylistWindow/PlaylistShade.js b/js/components/PlaylistWindow/PlaylistShade.tsx
similarity index 76%
rename from js/components/PlaylistWindow/PlaylistShade.js
rename to js/components/PlaylistWindow/PlaylistShade.tsx
index fddddf7f..8e6596bf 100644
--- a/js/components/PlaylistWindow/PlaylistShade.js
+++ b/js/components/PlaylistWindow/PlaylistShade.tsx
@@ -19,8 +19,23 @@ import {
 import { togglePlaylistShadeMode, closeWindow } from "../../actionCreators";
 import CharacterString from "../CharacterString";
 import PlaylistResizeTarget from "./PlaylistResizeTarget";
+import { AppState, WindowId, Dispatch } from "../../types";
 
-class PlaylistShade extends React.Component {
+interface StateProps {
+  name: string | null;
+  length: number | null;
+  playlistSize: [number, number];
+  focused: WindowId;
+  trackOrder: number[];
+}
+
+interface DispatchProps {
+  focusPlaylist: () => void;
+  close: () => void;
+  toggleShade: () => void;
+}
+
+class PlaylistShade extends React.Component<StateProps & DispatchProps> {
   _addedWidth() {
     return this.props.playlistSize[0] * WINDOW_RESIZE_SEGMENT_WIDTH;
   }
@@ -81,13 +96,19 @@ class PlaylistShade extends React.Component {
   }
 }
 
-const mapDispatchToProps = {
-  focusPlaylist: () => ({ type: SET_FOCUSED_WINDOW, window: WINDOWS.PLAYLIST }),
-  close: () => closeWindow("playlist"),
-  toggleShade: () => togglePlaylistShadeMode()
+const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => {
+  return {
+    focusPlaylist: () =>
+      dispatch({
+        type: SET_FOCUSED_WINDOW,
+        window: WINDOWS.PLAYLIST
+      }),
+    close: () => dispatch(closeWindow("playlist")),
+    toggleShade: () => dispatch(togglePlaylistShadeMode())
+  };
 };
 
-const mapStateToProps = state => {
+const mapStateToProps = (state: AppState): StateProps => {
   const {
     windows: { focused },
     media: { length }