migrate redux store

Summary: Migrating redux stores to TypeScript Reviewed By: passy Differential Revision: D16579796 fbshipit-source-id: e3e507f17f1bdd57eb45e30cb0b28aaee6c4521c
2019-08-08 08:01:55 -07:00
parent 2c95ef6b25
commit 64cefd0f84
62 changed files with 241 additions and 245 deletions
--- a/headless/index.js
+++ b/headless/index.js
@@ -11,7 +11,7 @@ import {applyMiddleware} from 'redux';
 import yargs from 'yargs';
 import dispatcher from '../src/dispatcher/index.js';
 import {init as initLogger} from '../src/fb-stubs/Logger.js';
-import reducers from '../src/reducers/index.js';
+import reducers from '../src/reducers/index.tsx';
 import {exportStore, pluginsClassMap} from '../src/utils/exportData.js';
 import {
  exportMetricsWithoutTrace,
@@ -20,7 +20,7 @@ import {
 import {listDevices} from '../src/utils/listDevices';
 // $FlowFixMe this file exist, trust me, flow!
 import setup from '../static/setup.js';
-import type {Store} from '../src/reducers';
+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';
--- a/package.json
+++ b/package.json
@@ -52,6 +52,11 @@
  "devDependencies": {
    "@jest-runner/electron": "^2.0.1",
    "@types/react-dom": "^16.8.5",
+    "@types/jest": "^24.0.16",
+    "@types/react": "^16.8.24",
+    "@types/react-redux": "^7.1.1",
+    "@types/redux-persist": "^4.3.1",
+    "@types/uuid": "^3.4.5",
    "@typescript-eslint/eslint-plugin": "^1.11.0",
    "babel-code-frame": "^6.26.0",
    "babel-eslint": "^10.0.1",
@@ -76,8 +81,6 @@
    "typescript": "^3.5.2"
  },
  "dependencies": {
-    "@types/react": "^16.8.21",
-    "@types/react-redux": "^7.1.0",
    "JSONStream": "^1.3.1",
    "adbkit-fb": "2.10.1",
    "ansi-to-html": "^0.6.3",
--- a/src/App.js
+++ b/src/App.js
@@ -9,7 +9,6 @@ import React from 'react';
 import {FlexColumn, FlexRow} from 'flipper';
 import {connect} from 'react-redux';
 import WelcomeScreen from './chrome/WelcomeScreen.tsx';
-// $FlowFixMe T47375728
 import TitleBar from './chrome/TitleBar.tsx';
 import MainSidebar from './chrome/MainSidebar.js';
 import BugReporterDialog from './chrome/BugReporterDialog.js';
@@ -23,6 +22,8 @@ import Sheet from './chrome/Sheet.js';
 import {ipcRenderer, remote} from 'electron';
 import PluginDebugger from './chrome/PluginDebugger.js';
 import {
+  ShareType,
+  ActiveSheet,
  ACTIVE_SHEET_BUG_REPORTER,
  ACTIVE_SHEET_PLUGIN_DEBUGGER,
  ACTIVE_SHEET_SHARE_DATA,
@@ -30,12 +31,10 @@ import {
  ACTIVE_SHEET_SHARE_DATA_IN_FILE,
  ACTIVE_SHEET_SELECT_PLUGINS_TO_EXPORT,
  ACTIVE_SHEET_PLUGIN_SHEET,
-} from './reducers/application.js';
-import type {ShareType} from './reducers/application.js';
+} from './reducers/application.tsx';
 import type {Logger} from './fb-interfaces/Logger.js';
 import type BugReporter from './fb-stubs/BugReporter.js';
 import type BaseDevice from './devices/BaseDevice.js';
-import type {ActiveSheet} from './reducers/application.js';
 const version = remote.app.getVersion();

 type OwnProps = {|
--- a/src/Client.js
+++ b/src/Client.js
@@ -9,17 +9,17 @@ import type {FlipperPlugin, FlipperBasePlugin} from './plugin.js';
 import type BaseDevice from './devices/BaseDevice.js';
 import type {App} from './App.js';
 import type {Logger} from './fb-interfaces/Logger.js';
-import type {Store} from './reducers/index.js';
+import type {Store} from './reducers/index.tsx';
 import type {OS} from './devices/BaseDevice.js';
 import {FlipperDevicePlugin} from './plugin.js';
-import {setPluginState} from './reducers/pluginStates.js';
+import {setPluginState} from './reducers/pluginStates.tsx';
 import {ReactiveSocket, PartialResponder} from 'rsocket-core';
 // $FlowFixMe perf_hooks is a new API in node
 import {performance} from 'perf_hooks';
 import {reportPlatformFailures} from './utils/metrics';
 import {reportPluginFailures} from './utils/metrics';
 import {default as isProduction} from './utils/isProduction.js';
-import {registerPlugins} from './reducers/plugins';
+import {registerPlugins} from './reducers/plugins.tsx';
 import createTableNativePlugin from './plugins/TableNativePlugin';

 const EventEmitter = require('events');
@@ -71,7 +71,7 @@ const handleError = (store: Store, deviceSerial: ?string, error: ErrorType) => {
        name: 'Plugin Error',
        reason: JSON.stringify(error),
      };
-  // $FlowFixMe: We checked persistedStateReducer exists
+
  const newPluginState = crashReporterPlugin.persistedStateReducer(
    persistedState,
    'flipper-crash-report',
--- a/src/MenuBar.js
+++ b/src/MenuBar.js
@@ -12,8 +12,8 @@ import {
  setActiveSheet,
  setSelectPluginsToExportActiveSheet,
  ACTIVE_SHEET_SHARE_DATA,
-} from './reducers/application';
-import type {Store} from './reducers/';
+} from './reducers/application.tsx';
+import type {Store} from './reducers/index.tsx';
 import electron from 'electron';
 import {ENABLE_SHAREABLE_LINK} from 'flipper';
 export type DefaultKeyboardAction = 'clear' | 'goToBottom' | 'createPaste';
--- a/src/NotificationsHub.js
+++ b/src/NotificationsHub.js
@@ -11,7 +11,7 @@ import type {
  FlipperPlugin,
  Device,
 } from 'flipper';
-import type {PluginNotification} from './reducers/notifications';
+import type {PluginNotification} from './reducers/notifications.tsx';
 import type {Logger} from './fb-interfaces/Logger';

 import {
@@ -35,8 +35,8 @@ import {
  clearAllNotifications,
  updatePluginBlacklist,
  updateCategoryBlacklist,
-} from './reducers/notifications';
-import {selectPlugin} from './reducers/connections';
+} from './reducers/notifications.tsx';
+import {selectPlugin} from './reducers/connections.tsx';
 import {textContent} from './utils/index';
 import createPaste from './fb-stubs/createPaste';

--- a/src/PluginContainer.js
+++ b/src/PluginContainer.js
@@ -8,7 +8,7 @@ import type {FlipperPlugin, FlipperDevicePlugin} from './plugin.js';
 import type {Logger} from './fb-interfaces/Logger';
 import BaseDevice from './devices/BaseDevice.js';
 import type {Props as PluginProps} from './plugin';
-import {pluginKey as getPluginKey} from './reducers/pluginStates';
+import {pluginKey as getPluginKey} from './reducers/pluginStates.tsx';
 import Client from './Client.js';
 import {
  ErrorBoundary,
@@ -21,8 +21,8 @@ import {
 } from 'flipper';
 import React from 'react';
 import {connect} from 'react-redux';
-import {setPluginState} from './reducers/pluginStates.js';
-import {selectPlugin} from './reducers/connections';
+import {setPluginState} from './reducers/pluginStates.tsx';
+import {selectPlugin} from './reducers/connections.tsx';
 import NotificationsHub from './NotificationsHub';
 import {activateMenuItems} from './MenuBar.js';

--- a/src/tests/App.electron.js
+++ b/src/tests/App.electron.js
@@ -8,7 +8,7 @@ import React from 'react';
 import {App} from '../App.js';
 import {Provider} from 'react-redux';
 import renderer from 'react-test-renderer';
-import reducers from '../reducers/index.js';
+import reducers from '../reducers/index.tsx';
 import configureStore from 'redux-mock-store';
 import {init as initLogger} from '../fb-stubs/Logger';
 import BugReporter from '../fb-stubs/BugReporter.js';
--- a/src/tests/server.device.js
+++ b/src/tests/server.device.js
@@ -7,7 +7,7 @@

 import Server from '../server.js';
 import {init as initLogger} from '../fb-stubs/Logger';
-import reducers from '../reducers/index.js';
+import reducers from '../reducers/index.tsx';
 import {createStore} from 'redux';
 import path from 'path';
 import os from 'os';
--- a/src/tests/server.electron.js
+++ b/src/tests/server.electron.js
@@ -7,7 +7,7 @@

 import {init as initLogger} from '../fb-stubs/Logger';
 import Server from '../server';
-import reducers from '../reducers/index.js';
+import reducers from '../reducers/index.tsx';
 import configureStore from 'redux-mock-store';
 import path from 'path';
 import os from 'os';
--- a/src/chrome/DetailSidebar.js
+++ b/src/chrome/DetailSidebar.js
@@ -9,7 +9,7 @@ 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.js';
+import {toggleRightSidebarAvailable} from '../reducers/application.tsx';

 type OwnProps = {|
  children: any,
--- a/src/chrome/DevicesButton.js
+++ b/src/chrome/DevicesButton.js
@@ -9,7 +9,7 @@ import {Component, Button, styled} from 'flipper';
 import {connect} from 'react-redux';
 import {spawn} from 'child_process';
 import {dirname} from 'path';
-import {selectDevice, preferDevice} from '../reducers/connections.js';
+import {selectDevice, preferDevice} from '../reducers/connections.tsx';
 import {default as which} from 'which';
 import {promisify} from 'util';
 import {showOpenDialog} from '../utils/exportData';
--- a/src/chrome/ExportDataPluginSheet.js
+++ b/src/chrome/ExportDataPluginSheet.js
@@ -6,17 +6,17 @@
 */

 import {Component, connect} from 'flipper';
-import type {ShareType} from '../reducers/application.js';
-import type {State as PluginState} from '../reducers/plugins.js';
-import type {State as PluginStatesState} from '../reducers/pluginStates.js';
-import type {ActiveSheet} from '../reducers/application.js';
-import {selectedPlugins as actionForSelectedPlugins} from '../reducers/plugins.js';
+import type {ShareType} from '../reducers/application.tsx';
+import type {State as PluginState} from '../reducers/plugins.tsx';
+import type {State as PluginStatesState} from '../reducers/pluginStates.tsx';
+import type {ActiveSheet} from '../reducers/application.tsx';
+import {selectedPlugins as actionForSelectedPlugins} from '../reducers/plugins.tsx';
 import {getActivePersistentPlugins} from '../utils/pluginUtils';
 import {
  ACTIVE_SHEET_SHARE_DATA,
  setActiveSheet as getActiveSheetAction,
  setExportDataToFileActiveSheet as getExportDataToFileActiveSheetAction,
-} from '../reducers/application.js';
+} from '../reducers/application.tsx';
 import SelectPluginSheet from './SelectPluginSheet';

 type OwnProps = {|
--- a/src/chrome/MainSidebar.js
+++ b/src/chrome/MainSidebar.js
@@ -10,8 +10,8 @@ import config from '../fb-stubs/config';
 import type BaseDevice from '../devices/BaseDevice.js';
 import type Client from '../Client.js';
 import type {UninitializedClient} from '../UninitializedClient.js';
-import type {PluginNotification} from '../reducers/notifications';
-import type {ActiveSheet} from '../reducers/application';
+import type {PluginNotification} from '../reducers/notifications.tsx';
+import type {ActiveSheet} from '../reducers/application.tsx';

 import {
  PureComponent,
@@ -31,8 +31,8 @@ import {
 } from 'flipper';
 import React from 'react';
 import NotificationsHub from '../NotificationsHub.js';
-import {selectPlugin} from '../reducers/connections.js';
-import {setActiveSheet} from '../reducers/application.js';
+import {selectPlugin} from '../reducers/connections.tsx';
+import {setActiveSheet} from '../reducers/application.tsx';
 import UserAccount from './UserAccount.tsx';
 import {connect} from 'react-redux';

--- a/src/chrome/ShareSheet.js
+++ b/src/chrome/ShareSheet.js
@@ -17,7 +17,10 @@ import {
  Spacer,
  Input,
 } from 'flipper';
-import {setExportStatusComponent, unsetShare} from '../reducers/application';
+import {
+  setExportStatusComponent,
+  unsetShare,
+} from '../reducers/application.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
 import {Idler} from '../utils/Idler';
 import {shareFlipperData} from '../fb-stubs/user';
--- a/src/chrome/ShareSheetExportFile.js
+++ b/src/chrome/ShareSheetExportFile.js
@@ -15,7 +15,10 @@ import {
  FlexRow,
  Spacer,
 } from 'flipper';
-import {setExportStatusComponent, unsetShare} from '../reducers/application';
+import {
+  setExportStatusComponent,
+  unsetShare,
+} from '../reducers/application.tsx';
 import {reportPlatformFailures} from '../utils/metrics';
 import CancellableExportStatus from './CancellableExportStatus';
 // $FlowFixMe: Missing type defs for node built-in.
--- a/src/chrome/Sheet.js
+++ b/src/chrome/Sheet.js
@@ -7,13 +7,13 @@

 import {Component} from 'react';
 import {Transition} from 'react-transition-group';
-import {setActiveSheet} from '../reducers/application.js';
+import {setActiveSheet} from '../reducers/application.tsx';
 import {connect} from 'react-redux';
 import {styled} from 'flipper';
 import {PLUGIN_SHEET_ELEMENT_ID} from '../ui/components/Sheet';
-import {ACTIVE_SHEET_PLUGIN_SHEET} from '../reducers/application';
+import {ACTIVE_SHEET_PLUGIN_SHEET} from '../reducers/application.tsx';

-import type {ActiveSheet} from '../reducers/application';
+import type {ActiveSheet} from '../reducers/application.tsx';

 const DialogContainer = styled('div')(({state}) => ({
  transform: `translate(-50%, ${
--- a/src/chrome/SignInSheet.js
+++ b/src/chrome/SignInSheet.js
@@ -18,7 +18,7 @@ import {
  colors,
 } from 'flipper';
 import {writeKeychain, getUser} from '../fb-stubs/user';
-import {login} from '../reducers/user';
+import {login} from '../reducers/user.tsx';
 import {connect} from 'react-redux';

 const Container = styled(FlexColumn)({
--- a/src/chrome/TitleBar.tsx
+++ b/src/chrome/TitleBar.tsx
@@ -5,8 +5,16 @@
 * @format
 */

-import {ActiveSheet, LauncherMsg, ShareType} from '../reducers/application.js';
-
+import {
+  ActiveSheet,
+  LauncherMsg,
+  ShareType,
+  setActiveSheet,
+  toggleLeftSidebarVisible,
+  toggleRightSidebarVisible,
+  ACTIVE_SHEET_BUG_REPORTER,
+  setFlipperRating,
+} from '../reducers/application';
 import {
  colors,
  Button,
@@ -18,13 +26,6 @@ import {
  LoadingIndicator,
 } from 'flipper';
 import {connect} from 'react-redux';
-import {
-  setActiveSheet,
-  toggleLeftSidebarVisible,
-  toggleRightSidebarVisible,
-  ACTIVE_SHEET_BUG_REPORTER,
-  setFlipperRating,
-} from '../reducers/application.js';
 import RatingButton from './RatingButton.js';
 import DevicesButton from './DevicesButton.js';
 import ScreenCaptureButtons from './ScreenCaptureButtons.js';
@@ -35,6 +36,7 @@ import {isAutoUpdaterEnabled} from '../utils/argvUtils.js';
 import isProduction from '../utils/isProduction.js';
 import {clipboard} from 'electron';
 import React from 'react';
+import {State} from 'src/reducers';

 const AppTitleBar = styled(FlexRow)(({focused}) => ({
  background: focused
@@ -118,7 +120,7 @@ const Importing = styled(FlexRow)({

 function statusMessageComponent(
  downloadingImportData: boolean,
-  statusComponent?: React.ReactElement<any> | undefined,
+  statusComponent?: React.ReactNode | undefined,
 ) {
  if (downloadingImportData) {
    return (
@@ -192,9 +194,7 @@ class TitleBar extends React.Component<Props, StateFromProps> {
  }
 }

-// @TODO: TS_MIGRATION
-type Store = any;
-export default connect<StateFromProps, DispatchFromProps, OwnProps, Store>(
+export default connect<StateFromProps, DispatchFromProps, OwnProps, State>(
  ({
    application: {
      windowIsFocused,
--- a/src/chrome/UpdateIndicator.tsx
+++ b/src/chrome/UpdateIndicator.tsx
@@ -5,9 +5,9 @@
 * @format
 */

-import {LauncherMsg} from '../reducers/application.js';
+import {LauncherMsg} from '../reducers/application';
 import {colors, FlexRow, Glyph, styled} from 'flipper';
-import React, {Component} from 'react';
+import React from 'react';

 const Container = styled(FlexRow)({
  alignItems: 'center',
@@ -27,7 +27,7 @@ function getSeverityColor(severity: 'warning' | 'error'): string {
  }
 }

-export default class UpdateIndicator extends Component<Props> {
+export default class UpdateIndicator extends React.Component<Props> {
  render() {
    if (this.props.launcherMsg.message.length == 0) {
      return null;
--- a/src/chrome/UserAccount.tsx
+++ b/src/chrome/UserAccount.tsx
@@ -10,7 +10,7 @@ import {ActiveSheet} from '../reducers/application';

 import {styled, FlexRow, Glyph, Text, colors} from 'flipper';
 import {logout} from '../reducers/user';
-import {setActiveSheet, ACTIVE_SHEET_SIGN_IN} from '../reducers/application.js';
+import {setActiveSheet, ACTIVE_SHEET_SIGN_IN} from '../reducers/application';
 import {connect} from 'react-redux';
 import electron from 'electron';
 import {findDOMNode} from 'react-dom';
--- a/src/chrome/tests/TitleBar.electron.js
+++ b/src/chrome/tests/TitleBar.electron.js
@@ -5,10 +5,9 @@
 * @format
 */

-// $FlowFixMe T47375728
 import TitleBar from '../TitleBar.tsx';
 import renderer from 'react-test-renderer';
-import reducers from '../../reducers/index.js';
+import reducers from '../../reducers/index.tsx';
 import configureStore from 'redux-mock-store';
 import {Provider} from 'react-redux';

--- a/src/dispatcher/tests/plugins.electron.js
+++ b/src/dispatcher/tests/plugins.electron.js
@@ -14,7 +14,7 @@ import dispatcher, {
 import path from 'path';
 import {remote} from 'electron';
 import {FlipperPlugin} from '../../plugin';
-import reducers from '../../reducers/index.js';
+import reducers from '../../reducers/index.tsx';
 import {init as initLogger} from '../../fb-stubs/Logger.js';
 import configureStore from 'redux-mock-store';
 import {TEST_PASSING_GK, TEST_FAILING_GK} from '../../fb-stubs/GK';
--- a/src/dispatcher/androidDevice.js
+++ b/src/dispatcher/androidDevice.js
@@ -7,14 +7,14 @@

 import AndroidDevice from '../devices/AndroidDevice';
 import child_process from 'child_process';
-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type BaseDevice from '../devices/BaseDevice';
 import type {Logger} from '../fb-interfaces/Logger.js';
 import {registerDeviceCallbackOnPlugins} from '../utils/onRegisterDevice.js';
 import {getAdbClient} from '../utils/adbClient';
 import {default as which} from 'which';
 import {promisify} from 'util';
-import type {ServerPorts} from '../reducers/application';
+import type {ServerPorts} from '../reducers/application.tsx';

 function createDevice(
  adbClient: any,
--- a/src/dispatcher/application.js
+++ b/src/dispatcher/application.js
@@ -6,9 +6,9 @@
 */

 import {remote, ipcRenderer} from 'electron';
-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
-import {toggleAction} from '../reducers/application';
+import {toggleAction} from '../reducers/application.tsx';
 import {parseFlipperPorts} from '../utils/environmentVariables';
 import {
  importDataToStore,
@@ -17,7 +17,7 @@ import {
 } from '../utils/exportData';
 import {tryCatchReportPlatformFailures} from '../utils/metrics';

-import {selectPlugin} from '../reducers/connections';
+import {selectPlugin} from '../reducers/connections.tsx';
 import qs from 'query-string';

 export const uriComponents = (url: string) => {
--- a/src/dispatcher/desktopDevice.js
+++ b/src/dispatcher/desktopDevice.js
@@ -5,7 +5,7 @@
 * @format
 */

-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';

 import MacDevice from '../devices/MacDevice';
--- a/src/dispatcher/iOSDevice.js
+++ b/src/dispatcher/iOSDevice.js
@@ -6,7 +6,7 @@
 */

 import type {ChildProcess} from 'child_process';
-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
 import type {DeviceType} from '../devices/BaseDevice';
 import {promisify} from 'util';
--- a/src/dispatcher/index.js
+++ b/src/dispatcher/index.js
@@ -16,7 +16,7 @@ import plugins from './plugins';
 import user from './user';

 import type {Logger} from '../fb-interfaces/Logger.js';
-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Dispatcher} from './types';

 export default function(store: Store, logger: Logger): () => Promise<void> {
--- a/src/dispatcher/notifications.js
+++ b/src/dispatcher/notifications.js
@@ -5,18 +5,18 @@
 * @format
 */

-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
-import type {PluginNotification} from '../reducers/notifications';
+import type {PluginNotification} from '../reducers/notifications.tsx';
 import type {FlipperPlugin, FlipperDevicePlugin} from '../plugin.js';
 import isHeadless from '../utils/isHeadless.js';
 import {ipcRenderer} from 'electron';
-import {selectPlugin} from '../reducers/connections';
+import {selectPlugin} from '../reducers/connections.tsx';
 import {
  setActiveNotifications,
  updatePluginBlacklist,
  updateCategoryBlacklist,
-} from '../reducers/notifications';
+} from '../reducers/notifications.tsx';
 import {textContent} from '../utils/index';
 import GK from '../fb-stubs/GK';

--- a/src/dispatcher/plugins.js
+++ b/src/dispatcher/plugins.js
@@ -5,10 +5,10 @@
 * @format
 */

-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
 import type {FlipperPlugin, FlipperDevicePlugin} from '../plugin.js';
-import type {State} from '../reducers/plugins';
+import type {State} from '../reducers/plugins.tsx';

 import React from 'react';
 import ReactDOM from 'react-dom';
@@ -18,7 +18,7 @@ import {
  addGatekeepedPlugins,
  addDisabledPlugins,
  addFailedPlugins,
-} from '../reducers/plugins';
+} from '../reducers/plugins.tsx';
 import {remote} from 'electron';
 import GK from '../fb-stubs/GK';
 import {FlipperBasePlugin} from '../plugin.js';
--- a/src/dispatcher/server.js
+++ b/src/dispatcher/server.js
@@ -7,7 +7,7 @@

 import Server from '../server.js';

-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
 import type Client from '../Client.js';
 import type {UninitializedClient} from '../UninitializedClient';
--- a/src/dispatcher/tracking.js
+++ b/src/dispatcher/tracking.js
@@ -9,7 +9,7 @@ import {ipcRenderer} from 'electron';
 // $FlowFixMe perf_hooks is a new API in node
 import {performance} from 'perf_hooks';

-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
 import type Client from '../Client';

--- a/src/dispatcher/types.js
+++ b/src/dispatcher/types.js
@@ -4,7 +4,7 @@
 * LICENSE file in the root directory of this source tree.
 * @format
 */
-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger';

 export type Dispatcher = (store: Store, logger: Logger) => ?() => Promise<void>;
--- a/src/dispatcher/user.js
+++ b/src/dispatcher/user.js
@@ -5,9 +5,9 @@
 * @format
 */

-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import type {Logger} from '../fb-interfaces/Logger.js';
-import {login} from '../reducers/user';
+import {login} from '../reducers/user.tsx';
 import {getUser, logoutUser} from '../fb-stubs/user';

 export default (store: Store, logger: Logger) => {
--- a/src/fb-stubs/BugReporter.js
+++ b/src/fb-stubs/BugReporter.js
@@ -7,7 +7,7 @@

 import type {Logger} from '../fb-interfaces/Logger';

-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';

 export default class BugReporter {
  constructor(logManager: Logger, store: Store) {}
--- a/src/fb-stubs/Logger.js
+++ b/src/fb-stubs/Logger.js
@@ -6,7 +6,7 @@
 */

 import type {TrackType, Logger} from '../fb-interfaces/Logger';
-import type {Store} from '../reducers/index';
+import type {Store} from '../reducers/index.tsx';
 import ScribeLogger from './ScribeLogger';

 let instance: ?StubLogger = null;
--- a/src/index.js
+++ b/src/index.js
@@ -24,10 +24,10 @@ export {clipboard} from 'electron';
 export * from './fb-stubs/constants.js';
 export * from './fb-stubs/createPaste.js';
 export {connect} from 'react-redux';
-export {selectPlugin} from './reducers/connections';
+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.js';
+export type {Store, MiddlewareAPI} from './reducers/index.tsx';

 export {
  default as SidebarExtensions,
--- a/src/init.js
+++ b/src/init.js
@@ -15,7 +15,7 @@ import BugReporter from './fb-stubs/BugReporter.js';
 import setupPrefetcher from './fb-stubs/Prefetcher.js';
 import {createStore} from 'redux';
 import {persistStore} from 'redux-persist';
-import reducers from './reducers/index.js';
+import reducers from './reducers/index.tsx';
 import dispatcher from './dispatcher/index.js';
 import TooltipProvider from './ui/components/TooltipProvider.js';
 import config from './utils/processConfig.js';
--- a/src/plugin.js
+++ b/src/plugin.js
@@ -9,7 +9,7 @@ import type {KeyboardActions} from './MenuBar.js';
 import type {App} from './App.js';
 import type {Logger} from './fb-interfaces/Logger.js';
 import type Client from './Client.js';
-import type {Store, MiddlewareAPI} from './reducers/index.js';
+import type {Store, MiddlewareAPI} from './reducers/index.tsx';
 import type {MetricType} from './utils/exportMetrics.js';
 import React from 'react';
 import type {Node} from 'react';
--- a/src/reducers/tests/connections.node.tsx
+++ b/src/reducers/tests/connections.node.tsx
@@ -7,7 +7,7 @@

 import reducer from '../connections';
 import BaseDevice from '../../devices/BaseDevice';
-import type {State} from '../connections';
+import {State} from '../connections';

 test('REGISTER_DEVICE doesnt remove error', () => {
  const initialState: State = reducer(undefined, {
--- a/src/reducers/tests/notifications.node.tsx
+++ b/src/reducers/tests/notifications.node.tsx
@@ -5,7 +5,7 @@
 * @format
 */

-import type {State} from '../notifications';
+import {State} from '../notifications';

 import {
  default as reducer,
--- a/src/reducers/tests/pluginStates.node.tsx
+++ b/src/reducers/tests/pluginStates.node.tsx
@@ -5,8 +5,7 @@
 * @format
 */

-import {default as reducer, setPluginState} from '../pluginStates';
-import type {Action} from '../pluginStates';
+import {default as reducer, setPluginState, Action} from '../pluginStates';

 test('reduce setPluginState', () => {
  const result = reducer(
--- a/src/reducers/tests/plugins.node.tsx
+++ b/src/reducers/tests/plugins.node.tsx
@@ -83,7 +83,6 @@ test('do not add other classes', () => {
      disabledPlugins: [],
      selectedPlugins: [],
    },
-    // $FlowFixMe testing wrong classes on purpose here
    registerPlugins([testBasePlugin]),
  );
  expect(res.devicePlugins.size).toEqual(0);
--- a/src/reducers/tests/user.node.tsx
+++ b/src/reducers/tests/user.node.tsx
@@ -8,7 +8,7 @@
 import {default as reducer, login, logout} from '../user';

 test('login', () => {
-  const userData = {username: 'Jane Doe'};
+  const userData = {name: 'Jane Doe'};
  const res = reducer({}, login(userData));
  expect(res).toEqual(userData);
 });
@@ -16,7 +16,7 @@ test('login', () => {
 test('logout', () => {
  const res = reducer(
    {
-      username: 'Jane Doe',
+      name: 'Jane Doe',
    },
    logout(),
  );
--- a/src/reducers/application.tsx
+++ b/src/reducers/application.tsx
@@ -7,8 +7,7 @@

 import {remote} from 'electron';
 import uuidv1 from 'uuid/v1';
-import {type Element as ReactElement} from 'react';
-import CancellableExportStatus from '../chrome/CancellableExportStatus';
+
 export const ACTIVE_SHEET_PLUGIN_SHEET: 'PLUGIN_SHEET' = 'PLUGIN_SHEET';
 export const ACTIVE_SHEET_BUG_REPORTER: 'BUG_REPORTER' = 'BUG_REPORTER';
 export const ACTIVE_SHEET_PLUGIN_DEBUGGER: 'PLUGIN_DEBUGGER' =
@@ -42,12 +41,16 @@ export type ServerPorts = {
  secure: number,
 };

-type SubShareType = {type: 'file', file: string} | {type: 'link'};
+type SubShareType =
+  | {
+      type: 'file',
+      file: string,
+    }
+  | {type: 'link'};

 export type ShareType = {
-  statusComponent?: ReactElement<typeof CancellableExportStatus>,
-  ...SubShareType,
-};
+  statusComponent?: React.ReactNode,
+} & SubShareType;

 export type State = {
  leftSidebarVisible: boolean,
@@ -55,12 +58,12 @@ export type State = {
  rightSidebarAvailable: boolean,
  windowIsFocused: boolean,
  activeSheet: ActiveSheet,
-  share: ?ShareType,
-  sessionId: ?string,
+  share: ShareType | null,
+  sessionId: string | null,
  serverPorts: ServerPorts,
  downloadingImportData: boolean,
  launcherMsg: LauncherMsg,
-  flipperRating: ?number,
+  flipperRating: number | null,
 };

 type BooleanActionType =
@@ -108,11 +111,11 @@ export type Action =
      },
    }
  | {
-      type: typeof UNSET_SHARE,
+      type: 'UNSET_SHARE',
    }
  | {
-      type: typeof SET_EXPORT_STATUS_MESSAGE,
-      payload: ReactElement<typeof CancellableExportStatus>,
+      type: 'SET_EXPORT_STATUS_MESSAGE',
+      payload: React.ReactNode,
    };

 const initialState: () => State = () => ({
@@ -195,7 +198,6 @@ export default function reducer(state: State, action: Action): State {
      const {share} = state;
      return {
        ...state,
-        //$FlowFixMe: T48110490, its not able to understand for which case it needs to apply the changes
        share: {...share, statusComponent: action.payload},
      };
    }
@@ -215,17 +217,6 @@ export const toggleAction = (
  payload,
 });

-export const unsetShare = (): Action => ({
-  type: UNSET_SHARE,
-});
-
-export const setExportStatusComponent = (
-  payload: ReactElement<typeof CancellableExportStatus>,
-): Action => ({
-  type: SET_EXPORT_STATUS_MESSAGE,
-  payload,
-});
-
 export const setSelectPluginsToExportActiveSheet = (
  payload: ShareType,
 ): Action => ({
--- a/src/reducers/connections.tsx
+++ b/src/reducers/connections.tsx
@@ -5,33 +5,32 @@
 * @format
 */

-import type BaseDevice from '../devices/BaseDevice';
+import BaseDevice from '../devices/BaseDevice';
 import MacDevice from '../devices/MacDevice';
-import type Client from '../Client';
-import type {UninitializedClient} from '../UninitializedClient';
+import Client from '../Client';
+import {UninitializedClient} from '../UninitializedClient';
 import {isEqual} from 'lodash';
 import iosUtil from '../fb-stubs/iOSContainerUtility';
-// $FlowFixMe perf_hooks is a new API in node
 import {performance} from 'perf_hooks';

-export type State = {|
+export type State = {
  devices: Array<BaseDevice>,
  androidEmulators: Array<string>,
-  selectedDevice: ?BaseDevice,
-  selectedPlugin: ?string,
-  selectedApp: ?string,
-  userPreferredDevice: ?string,
-  userPreferredPlugin: ?string,
-  userPreferredApp: ?string,
-  error: ?string,
+  selectedDevice: null | BaseDevice,
+  selectedPlugin: null | string,
+  selectedApp: null | string,
+  userPreferredDevice: null | string,
+  userPreferredPlugin: null | string,
+  userPreferredApp: null | string,
+  error: null | string,
  clients: Array<Client>,
  uninitializedClients: Array<{
    client: UninitializedClient,
    deviceId?: string,
    errorMessage?: string,
  }>,
-  deepLinkPayload: ?string,
-|};
+  deepLinkPayload: null | string,
+};

 export type Action =
  | {
@@ -52,11 +51,11 @@ export type Action =
    }
  | {
      type: 'SELECT_PLUGIN',
-      payload: {|
-        selectedPlugin: ?string,
-        selectedApp: ?string,
-        deepLinkPayload: ?string,
-      |},
+      payload: {
+        selectedPlugin: null | string,
+        selectedApp?: null | string,
+        deepLinkPayload: null | string,
+      },
    }
  | {
      type: 'SELECT_USER_PREFERRED_PLUGIN',
@@ -64,7 +63,7 @@ export type Action =
    }
  | {
      type: 'SERVER_ERROR',
-      payload: ?string,
+      payload: null | string,
    }
  | {
      type: 'NEW_CLIENT',
@@ -138,7 +137,7 @@ const reducer = (state: State = INITAL_STATE, action: Action): State => {
      let {selectedDevice, selectedPlugin} = state;

      // select the default plugin
-      let selection = {
+      let selection: Partial<State> = {
        selectedApp: null,
        selectedPlugin: DEFAULT_PLUGIN,
      };
@@ -270,7 +269,7 @@ const reducer = (state: State = INITAL_STATE, action: Action): State => {
    case 'CLIENT_REMOVED': {
      const {payload} = action;

-      const selected = {};
+      const selected: Partial<State> = {};
      if (state.selectedApp === payload) {
        selected.selectedApp = null;
        selected.selectedPlugin = DEFAULT_PLUGIN;
@@ -374,11 +373,11 @@ export const preferDevice = (payload: string): Action => ({
  payload,
 });

-export const selectPlugin = (payload: {|
-  selectedPlugin: ?string,
-  selectedApp?: ?string,
-  deepLinkPayload: ?string,
-|}): Action => ({
+export const selectPlugin = (payload: {
+  selectedPlugin: null | string,
+  selectedApp?: null | string,
+  deepLinkPayload: null | string,
+}): Action => ({
  type: 'SELECT_PLUGIN',
  payload,
 });
--- a/src/reducers/index.tsx
+++ b/src/reducers/index.tsx
@@ -5,42 +5,33 @@
 * @format
 */

-import {combineReducers} from 'redux';
-import application from './application.js';
-import connections from './connections.js';
-import pluginStates from './pluginStates.js';
-import notifications from './notifications.js';
-import plugins from './plugins.js';
-import user from './user.js';
+import {combineReducers, Dispatch} from 'redux';
+import application, {
+  State as ApplicationState,
+  Action as ApplicationAction,
+} from './application';
+import connections, {
+  State as DevicesState,
+  Action as DevicesAction,
+} from './connections';
+import pluginStates, {
+  State as PluginStatesState,
+  Action as PluginStatesAction,
+} from './pluginStates';
+import notifications, {
+  State as NotificationsState,
+  Action as NotificationsAction,
+} from './notifications';
+import plugins, {
+  State as PluginsState,
+  Action as PluginsAction,
+} from './plugins';
+import user, {State as UserState, Action as UserAction} from './user';

 import {persistReducer} from 'redux-persist';
 import storage from 'redux-persist/lib/storage/index.js';

-import type {
-  State as ApplicationState,
-  Action as ApplicationAction,
-} from './application.js';
-import type {
-  State as DevicesState,
-  Action as DevicesAction,
-} from './connections.js';
-import type {
-  State as PluginStatesState,
-  Action as PluginStatesAction,
-} from './pluginStates.js';
-import type {
-  State as NotificationsState,
-  Action as NotificationsAction,
-} from './notifications.js';
-import type {
-  State as PluginsState,
-  Action as PluginsAction,
-} from './plugins.js';
-import type {State as UserState, Action as UserAction} from './user.js';
-import type {
-  Store as ReduxStore,
-  MiddlewareAPI as ReduxMiddlewareAPI,
-} from 'redux';
+import {Store as ReduxStore, MiddlewareAPI as ReduxMiddlewareAPI} from 'redux';

 type Actions =
  | ApplicationAction
@@ -49,21 +40,21 @@ type Actions =
  | NotificationsAction
  | PluginsAction
  | UserAction
-  | {|type: 'INIT'|};
+  | {type: 'INIT'};

-export type State = {|
+export type State = {
  application: ApplicationState,
  connections: DevicesState,
  pluginStates: PluginStatesState,
  notifications: NotificationsState,
  plugins: PluginsState,
  user: UserState,
-|};
+};

 export type Store = ReduxStore<State, Actions>;
-export type MiddlewareAPI = ReduxMiddlewareAPI<State, Actions>;
+export type MiddlewareAPI = ReduxMiddlewareAPI<Dispatch<Actions>, State>;

-export default combineReducers<_, Actions>({
+export default combineReducers<State, Actions>({
  application: persistReducer(
    {
      key: 'application',
--- a/src/reducers/notifications.tsx
+++ b/src/reducers/notifications.tsx
@@ -4,13 +4,13 @@
 * LICENSE file in the root directory of this source tree.
 * @format
 */
-import type {Notification} from '../plugin';
+import {Notification} from '../plugin';

-export type PluginNotification = {|
+export type PluginNotification = {
  notification: Notification,
  pluginId: string,
-  client: ?string,
-|};
+  client: null | string,
+};

 export type State = {
  activeNotifications: Array<PluginNotification>,
@@ -24,7 +24,7 @@ type ActiveNotificationsAction = {
  type: 'SET_ACTIVE_NOTIFICATIONS',
  payload: {
    notifications: Array<Notification>,
-    client: ?string,
+    client: null | string,
    pluginId: string,
  },
 };
@@ -37,7 +37,7 @@ export type Action =
      type: 'SET_ACTIVE_NOTIFICATIONS',
      payload: {
        notifications: Array<Notification>,
-        client: ?string,
+        client: null | string,
        pluginId: string,
      },
    }
@@ -139,7 +139,7 @@ function activeNotificationsReducer(

 export function setActiveNotifications(payload: {
  notifications: Array<Notification>,
-  client: ?string,
+  client: null | string,
  pluginId: string,
 }): Action {
  return {
@@ -154,14 +154,14 @@ export function clearAllNotifications(): Action {
  };
 }

-export function updatePluginBlacklist(payload: Array<string>) {
+export function updatePluginBlacklist(payload: Array<string>): Action {
  return {
    type: 'UPDATE_PLUGIN_BLACKLIST',
    payload,
  };
 }

-export function updateCategoryBlacklist(payload: Array<string>) {
+export function updateCategoryBlacklist(payload: Array<string>): Action {
  return {
    type: 'UPDATE_CATEGORY_BLACKLIST',
    payload,
--- a/src/reducers/pluginStates.tsx
+++ b/src/reducers/pluginStates.tsx
--- a/src/reducers/plugins.tsx
+++ b/src/reducers/plugins.tsx
@@ -6,19 +6,18 @@
 */

 import {FlipperPlugin, FlipperDevicePlugin} from '../plugin.js';
-
-import type {PluginDefinition} from '../dispatcher/plugins';
+import {PluginDefinition} from '../dispatcher/plugins';

 export type State = {
-  devicePlugins: Map<string, Class<FlipperDevicePlugin<>>>,
-  clientPlugins: Map<string, Class<FlipperPlugin<>>>,
+  devicePlugins: Map<string, typeof FlipperDevicePlugin>,
+  clientPlugins: Map<string, typeof FlipperPlugin>,
  gatekeepedPlugins: Array<PluginDefinition>,
  disabledPlugins: Array<PluginDefinition>,
  failedPlugins: Array<[PluginDefinition, string]>,
  selectedPlugins: Array<string>,
 };

-type P = Class<FlipperPlugin<> | FlipperDevicePlugin<>>;
+type P = typeof FlipperPlugin | typeof FlipperDevicePlugin;

 export type Action =
  | {
--- a/src/reducers/user.tsx
+++ b/src/reducers/user.tsx
--- a/src/server.js
+++ b/src/server.js
@@ -8,7 +8,7 @@
 import type {SecureServerConfig} from './utils/CertificateProvider';
 import type {Logger} from './fb-interfaces/Logger';
 import type {ClientQuery} from './Client.js';
-import type {Store} from './reducers/index.js';
+import type {Store} from './reducers/index.tsx';

 import CertificateProvider from './utils/CertificateProvider';
 import {RSocketServer, ReactiveSocket} from 'rsocket-core';
--- a/src/ui/components/Sheet.js
+++ b/src/ui/components/Sheet.js
@@ -11,9 +11,9 @@ import {connect} from 'react-redux';
 import {
  ACTIVE_SHEET_PLUGIN_SHEET,
  setActiveSheet,
-} from '../../reducers/application.js';
+} from '../../reducers/application.tsx';

-import type {ActiveSheet} from '../../reducers/application';
+import type {ActiveSheet} from '../../reducers/application.tsx';

 export const PLUGIN_SHEET_ELEMENT_ID = 'pluginSheetContents';

--- a/src/utils/tests/pluginUtils.node.js
+++ b/src/utils/tests/pluginUtils.node.js
@@ -6,11 +6,11 @@
 */

 import {getPersistentPlugins, getActivePersistentPlugins} from '../pluginUtils';
-import type {State as PluginsState} from '../../reducers/plugins.js';
-import type {State as PluginStatesState} from '../../reducers/pluginStates.js';
+import type {State as PluginsState} from '../../reducers/plugins.tsx';
+import type {State as PluginStatesState} from '../../reducers/pluginStates.tsx';
 import type {PluginDefinition} from '../../dispatcher/plugins';
 import {FlipperBasePlugin} from '../../..';
-import type {MiddlewareAPI} from '../../reducers/index.js';
+import type {MiddlewareAPI} from '../../reducers/index.tsx';
 class MockFlipperPluginWithDefaultPersistedState extends FlipperBasePlugin<
  *,
  *,
@@ -46,15 +46,11 @@ function mockPluginState(
 ): PluginsState {
  return {
    devicePlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['DevicePlugin1', MockFlipperPluginWithDefaultPersistedState],
-      //$FlowFixMe: Just for testing
      ['DevicePlugin2', MockFlipperPluginWithDefaultPersistedState],
    ]),
    clientPlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['ClientPlugin1', MockFlipperPluginWithDefaultPersistedState],
-      //$FlowFixMe: Just for testing
      ['ClientPlugin2', MockFlipperPluginWithDefaultPersistedState],
    ]),
    gatekeepedPlugins,
@@ -95,15 +91,11 @@ test('getPersistentPlugins with no plugins getting excluded', () => {
 test('getPersistentPlugins, where the plugins with exportPersistedState not getting excluded', () => {
  const state: PluginsState = {
    devicePlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['DevicePlugin1', MockFlipperPluginWithExportPersistedState],
-      //$FlowFixMe: Just for testing
      ['DevicePlugin2', MockFlipperPluginWithExportPersistedState],
    ]),
    clientPlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['ClientPlugin1', MockFlipperPluginWithExportPersistedState],
-      //$FlowFixMe: Just for testing
      ['ClientPlugin2', MockFlipperPluginWithExportPersistedState],
    ]),
    gatekeepedPlugins: [],
@@ -123,15 +115,11 @@ test('getPersistentPlugins, where the plugins with exportPersistedState not gett
 test('getPersistentPlugins, where the non persistent plugins getting excluded', () => {
  const state: PluginsState = {
    devicePlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['DevicePlugin1', MockFlipperPluginWithNoPersistedState],
-      //$FlowFixMe: Just for testing
      ['DevicePlugin2', MockFlipperPluginWithDefaultPersistedState],
    ]),
    clientPlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['ClientPlugin1', MockFlipperPluginWithDefaultPersistedState],
-      //$FlowFixMe: Just for testing
      ['ClientPlugin2', MockFlipperPluginWithNoPersistedState],
    ]),
    gatekeepedPlugins: [],
@@ -146,15 +134,11 @@ test('getPersistentPlugins, where the non persistent plugins getting excluded',
 test('getActivePersistentPlugins, where the non persistent plugins getting excluded', () => {
  const state: PluginsState = {
    devicePlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['DevicePlugin1', MockFlipperPluginWithNoPersistedState],
-      //$FlowFixMe: Just for testing
      ['DevicePlugin2', MockFlipperPluginWithDefaultPersistedState],
    ]),
    clientPlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['ClientPlugin1', MockFlipperPluginWithDefaultPersistedState],
-      //$FlowFixMe: Just for testing
      ['ClientPlugin2', MockFlipperPluginWithNoPersistedState],
    ]),
    gatekeepedPlugins: [],
@@ -175,15 +159,11 @@ test('getActivePersistentPlugins, where the non persistent plugins getting exclu
 test('getActivePersistentPlugins, where the plugins not in pluginState gets excluded', () => {
  const state: PluginsState = {
    devicePlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['DevicePlugin1', MockFlipperPluginWithDefaultPersistedState],
-      //$FlowFixMe: Just for testing
      ['DevicePlugin2', MockFlipperPluginWithDefaultPersistedState],
    ]),
    clientPlugins: new Map([
-      //$FlowFixMe: Just for testing
      ['ClientPlugin1', MockFlipperPluginWithDefaultPersistedState],
-      //$FlowFixMe: Just for testing
      ['ClientPlugin2', MockFlipperPluginWithDefaultPersistedState],
    ]),
    gatekeepedPlugins: [],
--- a/src/utils/exportData.js
+++ b/src/utils/exportData.js
@@ -5,13 +5,13 @@
 * @format
 */
 import {getInstance as getLogger} from '../fb-stubs/Logger';
-import type {Store, MiddlewareAPI} from '../reducers';
+import type {Store, MiddlewareAPI} from '../reducers.tsx';
 import type {DeviceExport} from '../devices/BaseDevice';
-import type {State as PluginStates} from '../reducers/pluginStates';
-import type {PluginNotification} from '../reducers/notifications.js';
+import type {State as PluginStates} from '../reducers/pluginStates.tsx';
+import type {PluginNotification} from '../reducers/notifications.tsx';
 import type {ClientExport} from '../Client.js';
-import type {State as PluginStatesState} from '../reducers/pluginStates';
-import {pluginKey} from '../reducers/pluginStates';
+import type {State as PluginStatesState} from '../reducers/pluginStates.tsx';
+import {pluginKey} from '../reducers/pluginStates.tsx';
 import {FlipperDevicePlugin, FlipperPlugin, callClient} from '../plugin.js';
 import {default as BaseDevice} from '../devices/BaseDevice';
 import {default as ArchivedDevice} from '../devices/ArchivedDevice';
--- a/src/utils/exportMetrics.js
+++ b/src/utils/exportMetrics.js
@@ -6,8 +6,8 @@
 */
 import type {FlipperPlugin, FlipperDevicePlugin} from 'flipper';
 import {serialize} from './serialization';
-import type {State as PluginStatesState} from '../reducers/pluginStates';
-import type {Store} from '../reducers';
+import type {State as PluginStatesState} from '../reducers/pluginStates.tsx';
+import type {Store} from '../reducers/index.tsx';
 import fs from 'fs';
 import type {ExportType} from './exportData';
 import {fetchMetadata, pluginsClassMap} from './exportData';
--- a/src/utils/launcher.js
+++ b/src/utils/launcher.js
@@ -6,7 +6,7 @@
 */

 import type {ProcessConfig} from './processConfig.js';
-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';

 export function initLauncherHooks(config: ProcessConfig, store: Store) {
  if (config.launcherMsg) {
--- a/src/utils/onRegisterDevice.js
+++ b/src/utils/onRegisterDevice.js
@@ -4,10 +4,10 @@
 * LICENSE file in the root directory of this source tree.
 * @format
 */
-import type {Store} from '../reducers/index.js';
+import type {Store} from '../reducers/index.tsx';
 import {FlipperPlugin, FlipperDevicePlugin} from '../plugin.js';
 import type BaseDevice from '../devices/BaseDevice.js';
-import {setPluginState} from '../reducers/pluginStates.js';
+import {setPluginState} from '../reducers/pluginStates.tsx';
 import {getPersistedState} from '../utils/pluginUtils.js';

 export function registerDeviceCallbackOnPlugins(
--- a/src/utils/pluginUtils.js
+++ b/src/utils/pluginUtils.js
@@ -6,9 +6,9 @@
 */
 import type BaseDevice from '../devices/BaseDevice.js';
 import {FlipperDevicePlugin, FlipperPlugin} from '../plugin.js';
-import type {State as PluginStatesState} from '../reducers/pluginStates.js';
+import type {State as PluginStatesState} from '../reducers/pluginStates.tsx';
 import {pluginsClassMap} from './exportData.js';
-import type {State as PluginsState} from '../reducers/plugins.js';
+import type {State as PluginsState} from '../reducers/plugins.tsx';
 import type {PluginDefinition} from '../dispatcher/plugins';

 export function getPluginKey(
--- a/src/utils/reduxDevToolsConfig.js
+++ b/src/utils/reduxDevToolsConfig.js
@@ -4,7 +4,7 @@
 * LICENSE file in the root directory of this source tree.
 * @format
 */
-import type {State} from '../reducers/index';
+import {State} from '../reducers/index.tsx';
 import type {DeviceExport} from '../devices/BaseDevice';

 export const stateSanitizer = (state: State) => {
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -2,6 +2,7 @@
  "compilerOptions": {
    "module": "system",
    "lib": ["es7", "dom"],
+    "target": "es6",
    "removeComments": true,
    "preserveConstEnums": true,
    "outFile": "../../built/local/tsc.js",
--- a/yarn.lock
+++ b/yarn.lock
@@ -1104,6 +1104,18 @@
    "@types/istanbul-lib-coverage" "*"
    "@types/istanbul-lib-report" "*"

+"@types/jest-diff@*":
+  version "20.0.1"
+  resolved "https://registry.yarnpkg.com/@types/jest-diff/-/jest-diff-20.0.1.tgz#35cc15b9c4f30a18ef21852e255fdb02f6d59b89"
+  integrity sha512-yALhelO3i0hqZwhjtcr6dYyaLoCHbAMshwtj6cGxTvHZAKXHsYGdff6E8EPw3xLKY0ELUTQ69Q1rQiJENnccMA==
+
+"@types/jest@^24.0.16":
+  version "24.0.16"
+  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-24.0.16.tgz#8d3e406ec0f0dc1688d6711af3062ff9bd428066"
+  integrity sha512-JrAiyV+PPGKZzw6uxbI761cHZ0G7QMOHXPhtSpcl08rZH6CswXaaejckn3goFKmF7M3nzEoJ0lwYCbqLMmjziQ==
+  dependencies:
+    "@types/jest-diff" "*"
+
 "@types/json-schema@^7.0.3":
  version "7.0.3"
  resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.3.tgz#bdfd69d61e464dcc81b25159c270d75a73c1a636"
@@ -1115,9 +1127,9 @@
  integrity sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==

 "@types/node@*":
-  version "12.6.8"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-12.6.8.tgz#e469b4bf9d1c9832aee4907ba8a051494357c12c"
-  integrity sha512-aX+gFgA5GHcDi89KG5keey2zf0WfZk/HAQotEamsK2kbey+8yGKcson0hbK8E+v0NArlCJQCqMP161YhV6ZXLg==
+  version "12.6.9"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-12.6.9.tgz#ffeee23afdc19ab16e979338e7b536fdebbbaeaf"
+  integrity sha512-+YB9FtyxXGyD54p8rXwWaN1EWEyar5L58GlGWgtH2I9rGmLGBQcw63+0jw+ujqVavNuO47S1ByAjm9zdHMnskw==

 "@types/node@^10.12.18":
  version "10.14.13"
@@ -1136,7 +1148,7 @@
  dependencies:
    "@types/react" "*"

-"@types/react-redux@^7.1.0":
+"@types/react-redux@^7.1.1":
  version "7.1.1"
  resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.1.1.tgz#eb01e89cf71cad77df9f442b819d5db692b997cb"
  integrity sha512-owqNahzE8en/jR4NtrUJDJya3tKru7CIEGSRL/pVS84LtSCdSoT7qZTkrbBd3S4Lp11sAp+7LsvxIeONJVKMnw==
@@ -1146,19 +1158,33 @@
    hoist-non-react-statics "^3.3.0"
    redux "^4.0.0"

-"@types/react@*", "@types/react@^16.8.21":
-  version "16.8.23"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.8.23.tgz#ec6be3ceed6353a20948169b6cb4c97b65b97ad2"
-  integrity sha512-abkEOIeljniUN9qB5onp++g0EY38h7atnDHxwKUFz1r3VH1+yG1OKi2sNPTyObL40goBmfKFpdii2lEzwLX1cA==
+"@types/react@*", "@types/react@^16.8.24":
+  version "16.8.24"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.8.24.tgz#8d1ea1fcbfa214220da3d3c04e506f1077b0deac"
+  integrity sha512-VpFHUoD37YNY2+lr/+c7qL/tZsIU/bKuskUF3tmGUArbxIcQdb5j3zvo4cuuzu2A6UaVmVn7sJ4PgWYNFEBGzg==
  dependencies:
    "@types/prop-types" "*"
    csstype "^2.2.0"

+"@types/redux-persist@^4.3.1":
+  version "4.3.1"
+  resolved "https://registry.yarnpkg.com/@types/redux-persist/-/redux-persist-4.3.1.tgz#aa4c876859e0bea5155e5f7980e5b8c4699dc2e6"
+  integrity sha1-qkyHaFngvqUVXl95gOW4xGmdwuY=
+  dependencies:
+    redux-persist "*"
+
 "@types/stack-utils@^1.0.1":
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-1.0.1.tgz#0a851d3bd96498fa25c33ab7278ed3bd65f06c3e"
  integrity sha512-l42BggppR6zLmpfU6fq9HEa2oGPEI8yrSPL3GITjfRInppYFahObbIQOQK3UGxEnyQpltZLaPe75046NOZQikw==

+"@types/uuid@^3.4.5":
+  version "3.4.5"
+  resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-3.4.5.tgz#d4dc10785b497a1474eae0ba7f0cb09c0ddfd6eb"
+  integrity sha512-MNL15wC3EKyw1VLF+RoVO4hJJdk9t/Hlv3rt1OL65Qvuadm4BYo6g9ZJQqoq7X8NBFSsQXgAujWciovh2lpVjA==
+  dependencies:
+    "@types/node" "*"
+
 "@types/yargs@^12.0.2", "@types/yargs@^12.0.9":
  version "12.0.12"
  resolved "https://registry.yarnpkg.com/@types/yargs/-/yargs-12.0.12.tgz#45dd1d0638e8c8f153e87d296907659296873916"
@@ -2598,11 +2624,15 @@ cssstyle@^1.0.0:
  dependencies:
    cssom "0.3.x"

-csstype@^2.2.0, csstype@^2.5.2:
+csstype@^2.2.0:
  version "2.6.6"
  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.6.tgz#c34f8226a94bbb10c32cc0d714afdf942291fc41"
  integrity sha512-RpFbQGUE74iyPgvr46U9t1xoQBM8T4BL8SxrN66Le2xYAPSaDJJKeztV3awugusb3g3G9iL8StmkBBXhcbbXhg==

+csstype@^2.5.2:
+  version "2.5.6"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.6.tgz#2ae1db2319642d8b80a668d2d025c6196071e788"
+
 currently-unhandled@^0.4.1:
  version "0.4.1"
  resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -7200,7 +7230,7 @@ redux-mock-store@^1.5.3:
  dependencies:
    lodash.isplainobject "^4.0.6"

-redux-persist@^5.10.0:
+redux-persist@*, redux-persist@^5.10.0:
  version "5.10.0"
  resolved "https://registry.yarnpkg.com/redux-persist/-/redux-persist-5.10.0.tgz#5d8d802c5571e55924efc1c3a9b23575283be62b"
  integrity sha512-sSJAzNq7zka3qVHKce1hbvqf0Vf5DuTVm7dr4GtsqQVOexnrvbV47RWFiPxQ8fscnyiuWyD2O92DOxPl0tGCRg==