Add meteor data

.meteor/packages

@@ -21,3 +21,4 @@ autopublish             # Publish all data to the clients (for prototyping)
 insecure                # Allow all DB writes from clients (for prototyping)
 alt:react-accounts-ui
 accounts-password
+react-meteor-data

.meteor/versions

@@ -63,6 +63,7 @@ ordered-dict@1.0.7
 promise@0.6.7
 random@1.0.9
 rate-limit@1.0.4
+react-meteor-data@0.2.9
 reactive-dict@1.1.7
 reactive-var@1.0.9
 reload@1.1.8
@@ -78,6 +79,7 @@ standard-minifier-css@1.0.6
 standard-minifier-js@1.0.6
 templating@1.1.9
 templating-tools@1.0.4
+tmeasday:check-npm-versions@0.2.0
 tracker@1.0.13
 ui@1.0.11
 underscore@1.0.8

README.md

@@ -0,0 +1,14 @@
+# meteor starter kit
+
+A simple kit to start experimenting with Apollo and Meteor.
+
+### Running it
+
+```
+meteor npm install
+meteor
+```
+
+### Learn more
+
+Learn more [in the docs](http://docs.apollostack.com/)!

imports/api/schema.js

@@ -1,3 +1,5 @@
+import { Random } from 'meteor/random';
+
 export const schema = [`
 type Email {
   address: String
@@ -6,10 +8,11 @@ type Email {
 
 type User {
   emails: [Email]
+  randomString: String
 }
 
 type Query {
-  currentUser: User
+  user(id: String!): User
 }
 
 schema {
@@ -19,11 +22,15 @@ schema {
 
 export const resolvers = {
   Query: {
-    currentUser(root, args, context) {
-      return context.user;
+    user(root, args, context) {
+      // Only return the current user, for security
+      if (context.user._id === args.id) {
+        return context.user;
+      }
     },
   },
   User: {
     emails: ({emails}) => emails,
+    randomString: () => Random.id(),
   }
 }

imports/ui/App.js

@@ -1,33 +1,56 @@
 import React, { Component } from 'react';
 import { connect } from 'react-apollo';
+import { Meteor } from 'meteor/meteor';
+import { createContainer } from 'meteor/react-meteor-data';
 
-const App = ({ currentUser }) => {
+const App = ({ userId, currentUser }) => {
+  console.log(userId, currentUser);
   return (
     <div>
       <LogInButtons />
-      <pre>{JSON.stringify(currentUser, null, 2)}</pre>
-      <button onClick={currentUser.refetch}>Refetch!</button>
+      { userId ? (
+        <div>
+          <pre>{JSON.stringify(currentUser, null, 2)}</pre>
+          <button onClick={currentUser.refetch}>Refetch!</button>
+        </div>
+      ) : 'Please log in!' }
     </div>
   )
 }
 
+// This container brings in Apollo GraphQL data
 const AppWithData = connect({
-  mapQueriesToProps() {
-    return {
-      currentUser: {
-        query: `
-          {
-            currentUser {
-              emails {
-                address
-                verified
+  mapQueriesToProps({ ownProps }) {
+    if (ownProps.userId) {
+      return {
+        currentUser: {
+          query: `
+            query getUserData ($id: String!) {
+              user(id: $id) {
+                emails {
+                  address
+                  verified
+                }
+                randomString
               }
             }
-          }
-        `,
-      },
-    };
+          `,
+          variables: {
+            id: ownProps.userId,
+          },
+          forceFetch: true,
+        },
+      };
+    }
   },
 })(App);
 
-export default AppWithData;
+// This container brings in Tracker-enabled Meteor data
+const AppWithUserId = createContainer(() => {
+  console.log("running", Meteor.userId())
+  return {
+    userId: Meteor.userId() || false,
+  };
+}, AppWithData);
+
+export default AppWithUserId;

package.json

@@ -13,6 +13,7 @@
     "invariant": "^2.2.1",
     "meteor-node-stubs": "~0.2.0",
     "react": "^15.0.1",
+    "react-addons-pure-render-mixin": "^15.0.1",
     "react-apollo": "^0.1.1",
     "react-dom": "^15.0.1"
   }