Fix flow setup

.flowconfig

@@ -1,17 +1,10 @@
-[ignore]
-.*/node_modules/config-chain/test/broken.json.*
-.*/node_modules/npmconf/test/fixtures/package.json.*
-.*/node_modules/babel-plugin-transform-react-remove-prop-types/src/index.js.*
-
-[include]
-types/context.flow.js
-
 [libs]
-types/
+flow-typed
+types
 
 [options]
 module.name_mapper='^@pages\(/.+\)?$' -> '<PROJECT_ROOT>/pages\1'
 module.name_mapper='^@components\(/.+\)?$' -> '<PROJECT_ROOT>/components\1'
-module.name_mapper='^@lib\(/.+\)?$' -> '<PROJECT_ROOT>/lib\1'
+module.name_mapper='^@lib\(/.+\)?$' -> '<PROJECT_ROOT>/common/lib'
 module.name_mapper='^@common\(/.+\)?$' -> '<PROJECT_ROOT>/common\1'
 module.name_mapper='^@static\(/.+\)?$' -> '<PROJECT_ROOT>/static\1'

common/lib/index.js

@@ -1,5 +1,7 @@
 // @flow
 
+import type { Context } from "next";
+
 import "isomorphic-fetch";
 
 const EXTENSIONS = {
@@ -8,7 +10,7 @@ const EXTENSIONS = {
   Windows: ".exe"
 };
 
-export function detectPlatform(ctx: Context<*>): Platform {
+export function detectPlatform(ctx: Context): Platform {
   if (ctx.req && ctx.req.headers) {
     // Server side
     const ua = ctx.req.headers["user-agent"];

components/hero/index.js

@@ -35,6 +35,10 @@ const Hero = ({ color, children, ...rest }: HeroProps) => {
   );
 };
 
+Hero.defaultProps = {
+  color: "#334865"
+};
+
 Hero.Pane = StyledHero.Pane;
 Hero.Title = Title;
 

components/kernels/c++.js

@@ -1,17 +1,13 @@
 // @flow
-import Layout from "../../components/layout/layout";
+import Layout from "@components/layout";
 import Link from "next/link";
-import {
-  ContentSection,
-  ContentSectionPane
-} from "../../components/content-section/content-section";
 import React from "react";
-import Node from "../../components/kernels/c++";
+import Node from "@components/kernels/c++";
 import {
   PageHeader,
   PageHeaderLeft,
   PageHeaderRight
-} from "../../components/page-header/page-header";
+} from "@components/page-header";
 
 export default class NodePage extends React.Component<*, *> {
   render() {

components/kernels/julia.js

@@ -1,17 +1,13 @@
 // @flow
-import Layout from "../../components/layout/layout";
+import Layout from "@components/layout";
 import Link from "next/link";
-import {
-  ContentSection,
-  ContentSectionPane
-} from "../../components/content-section/content-section";
 import React from "react";
-import Python from "../../components/kernels/julia";
+import Python from "@components/kernels/julia";
 import {
   PageHeader,
   PageHeaderLeft,
   PageHeaderRight
-} from "../../components/page-header/page-header";
+} from "@components/page-header";
 
 export default class PythonPage extends React.Component<*, *> {
   render() {

components/kernels/language-toggle.js

@@ -18,7 +18,7 @@ const LanguageToggle = ({ kernels, current }: LanguageToggleProps) => (
       {kernels.map((kernel: KernelSelect) => (
         <StyledKernelListItem
           key={kernel.path}
-          selected={props.current === kernel.name}
+          selected={current === kernel.name}
         >
           <Link href={kernel.path} prefetch>
             <a>{kernel.name}</a>

package.json

@@ -22,7 +22,7 @@
   "devDependencies": {
     "babel-plugin-styled-components": "^1.5.1",
     "babel-plugin-transform-flow-strip-types": "^6.22.0",
-    "flow-bin": "^0.83.0",
+    "flow-bin": "^0.84.0",
     "lint-staged": "^7.0.5",
     "prettier": "^1.12.1"
   },

pages/_app.js

@@ -6,13 +6,15 @@ import { Header } from "@components/header";
 import { Footer } from "@components/footer";
 import { WindowSize } from "react-fns";
 
+import type { Context } from "next";
+
 // Should these types come from next.js directly somehow?
 type AppProps<P> = {
   Component: React.Component<*, *> & {
-    getInitialProps: ?(ctx: Context<*>) => P
+    getInitialProps: ?(ctx: Context) => P
   },
   router: *,
-  ctx: Context<*>
+  ctx: Context
 };
 
 class MyApp extends App {

pages/_document.js

@@ -3,6 +3,8 @@ import * as React from "react";
 import Document, { Head, Main, NextScript } from "next/document";
 import styled, { ServerStyleSheet, createGlobalStyle } from "styled-components";
 import { normalize } from "polished";
+
+import type { Context } from "next";
 /**
  * Reset our styles
  */
@@ -31,8 +33,10 @@ const DocWrapper = styled.div`
   }
 `;
 
+type DocumentContext = Context & { renderPage: Function };
+
 export default class MyDocument extends Document {
-  static getInitialProps({ renderPage }: DocumentContext<*>) {
+  static getInitialProps({ renderPage }: DocumentContext) {
     const sheet = new ServerStyleSheet();
     const page = renderPage(App => props =>
       sheet.collectStyles(<App {...props} />)

pages/about.js

@@ -2,7 +2,7 @@
 import * as React from "react";
 import { GithubCircleIcon, WebIcon } from "mdi-react";
 
-import Layout from "../components/layout";
+import Layout from "@components/layout";
 import {
   StyledPerson,
   StyledPersonAvatar,
@@ -13,10 +13,10 @@ import {
   StyledPersonSocialItem,
   StyledGridWrapper,
   StyledGrid
-} from "../components/layout/styled";
-import { ContentSection } from "../components/content-section";
-import { PageHeader } from "../components/page-header";
-import { Type } from "../components/typography";
+} from "@components/layout/styled";
+import { ContentSection } from "@components/content-section";
+import { PageHeader } from "@components/page-header";
+import { Type } from "@components/typography";
 const contributorsData = require("nteract-members");
 
 const Mission = () => (

pages/atom.js

@@ -8,10 +8,15 @@ import { ContentSection, ContentSections } from "@components/content-section";
 import { Button, Buttons } from "@components/button";
 import { CutoffImage } from "@components/cutoff-image";
 
-const Video = ({ mp4, webm, poster }) => (
-  <video poster={poster} preload="auto" autoPlay muted loop="loop">
-    {mp4 ? <source src={mp4} type="video/mp4" /> : null}
-    {webm ? <source src={webm} type="video/webm" /> : null}
+type VideoProps =
+  | { mp4: string, webm: string, poster: string }
+  | { mp4: string, poster: string }
+  | { webm: string, poster: string };
+
+const Video = (props: VideoProps) => (
+  <video poster={props.poster} preload="auto" autoPlay muted loop="loop">
+    {props.mp4 ? <source src={props.mp4} type="video/mp4" /> : null}
+    {props.webm ? <source src={props.webm} type="video/webm" /> : null}
   </video>
 );
 

pages/desktop.js

@@ -9,8 +9,10 @@ import { detectPlatform, getDownloadUrl } from "@lib";
 import { DownloadFeaturette } from "@components/download-buttons";
 import { CutoffImage } from "@components/cutoff-image";
 
-class Atom extends React.Component<null, null> {
-  static async getInitialProps(ctx: Context<EmptyQuery>): Promise<OSProps> {
+import type { Context } from "next";
+
+class Atom extends React.Component<OSProps> {
+  static async getInitialProps(ctx: Context): Promise<OSProps> {
     const platform = detectPlatform(ctx);
     const assetUrl = await getDownloadUrl(platform);
     return { platform, assetUrl };

pages/index.js

@@ -8,6 +8,8 @@ import { Button, Buttons } from "@components/button";
 import { DownloadFeaturette } from "@components/download-buttons";
 import { detectPlatform, getDownloadUrl } from "@lib";
 
+import type { Context } from "next";
+
 const DemoVideo = () => (
   <video
     poster="https://nteract.github.io/assets/images/[email protected]"
@@ -27,13 +29,8 @@ const DemoVideo = () => (
   </video>
 );
 
-type HomeProps = {
-  platform: Platforms,
-  assetUrl: string
-};
-
-class Home extends React.Component<HomeProps, null> {
-  static async getInitialProps(ctx: Context<EmptyQuery>): Promise<OSProps> {
+class Home extends React.Component<OSProps, null> {
+  static async getInitialProps(ctx: Context): Promise<OSProps> {
     const platform = detectPlatform(ctx);
     const assetUrl = await getDownloadUrl(platform);
     return { platform, assetUrl };

pages/kernels.js

@@ -105,7 +105,7 @@ const RenderContent = ({ view }) => {
 };
 
 class KernelsPage extends React.Component<
-  { slug: ?Languages, url: Array<string> },
+  { slug: ?Languages, url: Array<string>, router: * },
   { view: ?string }
 > {
   static async getInitialProps(ctx: *) {

types/platform.js

@@ -0,0 +1,6 @@
+declare type Platform = "macOS" | "Linux" | "Windows";
+
+declare type OSProps = {
+  platform: Platform,
+  assetUrl: string
+};

yarn.lock

@@ -2346,10 +2346,10 @@ find-up@^3.0.0:
   dependencies:
     locate-path "^3.0.0"
 
-flow-bin@^0.83.0:
-  version "0.83.0"
-  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.83.0.tgz#fd26f5f95758d7701264b3f9a1e1a3d4cbcab1a9"
-  integrity sha512-1K83EL/U9Gh0BaXPKkZe6TRizSmNSKx9Wuws1c8gh7DJEwiburtCxYT+4o7in1+GnNEm3CZWnbnVV8n9HMpiDA==
+flow-bin@^0.84.0:
+  version "0.84.0"
+  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.84.0.tgz#4cb2364c750fb37a7840524fa62456b53f64cdcb"
+  integrity sha512-ocji8eEYp+YfICsm+F6cIHUcD7v5sb0/ADEXm6gyUKdjQzmSckMrPUdZtyfP973t3YGHKliUMxMvIBHyR5LbXQ==
 
 flush-write-stream@^1.0.0:
   version "1.0.3"