From e199ee95d3f16c560d4df74a494a8a243a5090ae 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] ResizeSensor

Summary: _typescript_

Reviewed By: priteshrnandgaonkar

Differential Revision: D16828871

fbshipit-source-id: d88c65178f0728b40414c9eab66d0402d7d51edd
---
 .../{ResizeSensor.js => ResizeSensor.tsx}           | 13 +++++++------
 src/ui/index.js                                     |  2 +-
 2 files changed, 8 insertions(+), 7 deletions(-)
 rename src/ui/components/{ResizeSensor.js => ResizeSensor.tsx} (76%)

diff --git a/src/ui/components/ResizeSensor.js b/src/ui/components/ResizeSensor.tsx
similarity index 76%
rename from src/ui/components/ResizeSensor.js
rename to src/ui/components/ResizeSensor.tsx
index 04abf8d60..5baa4df29 100644
--- a/src/ui/components/ResizeSensor.js
+++ b/src/ui/components/ResizeSensor.tsx
@@ -5,8 +5,9 @@
  * @format
  */
 
-import styled from '../styled/index.js';
+import styled from 'react-emotion';
 import {Component} from 'react';
+import React from 'react';
 
 const IFrame = styled('iframe')({
   height: '100%',
@@ -24,11 +25,11 @@ const IFrame = styled('iframe')({
  */
 export default class ResizeSensor extends Component<{
   /** Callback when resize happened */
-  onResize: (e: UIEvent) => void,
+  onResize: (e: UIEvent) => void;
 }> {
-  iframe: ?HTMLIFrameElement;
+  iframe: HTMLIFrameElement | undefined;
 
-  setRef = (ref: ?HTMLIFrameElement) => {
+  setRef = (ref: HTMLIFrameElement | undefined) => {
     this.iframe = ref;
   };
 
@@ -50,7 +51,7 @@ export default class ResizeSensor extends Component<{
     }
   }
 
-  handleResize = () => {
-    window.requestAnimationFrame(this.props.onResize);
+  handleResize = (e: UIEvent) => {
+    window.requestAnimationFrame(() => this.props.onResize(e));
   };
 }
diff --git a/src/ui/index.js b/src/ui/index.js
index 77cf4526e..cb811f06e 100644
--- a/src/ui/index.js
+++ b/src/ui/index.js
@@ -132,7 +132,7 @@ export {default as PathBreadcrumbs} from './components/PathBreadcrumbs.tsx';
 export {default as ModalOverlay} from './components/ModalOverlay.tsx';
 export {default as Tooltip} from './components/Tooltip.js';
 export {default as TooltipProvider} from './components/TooltipProvider.js';
-export {default as ResizeSensor} from './components/ResizeSensor.js';
+export {default as ResizeSensor} from './components/ResizeSensor.tsx';
 export {default as StatusIndicator} from './components/StatusIndicator.js';
 
 // typography