From 4305aba816d6598350aa9841170c28e9bd26a96f 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 Sheet from js to ts

Summary: Migrated Sheet.js to Sheet.tsx

Reviewed By: passy

Differential Revision: D16735685

fbshipit-source-id: f910b38c9d0a8ac5d77203385599a03d0a4bc5bd
---
 src/App.js                         |  2 +-
 src/chrome/{Sheet.js => Sheet.tsx} | 38 +++++++++++++++++-------------
 2 files changed, 22 insertions(+), 18 deletions(-)
 rename src/chrome/{Sheet.js => Sheet.tsx} (80%)

diff --git a/src/App.js b/src/App.js
index 8cddaa501..8edf3a80a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -18,7 +18,7 @@ import SignInSheet from './chrome/SignInSheet.tsx';
 import ExportDataPluginSheet from './chrome/ExportDataPluginSheet.tsx';
 import ShareSheetExportFile from './chrome/ShareSheetExportFile.tsx';
 import PluginContainer from './PluginContainer.js';
-import Sheet from './chrome/Sheet.js';
+import Sheet from './chrome/Sheet.tsx';
 import {ipcRenderer, remote} from 'electron';
 import PluginDebugger from './chrome/PluginDebugger.tsx';
 import {
diff --git a/src/chrome/Sheet.js b/src/chrome/Sheet.tsx
similarity index 80%
rename from src/chrome/Sheet.js
rename to src/chrome/Sheet.tsx
index b7396da34..6570c92fa 100644
--- a/src/chrome/Sheet.js
+++ b/src/chrome/Sheet.tsx
@@ -5,15 +5,16 @@
  * @format
  */
 
-import {Component} from 'react';
+import React, {Component} from 'react';
 import {Transition} from 'react-transition-group';
-import {setActiveSheet} from '../reducers/application.tsx';
+import {setActiveSheet} from '../reducers/application';
 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.tsx';
+import {ACTIVE_SHEET_PLUGIN_SHEET} from '../reducers/application';
+import {State as Store} from '../reducers';
 
-import type {ActiveSheet} from '../reducers/application.tsx';
+import {ActiveSheet} from '../reducers/application';
 
 const DialogContainer = styled('div')(({state}) => ({
   transform: `translate(-50%, ${
@@ -35,26 +36,29 @@ const DialogContainer = styled('div')(({state}) => ({
   boxShadow: '0 5px 13px rgba(0, 0, 0, 0.2)',
 }));
 
-type OwnProps = {|
-  children: (onHide: () => mixed) => any,
-|};
+type OwnProps = {
+  children: (onHide: () => any) => any;
+};
 
-type Props = {|
-  ...OwnProps,
-  activeSheet: ActiveSheet,
-  onHideSheet: () => void,
-|};
+type StateFromProps = {
+  activeSheet: ActiveSheet;
+};
 
-type State = {|
-  isVisible: boolean,
-|};
+type DispatchFromProps = {
+  onHideSheet: () => void;
+};
 
+type State = {
+  isVisible: boolean;
+};
+
+type Props = OwnProps & StateFromProps & DispatchFromProps;
 class Sheet extends Component<Props, State> {
   state = {
     isVisible: Boolean(this.props.activeSheet),
   };
 
-  static getDerivedStateFromProps(props: Props, state: State) {
+  static getDerivedStateFromProps(props: Props) {
     if (!props.activeSheet) {
       return {
         isVisible: true,
@@ -110,7 +114,7 @@ class Sheet extends Component<Props, State> {
   }
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(
+export default connect<StateFromProps, DispatchFromProps, OwnProps, Store>(
   ({application: {activeSheet}}) => ({
     activeSheet,
   }),