Migrate DetailSidebar from js to tsx

Summary: Migrated DetailSidebar.js to DetailSidebar.tsx

Reviewed By: passy

Differential Revision: D16708503

fbshipit-source-id: 13090d6d44dbd01b162194c66724059d8e86a4c8

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 = {|
+type OwnProps = {
-  children: any,
+  children: any;
-  width?: number,
+  width?: number;
-  minWidth?: number,
+  minWidth?: number;
-|};
-
-type Props = {
-  ...OwnProps,
-  rightSidebarVisible: boolean,
-  rightSidebarAvailable: boolean,
-  toggleRightSidebarAvailable: (visible?: boolean) => any,
 };
 
+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,

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';

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';

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';