change options name to fix AC collision and add flow smoke test

.flowconfig

@@ -0,0 +1,12 @@
+[ignore]
+.*/examples/**/.*
+.*/node_modules/art/.*
+.*/node_modules/react-native/**/.*
+
+[include]
+
+[libs]
+./index.js.flow
+
+[options]
+suppress_comment= \\(.\\|\n\\)*\\$ExpectError

index.js.flow

@@ -36,21 +36,21 @@ declare module "react-apollo" {
     render(): React$Element<*>,
   }
   declare export type MutationFunc<TResult> = (
-    opts: MutationOptions
+    opts: MutationOpts
   ) => Promise<ApolloQueryResult<TResult>>;
 
   declare export type DefaultChildProps<P, R> = {
     data: QueryProps & R,
     mutate: MutationFunc<R>,
   } & P;
 
-  declare export interface MutationOptions {
+  declare export interface MutationOpts {
     variables?: { [key: string]: mixed },
     optimisticResponse?: Object,
     updateQueries?: MutationQueryReducersMap,
   }
 
-  declare export interface QueryOptions {
+  declare export interface QueryOpts {
     ssr?: boolean,
     variables?: {
       [key: string]: mixed,
@@ -87,7 +87,7 @@ declare module "react-apollo" {
 
   declare export type OptionDescription<P> = (
     props: P
-  ) => QueryOptions | MutationOptions;
+  ) => QueryOpts | MutationOpts;
 
   declare export interface OperationOption<TProps: {}, TResult: {}> {
     options?: OptionDescription<TProps>,

package.json

@@ -14,6 +14,7 @@
     "test-watch": "jest --watch",
     "posttest": "npm run lint",
     "filesize": "npm run compile:browser && ./scripts/filesize.js --file=./dist/index.min.js --maxGzip=20",
+    "flow-check": "flow check",
     "compile": "tsc",
     "bundle": "rollup -c && rollup -c rollup.browser.config.js && rollup -c rollup.test-utils.config.js && cp ./index.js.flow ./lib",
     "compile:browser": "rm -rf ./dist && mkdir ./dist && browserify ./lib/react-apollo.browser.umd.js --i graphql-tag --i react --i apollo-client -o=./dist/index.js && npm run minify:browser && npm run compress:browser",
@@ -54,9 +55,10 @@
       "json"
     ],
     "modulePathIgnorePatterns": [
-      "<rootDir>/examples"
+      "<rootDir>/examples",
+      "<rootDir>/test/flow.js"
     ],
-"testRegex": "(/test/.*|\\.(test|spec))\\.(ts|tsx|js)$",
+    "testRegex": "(/test/.*|\\.(test|spec))\\.(ts|tsx|js)$",
     "collectCoverage": true
   },
   "license": "MIT",

src/browser.ts

@@ -1,5 +1,14 @@
 export { default as ApolloProvider } from './ApolloProvider';
-export { default as graphql } from './graphql';
+export {
+  default as graphql,
+  MutationOpts,
+  QueryOpts,
+  QueryProps,
+  MutationFunc,
+  OptionProps,
+  DefaultChildProps,
+  OperationOption,
+ } from './graphql';
 export { withApollo } from './withApollo';
 
 // expose easy way to join queries from redux

src/graphql.tsx

@@ -35,13 +35,13 @@ import {
 
 import { parser, DocumentType } from './parser';
 
-export declare interface MutationOptions {
+export declare interface MutationOpts {
   variables?: Object;
   optimisticResponse?: Object;
   updateQueries?: MutationQueryReducersMap;
 }
 
-export declare interface QueryOptions {
+export declare interface QueryOpts {
   ssr?: boolean;
   variables?: { [key: string]: any };
   fetchPolicy?: FetchPolicy;
@@ -65,7 +65,7 @@ export interface QueryProps {
   updateQuery: (mapFn: (previousQueryResult: any, options: UpdateQueryOptions) => any) => void;
 }
 
-export type MutationFunc<TResult> = (opts: MutationOptions) => Promise<ApolloQueryResult<TResult>>;
+export type MutationFunc<TResult> = (opts: MutationOpts) => Promise<ApolloQueryResult<TResult>>;
 
 export interface OptionProps<TProps, TResult> {
   ownProps: TProps;
@@ -76,7 +76,7 @@ export interface OptionProps<TProps, TResult> {
 export type DefaultChildProps<P, R> = P & { data?: QueryProps & R, mutate?: MutationFunc<R> };
 
 export interface OperationOption<TProps, TResult> {
-  options?: QueryOptions | MutationOptions | ((props: TProps) => QueryOptions | MutationOptions);
+  options?: QueryOpts | MutationOpts | ((props: TProps) => QueryOpts | MutationOpts);
   props?: (props: OptionProps<TProps, TResult>) => any;
   skip?: boolean | ((props: any) => boolean);
   name?: string;
@@ -131,7 +131,7 @@ export default function graphql<TResult = {}, TProps = {}, TChildProps = Default
     alias = 'Apollo',
   } = operationOptions;
 
-  let mapPropsToOptions = options as (props: any) => QueryOptions | MutationOptions;
+  let mapPropsToOptions = options as (props: any) => QueryOpts | MutationOpts;
   if (typeof mapPropsToOptions !== 'function') mapPropsToOptions = () => options;
 
   let mapPropsToSkip = skip as (props: any) => boolean;
@@ -329,12 +329,12 @@ export default function graphql<TResult = {}, TProps = {}, TChildProps = Default
 
         // Create the observable but don't subscribe yet. The query won't
         // fire until we do.
-        const opts: QueryOptions = this.calculateOptions(this.props);
+        const opts: QueryOpts = this.calculateOptions(this.props);
 
         this.createQuery(opts);
       }
 
-      createQuery(opts: QueryOptions) {
+      createQuery(opts: QueryOpts) {
         if (this.type === DocumentType.Subscription) {
           this.queryObservable = this.client.subscribe(assign({
             query: document,
@@ -361,7 +361,7 @@ export default function graphql<TResult = {}, TProps = {}, TChildProps = Default
       }
 
       updateQuery(props) {
-        const opts = this.calculateOptions(props) as QueryOptions;
+        const opts = this.calculateOptions(props) as QueryOpts;
 
         // if we skipped initially, we may not have yet created the observable
         if (!this.queryObservable) {
@@ -456,7 +456,7 @@ export default function graphql<TResult = {}, TProps = {}, TChildProps = Default
 
       shouldSkip(props = this.props) {
         return mapPropsToSkip(props) ||
-          (mapPropsToOptions(props) as QueryOptions).skip;
+          (mapPropsToOptions(props) as QueryOpts).skip;
       }
 
       forceRenderChildren() {
@@ -476,7 +476,7 @@ export default function graphql<TResult = {}, TProps = {}, TChildProps = Default
 
       dataForChild() {
         if (this.type === DocumentType.Mutation) {
-          return (mutationOpts: MutationOptions) => {
+          return (mutationOpts: MutationOpts) => {
             const opts = this.calculateOptions(this.props, mutationOpts);
 
             if (typeof opts.variables === 'undefined') delete opts.variables;
@@ -626,7 +626,7 @@ class ObservableQueryRecycler {
    * All mutations that occured between the time of recycling and the time of
    * reusing have been applied.
    */
-  public reuse (options: QueryOptions): ObservableQuery<any> {
+  public reuse (options: QueryOpts): ObservableQuery<any> {
     if (this.observableQueries.length <= 0) {
       return null;
     }

src/withApollo.tsx

@@ -33,8 +33,6 @@ import {
 import { parser, DocumentType } from './parser';
 import {
   OperationOption,
-  MutationOptions,
-  QueryOptions,
 } from './graphql';
 
 function getDisplayName(WrappedComponent) {

test/flow.js

@@ -0,0 +1,34 @@
+/*
+
+  This file is used to validate the flow typings for react-apollo.
+  Currently it just serves as a smoke test around used imports and
+  common usage patterns.
+
+  Ideally this should include tests for all of the functionality of
+  react-apollo
+
+*/
+
+// @flow
+import { graphql } from "react-apollo";
+import type { OperationComponent } from "react-apollo";
+import type { DocumentNode } from "graphql";
+import gql from "graphql-tag";
+
+const query: DocumentNode = gql`{ foo }`;
+const mutation: DocumentNode = gql`mutation { foo }`;
+
+type IQuery = {
+  foo: string,
+};
+
+// common errors
+
+const withData: OperationComponent<IQuery> = graphql(query);
+
+const ComponentWithData = withData(({ data: { foo }}) => {
+  // $ExpectError
+  if (foo > 1) return <span />;
+
+  return null;
+});