kriasoft · langpavel · Aug 7, 2018 · Sep 4, 2018 · Feb 19, 2019 · Mar 21, 2019
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -10,25 +10,29 @@
 // ESLint configuration
 // http://eslint.org/docs/user-guide/configuring
 module.exports = {
-  parser: 'babel-eslint',
+  parser: '@typescript-eslint/parser',
 
   extends: [
     'airbnb',
-    'plugin:flowtype/recommended',
     'plugin:css-modules/recommended',
     'prettier',
-    'prettier/flowtype',
     'prettier/react',
   ],
 
-  plugins: ['flowtype', 'css-modules', 'prettier'],
+  plugins: ['@typescript-eslint/eslint-plugin', 'css-modules', 'prettier', 'jest'],
+
+  parserOptions: {
+    sourceType: 'module',
+    project: './tsconfig.json',
+  },
 
   globals: {
     __DEV__: true,
   },
 
   env: {
     browser: true,
+    jest: true,
   },
 
   rules: {
@@ -46,6 +50,15 @@ module.exports = {
       },
     ],
 
+    // Allow only special identifiers
+    // https://eslint.org/docs/rules/no-underscore-dangle
+    'no-underscore-dangle': [
+      'error',
+      {
+        allow: ['__typename', '__DEV__'],
+      },
+    ],
+
     // Prefer destructuring from arrays and objects
     // http://eslint.org/docs/rules/prefer-destructuring
     'prefer-destructuring': [
@@ -78,7 +91,7 @@ module.exports = {
 
     // Allow .js files to use JSX syntax
     // https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-filename-extension.md
-    'react/jsx-filename-extension': ['error', { extensions: ['.js', '.jsx'] }],
+    'react/jsx-filename-extension': [1, { extensions: ['.ts', '.tsx'] }],
 
     // Functional and class components are equivalent from React’s point of view
     // https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/prefer-stateless-function.md
@@ -90,15 +103,29 @@ module.exports = {
 
     'react/forbid-prop-types': 'off',
     'react/destructuring-assignment': 'off',
-  },
+    'react/jsx-props-no-spreading': 'off',
+    'react/static-property-placement': 'off',
 
-  settings: {
-    // Allow absolute paths in imports, e.g. import Button from 'components/Button'
-    // https://github.com/benmosher/eslint-plugin-import/tree/master/resolvers
-    'import/resolver': {
-      node: {
-        moduleDirectory: ['node_modules', 'src'],
+    // TypeScript checks prop-types
+    'react/prop-types': 'off',
+
+    // Cannot config .ts, .tsx resolution
+    'import/no-unresolved': 'off',
+
+    'import/no-webpack-loader-syntax': 'off',
+
+    'no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': [
+      'error',
+      {
+        vars: 'local',
+        args: 'after-used',
+        ignoreRestSiblings: false,
+        argsIgnorePattern: '^_',
       },
-    },
+    ],
+
+    // Type variables by Codegen can not be camelcase.
+    camelcase: 'off',
   },
 };
diff --git a/.flowconfig b/.flowconfig
@@ -7,5 +7,14 @@
 [include]
 
 [options]
-module.system.node.resolve_dirname=node_modules
-module.system.node.resolve_dirname=src
+suppress_comment=\\(.\\|\n\\)*\\$FlowExpectError
+module.file_ext=.js
+module.file_ext=.jsx
+module.file_ext=.json
+module.file_ext=.css
+module.file_ext=.scss
+module.file_ext=.graphql
+module.name_mapper.extension='json' -> 'empty/object'
+module.name_mapper.extension='css' -> 'empty/object'
+module.name_mapper.extension='scss' -> 'empty/object'
+module.name_mapper.extension='graphql' -> 'empty/object'
diff --git a/.gitignore b/.gitignore
@@ -6,6 +6,9 @@ node_modules/
 # Compiled output
 build
 
+# Generate Types
+__generated__
+
 # Runtime data
 database.sqlite
 

diff --git a/.travis.yml b/.travis.yml
@@ -1,19 +1,11 @@
 language: node_js
 node_js:
   - 'stable'
+  - '12'
   - '10'
-  - '8'
-  - '6'
-env:
-  - CXX=g++-4.8
-addons:
-  apt:
-    sources:
-      - ubuntu-toolchain-r-test
-    packages:
-      - g++-4.8
 cache: yarn
 script:
+  - yarn codegen
   - yarn lint
   - yarn test
   - yarn build --release
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -27,13 +27,15 @@ All notable changes to this project will be documented in this file.
 - Move page / screen components into the `src/routes` folder along with the routing information for them (BREAKING CHANGE). [6553936](https://github.com/kriasoft/react-starter-kit/commit/6553936e693e24a8ac6178f4962af15e0ea87dfd)
 
 ### [v0.5.1]
+
 > 2016-03-02
 
 - Remove `Html` React component in favor of compiled Jade templates (`src/views`) (BREAKING CHANGE). [e188388](https://github.com/kriasoft/react-starter-kit/commit/e188388f87069cdc7d501b385d6b0e46c98fed60)
 - Add global error handling in Node.js/Express app. [e188388](https://github.com/kriasoft/react-starter-kit/commit/e188388f87069cdc7d501b385d6b0e46c98fed60)
 - Add support for Markdown and HTML for static pages. [#469](https://github.com/kriasoft/react-starter-kit/pull/469), [#477](https://github.com/kriasoft/react-starter-kit/pull/477)
 
 ### [v0.5.0]
+
 > 2016-02-27
 
 - Replace RESTful API endpoint (`src/api`) with GraphQL (`src/data`)
@@ -54,6 +56,7 @@ All notable changes to this project will be documented in this file.
 - Add `CHANGELOG.md` file with a list of notable changes to this project
 
 ### [v0.4.1]
+
 > 2015-10-04
 
 - Replace React Hot Loader (deprecated) with React Transform

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -33,23 +33,23 @@ files right from GitHub website as described [here](https://help.github.com/arti
 
 Before opening an issue, please:
 
-* Check the [Getting Started](https://github.com/kriasoft/react-starter-kit/blob/master/docs/getting-started.md) guide.
-* Search the [issue tracker](https://github.com/kriasoft/react-starter-kit/issues) to make sure
+- Check the [Getting Started](https://github.com/kriasoft/react-starter-kit/blob/master/docs/getting-started.md) guide.
+- Search the [issue tracker](https://github.com/kriasoft/react-starter-kit/issues) to make sure
   your issue hasn’t already been reported.
-* If your issue sounds more like a question, please post it on StackOverflow.com instead with the
+- If your issue sounds more like a question, please post it on StackOverflow.com instead with the
   tag [react-starter-kit](http://stackoverflow.com/questions/tagged/react-starter-kit).
 
 ### Pull Requests
 
 Before you submit a [pull request](https://help.github.com/articles/using-pull-requests/) from your
 forked repo, check that it meets these guidelines:
 
-* If the pull request adds functionality, the docs should be updated as part of the same PR.
-* Create a separate PR for each small feature or bug fix.
-* [Squash](http://stackoverflow.com/questions/5189560/squash-my-last-x-commits-together-using-git)
+- If the pull request adds functionality, the docs should be updated as part of the same PR.
+- Create a separate PR for each small feature or bug fix.
+- [Squash](http://stackoverflow.com/questions/5189560/squash-my-last-x-commits-together-using-git)
   your commits into one for each PR.
-* Run `yarn test` to make sure that your code style is OK and there are no any regression bugs.
-* When contributing to an opt-in feature, apply the `[feature/...]` tag as a prefix to your PR title
+- Run `yarn test` to make sure that your code style is OK and there are no any regression bugs.
+- When contributing to an opt-in feature, apply the `[feature/...]` tag as a prefix to your PR title
 
 #### Style Guide
 

diff --git a/README.md b/README.md
@@ -21,39 +21,36 @@ and newcomers to the industry.
   <sup><a href="https://x-team.com/join/?utm_source=reactstarterkit&utm_medium=github-link&utm_campaign=reactstarterkit-june">Hiring</a></sup>
 </p>
 
-
 ### Getting Started
 
-  * Follow the [getting started guide](./docs/getting-started.md) to download and run the project
-    ([Node.js](https://nodejs.org/) >= 6.9)
-  * Check the [code recipes](./docs/recipes) used in this boilerplate, or share yours
-
+- Follow the [getting started guide](./docs/getting-started.md) to download and run the project
+  ([Node.js](https://nodejs.org/) >= 6.9)
+- Check the [code recipes](./docs/recipes) used in this boilerplate, or share yours
 
 ### Customization
 
 The `master` branch of React Starter Kit doesn't include a Flux implementation or any other
-advanced integrations. Nevertheless, we have some integrations available to you in *feature*
+advanced integrations. Nevertheless, we have some integrations available to you in _feature_
 branches that you can use either as a reference or merge into your project:
 
-  * [feature/redux](https://github.com/kriasoft/react-starter-kit/tree/feature/redux) ([PR](https://github.com/kriasoft/react-starter-kit/pull/1084))
-    — isomorphic Redux by [Pavel Lang](https://github.com/langpavel)
-    (see [how to integrate Redux](./docs/recipes/how-to-integrate-redux.md)) (based on `master`)
-  * [feature/apollo](https://github.com/kriasoft/react-starter-kit/tree/feature/apollo) ([PR](https://github.com/kriasoft/react-starter-kit/pull/1147))
-    — isomorphic Apollo Client by [Pavel Lang](https://github.com/langpavel)
-    (see [Tracking PR #1147](https://github.com/kriasoft/react-starter-kit/pull/1147)) (based on `feature/redux`)
-  * [feature/react-intl](https://github.com/kriasoft/react-starter-kit/tree/feature/react-intl) ([PR](https://github.com/kriasoft/react-starter-kit/pull/1135))
-    — isomorphic Redux and React Intl by [Pavel Lang](https://github.com/langpavel)
-    (see [how to integrate React Intl](./docs/recipes/how-to-integrate-react-intl.md)) (based on `feature/apollo`)
-  * [feature/apollo-pure](https://github.com/kriasoft/react-starter-kit/tree/feature/apollo-pure) ([PR](https://github.com/kriasoft/react-starter-kit/pull/1666))
-    — Apollo devtools and TypeScript integration by [piglovesyou](https://github.com/piglovesyou) (based on `master`)
+- [feature/redux](https://github.com/kriasoft/react-starter-kit/tree/feature/redux) ([PR](https://github.com/kriasoft/react-starter-kit/pull/1084))
+  — isomorphic Redux by [Pavel Lang](https://github.com/langpavel)
+  (see [how to integrate Redux](./docs/recipes/how-to-integrate-redux.md)) (based on `master`)
+- [feature/apollo](https://github.com/kriasoft/react-starter-kit/tree/feature/apollo) ([PR](https://github.com/kriasoft/react-starter-kit/pull/1147))
+  — isomorphic Apollo Client by [Pavel Lang](https://github.com/langpavel)
+  (see [Tracking PR #1147](https://github.com/kriasoft/react-starter-kit/pull/1147)) (based on `feature/redux`)
+- [feature/react-intl](https://github.com/kriasoft/react-starter-kit/tree/feature/react-intl) ([PR](https://github.com/kriasoft/react-starter-kit/pull/1135))
+  — isomorphic Redux and React Intl by [Pavel Lang](https://github.com/langpavel)
+  (see [how to integrate React Intl](./docs/recipes/how-to-integrate-react-intl.md)) (based on `feature/apollo`)
+- [feature/apollo-pure](https://github.com/kriasoft/react-starter-kit/tree/feature/apollo-pure) ([PR](https://github.com/kriasoft/react-starter-kit/pull/1666))
+  — Apollo devtools and TypeScript integration by [piglovesyou](https://github.com/piglovesyou) (based on `master`)
 
 You can see status of most reasonable merge combination as [PRs labeled as `TRACKING`](https://github.com/kriasoft/react-starter-kit/labels/TRACKING)
 
 If you think that any of these features should be on `master`, or vice versa, some features should
 removed from the `master` branch, please [let us know](https://gitter.im/kriasoft/react-starter-kit).
 We love your feedback!
 
-
 ### Comparison
 
 <table width="100%">
@@ -151,7 +148,6 @@ We love your feedback!
   </tr>
 </table>
 
-
 ### Backers
 
 ♥ React Starter Kit? Help us keep it alive by donating funds to cover project
@@ -180,7 +176,6 @@ expenses via [OpenCollective](https://opencollective.com/react-starter-kit) or
   <img src="https://opencollective.com/static/images/become_backer.svg" width="64" height="64" alt="">
 </a>
 
-
 ### How to Contribute
 
 Anyone and everyone is welcome to [contribute](CONTRIBUTING.md) to this project. The best way to
@@ -190,35 +185,31 @@ start is by checking our [open issues](https://github.com/kriasoft/react-starter
 participate in discussions, upvote or downvote the issues you like or dislike, send [pull
 requests](CONTRIBUTING.md#pull-requests).
 
-
 ### Learn More
 
-  * [Getting Started with React.js](http://facebook.github.io/react/)
-  * [Getting Started with GraphQL and Relay](https://quip.com/oLxzA1gTsJsE)
-  * [React.js Questions on StackOverflow](http://stackoverflow.com/questions/tagged/reactjs)
-  * [React.js Discussion Board](https://discuss.reactjs.org/)
-  * [Flux Architecture for Building User Interfaces](http://facebook.github.io/flux/)
-  * [Enzyme — JavaScript Testing utilities for React](http://airbnb.io/enzyme/)
-  * [Flow — A static type checker for JavaScript](http://flowtype.org/)
-  * [The Future of React](https://github.com/reactjs/react-future)
-  * [Learn ES6](https://babeljs.io/docs/learn-es6/), [ES6 Features](https://github.com/lukehoban/es6features#readme)
-
+- [Getting Started with React.js](http://facebook.github.io/react/)
+- [Getting Started with GraphQL and Relay](https://quip.com/oLxzA1gTsJsE)
+- [React.js Questions on StackOverflow](http://stackoverflow.com/questions/tagged/reactjs)
+- [React.js Discussion Board](https://discuss.reactjs.org/)
+- [Flux Architecture for Building User Interfaces](http://facebook.github.io/flux/)
+- [Enzyme — JavaScript Testing utilities for React](http://airbnb.io/enzyme/)
+- [Flow — A static type checker for JavaScript](http://flowtype.org/)
+- [The Future of React](https://github.com/reactjs/react-future)
+- [Learn ES6](https://babeljs.io/docs/learn-es6/), [ES6 Features](https://github.com/lukehoban/es6features#readme)
 
 ### Related Projects
 
-  * [GraphQL Starter Kit](https://github.com/kriasoft/graphql-starter-kit) — Boilerplate for building data APIs with Node.js, JavaScript (via Babel) and GraphQL
-  * [Membership Database](https://github.com/membership/membership.db) — SQL schema boilerplate for user accounts, profiles, roles, and auth claims
-  * [Babel Starter Kit](https://github.com/kriasoft/babel-starter-kit) — Boilerplate for authoring JavaScript/React.js libraries
-
+- [GraphQL Starter Kit](https://github.com/kriasoft/graphql-starter-kit) — Boilerplate for building data APIs with Node.js, JavaScript (via Babel) and GraphQL
+- [Membership Database](https://github.com/membership/membership.db) — SQL schema boilerplate for user accounts, profiles, roles, and auth claims
+- [Babel Starter Kit](https://github.com/kriasoft/babel-starter-kit) — Boilerplate for authoring JavaScript/React.js libraries
 
 ### Support
 
-  * [#react-starter-kit](http://stackoverflow.com/questions/tagged/react-starter-kit) on Stack Overflow — Questions and answers
-  * [#react-starter-kit](https://gitter.im/kriasoft/react-starter-kit) on Gitter — Watch announcements, share ideas and feedback
-  * [GitHub issues](https://github.com/kriasoft/react-starter-kit/issues), or [Scrum board](https://waffle.io/kriasoft/react-starter-kit) — File issues, send feature requests
-  * [appear.in/react](https://appear.in/react) — Open hours! Exchange ideas and experiences (React, GraphQL, startups and pet projects)
-  * [@koistya](https://twitter.com/koistya) on [Codementor](https://www.codementor.io/koistya), or [Skype](http://hatscripts.com/addskype?koistya) — Private consulting
-
+- [#react-starter-kit](http://stackoverflow.com/questions/tagged/react-starter-kit) on Stack Overflow — Questions and answers
+- [#react-starter-kit](https://gitter.im/kriasoft/react-starter-kit) on Gitter — Watch announcements, share ideas and feedback
+- [GitHub issues](https://github.com/kriasoft/react-starter-kit/issues), or [Scrum board](https://waffle.io/kriasoft/react-starter-kit) — File issues, send feature requests
+- [appear.in/react](https://appear.in/react) — Open hours! Exchange ideas and experiences (React, GraphQL, startups and pet projects)
+- [@koistya](https://twitter.com/koistya) on [Codementor](https://www.codementor.io/koistya), or [Skype](http://hatscripts.com/addskype?koistya) — Private consulting
 
 ### License
 
@@ -228,6 +219,7 @@ file. The documentation to the project is licensed under the
 [CC BY-SA 4.0](http://creativecommons.org/licenses/by-sa/4.0/) license.
 
 ---
+
 Made with ♥ by Konstantin Tarkus ([@koistya](https://twitter.com/koistya)) and [contributors](https://github.com/kriasoft/react-starter-kit/graphs/contributors)
 
 [rsk]: https://www.reactstarterkit.com

diff --git a/babel.config.js b/babel.config.js
@@ -1,14 +1,3 @@
-/**
- * React Starter Kit (https://www.reactstarterkit.com/)
- *
- * Copyright © 2014-present Kriasoft, LLC. All rights reserved.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.txt file in the root directory of this source tree.
- */
-
-// Babel configuration
-// https://babeljs.io/docs/usage/api/
 module.exports = {
   presets: [
     [
@@ -19,8 +8,8 @@ module.exports = {
         },
       },
     ],
-    '@babel/preset-flow',
     '@babel/preset-react',
+    '@babel/preset-typescript',
   ],
   plugins: [
     '@babel/plugin-proposal-class-properties',

diff --git a/docs/README.md b/docs/README.md
@@ -2,22 +2,20 @@
 
 ### General
 
-* [Getting Started](./getting-started.md)
-* [React Style Guide](./react-style-guide.md)
-* [How to configure text editors and IDEs](./how-to-configure-text-editors.md)
-* [Data fetching with WHATWG Fetch](./data-fetching.md)
-* [Testing your application](./testing-your-application.md)
+- [Getting Started](./getting-started.md)
+- [React Style Guide](./react-style-guide.md)
+- [How to configure text editors and IDEs](./how-to-configure-text-editors.md)
+- [Testing your application](./testing-your-application.md)
 
 ### Questions
 
-* [Which module bundler should I use?](https://github.com/kriasoft/react-starter-kit/issues/3)
-* [Which Flux implementation should I use?](https://github.com/kriasoft/react-starter-kit/issues/22)
+- [Which module bundler should I use?](https://github.com/kriasoft/react-starter-kit/issues/3)
+- [Which Flux implementation should I use?](https://github.com/kriasoft/react-starter-kit/issues/22)
 
 ### Recipes
 
-* [How to Implement Routing and Navigation](./recipes/how-to-implement-routing.md)
-* [How to Integrate Redux](./recipes/how-to-integrate-redux.md)
-* [How to Integrate React Intl](./recipes/how-to-integrate-react-intl.md)
-* [How to Integrate Disqus](./recipes/how-to-integrate-disqus.md)
-* [How to Use Sass/SCSS](./recipes/how-to-use-sass.md)
-* [How to Configure Facebook Login](./recipes/how-to-configure-facebook-login.md)
+- [How to Implement Routing and Navigation](./recipes/how-to-implement-routing.md)
+- [How to Integrate React Intl](./recipes/how-to-integrate-react-intl.md)
+- [How to Integrate Disqus](./recipes/how-to-integrate-disqus.md)
+- [How to Use Sass/SCSS](./recipes/how-to-use-sass.md)
+- [How to Configure Facebook Login](./recipes/how-to-configure-facebook-login.md)