From c1b718db8fc3cc1556a735eab80bcb520dd3a3f5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20B=C3=BCchele?= <danielbuechele@fb.com>
Date: Tue, 20 Aug 2019 03:18:32 -0700
Subject: [PATCH] Console

Summary: _typescript_

Reviewed By: priteshrnandgaonkar

Differential Revision: D16828108

fbshipit-source-id: ca04853242b2f6511ecf28250add78bbbf79ba05
---
 src/ui/components/{console.js => console.tsx} | 77 +++++++++----------
 .../components/elements-inspector/sidebar.js  |  2 +-
 src/ui/index.js                               |  2 +-
 3 files changed, 39 insertions(+), 42 deletions(-)
 rename src/ui/components/{console.js => console.tsx} (77%)

diff --git a/src/ui/components/console.js b/src/ui/components/console.tsx
similarity index 77%
rename from src/ui/components/console.js
rename to src/ui/components/console.tsx
index 9c45a4d5b..3a51ef3fb 100644
--- a/src/ui/components/console.js
+++ b/src/ui/components/console.tsx
@@ -4,52 +4,50 @@
  * LICENSE file in the root directory of this source tree.
  * @format
  */
-import {Component} from 'react';
-import {
-  CodeBlock,
-  colors,
-  ManagedTable,
-  FlexColumn,
-  Text,
-  ManagedDataInspector,
-  Input,
-  View,
-} from '../index';
-import styled from '../styled/index';
-import type {TableBodyRow, TableRows} from 'flipper';
-import type {PluginClient} from '../../plugin.tsx';
+import React, {Component} from 'react';
+import CodeBlock from './CodeBlock';
+import {colors} from './colors';
+import ManagedTable from './table/ManagedTable';
+import FlexColumn from './FlexColumn';
+import Text from './Text';
+import ManagedDataInspector from './data-inspector/ManagedDataInspector';
+import Input from './Input';
+import View from './View';
+import styled from 'react-emotion';
+import {TableBodyRow, TableRows} from './table/types';
+import {PluginClient} from '../../plugin';
 
-type ValueWithType = {|
-  type: string,
-  value: any,
-|};
-type SuccessResult = {|
-  isSuccess: true,
-  value: ValueWithType,
-|};
-type FailedResult = {|
-  isSuccess: false,
-  error: string,
-|};
+type ValueWithType = {
+  type: string;
+  value: any;
+};
+type SuccessResult = {
+  isSuccess: true;
+  value: ValueWithType;
+};
+type FailedResult = {
+  isSuccess: false;
+  error: string;
+};
 
 type CommandResult = SuccessResult | FailedResult;
 
 type Props = {
-  client: PluginClient,
-  getContext: () => string,
+  client: PluginClient;
+  getContext: () => string;
 };
 type State = {
-  isConsoleEnabled: boolean,
-  script: string,
+  isConsoleEnabled: boolean;
+  script: string;
   previousExecutions: Array<{
-    command: string,
-    result: CommandResult,
-  }>,
+    command: string;
+    result: CommandResult;
+  }>;
 };
 
 class ConsoleError extends Component<{
-  error: Error | string | void,
-  className?: string,
+  error: Error | string | void;
+  className?: string;
 }> {
   static Container = styled(CodeBlock)({
     backgroundColor: colors.redTint,
@@ -62,10 +60,9 @@ class ConsoleError extends Component<{
 
   render() {
     const {className, error} = this.props;
-
     return (
       <ConsoleError.Container className={className}>
-        {error}
+        {(error || '').toString()}
       </ConsoleError.Container>
     );
   }
@@ -133,11 +130,11 @@ export class Console extends Component<Props, State> {
       });
   };
 
-  onInputChange = (event: SyntheticInputEvent<>) => {
+  onInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     this.setState({script: event.target.value});
   };
 
-  onSubmit = (event: SyntheticEvent<>) => {
+  onSubmit = (event: React.FormEvent) => {
     if (this.state.script != '') {
       this.executeScriptOnDevice();
     }
@@ -166,7 +163,7 @@ export class Console extends Component<Props, State> {
               collapsed={true}
             />
           ) : (
-            <ConsoleError error={result.error} />
+            <ConsoleError error={(result as FailedResult).error} />
           ),
         },
       },
diff --git a/src/ui/components/elements-inspector/sidebar.js b/src/ui/components/elements-inspector/sidebar.js
index 0eec86f14..9ee47e8bb 100644
--- a/src/ui/components/elements-inspector/sidebar.js
+++ b/src/ui/components/elements-inspector/sidebar.js
@@ -12,7 +12,7 @@ import type {Logger} from '../../../fb-interfaces/Logger.js';
 import Panel from '../Panel.js';
 import ManagedDataInspector from '../data-inspector/ManagedDataInspector.js';
 import {Component} from 'react';
-import {Console} from '../console';
+import {Console} from '../console.tsx';
 import GK from '../../../fb-stubs/GK.tsx';
 
 const deepEqual = require('deep-equal');
diff --git a/src/ui/index.js b/src/ui/index.js
index 9d5a3a71a..998808932 100644
--- a/src/ui/index.js
+++ b/src/ui/index.js
@@ -180,6 +180,6 @@ export {
 } from './components/elements-inspector/ElementsInspector.js';
 export {InspectorSidebar} from './components/elements-inspector/sidebar.js';
 
-export {Console} from './components/console.js';
+export {Console} from './components/console.tsx';
 
 export {default as Sheet} from './components/Sheet.js';