From e4b071e8674e3a10b1f7530ff0c7199094ba613c Mon Sep 17 00:00:00 2001
From: Benjamin Elo <beneloca@fb.com>
Date: Mon, 12 Aug 2019 05:49:44 -0700
Subject: [PATCH] Migrate PluginDebugger from js to tsx

Summary: Migrated PluginDebugger.js to PluginDebugger.tsx

Reviewed By: passy

Differential Revision: D16732025

fbshipit-source-id: c4ff5586f823e90eba14eef5a8dac114a058763b
---
 src/App.js                                    |  2 +-
 .../{PluginDebugger.js => PluginDebugger.tsx} | 52 +++++++++----------
 src/dispatcher/plugins.tsx                    |  3 +-
 3 files changed, 29 insertions(+), 28 deletions(-)
 rename src/chrome/{PluginDebugger.js => PluginDebugger.tsx} (87%)

diff --git a/src/App.js b/src/App.js
index a7c1dce98..f867df158 100644
--- a/src/App.js
+++ b/src/App.js
@@ -20,7 +20,7 @@ import ShareSheetExportFile from './chrome/ShareSheetExportFile.js';
 import PluginContainer from './PluginContainer.js';
 import Sheet from './chrome/Sheet.js';
 import {ipcRenderer, remote} from 'electron';
-import PluginDebugger from './chrome/PluginDebugger.js';
+import PluginDebugger from './chrome/PluginDebugger.tsx';
 import {
   ShareType,
   ActiveSheet,
diff --git a/src/chrome/PluginDebugger.js b/src/chrome/PluginDebugger.tsx
similarity index 87%
rename from src/chrome/PluginDebugger.js
rename to src/chrome/PluginDebugger.tsx
index b22c1a0ce..f6163f325 100644
--- a/src/chrome/PluginDebugger.js
+++ b/src/chrome/PluginDebugger.tsx
@@ -5,12 +5,10 @@
  * @format
  */
 
-import type {FlipperDevicePlugin, FlipperPlugin} from '../plugin.tsx';
-import type {PluginDefinition} from '../dispatcher/plugins.tsx';
-import type Client from '../Client.tsx';
-import type {TableBodyRow} from '../ui/components/table/types';
-
-import {Component, Fragment} from 'react';
+import {PluginDefinition} from '../dispatcher/plugins';
+import Client from '../Client';
+import {TableBodyRow} from '../ui/components/table/types';
+import React, {Component, Fragment} from 'react';
 import {connect} from 'react-redux';
 import {
   FlexColumn,
@@ -22,6 +20,7 @@ import {
   Link,
 } from 'flipper';
 import StatusIndicator from '../ui/components/StatusIndicator';
+import {State as Store} from '../reducers';
 
 const Container = styled(FlexColumn)({
   padding: 10,
@@ -64,16 +63,21 @@ const Lamp = props => (
   <StatusIndicator statusColor={props.on ? colors.lime : colors.red} />
 );
 
-type Props = {|
-  devicePlugins: Array<FlipperDevicePlugin<>>,
-  clientPlugins: Array<FlipperPlugin<>>,
-  gatekeepedPlugins: Array<PluginDefinition>,
-  disabledPlugins: Array<PluginDefinition>,
-  failedPlugins: Array<[PluginDefinition, string]>,
-  clients: Array<Client>,
-  selectedDevice: ?string,
-  onHide: () => mixed,
-|};
+type StateFromProps = {
+  gatekeepedPlugins: Array<PluginDefinition>;
+  disabledPlugins: Array<PluginDefinition>;
+  failedPlugins: Array<[PluginDefinition, string]>;
+  clients: Array<Client>;
+  selectedDevice: string | null | undefined;
+  devicePlugins: Array<PluginDefinition>;
+  clientPlugins: Array<PluginDefinition>;
+};
+
+type DispatchFromProps = {};
+
+type OwnProps = {
+  onHide: () => any;
+};
 
 const COLUMNS = {
   lamp: {
@@ -105,14 +109,15 @@ const COLUMNS_SIZES = {
   source: 140,
 };
 
+type Props = OwnProps & StateFromProps & DispatchFromProps;
 class PluginDebugger extends Component<Props> {
   buildRow(
     name: string,
     loaded: boolean,
     status: string,
-    GKname: ?string,
-    GKpassing: ?boolean,
-    pluginPath: ?string,
+    GKname: string | null | undefined,
+    GKpassing: boolean | null | undefined,
+    pluginPath: string | null | undefined,
   ): TableBodyRow {
     return {
       key: name.toLowerCase(),
@@ -191,10 +196,8 @@ class PluginDebugger extends Component<Props> {
           plugin.id,
           true,
           '',
-          // $FlowFixMe: Flow doesn't know this is inherited from FlipperBasePlugin
           plugin.gatekeeper,
           true,
-          // $FlowFixMe: Flow doesn't know this is inherited from FlipperBasePlugin
           externalPluginPath(plugin),
         ),
       ),
@@ -206,10 +209,8 @@ class PluginDebugger extends Component<Props> {
           plugin.id,
           true,
           '',
-          // $FlowFixMe: Flow doesn't know this is inherited from FlipperBasePlugin
           plugin.gatekeeper,
           true,
-          // $FlowFixMe: Flow doesn't know this is inherited from FlipperBasePlugin
           externalPluginPath(plugin),
         ),
       ),
@@ -325,8 +326,7 @@ class PluginDebugger extends Component<Props> {
   }
 }
 
-// $FlowFixMe
-export default connect(
+export default connect<StateFromProps, DispatchFromProps, OwnProps, Store>(
   ({
     plugins: {
       devicePlugins,
@@ -343,6 +343,6 @@ export default connect(
     clients,
     disabledPlugins,
     failedPlugins,
-    selectedDevice: selectedDevice?.serial,
+    selectedDevice: selectedDevice && selectedDevice.serial,
   }),
 )(PluginDebugger);
diff --git a/src/dispatcher/plugins.tsx b/src/dispatcher/plugins.tsx
index f7f31d237..480b6ba74 100644
--- a/src/dispatcher/plugins.tsx
+++ b/src/dispatcher/plugins.tsx
@@ -28,8 +28,9 @@ import {default as config} from '../utils/processConfig';
 import isProduction from '../utils/isProduction';
 
 export type PluginDefinition = {
+  id?: string;
   name: string;
-  out: string;
+  out?: string;
   gatekeeper?: string;
   entry?: string;
 };