Merge pull request #156 from tricinel/feature/flow-types

Switch to flow types; wip related to #24

flow-typed/react-helmet.js

@@ -0,0 +1,3 @@
+declare module 'react-helmet' {
+  declare module.exports: any;
+}

src/components/Header/Header.js

@@ -2,6 +2,7 @@
  * Copyright (c) 2013-present, Facebook, Inc.
  *
  * @emails react-core
+ * @flow
  */
 
 'use strict';
@@ -9,7 +10,9 @@
 import React from 'react';
 import {colors, fonts} from 'theme';
 
-const Header = ({children}) => (
+import type {Node} from 'react';
+
+const Header = ({children}: {children: Node}) => (
   <h1
     css={{
       color: colors.dark,

src/components/MarkdownHeader/MarkdownHeader.js

@@ -2,16 +2,16 @@
  * Copyright (c) 2013-present, Facebook, Inc.
  *
  * @emails react-core
+ * @flow
  */
 
 'use strict';
 
 import Flex from 'components/Flex';
-import PropTypes from 'prop-types';
 import React from 'react';
 import {colors, fonts, media} from 'theme';
 
-const MarkdownHeader = ({title}) => (
+const MarkdownHeader = ({title}: {title: string}) => (
   <Flex type="header" halign="space-between" valign="baseline">
     <h1
       css={{
@@ -33,8 +33,4 @@ const MarkdownHeader = ({title}) => (
   </Flex>
 );
 
-MarkdownHeader.propTypes = {
-  title: PropTypes.string.isRequired,
-};
-
 export default MarkdownHeader;

src/components/MarkdownPage/MarkdownPage.js

@@ -2,6 +2,7 @@
  * Copyright (c) 2013-present, Facebook, Inc.
  *
  * @emails react-core
+ * @flow
  */
 
 'use strict';
@@ -10,7 +11,6 @@ import Container from 'components/Container';
 import Flex from 'components/Flex';
 import MarkdownHeader from 'components/MarkdownHeader';
 import NavigationFooter from 'templates/components/NavigationFooter';
-import PropTypes from 'prop-types';
 import React from 'react';
 import StickyResponsiveSidebar from 'components/StickyResponsiveSidebar';
 import TitleAndMetaTags from 'components/TitleAndMetaTags';
@@ -19,8 +19,22 @@ import toCommaSeparatedList from 'utils/toCommaSeparatedList';
 import {sharedStyles} from 'theme';
 import createOgUrl from 'utils/createOgUrl';
 
+import type {Node} from 'types';
+
+type Props = {
+  authors: Array<string>,
+  createLink: Function, // TODO: Add better flow type once we Flow-type createLink
+  date?: string,
+  enableScrollSync?: boolean,
+  ogDescription: string,
+  location: Location,
+  markdownRemark: Node,
+  sectionList: Array<Object>, // TODO: Add better flow type once we have the Section component
+  titlePostfix: string,
+};
+
 const MarkdownPage = ({
-  authors,
+  authors = [],
   createLink,
   date,
   enableScrollSync,
@@ -29,7 +43,7 @@ const MarkdownPage = ({
   markdownRemark,
   sectionList,
   titlePostfix = '',
-}) => {
+}: Props) => {
   const hasAuthors = authors.length > 0;
   const titlePrefix = markdownRemark.frontmatter.title || '';
 
@@ -122,19 +136,4 @@ const MarkdownPage = ({
   );
 };
 
-MarkdownPage.defaultProps = {
-  authors: [],
-};
-
-// TODO Better types
-MarkdownPage.propTypes = {
-  authors: PropTypes.array.isRequired,
-  createLink: PropTypes.func.isRequired,
-  date: PropTypes.string,
-  enableScrollSync: PropTypes.bool,
-  location: PropTypes.object.isRequired,
-  markdownRemark: PropTypes.object.isRequired,
-  sectionList: PropTypes.array.isRequired,
-};
-
 export default MarkdownPage;

src/components/TitleAndMetaTags/TitleAndMetaTags.js

@@ -2,6 +2,7 @@
  * Copyright (c) 2013-present, Facebook, Inc.
  *
  * @emails react-core
+ * @flow
  */
 
 'use strict';
@@ -11,7 +12,13 @@ import React from 'react';
 
 const defaultDescription = 'A JavaScript library for building user interfaces';
 
-const TitleAndMetaTags = ({title, ogDescription, ogUrl}) => {
+type Props = {
+  title: string,
+  ogDescription: string,
+  ogUrl: string,
+};
+
+const TitleAndMetaTags = ({title, ogDescription, ogUrl}: Props) => {
   return (
     <Helmet title={title}>
       <meta property="og:title" content={title} />

src/templates/components/ChevronSvg/index.js

@@ -2,13 +2,19 @@
  * Copyright (c) 2013-present, Facebook, Inc.
  *
  * @emails react-core
+ * @flow
  */
 
 'use strict';
 
 import React from 'react';
 
-const ChevronSvg = ({size = 10, cssProps = {}}) => (
+type Props = {
+  size: number,
+  cssProps: Object,
+};
+
+const ChevronSvg = ({size = 10, cssProps = {}}: Props) => (
   <svg
     css={cssProps}
     viewBox="0 0 926.23699 573.74994"

src/templates/components/ExternalLinkSvg/index.js

@@ -8,7 +8,7 @@
 
 import React from 'react';
 
-const ExternalLinkSvg = ({cssProps = {}}) => (
+const ExternalLinkSvg = ({cssProps = {}}: {cssProps: Object}) => (
   <svg
     x="0px"
     y="0px"