Intial build

.gitignore

@@ -0,0 +1,32 @@
+# Logs
+logs
+*.log
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directory
+# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
+node_modules
+
+# don't commit compiled files
+lib
+test-lib
+typings

.npmignore

@@ -0,0 +1 @@
+example

.travis.yml

@@ -0,0 +1,15 @@
+language: node_js
+node_js:
+  - "5"
+  - "4"
+install:
+  - npm install -g coveralls
+  - npm install
+
+script:
+  - npm test
+  - npm run coverage
+  - coveralls < ./coverage/lcov.info || true # ignore coveralls error
+
+# Allow Travis tests to run in containers.
+sudo: false

.vscode/launch.json

@@ -0,0 +1,14 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Test",
+      "type": "node",
+      "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
+      "stopOnEntry": false,
+      "args": ["lib/test/tests.js"],
+      "cwd": "${workspaceRoot}",
+      "runtimeExecutable": null
+    }
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,16 @@
+// Place your settings in this file to overwrite default and user settings.
+{
+  "editor.tabSize": 2,
+  "editor.rulers": [100],
+  "files.trimTrailingWhitespace": true,
+  "files.insertFinalNewline": true,
+  "editor.wrappingColumn": 100,
+  "files.exclude": {
+    "**/.git": true,
+    "**/.DS_Store": true,
+    // "node_modules": true,
+    "test-lib": true,
+    "lib": true,
+    "coverage": true
+  }
+}

LICENSE

@@ -0,0 +1,22 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Ben Newman
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

README.md

@@ -2,9 +2,10 @@
 
 Use your GraphQL server data in your React components, with the Apollo Client.
 
-## API sketch
-
-I'd like to base this very heavily on the [`react-redux` API](https://github.com/reactjs/react-redux/blob/master/docs/api.md#api) and have the same parts - a `Provider` component and a `connect` function. Ideally, if you are using Apollo and Redux together, you don't have to nest calls to providers and containers - they should just work together. So, here we go!
+- [Provider](#provider)
+- [connect](#connect)
+- [Additional Props](#additional-props)
+- [Using in concert with Redux](#using-in-concert-with-redux)
 
 ### Provider
 
@@ -54,7 +55,7 @@ ReactDOM.render(
 )
 ```
 
-Note that this design calls it just `Provider`, which is appropriate because in the base case you can use it instead of the Redux provider.
+The wrapper is called `Provider` because in the base case you can use it instead of the Redux provider or you can use it as an Apollo enhanced Redux Provider.
 
 ### connect
 
@@ -72,9 +73,9 @@ import { connect } from 'apollo-react';
 
 import Category from '../components/Category';
 
-function mapQueriesToProps({ watchQuery, ownProps, state }) {
+function mapQueriesToProps({ ownProps, state }) {
   return {
-    category: watchQuery({
+    category: {
       query: `
         query getCategory($categoryId: Int!) {
           category(id: $categoryId) {
@@ -88,44 +89,42 @@ function mapQueriesToProps({ watchQuery, ownProps, state }) {
       },
       forceFetch: false,
       returnPartialData: true,
-    })
-  }
-}
+    },
+  };
+};
 
