diff --git a/src/chrome/DetailSidebar.js b/src/chrome/DetailSidebar.tsx
similarity index 76%
rename from src/chrome/DetailSidebar.js
rename to src/chrome/DetailSidebar.tsx
index a226f6096..23bc386b8 100644
--- a/src/chrome/DetailSidebar.js
+++ b/src/chrome/DetailSidebar.tsx
@@ -9,21 +9,24 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import Sidebar from '../ui/components/Sidebar';
 import {connect} from 'react-redux';
-import {toggleRightSidebarAvailable} from '../reducers/application.tsx';
+import {toggleRightSidebarAvailable} from '../reducers/application';
 
-type OwnProps = {|
-  children: any,
-  width?: number,
-  minWidth?: number,
-|};
-
-type Props = {
-  ...OwnProps,
-  rightSidebarVisible: boolean,
-  rightSidebarAvailable: boolean,
-  toggleRightSidebarAvailable: (visible?: boolean) => any,
+type OwnProps = {
+  children: any;
+  width?: number;
+  minWidth?: number;
 };
 
+type StateFromProps = {
+  rightSidebarVisible: boolean;
+  rightSidebarAvailable: boolean;
+};
+
+type DispatchFromProps = {
+  toggleRightSidebarAvailable: (visible?: boolean) => any;
+};
+
+type Props = OwnProps & StateFromProps & DispatchFromProps;
 class DetailSidebar extends React.Component<Props> {
   componentDidMount() {
     this.updateSidebarAvailablility();
@@ -59,7 +62,9 @@ class DetailSidebar extends React.Component<Props> {
   }
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(
+// @TODO: TS_MIGRATION
+type Store = any;
+export default connect<StateFromProps, DispatchFromProps, OwnProps, Store>(
   ({application: {rightSidebarVisible, rightSidebarAvailable}}) => ({
     rightSidebarVisible,
     rightSidebarAvailable,
diff --git a/src/createTablePlugin.js b/src/createTablePlugin.js
index 71659ba9c..96f1c4ded 100644
--- a/src/createTablePlugin.js
+++ b/src/createTablePlugin.js
@@ -14,7 +14,7 @@ import type {
 
 import FlexColumn from './ui/components/FlexColumn';
 import Button from './ui/components/Button';
-import DetailSidebar from './chrome/DetailSidebar';
+import DetailSidebar from './chrome/DetailSidebar.tsx';
 import {FlipperPlugin} from './plugin.tsx';
 import SearchableTable_immutable from './ui/components/searchable/SearchableTable_immutable';
 import textContent from './utils/textContent.tsx';
diff --git a/src/index.js b/src/index.js
index 4f5fe6c92..8badb4087 100644
--- a/src/index.js
+++ b/src/index.js
@@ -39,7 +39,7 @@ export {
 export {shouldParseAndroidLog} from './utils/crashReporterUtility.tsx';
 export {default as isProduction} from './utils/isProduction.tsx';
 export {createTablePlugin} from './createTablePlugin.js';
-export {default as DetailSidebar} from './chrome/DetailSidebar.js';
+export {default as DetailSidebar} from './chrome/DetailSidebar.tsx';
 
 export {default as Device} from './devices/BaseDevice.tsx';
 export {default as AndroidDevice} from './devices/AndroidDevice.tsx';
diff --git a/src/plugins/TableNativePlugin.js b/src/plugins/TableNativePlugin.js
index 4c1b22664..f7a10f1c7 100644
--- a/src/plugins/TableNativePlugin.js
+++ b/src/plugins/TableNativePlugin.js
@@ -18,7 +18,7 @@ import {
 } from 'flipper';
 import ErrorBlock from '../ui/components/ErrorBlock';
 import FlexColumn from '../ui/components/FlexColumn';
-import DetailSidebar from '../chrome/DetailSidebar';
+import DetailSidebar from '../chrome/DetailSidebar.tsx';
 import {FlipperPlugin} from '../plugin.tsx';
 import SearchableTable from '../ui/components/searchable/SearchableTable';
 import textContent from '../utils/textContent.tsx';