From 58dafaffa45876ddfc30b448521d1dce2b6d11e9 Mon Sep 17 00:00:00 2001
From: Jordan Eldredge <jordan@jordaneldredge.com>
Date: Sun, 30 Dec 2018 15:54:16 -0800
Subject: [PATCH] Type MainContextMenu

---
 js/components/ContextMenu.tsx                 |  1 +
 ...MainContextMenu.js => MainContextMenu.tsx} | 46 +++++++++++++++----
 js/components/MainWindow/index.tsx            |  5 +-
 3 files changed, 40 insertions(+), 12 deletions(-)
 rename js/components/MainWindow/{MainContextMenu.js => MainContextMenu.tsx} (65%)

diff --git a/js/components/ContextMenu.tsx b/js/components/ContextMenu.tsx
index 12f93f37..a2542888 100644
--- a/js/components/ContextMenu.tsx
+++ b/js/components/ContextMenu.tsx
@@ -65,6 +65,7 @@ export const Parent = ({ children, label }: ParentProps) => (
 interface LinkNodeProps {
   label: string;
   href: string;
+  target?: string;
 }
 
 export const LinkNode = (props: LinkNodeProps) => (
diff --git a/js/components/MainWindow/MainContextMenu.js b/js/components/MainWindow/MainContextMenu.tsx
similarity index 65%
rename from js/components/MainWindow/MainContextMenu.js
rename to js/components/MainWindow/MainContextMenu.tsx
index 847dd0eb..bc86f720 100644
--- a/js/components/MainWindow/MainContextMenu.js
+++ b/js/components/MainWindow/MainContextMenu.tsx
@@ -12,8 +12,35 @@ import { Hr, Node, Parent, LinkNode } from "../ContextMenu";
 import PlaybackContextMenu from "../PlaybackContextMenu";
 import OptionsContextMenu from "../OptionsContextMenu";
 import SkinsContextMenu from "../SkinsContextMenu";
+import {
+  AppState,
+  Dispatch,
+  Track,
+  WindowId,
+  FilePicker,
+  LoadStyle
+} from "../../types";
+import { WebampWindow } from "../../reducers/windows";
 
-const MainContextMenu = props => (
+interface StateProps {
+  networkConnected: boolean;
+  genWindows: { [windowId: string]: WebampWindow };
+}
+
+interface DispatchProps {
+  close(): void;
+  openMediaFileDialog(): void;
+  loadMediaFiles(tracks: Track[], loadStyle: LoadStyle): void;
+  toggleGenWindow(windowId: WindowId): void;
+}
+
+interface OwnProps {
+  filePickers: FilePicker[];
+}
+
+type Props = StateProps & DispatchProps & OwnProps;
+
+const MainContextMenu = (props: Props) => (
   <React.Fragment>
     <LinkNode
       href="https://github.com/captbaritone/webamp"
@@ -36,7 +63,7 @@ const MainContextMenu = props => (
                   } catch (e) {
                     console.error("Error loading from file picker", e);
                   }
-                  props.loadMediaFiles(files, LOAD_STYLE.PLAY);
+                  props.loadMediaFiles(files || [], LOAD_STYLE.PLAY);
                 }}
                 label={picker.contextMenuName}
               />
@@ -67,16 +94,19 @@ const MainContextMenu = props => (
   </React.Fragment>
 );
 
-const mapStateToProps = state => ({
+const mapStateToProps = (state: AppState): StateProps => ({
   networkConnected: state.network.connected,
   genWindows: getGenWindows(state)
 });
 
-const mapDispatchToProps = {
-  close,
-  openMediaFileDialog,
-  loadMediaFiles,
-  toggleGenWindow: toggleWindow
+const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => {
+  return {
+    close: () => dispatch(close()),
+    openMediaFileDialog: () => dispatch(openMediaFileDialog()),
+    loadMediaFiles: (tracks: Track[], loadStyle: LoadStyle) =>
+      dispatch(loadMediaFiles(tracks, loadStyle)),
+    toggleGenWindow: (windowId: WindowId) => dispatch(toggleWindow(windowId))
+  };
 };
 
 export default connect(
diff --git a/js/components/MainWindow/index.tsx b/js/components/MainWindow/index.tsx
index 6d68e72b..2016e5c2 100644
--- a/js/components/MainWindow/index.tsx
+++ b/js/components/MainWindow/index.tsx
@@ -121,10 +121,7 @@ export class MainWindow extends React.Component<Props> {
             bottom
             handle={<ClickedDiv id="option" title="Winamp Menu" />}
           >
-            <MainContextMenu
-              // @ts-ignore MainContextMenu is not typed yet
-              filePickers={filePickers}
-            />
+            <MainContextMenu filePickers={filePickers} />
           </ContextMenuTarget>
           {mainShade && <MiniTime />}
           <Minimize />