Begin adding Flow annotations

.babelrc

@@ -7,6 +7,7 @@
   "plugins": [
     "babel-plugin-dedent",
     "transform-class-properties",
-    "transform-es2015-modules-commonjs"
+    "transform-es2015-modules-commonjs",
+    "transform-flow-strip-types"
   ]
 }

.eslintrc

@@ -55,7 +55,7 @@
     }],
     // This ensures imports are at the top of the file.
     "import/imports-first": ["error"],
-    // This catches duplicate exports.
+    // This reports when you accidentally import/export an object twice.
     "import/no-duplicates": ["error"],
     // This ensures import statements never provide a file extension in the path.
     "import/extensions": ["error", "never"],
@@ -72,6 +72,8 @@
     "import/newline-after-import": ["error"],
     "jsx-a11y/no-static-element-interactions": "off",
     "no-console": "error",
+    // We use import/no-duplicates instead because it supports Flow types.
+    "no-duplicate-imports": "off",
     "no-plusplus": "off",
     "no-underscore-dangle": "off",
     "space-before-function-paren": ["error", "never"],

.flowconfig

@@ -0,0 +1,26 @@
+[ignore]
+# Ignore built/minified addons-frontend code.
+<PROJECT_ROOT>/dist/.*
+
+# These modules opt into Flow but we don't need to check them.
+.*/node_modules/babel.*
+.*/node_modules/react-nested-status
+.*/node_modules/stylelint
+
+[include]
+
+[libs]
+# TODO: this can go away after
+# https://github.com/mozilla/addons-frontend/issues/2092
+./flow/libs/dedent.js.flow
+
+[options]
+# This maps all Sass/SCSS imports to a dummy Flow file to suppress import
+# errors. It's not necessary for Flow to analyze Sass/SCSS files.
+module.name_mapper.extension='scss' -> '<PROJECT_ROOT>/flow/flowStub.js.flow'
+module.system=node
+module.system.node.resolve_dirname=node_modules
+module.system.node.resolve_dirname=./src
+log.file=./flow/logs/flow.log
+suppress_comment= \\(.\\|\n\\)*\\$FLOW_FIXME
+suppress_comment= \\(.\\|\n\\)*\\$FLOW_IGNORE

.gitignore

@@ -2,6 +2,7 @@
 logs
 *.log
 npm-debug.log*
