diff --git a/js/components/PlaylistWindow/ScrollBar.js b/js/components/PlaylistWindow/ScrollBar.js
deleted file mode 100644
index c7680dd6..00000000
--- a/js/components/PlaylistWindow/ScrollBar.js
+++ /dev/null
@@ -1,39 +0,0 @@
-import React from "react";
-import { connect } from "react-redux";
-import Slider from "rc-slider/lib/Slider";
-
-import { setPlaylistScrollPosition } from "../../actionCreators";
-import { getVisibleTrackIds, getPlaylistScrollPosition } from "../../selectors";
-
-const Handle = () =>
;
-
-const ScrollBar = props => (
-
-);
-
-const mapDispatchToProps = {
- setPlaylistScrollPosition: position =>
- setPlaylistScrollPosition(100 - position)
-};
-
-const mapStateToProps = state => ({
- playlistScrollPosition: getPlaylistScrollPosition(state),
- allTracksAreVisible:
- getVisibleTrackIds(state).length === state.playlist.length
-});
-
-export default connect(
- mapStateToProps,
- mapDispatchToProps
-)(ScrollBar);
diff --git a/js/components/PlaylistWindow/ScrollBar.tsx b/js/components/PlaylistWindow/ScrollBar.tsx
new file mode 100644
index 00000000..a096d60d
--- /dev/null
+++ b/js/components/PlaylistWindow/ScrollBar.tsx
@@ -0,0 +1,57 @@
+import React from "react";
+import { connect } from "react-redux";
+
+// Here we import the rc-slider class just to get it's type.
+// We expect the Typescript compiler to not actually include this in the bundle.
+import RcSlider from "rc-slider";
+// @ts-ignore
+import SliderComponent from "rc-slider/lib/Slider";
+// Here we inform TypeScript to use the default export's type for our partial import.
+const Slider = SliderComponent as typeof RcSlider;
+
+import { setPlaylistScrollPosition } from "../../actionCreators";
+import { getVisibleTrackIds, getPlaylistScrollPosition } from "../../selectors";
+import { AppState, Dispatch } from "../../types";
+
+interface StateProps {
+ playlistScrollPosition: number;
+ allTracksAreVisible: boolean;
+}
+
+interface DispatchProps {
+ setPlaylistScrollPosition: (value: number) => void;
+}
+
+const Handle = () => ;
+
+const ScrollBar = (props: StateProps & DispatchProps) => (
+
+);
+
+const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => {
+ return {
+ setPlaylistScrollPosition: position =>
+ dispatch(setPlaylistScrollPosition(100 - position))
+ };
+};
+
+const mapStateToProps = (state: AppState): StateProps => ({
+ playlistScrollPosition: getPlaylistScrollPosition(state),
+ allTracksAreVisible:
+ getVisibleTrackIds(state).length === state.playlist.trackOrder.length
+});
+
+export default connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(ScrollBar);
diff --git a/js/components/PlaylistWindow/__snapshots__/index.test.js.snap b/js/components/PlaylistWindow/__snapshots__/index.test.js.snap
index 0ad3db3b..0fca32e0 100644
--- a/js/components/PlaylistWindow/__snapshots__/index.test.js.snap
+++ b/js/components/PlaylistWindow/__snapshots__/index.test.js.snap
@@ -86,7 +86,7 @@ exports[`PlaylistWindow renders to snapshot 1`] = `
className="playlist-middle-right draggable"
>