Migrate BaseDevice from js to tsx

Summary: As per the title

Reviewed By: passy

Differential Revision: D16687261

fbshipit-source-id: a9d85424fb0a08fada7edd0355c356907518d366

headless/index.js

@@ -23,7 +23,7 @@ import setup from '../static/setup.js';
 import type {Store} from '../src/reducers/index.tsx';
 import {getPersistentPlugins} from '../src/utils/pluginUtils.js';
 import {serialize} from '../src/utils/serialization';
-import type BaseDevice from '../src/devices/BaseDevice';
+import type BaseDevice from '../src/devices/BaseDevice.tsx';
 
 import {getStringFromErrorLike} from '../src/utils/index';
 

src/App.js

@@ -34,7 +34,7 @@ import {
 } from './reducers/application.tsx';
 import type {Logger} from './fb-interfaces/Logger.js';
 import type BugReporter from './fb-stubs/BugReporter.tsx';
-import type BaseDevice from './devices/BaseDevice.js';
+import type BaseDevice from './devices/BaseDevice.tsx';
 const version = remote.app.getVersion();
 
 type OwnProps = {|

src/Client.tsx

@@ -6,7 +6,7 @@
  */
 
 import {FlipperPlugin, FlipperDevicePlugin} from './plugin';
-import BaseDevice, {OS} from './devices/BaseDevice.js';
+import BaseDevice, {OS} from './devices/BaseDevice';
 import {App} from './App.js';
 import {Logger} from './fb-interfaces/Logger.js';
 import {Store} from './reducers/index';

src/PluginContainer.js

@@ -6,10 +6,10 @@
  */
 import type {FlipperPlugin, FlipperDevicePlugin} from './plugin.tsx';
 import type {Logger} from './fb-interfaces/Logger';
-import BaseDevice from './devices/BaseDevice.js';
 import type {Props as PluginProps} from './plugin.tsx';
 import {pluginKey as getPluginKey} from './reducers/pluginStates.tsx';
 import Client from './Client.tsx';
+import BaseDevice from './devices/BaseDevice.tsx';
 import {
   ErrorBoundary,
   PureComponent,

src/chrome/DevicesButton.js

@@ -14,7 +14,7 @@ import {default as which} from 'which';
 import {promisify} from 'util';
 import {showOpenDialog} from '../utils/exportData';
 import PropTypes from 'prop-types';
-import type BaseDevice from '../devices/BaseDevice.js';
+import type BaseDevice from '../devices/BaseDevice.tsx';
 
 const whichPromise = promisify(which);
 

src/chrome/LocationsButton.js

@@ -8,7 +8,7 @@
 import {Button, Component, styled} from 'flipper';
 import {connect} from 'react-redux';
 
-import type BaseDevice from '../devices/BaseDevice';
+import type BaseDevice from '../devices/BaseDevice.tsx';
 import AndroidDevice from '../devices/AndroidDevice';
 
 type OwnProps = {|

src/chrome/MainSidebar.js

@@ -7,7 +7,7 @@
 
 import {FlipperBasePlugin} from '../plugin.tsx';
 import config from '../fb-stubs/config.tsx';
-import type BaseDevice from '../devices/BaseDevice.js';
+import type BaseDevice from '../devices/BaseDevice.tsx';
 import type Client from '../Client.tsx';
 import type {UninitializedClient} from '../UninitializedClient.tsx';
 import type {PluginNotification} from '../reducers/notifications.tsx';

src/chrome/ScreenCaptureButtons.js

@@ -18,7 +18,7 @@ import {remote} from 'electron';
 import path from 'path';
 import {reportPlatformFailures} from '../utils/metrics';
 import config from '../utils/processConfig';
-import type BaseDevice from '../devices/BaseDevice';
+import type BaseDevice from '../devices/BaseDevice.tsx';
 
 const CAPTURE_LOCATION = expandTilde(
   config().screenCapturePath || remote.app.getPath('desktop'),

src/devices/AndroidDevice.js

@@ -5,12 +5,11 @@
  * @format
  */
 
-import type {DeviceType, DeviceShell} from './BaseDevice.js';
+import type {DeviceType, DeviceShell} from './BaseDevice.tsx';
-
+import BaseDevice from './BaseDevice.tsx';
 import {Priority} from 'adbkit-logcat-fb';
 import child_process from 'child_process';
 import child_process_promise from 'child-process-es6-promise';
-import BaseDevice from './BaseDevice.js';
 import ArchivedDevice from './ArchivedDevice.js';
 
 type ADBClient = any;

src/devices/ArchivedDevice.js

@@ -4,13 +4,13 @@
  * LICENSE file in the root directory of this source tree.
  * @format
  */
-import BaseDevice from './BaseDevice.js';
+import BaseDevice from './BaseDevice.tsx';
 import type {
   DeviceType,
   OS,
   DeviceShell,
   DeviceLogEntry,
-} from './BaseDevice.js';
+} from './BaseDevice.tsx';
 
 export default class ArchivedDevice extends BaseDevice {
   constructor(

src/devices/BaseDevice.tsx

@@ -5,8 +5,7 @@
  * @format
  */
 
-import type stream from 'stream';
+import stream from 'stream';
-import type ArchivedDevice from './ArchivedDevice';
 
 export type LogLevel =
   | 'unknown'
@@ -17,20 +16,20 @@ export type LogLevel =
   | 'error'
   | 'fatal';
 
-export type DeviceLogEntry = {|
+export type DeviceLogEntry = {
-  date: Date,
+  date: Date;
-  pid: number,
+  pid: number;
-  tid: number,
+  tid: number;
-  app?: string,
+  app?: string;
-  type: LogLevel,
+  type: LogLevel;
-  tag: string,
+  tag: string;
-  message: string,
+  message: string;
-|};
+};
 
 export type DeviceShell = {
-  stdout: stream.Readable,
+  stdout: stream.Readable;
-  stderr: stream.Readable,
+  stderr: stream.Readable;
-  stdin: stream.Writable,
+  stdin: stream.Writable;
 };
 
 export type DeviceLogListener = (entry: DeviceLogEntry) => void;
@@ -41,13 +40,13 @@ export type DeviceType =
   | 'archivedEmulator'
   | 'archivedPhysical';
 
-export type DeviceExport = {|
+export type DeviceExport = {
-  os: string,
+  os: string;
-  title: string,
+  title: string;
-  deviceType: DeviceType,
+  deviceType: DeviceType;
-  serial: string,
+  serial: string;
-  logs: Array<DeviceLogEntry>,
+  logs: Array<DeviceLogEntry>;
-|};
+};
 
 export type OS = 'iOS' | 'Android' | 'Windows' | 'MacOS';
 
@@ -71,7 +70,7 @@ export default class BaseDevice {
   serial: string;
 
   // possible src of icon to display next to the device title
-  icon: ?string;
+  icon: string | null | undefined;
 
   logListeners: Map<Symbol, DeviceLogListener> = new Map();
   logEntries: Array<DeviceLogEntry> = [];
@@ -135,7 +134,7 @@ export default class BaseDevice {
     this.logListeners.delete(id);
   }
 
-  spawnShell(): ?DeviceShell {
+  spawnShell(): DeviceShell | null | undefined {
     throw new Error('unimplemented');
   }
 
@@ -143,7 +142,7 @@ export default class BaseDevice {
     throw new Error('unimplemented');
   }
 
-  archive(): ?ArchivedDevice {
+  archive(): any | null | undefined {
     return null;
   }
 }

src/devices/IOSDevice.js

@@ -5,9 +5,9 @@
  * @format
  */
 
-import type {DeviceType, LogLevel, DeviceLogEntry} from './BaseDevice.js';
+import type {DeviceType, LogLevel, DeviceLogEntry} from './BaseDevice.tsx';
 import child_process from 'child_process';
-import BaseDevice from './BaseDevice.js';
+import BaseDevice from './BaseDevice.tsx';
 import JSONStream from 'JSONStream';
 import {Transform} from 'stream';
 

src/devices/MacDevice.js

@@ -5,7 +5,7 @@
  * @format
  */
 
-import BaseDevice from './BaseDevice.js';
+import BaseDevice from './BaseDevice.tsx';
 
 export default class MacDevice extends BaseDevice {
   os = 'MacOS';

src/devices/WindowsDevice.js

@@ -5,7 +5,7 @@
  * @format
  */
 
-import BaseDevice from './BaseDevice.js';
+import BaseDevice from './BaseDevice.tsx';
 
 export default class WindowsDevice extends BaseDevice {
   os = 'Windows';

src/dispatcher/androidDevice.js

@@ -8,7 +8,7 @@
 import AndroidDevice from '../devices/AndroidDevice';
 import child_process from 'child_process';
 import type {Store} from '../reducers/index.tsx';
-import type BaseDevice from '../devices/BaseDevice';
+import type BaseDevice from '../devices/BaseDevice.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
 import {registerDeviceCallbackOnPlugins} from '../utils/onRegisterDevice.js';
 import {getAdbClient} from '../utils/adbClient';

src/dispatcher/iOSDevice.js

@@ -8,7 +8,7 @@
 import type {ChildProcess} from 'child_process';
 import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
-import type {DeviceType} from '../devices/BaseDevice';
+import type {DeviceType} from '../devices/BaseDevice.tsx';
 import {promisify} from 'util';
 import path from 'path';
 import child_process from 'child_process';

src/index.js

@@ -25,8 +25,8 @@ export {default as constants} from './fb-stubs/constants.tsx';
 export {connect} from 'react-redux';
 export {selectPlugin} from './reducers/connections.tsx';
 export {getPluginKey, getPersistedState} from './utils/pluginUtils.js';
-export {default as BaseDevice} from './devices/BaseDevice.js';
 export type {Store, MiddlewareAPI} from './reducers/index.tsx';
+export {default as BaseDevice} from './devices/BaseDevice.tsx';
 
 export {
   default as SidebarExtensions,
@@ -35,7 +35,7 @@ export {
   DeviceLogListener,
   DeviceLogEntry,
   LogLevel,
-} from './devices/BaseDevice.js';
+} from './devices/BaseDevice.tsx';
 export {shouldParseAndroidLog} from './utils/crashReporterUtility.js';
 export {default as isProduction} from './utils/isProduction.js';
 export {createTablePlugin} from './createTablePlugin.js';
@@ -43,6 +43,6 @@ export {default as DetailSidebar} from './chrome/DetailSidebar.js';
 
 export {default as AndroidDevice} from './devices/AndroidDevice.js';
 export {default as ArchivedDevice} from './devices/ArchivedDevice.js';
-export {default as Device} from './devices/BaseDevice.js';
+export {default as Device} from './devices/BaseDevice.tsx';
 export {default as IOSDevice} from './devices/IOSDevice.js';
-export type {OS} from './devices/BaseDevice.js';
+export type {OS} from './devices/BaseDevice.tsx';

src/plugin.tsx

@@ -12,7 +12,7 @@ import Client from './Client';
 import {Store, MiddlewareAPI} from './reducers/index';
 import {MetricType} from './utils/exportMetrics.js';
 import {ReactNode, Component} from 'react';
-import BaseDevice from './devices/BaseDevice.js';
+import BaseDevice from './devices/BaseDevice';
 
 // This function is intended to be called from outside of the plugin.
 // If you want to `call` from the plugin use, this.client.call
@@ -163,7 +163,7 @@ export class FlipperDevicePlugin<
 
   constructor(props: Props<P>) {
     super(props);
-    // $FlowFixMe props.target will be instance of Device
+    // @ts-ignore props.target will be instance of Device
     this.device = props.target;
   }
 
@@ -192,7 +192,7 @@ export class FlipperPlugin<
     super(props);
     const {id} = this.constructor;
     this.subscriptions = [];
-    // $FlowFixMe props.target will be instance of Client
+    // @ts-ignore props.target will be instance of Client
     this.realClient = props.target;
     this.client = {
       call: (method, params) => this.realClient.call(id, method, true, params),

src/plugins/crash_reporter/__tests__/testCrashReporterPlugin.electron.js

@@ -4,7 +4,7 @@
  * LICENSE file in the root directory of this source tree.
  * @format
  */
-import BaseDevice from '../../../devices/BaseDevice';
+import BaseDevice from '../../../devices/BaseDevice.tsx';
 import CrashReporterPlugin from '../../crash_reporter';
 import type {PersistedState, Crash} from '../../crash_reporter';
 import {

src/plugins/logs/index.js

@@ -12,8 +12,8 @@ import type {
   TableColumns,
 } from 'flipper';
 import type {Counter} from './LogWatcher.js';
-import type {DeviceLogEntry} from '../../devices/BaseDevice.js';
 import type {Props as PluginProps} from '../../plugin.tsx';
+import type {DeviceLogEntry} from '../../devices/BaseDevice.tsx';
 
 import {
   Text,

src/reducers/__tests__/connections.node.tsx

@@ -6,8 +6,8 @@
  */
 
 import reducer from '../connections';
-import BaseDevice from '../../devices/BaseDevice';
 import {State} from '../connections';
+import BaseDevice from '../../devices/BaseDevice';
 
 test('REGISTER_DEVICE doesnt remove error', () => {
   const initialState: State = reducer(undefined, {

src/utils/__tests__/exportData.electron.js

@@ -5,7 +5,7 @@
  * @format
  */
 
-import {default as BaseDevice} from '../../devices/BaseDevice';
+import {default as BaseDevice} from '../../devices/BaseDevice.tsx';
 import {default as ArchivedDevice} from '../../devices/ArchivedDevice';
 import {processStore} from '../exportData';
 import {FlipperDevicePlugin} from '../../plugin.tsx';

src/utils/crashReporterUtility.js

@@ -5,7 +5,7 @@
  * @format
  * @flow
  */
-import type {DeviceLogEntry} from '../devices/BaseDevice.js';
+import type {DeviceLogEntry} from '../devices/BaseDevice.tsx';
 
 export function shouldParseAndroidLog(
   entry: DeviceLogEntry,

src/utils/exportData.js

@@ -6,14 +6,14 @@
  */
 import {getInstance as getLogger} from '../fb-stubs/Logger';
 import type {Store, MiddlewareAPI} from '../reducers.tsx';
-import type {DeviceExport} from '../devices/BaseDevice';
+import type {DeviceExport} from '../devices/BaseDevice.tsx';
 import type {State as PluginStates} from '../reducers/pluginStates.tsx';
 import type {PluginNotification} from '../reducers/notifications.tsx';
 import type {ClientExport} from '../Client.tsx';
 import type {State as PluginStatesState} from '../reducers/pluginStates.tsx';
 import {pluginKey} from '../reducers/pluginStates.tsx';
 import {FlipperDevicePlugin, FlipperPlugin, callClient} from '../plugin.tsx';
-import {default as BaseDevice} from '../devices/BaseDevice';
+import {default as BaseDevice} from '../devices/BaseDevice.tsx';
 import {default as ArchivedDevice} from '../devices/ArchivedDevice';
 import {default as Client} from '../Client.tsx';
 import fs from 'fs';

src/utils/listDevices.js

@@ -6,7 +6,7 @@
  */
 import {getActiveAndroidDevices} from '../dispatcher/androidDevice';
 import {getActiveDevicesAndSimulators} from '../dispatcher/iOSDevice';
-import type BaseDevice from '../devices/BaseDevice';
+import type BaseDevice from '../devices/BaseDevice.tsx';
 
 export async function listDevices(): Promise<Array<BaseDevice>> {
   const androidDevices = await getActiveAndroidDevices();

src/utils/onRegisterDevice.js

@@ -6,8 +6,8 @@
  */
 import type {Store} from '../reducers/index.tsx';
 import {FlipperPlugin, FlipperDevicePlugin} from '../plugin.tsx';
-import type BaseDevice from '../devices/BaseDevice.js';
 import {setPluginState} from '../reducers/pluginStates.tsx';
+import type BaseDevice from '../devices/BaseDevice.tsx';
 import {getPersistedState} from '../utils/pluginUtils.js';
 
 export function registerDeviceCallbackOnPlugins(

src/utils/pluginUtils.js

@@ -4,9 +4,9 @@
  * LICENSE file in the root directory of this source tree.
  * @format
  */
-import type BaseDevice from '../devices/BaseDevice.js';
 import {FlipperDevicePlugin, FlipperPlugin} from '../plugin.tsx';
 import type {State as PluginStatesState} from '../reducers/pluginStates.tsx';
+import type BaseDevice from '../devices/BaseDevice.tsx';
 import {pluginsClassMap} from './exportData.js';
 import type {State as PluginsState} from '../reducers/plugins.tsx';
 import type {PluginDefinition} from '../dispatcher/plugins';

src/utils/reduxDevToolsConfig.js

@@ -5,7 +5,7 @@
  * @format
  */
 import {State} from '../reducers/index.tsx';
-import type {DeviceExport} from '../devices/BaseDevice';
+import type {DeviceExport} from '../devices/BaseDevice.tsx';
 
 export const stateSanitizer = (state: State) => {
   if (state.connections && state.connections.devices) {

tsconfig.json

@@ -11,6 +11,7 @@
     "moduleResolution": "node",
     "baseUrl": ".",
     "downlevelIteration": true,
+    "esModuleInterop": true,
     "paths": {
       "flipper": ["./src/index.js"]
     }