Add flow types; related to #24

flow-typed/glamor.js

@@ -15,3 +15,7 @@ declare module 'glamor/react' {
     propMerge: Function,
   };
 }
+
+declare module 'glamor/reset' {
+  declare module.exports: any;
+}

flow-typed/polyfills.js

@@ -0,0 +1,11 @@
+declare module 'array-from' {
+  declare module.exports: any;
+}
+
+declare module 'string.prototype.includes' {
+  declare module.exports: any;
+}
+
+declare module 'string.prototype.repeat' {
+  declare module.exports: any;
+}

src/components/ErrorDecoder/ErrorDecoder.js

@@ -2,14 +2,14 @@
  * Copyright (c) 2013-present, Facebook, Inc.
  *
  * @emails react-core
+ * @flow
  */
 
 'use strict';
 
 import React, {Component} from 'react';
-import PropTypes from 'prop-types';
 
-function replaceArgs(msg, argList) {
+function replaceArgs(msg: string, argList: Array<any>): string {
   let argIdx = 0;
   return msg.replace(/%s/g, function() {
     const arg = argList[argIdx++];
@@ -17,7 +17,7 @@ function replaceArgs(msg, argList) {
   });
 }
 
-function urlify(str) {
+function urlify(str: string): Array<any> {
   const urlRegex = /(https:\/\/fb\.me\/[a-z\-]+)/g;
 
   const segments = str.split(urlRegex);
@@ -25,6 +25,7 @@ function urlify(str) {
   for (let i = 0; i < segments.length; i++) {
     if (i % 2 === 1) {
       segments[i] = (
+        // $FlowFixMe: We need to properly trace this error: React element 'a' inconsistent use of library definitions
         <a key={i} target="_blank" rel="noopener" href={segments[i]}>
           {segments[i]}
         </a>
@@ -36,7 +37,7 @@ function urlify(str) {
 }
 
 // ?invariant=123&args[]=foo&args[]=bar
-function parseQueryString(location) {
+function parseQueryString(location: Location): null | Array<any> {
   const rawQueryString = location.search.substring(1);
   if (!rawQueryString) {
     return null;
@@ -58,7 +59,12 @@ function parseQueryString(location) {
   return [code, args];
 }
 
-function ErrorResult(props) {
+type ErrorResultProps = {
+  code: mixed,
+  msg: string,
+};
+
+function ErrorResult(props: ErrorResultProps) {
   const code = props.code;
   const errorMsg = props.msg;
 
@@ -79,8 +85,18 @@ function ErrorResult(props) {
   );
 }
 
-class ErrorDecoder extends Component {
+type ErrorDecoderProps = {
-  constructor(...args) {
+  errorCodesString: string,
+  location: Location,
+};
+
+type State = {
+  code: mixed,
+  errorMsg: string,
+};
+
+class ErrorDecoder extends Component<ErrorDecoderProps, State> {
+  constructor(...args: Array<any>) {
     super(...args);
 
     this.state = {
@@ -109,9 +125,4 @@ class ErrorDecoder extends Component {
   }
 }
 
-ErrorDecoder.propTypes = {
-  errorCodesString: PropTypes.string.isRequired,
-  location: PropTypes.object.isRequired,
-};
-
 export default ErrorDecoder;

src/layouts/index.js

@@ -2,10 +2,13 @@
  * Copyright (c) 2013-present, Facebook, Inc.
  *
  * @emails react-core
+ * @flow
  */
 
 'use strict';
 
+// FIXME: I actually cannot figure out where this Template is used
+
 // Polyfills for IE
 import 'array-from';
 import 'string.prototype.includes';
@@ -23,7 +26,12 @@ import 'glamor/reset';
 import 'css/reset.css';
 import 'css/algolia.css';
 
-class Template extends Component {
+type Props = {
+  children: any, // I don't think this is a Node type
+  location: Location,
+};
+
+class Template extends Component<Props> {
   render() {
     const {children, location} = this.props;
 

src/pages/docs/error-decoder.html.js

@@ -2,6 +2,7 @@
  * Copyright (c) 2013-present, Facebook, Inc.
  *
  * @emails react-core
+ * @flow
  */
 
 'use strict';
@@ -19,7 +20,12 @@ import {createLinkDocs} from 'utils/createLink';
 import findSectionForPath from 'utils/findSectionForPath';
 import {sectionListDocs} from 'utils/sectionList';
 
-const ErrorPage = ({data, location}) => (
+type Props = {
+  data: Object,
+  location: Location,
+};
+
+const ErrorPage = ({data, location}: Props) => (
   <Flex
     direction="column"
     grow="1"