+flow/logs/*log*
 
 # Runtime data
 pids

README.md

@@ -43,6 +43,8 @@ Generic scripts that don't need env vars. Use these for development:
 | npm run dev:amo         |  Starts the dev server and proxy (amo)                |
 | npm run dev:amo:no-proxy|  Starts the dev server without proxy (amo)            |
 | npm run dev:disco       |  Starts the dev server (discovery pane)               |
+| npm run flow:check      |  Check for Flow errors and exit                       |
+| npm run flow:dev        |  Continuously check for Flow errors                   |
 | npm run eslint          |  Lints the JS                                         |
 | npm run stylelint       |  Lints the SCSS                                       |
 | npm run lint            |  Runs all the JS + SCSS linters                       |
@@ -84,6 +86,70 @@ or have `InfoDialog` in their behavior text.
 Any option after the double dash (`--`) gets sent to `mocha`. Check out
 [mocha's usage](https://mochajs.org/#usage) for ideas.
 
+### Flow
+
+There is limited support for using [Flow](https://flowtype.org/)
+to check for problems in the source code.
+
+To check for Flow issues during development while you edit files, run:
+
+    npm run flow:dev
+
+If you are new to working with Flow, here are some tips:
+* Check out the [getting started](https://flow.org/en/docs/getting-started/) guide.
+* Read through the [web-ext guide](https://github.com/mozilla/web-ext/blob/master/CONTRIBUTING.md#check-for-flow-errors)
+  for hints on how to solve common Flow errors.
+
+To add flow coverage to a source file, put a `/* @flow */` comment at the top.
+The more source files you can opt into Flow, the better.
+
+Here is our Flow manifesto:
+
+* We use Flow to **declare the intention of our code** and help others
+  refactor it with confidence.
+  Flow also makes it easier to catch mistakes before spending hours in a debugger
+  trying to find out what happened.
+* Avoid magic [Flow declarations](https://flowtype.org/en/docs/config/libs/)
+  for any *internal* code. Just declare a
+  [type alias](https://flowtype.org/en/docs/types/aliases/) next to the code
+  where it's used and
+  [export/import](https://flow.org/en/docs/types/modules/) it like any other object.
+* Never import a real JS object just to reference its type. Make a type alias
+  and import that instead.
+* Never add more type annotations than you need. Flow is really good at
+  inferring types from standard JS code; it will tell you
+  when you need to add explicit annotations.
+* When a function like `getAllAddons` takes object arguments, call its
+  type object `GetAllAddonsParams`. Example:
+
+````js
+type GetAllAddonsParams = {|
+  categoryId: number,
+|};
+
+function getAllAddons({ categoryId }: GetAllAddonsParams = {}) {
+  ...
+}
+````
+
+* Use [Exact object types](https://flowtype.org/en/docs/types/objects/#toc-exact-object-types)
+  via the pipe syntax (`{| key: ... |}`) when possible. Sometimes the
+  spread operator triggers an error like
+  'Inexact type is incompatible with exact type' but that's a
+  [bug](https://github.com/facebook/flow/issues/2405).
+  You can use the `Exact<T>` workaround from
+  [`src/core/types/util`](https://github.com/mozilla/addons-frontend/blob/master/src/core/types/util.js)
+  if you have to. This is meant as a working replacement for
+  [$Exact<T>](https://flow.org/en/docs/types/utilities/#toc-exact).
+* Try to avoid loose types like `Object` or `any` but feel free to use
+  them if you are spending too much time declaring types that depend on other
+  types that depend on other types, and so on.
+* You can add a `$FLOW_FIXME` comment to skip a Flow check if you run
+  into a bug or if you hit something that's making you bang your head on
+  the keyboard. If it's something you think is unfixable then use
+  `$FLOW_IGNORE` instead. Please explain your rationale in the comment and link
+  to a GitHub issue if possible.
+
 ### Code coverage
 
 The `npm run unittest` command generates a report of how well the unit tests

flow/flowStub.js.flow

@@ -0,0 +1 @@
+// This file is just a stub that will suppress 'missing file' errors.

flow/libs/README.md

@@ -0,0 +1,3 @@
+The files in this directory (when declared in `[libs]` of `.flowconfig`)
+will declare global objects. These declarations should be a last resort.
+Try to export/import types in the actual source code first.

flow/libs/dedent.js.flow

@@ -0,0 +1,6 @@
+// TODO: this can go away after
+// https://github.com/mozilla/addons-frontend/issues/2092
+
+// I'm not sure exactly what this should be. I was using this issue as a guide.
+// https://github.com/facebook/flow/issues/2616#issuecomment-289257544
+declare function dedent(params: Array<*>): string;

flow/logs/README.md

@@ -0,0 +1 @@
+Flow server logs are written to this directory.

package.json

@@ -14,6 +14,8 @@
     "dev:amo:no-proxy": "better-npm-run dev:amo:no-proxy",
     "dev:disco": "better-npm-run dev:disco",
     "eslint": "eslint .",
+    "flow:check": "flow check",
+    "flow:dev": "chokidar .flowconfig flow/ src/ tests/ -i flow/logs/flow.log -c 'flow status' --initial",
     "stylelint": "stylelint --syntax scss **/*.scss",
     "lint": "npm run eslint && npm run stylelint",
     "servertest": "bin/config-check.js && ADDONS_FRONTEND_BUILD_ALL=1 npm run build && better-npm-run servertest && better-npm-run servertest:amo && better-npm-run servertest:disco && better-npm-run servertest:admin",
@@ -118,7 +120,7 @@
       }
     },
     "test": {
-      "command": "npm run version-check && npm run unittest && npm run servertest && npm run eslint && npm run stylelint",
+      "command": "npm run version-check && npm run flow:check && npm run unittest && npm run servertest && npm run eslint && npm run stylelint",
       "env": {
         "NODE_PATH": "./:./src",
         "NODE_ENV": "test"
@@ -229,6 +231,7 @@
     "babel-plugin-react-transform": "2.0.2",
     "babel-plugin-transform-class-properties": "6.18.0",
     "babel-plugin-transform-decorators-legacy": "1.3.4",
+    "babel-plugin-transform-flow-strip-types": "6.22.0",
     "babel-plugin-transform-object-rest-spread": "6.20.2",
     "babel-preset-es2015": "6.24.0",
     "babel-preset-react": "6.16.0",
@@ -238,6 +241,7 @@
     "chai": "3.5.0",
     "chalk": "1.1.3",
     "cheerio": "0.22.0",
+    "chokidar-cli": "1.2.0",
     "concurrently": "3.4.0",
     "cookie": "0.3.1",
     "css-loader": "0.28.0",
@@ -249,6 +253,7 @@
     "eslint-plugin-react": "6.10.3",
     "fetch-mock": "5.9.4",
     "file-loader": "0.10.1",
+    "flow-bin": "0.38.0",
     "glob": "7.1.1",
     "http-proxy": "1.16.2",
     "json-loader": "0.5.4",

src/amo/actions/reviews.js

@@ -1,15 +1,32 @@
+/* @flow */
 import { SET_ADDON_REVIEWS, SET_REVIEW } from 'amo/constants';
+import type { ApiReviewType } from 'amo/api';
 
-export function denormalizeReview(review) {
+export type UserReviewType = {|
+  addonId: number,
+  addonSlug: string,
+  body: string,
+  created: Date,
+  id: number,
+  isLatest: boolean,
+  rating: number,
+  title: string,
+  userId: number,
+  userName: string,
+  userUrl: string,
+  versionId: ?number,
+|};
+
+export function denormalizeReview(review: ApiReviewType): UserReviewType {
   return {
     addonId: review.addon.id,
     addonSlug: review.addon.slug,
     body: review.body,
     created: review.created,
-    title: review.title,
     id: review.id,
     isLatest: review.is_latest,
     rating: review.rating,
+    title: review.title,
     userId: review.user.id,
     userName: review.user.name,
     userUrl: review.user.url,
@@ -18,26 +35,43 @@ export function denormalizeReview(review) {
   };
 }
 
-const setReviewAction = (review) => ({ type: SET_REVIEW, payload: review });
+export type SetReviewAction = {|
+  type: string,
+  payload: UserReviewType,
+|};
 
-export const setReview = (review, reviewOverrides = {}) => {
+export const setReview = (review: ApiReviewType): SetReviewAction => {
   if (!review) {
     throw new Error('review cannot be empty');
   }
-  return setReviewAction({
-    ...denormalizeReview(review),
-    ...reviewOverrides,
-  });
+  return { type: SET_REVIEW, payload: denormalizeReview(review) };
 };
 
-export const setDenormalizedReview = (review) => {
+export const setDenormalizedReview = (
+  review: UserReviewType
+): SetReviewAction => {
   if (!review) {
     throw new Error('review cannot be empty');
   }
-  return setReviewAction(review);
+  return { type: SET_REVIEW, payload: review };
 };
 
-export const setAddonReviews = ({ addonSlug, reviews }) => {
+export type SetAddonReviewsAction = {|
+  type: string,
+  payload: {|
+    addonSlug: string,
+    reviews: Array<UserReviewType>,
+  |},
+|};
+
+type SetAddonReviewsParams = {|
+  addonSlug: string,
+  reviews: Array<ApiReviewType>,
+|};
+
+export const setAddonReviews = (
+  { addonSlug, reviews }: SetAddonReviewsParams
+): SetAddonReviewsAction => {
   if (!addonSlug) {
     throw new Error('addonSlug cannot be empty');
   }