-function mapMutationsToProps({ mutate, ownProps, state }) {
+function mapMutationsToProps({ ownProps, state }) {
   return {
-    onPostReply(raw) {
-      return mutate({
-        mutation: `
-          mutation postReply(
-            $topic_id: ID!
-            $category_id: ID!
-            $raw: String!
+    postReply: (raw) => ({
+      mutation: `
+        mutation postReply(
+          $topic_id: ID!
+          $category_id: ID!
+          $raw: String!
+        ) {
+          createPost(
+            topic_id: $topic_id
+            category: $category_id
+            raw: $raw
           ) {
-            createPost(
-              topic_id: $topic_id
-              category: $category_id
-              raw: $raw
-            ) {
-              id
-              cooked
-            }
+            id
+            cooked
           }
-        `,
-        variables: {
-          // Use the container component's props
-          topic_id: ownProps.topic_id,
+        }
+      `,
+      variables: {
+        // Use the container component's props
+        topic_id: ownProps.topic_id,
 
-          // Use the redux state
-          category_id: state.selectedCategory,
+        // Use the redux state
+        category_id: state.selectedCategory,
 
-          // Use an argument passed from the callback
-          raw,
-        }
-      });
-    }
-  }
-}
+        // Use an argument passed from the triggering of the mutation
+        raw,
+      }
+    }),
+  };
+};
 
 const CategoryWithData = connect({
   mapQueriesToProps,
@@ -135,7 +134,7 @@ const CategoryWithData = connect({
 export default CategoryWithData;
 ```
 
-Note that `watchQuery` takes the same arguments as [`ApolloClient#watchQuery`](http://docs.apollostack.com/apollo-client/index.html#watchQuery). In this case, the `Category` component will get a prop called `category`, which has the following keys:
+Each key on the object returned by mapQueriesToProps should be made up of the same possible arguments as [`ApolloClient#watchQuery`](http://docs.apollostack.com/apollo-client/index.html#watchQuery). In this case, the `Category` component will get a prop called `category`, which has the following keys:
 
 ```js
 {
@@ -145,7 +144,23 @@ Note that `watchQuery` takes the same arguments as [`ApolloClient#watchQuery`](h
 }
 ```
 
-Using in concert with Redux:
+`mapMutationsToProps` returns an object made up of keys and values that are custom functions to call the mutation. These can be used in children components (for instance, on a event handler) to trigger the mutation. The resulting function must return the same possible arguents as [`ApolloClient#mutate`](http://docs.apollostack.com/apollo-client/index.html#mutate). In this case, the `Category` component will get a prop called `postReply`, which has the following keys:
+
+```js
+{
+  loading: boolean,
+  error: Error,
+  result: GraphQLResult,
+}
+```
+
+The `Category` component will also get a prop of `mutations` that will have a key of `postReply`. This key is the method that triggers the mutation and can take custom arguments (e.g. `this.props.mutations.postReply('Apollo and React are really great!')`). These arguments are passed to the method that creates the mutation.
+
+### Additional Props
+
+Redux's connect will pass `dispatch` as a prop unless action creators are passed using `mapDisptachToProps`. Likewise, the Apollo connect exposes part of the apollo-client api to props under the keys `query` and `mutate`. These correspond to the Apollo methods and can be used for custom needs outside of the ability of the wrapper component.
+
+### Using in concert with Redux
 
 ```js
 // ... same as above
@@ -165,4 +180,4 @@ const CategoryWithData = connect({
 export default CategoryWithData;
 ```
 
-In this case, `CategoryWithData` gets two props: `category` and `selectedCategory`.
+In this case, `CategoryWithData` gets two props: `category` and `selectedCategory`.

appveyor.yml

@@ -0,0 +1,26 @@
+# Test against this version of Node.js
+environment:
+  matrix:
+    # node.js
+    - nodejs_version: "5"
+    - nodejs_version: "4"
+
+# Install scripts. (runs after repo cloning)
+install:
+  # Get the latest stable version of Node.js or io.js
+  - ps: Install-Product node $env:nodejs_version
+  # install modules
+  - npm install
+
+# Post-install test scripts.
+test_script:
+  # run tests
+  - npm test
+
+# artifacts:
+#   - path: ./junit/xunit.xml
+#   - path: ./xunit.xml
+
+# nothing to compile in this project
+build: off
+deploy: off

package.json

@@ -1,11 +1,67 @@
 {
-  "name": "apollo-react",
+  "name": "react-apollo",
   "version": "0.0.1",
   "description": "React data container for Apollo Client",
-  "main": "index.js",
+  "main": "./lib/src/index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "pretest": "npm run compile",
+    "test": "mocha --require ./test/fixtures/setup.js --reporter spec --full-trace --recursive ./lib/test",
+    "posttest": "npm run lint",
+    "compile": "tsc",
+    "watch": "tsc -w",
+    "prepublish": "npm run compile",
+    "lint": "tslint src/*.ts* && tslint test/*.ts*",
+    "coverage": "istanbul cover ./node_modules/mocha/bin/_mocha -- --reporter dot --full-trace lib/test/tests.js",
+    "postcoverage": "remap-istanbul --input coverage/coverage.json --type lcovonly --output coverage/lcov.info"
   },
-  "author": "",
-  "license": "ISC"
+  "repository": {
+    "type": "git",
+    "url": "apollostack/react-apollo"
+  },
+  "keywords": [
+    "ecmascript",
+    "es2015",
+    "jsnext",
+    "javascript",
+    "relay",
+    "npm",
+    "react"
+  ],
+  "author": "James Baxley <james.baxley@newspring.cc>",
+  "license": "MIT",
+  "peerDependencies": {
+    "react": "^0.14.0 || ^15.0.0-0",
+    "redux": "^2.0.0 || ^3.0.0",
+    "apollo-client": "0.0.5"
+  },
+  "devDependencies": {
+    "apollo-client": "0.0.5",
+    "chai": "^3.5.0",
+    "chai-as-promised": "^5.2.0",
+    "chai-enzyme": "^0.4.2",
+    "cheerio": "^0.20.0",
+    "enzyme": "^2.2.0",
+    "graphql": "^0.5.0",
+    "istanbul": "^0.4.2",
+    "jsdom": "^8.3.1",
+    "mocha": "^2.3.3",
+    "react": "^15.0.1",
+    "react-addons-test-utils": "^15.0.1",
+    "react-dom": "^0.14.8",
+    "redux": "^3.4.0",
+    "remap-istanbul": "^0.5.1",
+    "source-map-support": "^0.4.0",
+    "swapi-graphql": "0.0.4",
+    "tslint": "^3.6.0",
+    "typescript": "^1.8.9",
+    "typescript-require": "^0.2.9-1",
+    "typings": "^0.7.9"
+  },
+  "dependencies": {
+    "hoist-non-react-statics": "^1.0.5",
+    "lodash.isequal": "^4.1.1",
+    "lodash.isobject": "^3.0.2",
+    "object-assign": "^4.0.1",
+    "react-redux": "^4.4.4"
+  }
 }