From 1223db334d776bfb24d854a6c49c2f2fdd328e9e Mon Sep 17 00:00:00 2001
From: Richard Ramos <info@richardramos.me>
Date: Tue, 10 Sep 2019 13:33:00 -0400
Subject: [PATCH] fix: reactive-graphql docs

---
 .vuepress/config.js |  2 +-
 api.md              |  2 +-
 graphql.md          | 47 ---------------------------------
 reactive-graphql.md | 63 +++++++++++++++++++++++++++++++++++++++++++++
 4 files changed, 65 insertions(+), 49 deletions(-)
 delete mode 100644 graphql.md
 create mode 100644 reactive-graphql.md

diff --git a/.vuepress/config.js b/.vuepress/config.js
index 4308a5c..7663520 100644
--- a/.vuepress/config.js
+++ b/.vuepress/config.js
@@ -32,7 +32,7 @@ module.exports = {
               '/redux-observable'
             ]
           },
-          '/graphql',
+          '/reactive-graphql',
           '/apollo-client'
         ]
       },
diff --git a/api.md b/api.md
index e3330a8..d0827c7 100644
--- a/api.md
+++ b/api.md
@@ -2,7 +2,7 @@
 
 ## General
 
-### `new Phoenix(web3Provider, [, options])`
+### `new Phoenix(web3Provider [, options])`
 Phoenix constructor. 
 
 **Parameters**
diff --git a/graphql.md b/graphql.md
deleted file mode 100644
index 8a53ef1..0000000
--- a/graphql.md
+++ /dev/null
@@ -1,47 +0,0 @@
-# Reactive GraphQL
-```js
-import { makeExecutableSchema } from "graphql-tools";
-import gql from "graphql-tag";
-import {graphql} from "reactive-graphql";
-
-      const typeDefs = `
-        type Escrow {
-          buyer: String!
-          seller: String!
-          escrowId: Int!
-        }
-        type Query {
-          escrows: Escrow!
-        }
-      `;
-
-      const resolvers = {
-        Query: {
-          escrows: () => {
-            return eventSyncer.trackEvent(this.EscrowContract, 'Created', { filter: { buyer: accounts[0] }, fromBlock: 1 })
-          }
-        }
-      };
-
-      
-      
-const schema = makeExecutableSchema({
-  typeDefs,
-  resolvers
-});
-
-const query = gql`
-  query {
-    escrows {
-      buyer
-      seller
-      escrowId
-    }
-  }
-`;
-
-const stream = graphql(schema, query).pipe(pluck("data", "escrows"));
-this.setState({
-  escrow: stream
-});
-```
\ No newline at end of file
diff --git a/reactive-graphql.md b/reactive-graphql.md
new file mode 100644
index 0000000..4403ed2
--- /dev/null
+++ b/reactive-graphql.md
@@ -0,0 +1,63 @@
+# reactive-graphql
+
+Using `reactive-graphql` you can execute GraphQL queries against Phoenix observables to it, and create your own type definitions and queries.
+
+### Example
+
+
+```js
+const Phoenix = require('phoenix');
+const MyContract = require('./MyContract');
+const { pluck } = require('rxjs/operators');
+const { makeExecutableSchema } = require("graphql-tools");
+const gql = require("graphql-tag");
+const { graphql } = require("reactive-graphql");
+
+const run = async () => {
+  const eventSyncer = new Phoenix(web3.currentProvider); // Use a valid websocket provider (geth, parity, infura...)
+  await eventSyncer.init();
+
+  const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance
+
+  const typeDefs = `
+    type MyEvent {
+      someValue: Int
+      anotherValue: String
+    }
+    type Query {
+      myEvents: MyEvent!
+    }
+  `;
+
+  const resolvers = {
+    Query: {
+      myEvents: () => {
+        return eventSyncer.trackEvent(MyContractInstance, 'MyEvent', { filter: {}, fromBlock: 1 })
+      }
+    }
+  };
+
+  const schema = makeExecutableSchema({ typeDefs, resolvers });
+
+  const query = gql`
+    query {
+      myEvents {
+        someValue
+        anotherValue
+      }
+    }
+  `;
+
+  const stream = graphql(schema, query).pipe(pluck('data', 'myEvents'));
+  stream.subscribe(data => {
+    console.log(data);
+  })
+
+}
+
+run();
+```
+
+::: tip 
+This example is available in [Github](https://github.com/status-im/phoenix/tree/master/examples/reactive-graphql)
+:::
\ No newline at end of file