Flow for all the files

frontend/scenes/DocumentEdit/components/Editor.js

@@ -1,3 +1,4 @@
+// @flow
 import React from 'react';
 import { observer } from 'mobx-react';
 import { convertToMarkdown } from 'utils/markdown';

frontend/scenes/DocumentEdit/components/EditorLoader.js

@@ -1,5 +1,7 @@
+// @flow
 export default () => {
   return new Promise(resolve => {
+    // $FlowIssue this is available with webpack
     require.ensure([], () => {
       resolve({
         Editor: require('./Editor').default,

frontend/scenes/DocumentEdit/components/EditorPane.js

@@ -1,18 +1,21 @@
+// @flow
 import React from 'react';
 
 import styles from '../DocumentEdit.scss';
 import classNames from 'classnames/bind';
 const cx = classNames.bind(styles);
 
-class EditorPane extends React.Component {
-  static propTypes = {
-    children: React.PropTypes.node.isRequired,
-    onScroll: React.PropTypes.func.isRequired,
-    scrollTop: React.PropTypes.number,
-    fullWidth: React.PropTypes.bool,
-  };
+type Props = {
+  children?: ?React.Element<any>,
+  onScroll?: Function,
+  scrollTop?: ?number,
+  fullWidth?: ?boolean,
+};
 
-  componentWillReceiveProps = nextProps => {
+class EditorPane extends React.Component {
+  props: Props;
+
+  componentWillReceiveProps = (nextProps: Props) => {
     if (nextProps.scrollTop) {
       this.scrollToPosition(nextProps.scrollTop);
     }
@@ -26,15 +29,16 @@ class EditorPane extends React.Component {
     this.refs.pane.removeEventListener('scroll', this.handleScroll);
   };
 
-  handleScroll = e => {
+  handleScroll = (e: Event) => {
     setTimeout(() => {
       const element = this.refs.pane;
       const contentEl = this.refs.content;
-      this.props.onScroll(element.scrollTop / contentEl.offsetHeight);
+      this.props.onScroll &&
+        this.props.onScroll(element.scrollTop / contentEl.offsetHeight);
     }, 50);
   };
 
-  scrollToPosition = percentage => {
+  scrollToPosition = (percentage: number) => {
     const contentEl = this.refs.content;
 
     // Push to edges

frontend/scenes/DocumentEdit/components/Preview/Preview.js

@@ -1,3 +1,4 @@
+// @flow
 import React from 'react';
 
 import { DocumentHtml } from 'components/Document';
@@ -6,7 +7,11 @@ import styles from './Preview.scss';
 import classNames from 'classnames/bind';
 const cx = classNames.bind(styles);
 
-const Preview = props => {
+type Props = {
+  html: ?string,
+};
+
+const Preview = (props: Props) => {
   return (
     <div className={cx(styles.container)}>
       <DocumentHtml html={props.html} />
@@ -14,8 +19,4 @@ const Preview = props => {
   );
 };
 
-Preview.propTypes = {
-  html: React.PropTypes.string.isRequired,
-};
-
 export default Preview;

frontend/scenes/DocumentEdit/components/Preview/index.js

@@ -1,2 +1,3 @@
+// @flow
 import Preview from './Preview';
 export default Preview;