-
-
-
diff --git a/packages/docs/.vuepress/theme/noopModule.js b/packages/docs/.vuepress/theme/noopModule.js
deleted file mode 100644
index b1c6ea4..0000000
--- a/packages/docs/.vuepress/theme/noopModule.js
+++ /dev/null
@@ -1 +0,0 @@
-export default {}
diff --git a/packages/docs/.vuepress/theme/styles/arrow.styl b/packages/docs/.vuepress/theme/styles/arrow.styl
deleted file mode 100644
index 20bffc0..0000000
--- a/packages/docs/.vuepress/theme/styles/arrow.styl
+++ /dev/null
@@ -1,22 +0,0 @@
-@require './config'
-
-.arrow
- display inline-block
- width 0
- height 0
- &.up
- border-left 4px solid transparent
- border-right 4px solid transparent
- border-bottom 6px solid $arrowBgColor
- &.down
- border-left 4px solid transparent
- border-right 4px solid transparent
- border-top 6px solid $arrowBgColor
- &.right
- border-top 4px solid transparent
- border-bottom 4px solid transparent
- border-left 6px solid $arrowBgColor
- &.left
- border-top 4px solid transparent
- border-bottom 4px solid transparent
- border-right 6px solid $arrowBgColor
diff --git a/packages/docs/.vuepress/theme/styles/code.styl b/packages/docs/.vuepress/theme/styles/code.styl
deleted file mode 100644
index 9d3aa9a..0000000
--- a/packages/docs/.vuepress/theme/styles/code.styl
+++ /dev/null
@@ -1,137 +0,0 @@
-{$contentClass}
- code
- color lighten($textColor, 20%)
- padding 0.25rem 0.5rem
- margin 0
- font-size 0.85em
- background-color rgba(27,31,35,0.05)
- border-radius 3px
- .token
- &.deleted
- color #EC5975
- &.inserted
- color $accentColor
-
-{$contentClass}
- pre, pre[class*="language-"]
- line-height 1.4
- padding 1.25rem 1.5rem
- margin 0.85rem 0
- background-color $codeBgColor
- border-radius 6px
- overflow auto
- code
- color #fff
- padding 0
- background-color transparent
- border-radius 0
-
-div[class*="language-"]
- position relative
- background-color $codeBgColor
- border-radius 6px
- .highlight-lines
- user-select none
- padding-top 1.3rem
- position absolute
- top 0
- left 0
- width 100%
- line-height 1.4
- .highlighted
- background-color rgba(0, 0, 0, 66%)
- pre, pre[class*="language-"]
- background transparent
- position relative
- z-index 1
- &::before
- position absolute
- z-index 3
- top 0.8em
- right 1em
- font-size 0.75rem
- color rgba(255, 255, 255, 0.4)
- &:not(.line-numbers-mode)
- .line-numbers-wrapper
- display none
- &.line-numbers-mode
- .highlight-lines .highlighted
- position relative
- &:before
- content ' '
- position absolute
- z-index 3
- left 0
- top 0
- display block
- width $lineNumbersWrapperWidth
- height 100%
- background-color rgba(0, 0, 0, 66%)
- pre
- padding-left $lineNumbersWrapperWidth + 1 rem
- vertical-align middle
- .line-numbers-wrapper
- position absolute
- top 0
- width $lineNumbersWrapperWidth
- text-align center
- color rgba(255, 255, 255, 0.3)
- padding 1.25rem 0
- line-height 1.4
- br
- user-select none
- .line-number
- position relative
- z-index 4
- user-select none
- font-size 0.85em
- &::after
- content ''
- position absolute
- z-index 2
- top 0
- left 0
- width $lineNumbersWrapperWidth
- height 100%
- border-radius 6px 0 0 6px
- border-right 1px solid rgba(0, 0, 0, 66%)
- background-color $codeBgColor
-
-
-for lang in $codeLang
- div{'[class~="language-' + lang + '"]'}
- &:before
- content ('' + lang)
-
-div[class~="language-javascript"]
- &:before
- content "js"
-
-div[class~="language-typescript"]
- &:before
- content "ts"
-
-div[class~="language-markup"]
- &:before
- content "html"
-
-div[class~="language-markdown"]
- &:before
- content "md"
-
-div[class~="language-json"]:before
- content "json"
-
-div[class~="language-ruby"]:before
- content "rb"
-
-div[class~="language-python"]:before
- content "py"
-
-div[class~="language-bash"]:before
- content "sh"
-
-div[class~="language-php"]:before
- content "php"
-
-@import '~prismjs/themes/prism-tomorrow.css'
diff --git a/packages/docs/.vuepress/theme/styles/config.styl b/packages/docs/.vuepress/theme/styles/config.styl
deleted file mode 100644
index 9e40321..0000000
--- a/packages/docs/.vuepress/theme/styles/config.styl
+++ /dev/null
@@ -1 +0,0 @@
-$contentClass = '.theme-default-content'
diff --git a/packages/docs/.vuepress/theme/styles/custom-blocks.styl b/packages/docs/.vuepress/theme/styles/custom-blocks.styl
deleted file mode 100644
index 2d07835..0000000
--- a/packages/docs/.vuepress/theme/styles/custom-blocks.styl
+++ /dev/null
@@ -1,30 +0,0 @@
-.custom-block
- .custom-block-title
- font-weight 600
- margin-bottom -0.4rem
- &.tip, &.warning, &.danger
- padding .1rem 1.5rem
- border-left-width .5rem
- border-left-style solid
- margin 1rem 0
- &.tip
- background-color #f3f5f7
- border-color #42b983
- &.warning
- background-color rgba(255,229,100,.3)
- border-color darken(#ffe564, 35%)
- color darken(#ffe564, 70%)
- .custom-block-title
- color darken(#ffe564, 50%)
- a
- color $textColor
- &.danger
- background-color #ffe6e6
- border-color darken(red, 20%)
- color darken(red, 70%)
- .custom-block-title
- color darken(red, 40%)
- a
- color $textColor
-
-
diff --git a/packages/docs/.vuepress/theme/styles/index.styl b/packages/docs/.vuepress/theme/styles/index.styl
deleted file mode 100644
index 976bfb0..0000000
--- a/packages/docs/.vuepress/theme/styles/index.styl
+++ /dev/null
@@ -1,201 +0,0 @@
-@require './config'
-@require './code'
-@require './custom-blocks'
-@require './arrow'
-@require './wrapper'
-@require './toc'
-
-html, body
- padding 0
- margin 0
- background-color #fff
-
-body
- font-family -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif
- -webkit-font-smoothing antialiased
- -moz-osx-font-smoothing grayscale
- font-size 16px
- color $textColor
-
-.page
- padding-left $sidebarWidth
-
-.navbar
- position fixed
- z-index 20
- top 0
- left 0
- right 0
- height $navbarHeight
- background-color #fff
- box-sizing border-box
- border-bottom 1px solid $borderColor
-
-.sidebar-mask
- position fixed
- z-index 9
- top 0
- left 0
- width 100vw
- height 100vh
- display none
-
-.sidebar
- font-size 16px
- background-color #fff
- width $sidebarWidth
- position fixed
- z-index 10
- margin 0
- top $navbarHeight
- left 0
- bottom 0
- box-sizing border-box
- border-right 1px solid $borderColor
- overflow-y auto
-
-{$contentClass}:not(.custom)
- @extend $wrapper
- > *:first-child
- margin-top $navbarHeight
-
- a:hover
- text-decoration underline
-
- p.demo
- padding 1rem 1.5rem
- border 1px solid #ddd
- border-radius 4px
-
- img
- max-width 100%
-
-{$contentClass}.custom
- padding 0
- margin 0
-
- img
- max-width 100%
-
-a
- font-weight 500
- color $accentColor
- text-decoration none
-
-p a code
- font-weight 400
- color $accentColor
-
-kbd
- background #eee
- border solid 0.15rem #ddd
- border-bottom solid 0.25rem #ddd
- border-radius 0.15rem
- padding 0 0.15em
-
-blockquote
- font-size 1rem
- color #999;
- border-left .2rem solid #dfe2e5
- margin 1rem 0
- padding .25rem 0 .25rem 1rem
-
- & > p
- margin 0
-
-ul, ol
- padding-left 1.2em
-
-strong
- font-weight 600
-
-h1, h2, h3, h4, h5, h6
- font-weight 600
- line-height 1.25
-
- {$contentClass}:not(.custom) > &
- margin-top (0.5rem - $navbarHeight)
- padding-top ($navbarHeight + 1rem)
- margin-bottom 0
-
- &:first-child
- margin-top -1.5rem
- margin-bottom 1rem
-
- + p, + pre, + .custom-block
- margin-top 2rem
-
- &:hover .header-anchor
- opacity: 1
-
-h1
- font-size 2.2rem
-
-h2
- font-size 1.65rem
- padding-bottom .3rem
- border-bottom 1px solid $borderColor
-
-h3
- font-size 1.35rem
-
-a.header-anchor
- font-size 0.85em
- float left
- margin-left -0.87em
- padding-right 0.23em
- margin-top 0.125em
- opacity 0
-
- &:hover
- text-decoration none
-
-code, kbd, .line-number
- font-family source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace
-
-p, ul, ol
- line-height 1.7
-
-hr
- border 0
- border-top 1px solid $borderColor
-
-table
- border-collapse collapse
- margin 1rem 0
- display: block
- overflow-x: auto
-
-tr
- border-top 1px solid #dfe2e5
-
- &:nth-child(2n)
- background-color #f6f8fa
-
-th, td
- border 1px solid #dfe2e5
- padding .6em 1em
-
-.theme-container
- &.sidebar-open
- .sidebar-mask
- display: block
-
- &.no-navbar
- {$contentClass}:not(.custom) > h1, h2, h3, h4, h5, h6
- margin-top 1.5rem
- padding-top 0
-
- .sidebar
- top 0
-
-
-@media (min-width: ($MQMobile + 1px))
- .theme-container.no-sidebar
- .sidebar
- display none
-
- .page
- padding-left 0
-
-@require 'mobile.styl'
diff --git a/packages/docs/.vuepress/theme/styles/mobile.styl b/packages/docs/.vuepress/theme/styles/mobile.styl
deleted file mode 100644
index f5bd327..0000000
--- a/packages/docs/.vuepress/theme/styles/mobile.styl
+++ /dev/null
@@ -1,37 +0,0 @@
-@require './config'
-
-$mobileSidebarWidth = $sidebarWidth * 0.82
-
-// narrow desktop / iPad
-@media (max-width: $MQNarrow)
- .sidebar
- font-size 15px
- width $mobileSidebarWidth
- .page
- padding-left $mobileSidebarWidth
-
-// wide mobile
-@media (max-width: $MQMobile)
- .sidebar
- top 0
- padding-top $navbarHeight
- transform translateX(-100%)
- transition transform .2s ease
- .page
- padding-left 0
- .theme-container
- &.sidebar-open
- .sidebar
- transform translateX(0)
- &.no-navbar
- .sidebar
- padding-top: 0
-
-// narrow mobile
-@media (max-width: $MQMobileNarrow)
- h1
- font-size 1.9rem
- {$contentClass}
- div[class*="language-"]
- margin 0.85rem -1.5rem
- border-radius 0
diff --git a/packages/docs/.vuepress/theme/styles/toc.styl b/packages/docs/.vuepress/theme/styles/toc.styl
deleted file mode 100644
index d3e7106..0000000
--- a/packages/docs/.vuepress/theme/styles/toc.styl
+++ /dev/null
@@ -1,3 +0,0 @@
-.table-of-contents
- .badge
- vertical-align middle
diff --git a/packages/docs/.vuepress/theme/styles/wrapper.styl b/packages/docs/.vuepress/theme/styles/wrapper.styl
deleted file mode 100644
index a99262c..0000000
--- a/packages/docs/.vuepress/theme/styles/wrapper.styl
+++ /dev/null
@@ -1,9 +0,0 @@
-$wrapper
- max-width $contentWidth
- margin 0 auto
- padding 2rem 2.5rem
- @media (max-width: $MQNarrow)
- padding 2rem
- @media (max-width: $MQMobileNarrow)
- padding 1.5rem
-
diff --git a/packages/docs/.vuepress/theme/util/index.js b/packages/docs/.vuepress/theme/util/index.js
deleted file mode 100644
index fbf6416..0000000
--- a/packages/docs/.vuepress/theme/util/index.js
+++ /dev/null
@@ -1,245 +0,0 @@
-export const hashRE = /#.*$/
-export const extRE = /\.(md|html)$/
-export const endingSlashRE = /\/$/
-export const outboundRE = /^[a-z]+:/i
-
-export function normalize (path) {
- return decodeURI(path)
- .replace(hashRE, '')
- .replace(extRE, '')
-}
-
-export function getHash (path) {
- const match = path.match(hashRE)
- if (match) {
- return match[0]
- }
-}
-
-export function isExternal (path) {
- return outboundRE.test(path)
-}
-
-export function isMailto (path) {
- return /^mailto:/.test(path)
-}
-
-export function isTel (path) {
- return /^tel:/.test(path)
-}
-
-export function ensureExt (path) {
- if (isExternal(path)) {
- return path
- }
- const hashMatch = path.match(hashRE)
- const hash = hashMatch ? hashMatch[0] : ''
- const normalized = normalize(path)
-
- if (endingSlashRE.test(normalized)) {
- return path
- }
- return normalized + '.html' + hash
-}
-
-export function isActive (route, path) {
- const routeHash = route.hash
- const linkHash = getHash(path)
- if (linkHash && routeHash !== linkHash) {
- return false
- }
- const routePath = normalize(route.path)
- const pagePath = normalize(path)
- return routePath === pagePath
-}
-
-export function resolvePage (pages, rawPath, base) {
- if (isExternal(rawPath)) {
- return {
- type: 'external',
- path: rawPath
- }
- }
- if (base) {
- rawPath = resolvePath(rawPath, base)
- }
- const path = normalize(rawPath)
- for (let i = 0; i < pages.length; i++) {
- if (normalize(pages[i].regularPath) === path) {
- return Object.assign({}, pages[i], {
- type: 'page',
- path: ensureExt(pages[i].path)
- })
- }
- }
- console.error(`[vuepress] No matching page found for sidebar item "${rawPath}"`)
- return {}
-}
-
-function resolvePath (relative, base, append) {
- const firstChar = relative.charAt(0)
- if (firstChar === '/') {
- return relative
- }
-
- if (firstChar === '?' || firstChar === '#') {
- return base + relative
- }
-
- const stack = base.split('/')
-
- // remove trailing segment if:
- // - not appending
- // - appending to trailing slash (last segment is empty)
- if (!append || !stack[stack.length - 1]) {
- stack.pop()
- }
-
- // resolve relative path
- const segments = relative.replace(/^\//, '').split('/')
- for (let i = 0; i < segments.length; i++) {
- const segment = segments[i]
- if (segment === '..') {
- stack.pop()
- } else if (segment !== '.') {
- stack.push(segment)
- }
- }
-
- // ensure leading slash
- if (stack[0] !== '') {
- stack.unshift('')
- }
-
- return stack.join('/')
-}
-
-/**
- * @param { Page } page
- * @param { string } regularPath
- * @param { SiteData } site
- * @param { string } localePath
- * @returns { SidebarGroup }
- */
-export function resolveSidebarItems (page, regularPath, site, localePath) {
- const { pages, themeConfig } = site
-
- const localeConfig = localePath && themeConfig.locales
- ? themeConfig.locales[localePath] || themeConfig
- : themeConfig
-
- const pageSidebarConfig = page.frontmatter.sidebar || localeConfig.sidebar || themeConfig.sidebar
- if (pageSidebarConfig === 'auto') {
- return resolveHeaders(page)
- }
-
- const sidebarConfig = localeConfig.sidebar || themeConfig.sidebar
- if (!sidebarConfig) {
- return []
- } else {
- const { base, config } = resolveMatchingConfig(regularPath, sidebarConfig)
- return config
- ? config.map(item => resolveItem(item, pages, base))
- : []
- }
-}
-
-/**
- * @param { Page } page
- * @returns { SidebarGroup }
- */
-function resolveHeaders (page) {
- const headers = groupHeaders(page.headers || [])
- return [{
- type: 'group',
- collapsable: false,
- title: page.title,
- path: null,
- children: headers.map(h => ({
- type: 'auto',
- title: h.title,
- basePath: page.path,
- path: page.path + '#' + h.slug,
- children: h.children || []
- }))
- }]
-}
-
-export function groupHeaders (headers) {
- // group h3s under h2
- headers = headers.map(h => Object.assign({}, h))
- let lastH2
- headers.forEach(h => {
- if (h.level === 2) {
- lastH2 = h
- } else if (lastH2) {
- (lastH2.children || (lastH2.children = [])).push(h)
- }
- })
- return headers.filter(h => h.level === 2)
-}
-
-export function resolveNavLinkItem (linkItem) {
- return Object.assign(linkItem, {
- type: linkItem.items && linkItem.items.length ? 'links' : 'link'
- })
-}
-
-/**
- * @param { Route } route
- * @param { Array | Array | [link: string]: SidebarConfig } config
- * @returns { base: string, config: SidebarConfig }
- */
-export function resolveMatchingConfig (regularPath, config) {
- if (Array.isArray(config)) {
- return {
- base: '/',
- config: config
- }
- }
- for (const base in config) {
- if (ensureEndingSlash(regularPath).indexOf(encodeURI(base)) === 0) {
- return {
- base,
- config: config[base]
- }
- }
- }
- return {}
-}
-
-function ensureEndingSlash (path) {
- return /(\.html|\/)$/.test(path)
- ? path
- : path + '/'
-}
-
-function resolveItem (item, pages, base, groupDepth = 1) {
- if (typeof item === 'string') {
- return resolvePage(pages, item, base)
- } else if (Array.isArray(item)) {
- return Object.assign(resolvePage(pages, item[0], base), {
- title: item[1]
- })
- } else {
- if (groupDepth > 3) {
- console.error(
- '[vuepress] detected a too deep nested sidebar group.'
- )
- }
- const children = item.children || []
- if (children.length === 0 && item.path) {
- return Object.assign(resolvePage(pages, item.path, base), {
- title: item.title
- })
- }
- return {
- type: 'group',
- path: item.path,
- title: item.title,
- sidebarDepth: item.sidebarDepth,
- children: children.map(child => resolveItem(child, pages, base, groupDepth + 1)),
- collapsable: item.collapsable !== false
- }
- }
-}
diff --git a/packages/site/CNAME b/packages/docs/CNAME
similarity index 100%
rename from packages/site/CNAME
rename to packages/docs/CNAME
diff --git a/packages/site/README.md b/packages/docs/README.md
similarity index 100%
rename from packages/site/README.md
rename to packages/docs/README.md
diff --git a/packages/site/_config.yml b/packages/docs/_config.yml
similarity index 90%
rename from packages/site/_config.yml
rename to packages/docs/_config.yml
index de91cca..fee5929 100644
--- a/packages/site/_config.yml
+++ b/packages/docs/_config.yml
@@ -15,7 +15,7 @@ permalink_defaults:
lang: en
i18n_dir: :lang
-source_dir: source/packages/docs
+source_dir: src
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
@@ -41,8 +41,7 @@ highlight:
autoprefixer:
enable: true
- browsers:
- - 'last 2 versions'
+
node_sass:
outputStyle: nested
precision: 5
diff --git a/packages/docs/api.md b/packages/docs/api.md
deleted file mode 100644
index 8fce198..0000000
--- a/packages/docs/api.md
+++ /dev/null
@@ -1,154 +0,0 @@
-# API
-
-## General
-
-### `new Subspace(web3 [, options])`
-Constructor.
-
-**Parameters**
-1. `web3` - `Object`: a `web3.js` object.
-2. `options` - `Object` (optional): Options used to initialize Subspace
- - `dbFilename` - `String` (optional): Name of the database where the information will be stored (default `'subspace.db'`)
-- `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).
- - `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
- - `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
-
-
-### `init()`
-Initializes **Subspace**
-
-**Returns**
-`Promise` that once it's resolved, will mean that **Subspace** is available to use
-
-### `close()`
-Dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution.
-
-### `contract(instance|{abi,address})`
-Adds a `track` method to the web3 contract objects. You can obtain this functionality by passing a `web3.eth.Contract` instance, or the `abi` and `address` of your contract
-
-**Returns**
-`web3.eth.Contract` object enhanced with `.track()` functions for methods and events.
-
-## Contract methods
-
-### `myContract.events.MyEvent.track([options])`
-Track a contract event.
-
-**Parameters**
-1. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
- - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `"myNumber"` is `12` or `13`.
- - `fromBlock` - `Number` (optional): The block number from which to get events on.
- - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `"latest"`)
- - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.
-
-**Returns**
-`RxJS Observable` which will stream the event `returnValues`.
-
-
-### `myContract.methods.myMethod([param1[, ...]]).track([callOptions])`
-Track a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.
-
-**Parameters**
-1. `callOptions` - `Object` (optional): The options used for calling.
- - `from` - `String` (optional): The address the call “transaction” should be made from.
- - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.
- - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).
-
-**Returns**
-`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked.
-
-
-### `myContract.trackBalance(address [, tokenAddress])`
-Track a contract's balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.
-
-**Parameters**
-1. `address` - `String`: The address to get the balance of.
-2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
-
-**Returns**
-`RxJS Observable` which will stream a string containing the address balance.
-
-
-## Blocks, gas price and block time
-
-### `trackBlock()`
-Receive the block information for any new block. It's the reactive equivalent to `web3.eth.getBlock("latest")`.
-
-**Returns**
-`RxJS Observable` which will stream a block object for the latest block received
-
-### `trackBlockNumber()`
-Returns the latest block number. It's the reactive equivalent to `web3.eth.getBlockNumber`.
-
-**Returns**
-`RxJS Observable` with the latest block number
-
-### `trackGasPrice()`
-Returns the current gas price oracle. It's the reactive equivalent to `web3.eth.getGasPrice`.
-
-**Returns**
-`RxJS Observable` with the average gas price in wei.
-
-### `trackAverageBlocktime()`
-Average block time of the last 10 blocks.
-
-**Returns**
-`RxJS Observable` with the moving average block time of the last 10 blocks. The time is returned in milliseconds:
-
-
-## Low level API for data tracking
-
-These are used in case you don't want to decorate your web3 contract objects, or if you want to track the balance for an specific address.
-
-### `trackEvent(contractObject, eventName [, options])`
-Track a contract event.
-
-**Parameters**
-1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.
-2. `eventName` - `String`: The name of the event to subscribe.
-3. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
- - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `"myNumber"` is `12` or `13`.
- - `fromBlock` - `Number` (optional): The block number from which to get events on.
- - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `"latest"`)
- - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.
-
-**Returns**
-`RxJS Observable` which will stream the event `returnValues`.
-
-### `trackProperty(contractObject, functionName [, functionArgs] [, callOptions])`
-Track a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.
-
-**Parameters**
-1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.
-2. `functionName` - `String`: Name of the function or variable whose values will be tracked.
-3. `functionArgs` - `Array` (optional): Array of arguments that the tracked function receives
-4. `callOptions` - `Object` (optional): The options used for calling.
- - `from` - `String` (optional): The address the call “transaction” should be made from.
- - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.
- - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).
-
-**Returns**
-`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked.
-
-### `trackBalance(address [, tokenAddress])`
-Track balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.
-
-**Parameters**
-1. `address` - `String`: The address to get the balance of.
-2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
-
-**Returns**
-`RxJS Observable` which will stream a string containing the address balance.
-
-### `trackLogs(options [, abi])`
-Tracks incoming logs, filtered by the given options.
-
-**Parameters**
-1. `options` - `Object` (optional): web3 filter options object to limit the number of logs
- - `address` - `String|Array` (optional): An address or a list of addresses to only get logs from particular account(s).
- - `fromBlock` - `Number` (optional): The block number from which to get events on.
- - `topics` - `Array` (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, '0x00...']. You can also pass another array for each topic with options for that topic e.g. [null, ['option1', 'option2']].
-2. `abi` - `Array` (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.
-
-**Returns**
-`RxJS Observable` which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.
\ No newline at end of file
diff --git a/packages/docs/apollo-client.md b/packages/docs/apollo-client.md
deleted file mode 100644
index 5c8d3c8..0000000
--- a/packages/docs/apollo-client.md
+++ /dev/null
@@ -1,60 +0,0 @@
-# apollo-client
-To use **Subspace** with `apollo-client`, a `ReactiveSchemaLink` from `apollo-link-reactive-schema` must be used with a custom schema.
-
-```js
-import {InMemoryCache} from "apollo-cache-inmemory";
-import ApolloClient from "apollo-client";
-import {ReactiveSchemaLink} from "apollo-link-reactive-schema";
-
-const schema = makeExecutableSchema({typeDefs, resolvers});
-const client = new ApolloClient({
- cache: new InMemoryCache(),
- link: new ReactiveSchemaLink({schema)})
-});
-
-```
-
-### Example
-
-```js{35-45}
-import { ApolloClient } from "apollo-client";
-import { InMemoryCache } from "apollo-cache-inmemory";
-import {ReactiveSchemaLink} from "apollo-link-reactive-schema";
-import Subspace from "@embarklabs/subspace";
-
-// ...
-
-// Initialize Subspace
-const subspace = new Subspace(web3);
-await subspace.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: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})
- }
-};
-
-const schema = makeExecutableSchema({ typeDefs, resolvers });
-
-const client = new ApolloClient({
- cache: new InMemoryCache(),
- link: new ReactiveSchemaLink({schema)})
-});
-```
-
-
-::: tip Using react-apollo
-A practical example can also be found in `examples/react-apollo`.
-:::
\ No newline at end of file
diff --git a/packages/docs/db.json b/packages/docs/db.json
new file mode 100644
index 0000000..c345324
--- /dev/null
+++ b/packages/docs/db.json
@@ -0,0 +1 @@
+{"meta":{"version":1,"warehouse":"3.0.2"},"models":{"Asset":[{"_id":"themes/subspace/source/css/application.scss","path":"css/application.scss","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/accounting-calculator.svg","path":"icons/accounting-calculator.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/book-address.svg","path":"icons/book-address.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/contactless-payment.svg","path":"icons/contactless-payment.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/close.svg","path":"icons/close.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/cloud-lock.svg","path":"icons/cloud-lock.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/crypto-currency-bitcoin-give.svg","path":"icons/crypto-currency-bitcoin-give.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/crypto-currency-bitcoin-lock.svg","path":"icons/crypto-currency-bitcoin-lock.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/facebook.svg","path":"icons/facebook.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/gauge-dashboard-1-alternate.svg","path":"icons/gauge-dashboard-1-alternate.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/credit-card-1.svg","path":"icons/credit-card-1.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/gesture-tap-2.svg","path":"icons/gesture-tap-2.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/navigation-menu.svg","path":"icons/navigation-menu.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/half-circles.svg","path":"icons/half-circles.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/twitter.svg","path":"icons/twitter.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/github.svg","path":"icons/github.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/images/embark-logo.svg","path":"images/embark-logo.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/images/favicon.png","path":"images/favicon.png","modified":0,"renderable":1},{"_id":"themes/subspace/source/images/circles.png","path":"images/circles.png","modified":0,"renderable":1},{"_id":"themes/subspace/source/images/logo.svg","path":"images/logo.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/javascripts/scripts.js","path":"javascripts/scripts.js","modified":0,"renderable":1},{"_id":"themes/subspace/source/fonts/LICENSE.txt","path":"fonts/LICENSE.txt","modified":0,"renderable":1},{"_id":"themes/subspace/source/javascripts/jquery.js","path":"javascripts/jquery.js","modified":0,"renderable":1},{"_id":"themes/subspace/source/css/utilities/text-color.scss","path":"css/utilities/text-color.scss","modified":0,"renderable":1},{"_id":"themes/subspace/source/css/utilities/text-size.scss","path":"css/utilities/text-size.scss","modified":0,"renderable":1},{"_id":"themes/subspace/source/fonts/Roboto-Regular.ttf","path":"fonts/Roboto-Regular.ttf","modified":0,"renderable":1},{"_id":"themes/subspace/source/fonts/Roboto-Bold.ttf","path":"fonts/Roboto-Bold.ttf","modified":0,"renderable":1},{"_id":"src/CNAME","path":"CNAME","modified":0,"renderable":0},{"_id":"src/d1.png","path":"d1.png","modified":0,"renderable":0},{"_id":"src/d2.png","path":"d2.png","modified":0,"renderable":0},{"_id":"src/d4.png","path":"d4.png","modified":0,"renderable":0},{"_id":"src/d3.png","path":"d3.png","modified":0,"renderable":0}],"Cache":[{"_id":"source/packages/docs/integrations.md","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642530738},{"_id":"source/packages/docs/CNAME","hash":"545c29d0214716b4d25f490ba92f7fc192267fa9","modified":1584642530729},{"_id":"source/packages/docs/api.md","hash":"ffde01913e2d96ec29385876a11263bc11fabceb","modified":1584723815864},{"_id":"source/packages/docs/apollo-client.md","hash":"cc160f89cce8517911336cee5b25cdf65917deff","modified":1584724636348},{"_id":"source/packages/docs/getting-started.md","hash":"1042b4f008235f64d7ea68bb2c2bda1ead199e55","modified":1584725507304},{"_id":"source/packages/docs/how-it-works.md","hash":"d63d4586abfc27e244c79fadc6bd511177000f93","modified":1584642530738},{"_id":"source/packages/docs/react.md","hash":"9535a6f86f81f41f7fc15abda4fa0b643445ca01","modified":1584724578524},{"_id":"source/packages/docs/index.md","hash":"c7f9f58861a13ea8feab62f9b1bdd77dbda50332","modified":1584642530738},{"_id":"source/packages/docs/reactive-graphql.md","hash":"94b59d798d01c251bdb6a6f68d7ea3488fedb100","modified":1584724721872},{"_id":"source/packages/docs/integrations-overview.md","hash":"27810364f74ec73eb6dad0c8de9d72d9b8b51819","modified":1584642530738},{"_id":"source/packages/docs/redux.md","hash":"a1e05949d04ccb860ecdf1dbbc0c0910eb08dc3a","modified":1584725185944},{"_id":"source/packages/docs/redux-observable.md","hash":"704cffb8c78cdd277e113bc36341b7ea3dc39e76","modified":1584725239448},{"_id":"source/packages/docs/tutorial.md","hash":"baadad45a3c4192b5b32636c0552e32f00e75076","modified":1584642530739},{"_id":"source/packages/docs/readme.md","hash":"87edb67efc2d3ff34adb4cdaf253af19602ad901","modified":1584642530739},{"_id":"source/packages/docs/vue.md","hash":"eae7d13431ff55dcb68392cf78abef0cdb7b4e4e","modified":1584724932780},{"_id":"source/packages/docs/d1.png","hash":"615cbb4801559261ddeaedcda06679dd13ff8f26","modified":1584642530731},{"_id":"themes/subspace/languages/en.yml","hash":"52b19a8059904b1c4d7024cb5f2e7a8071b0ab57","modified":1584642530754},{"_id":"themes/subspace/languages/.DS_Store","hash":"d76a2d7ac0d577c6351a42a52cde25f60bbe2e26","modified":1584642530754},{"_id":"themes/subspace/layout/about-us.ejs","hash":"906fffa56cbe7211846775e0b4844db1825230a7","modified":1584642530754},{"_id":"themes/subspace/layout/layout.ejs","hash":"38e9ef77f035f17fb6c4a46d3f2204d2c5f51459","modified":1584642530755},{"_id":"themes/subspace/layout/index.ejs","hash":"b104f0b2eaae87f8c90a6cdafc18e2f5c699d02a","modified":1584642530755},{"_id":"themes/subspace/layout/page.ejs","hash":"e006206018c66a2c2937215010c9c3cd705f05ad","modified":1584642530755},{"_id":"themes/subspace/layout/404.ejs","hash":"52679437dd54e18877ce4d3d6d9989b3515ff6bf","modified":1584642530754},{"_id":"source/packages/docs/d2.png","hash":"87c8eaa980edbe019c706ab8463148227bd25192","modified":1584642530733},{"_id":"source/packages/docs/d4.png","hash":"5cc6b8b2d141e41719bf9ace46d2be80d8236a69","modified":1584642530737},{"_id":"source/packages/docs/d3.png","hash":"ca19a6ae5bf461a92af770d0ed7e82170c27da4a","modified":1584642530735},{"_id":"themes/subspace/layout/partial/head.ejs","hash":"7b788f51a2f5cc3891dd2bc9db8590580a6c47da","modified":1584642530755},{"_id":"themes/subspace/source/css/application.scss","hash":"424452ff93d472ea4097d60437a5c2fb8be74e49","modified":1584642530756},{"_id":"themes/subspace/layout/partial/header.ejs","hash":"a6cbefc575f7d67895463ffce2813eee00cdc1d0","modified":1584642530756},{"_id":"themes/subspace/source/css/.DS_Store","hash":"6d11537ea7ac951519f8387948002c67d58ac9ef","modified":1584642530756},{"_id":"themes/subspace/layout/partial/footer.ejs","hash":"15e41147f066c4ae9fed03f0f10f7b821a3c54e7","modified":1584726309720},{"_id":"themes/subspace/layout/partial/mailpopup.ejs","hash":"edb6ea1449c8f419c1f6cd3fa0f3f6bac709675d","modified":1584642530756},{"_id":"themes/subspace/layout/partial/header-short.ejs","hash":"fcf71590daa7f07a0d898a9cd432faebb7b06ea9","modified":1584642530755},{"_id":"themes/subspace/source/icons/accounting-calculator.svg","hash":"7891b12b3fd13594b3ae17c10b3523208265be33","modified":1584642530762},{"_id":"themes/subspace/source/icons/book-address.svg","hash":"e2635b49f36833ec0f3373d53e3c5819a3446c24","modified":1584642530762},{"_id":"themes/subspace/source/icons/contactless-payment.svg","hash":"6674a6a6c06539d7be7bcb2459448d4895541051","modified":1584642530763},{"_id":"themes/subspace/source/icons/close.svg","hash":"07c332a892c2b2a107bf53a055425064006b7161","modified":1584642530763},{"_id":"themes/subspace/source/icons/cloud-lock.svg","hash":"b76429f6da1aaa8a1f1d1e72ae7167899976e7aa","modified":1584642530763},{"_id":"themes/subspace/source/icons/crypto-currency-bitcoin-give.svg","hash":"a07cb23aa2c7b81167289cfee51450e110dd46d2","modified":1584642530763},{"_id":"themes/subspace/source/icons/crypto-currency-bitcoin-lock.svg","hash":"27219b9e068b7dc5323217e3f49bad16f6555470","modified":1584642530763},{"_id":"themes/subspace/source/icons/facebook.svg","hash":"0cf65e7228226ff7aa72c74d35368db7599c884b","modified":1584642530763},{"_id":"themes/subspace/source/icons/gauge-dashboard-1-alternate.svg","hash":"4ab202003ecb28775848f4b6fa61a45b4cdc8a7c","modified":1584642530763},{"_id":"themes/subspace/source/icons/credit-card-1.svg","hash":"2c6082035b515eff854f84905cca61a53275aa8e","modified":1584642530763},{"_id":"themes/subspace/source/icons/gesture-tap-2.svg","hash":"8e9a60be2d1080c184f8863d8059472ae1051432","modified":1584642530763},{"_id":"themes/subspace/source/icons/navigation-menu.svg","hash":"d6b4d9e2da8849ac362bcb8d634725b921ebf46c","modified":1584642530764},{"_id":"themes/subspace/source/icons/half-circles.svg","hash":"0be6efb2cd315348a5f2f1404da205d11d5e78c3","modified":1584642530764},{"_id":"themes/subspace/source/icons/twitter.svg","hash":"dab32630d9eb04c293f9c4775271953d57eb8642","modified":1584642530764},{"_id":"themes/subspace/source/images/.DS_Store","hash":"df2fbeb1400acda0909a32c1cf6bf492f1121e07","modified":1584642530764},{"_id":"themes/subspace/source/icons/github.svg","hash":"4ad3447484a193da8e10d9705ebb598de10873e6","modified":1584642530764},{"_id":"themes/subspace/source/images/embark-logo.svg","hash":"682af62e01cd85c11235bd2258b8f87ee9b44afb","modified":1584642530765},{"_id":"themes/subspace/source/images/favicon.png","hash":"7f0c4305cd9711e9dd20ac94a5559f4d67a9fe9b","modified":1584642530765},{"_id":"themes/subspace/source/images/circles.png","hash":"ca3ed456a67c9c329e638990b9a8805a2f33c68c","modified":1584642530764},{"_id":"themes/subspace/source/images/logo.svg","hash":"e7d3c651b56c2bb890b567a67dd860fc96ad6579","modified":1584642530765},{"_id":"themes/subspace/source/javascripts/scripts.js","hash":"1f0ee8c12b179a9607cb1848710254652a7332b2","modified":1584642530766},{"_id":"themes/subspace/source/css/components/_footer.scss","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642530756},{"_id":"themes/subspace/source/fonts/LICENSE.txt","hash":"47b573e3824cd5e02a1a3ae99e2735b49e0256e4","modified":1584642530761},{"_id":"themes/subspace/source/javascripts/jquery.js","hash":"9592732de681f4365e9b7016dc5cf76e2a55ee9b","modified":1584642530765},{"_id":"themes/subspace/source/css/components/_accentbox.scss","hash":"d29f556f2e24edec1332ccc00e86426015de422a","modified":1584642530756},{"_id":"themes/subspace/source/css/components/_button.scss","hash":"0888de9a954f5bfb3b84bbfdeed13372d250f69d","modified":1584642530756},{"_id":"themes/subspace/source/css/components/_ghostbox.scss","hash":"1105139aba422228bc5a64863d28d8405d700d15","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_header.scss","hash":"e83d6db7e7c928f4d7d5fd2d57643fe1a551cffc","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_icons.scss","hash":"cb036eb40ed0c2525ca1918e59d73d6a592272ba","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_logo.scss","hash":"c3734c435890094b95a9f340337dbfc682bc1e1a","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_notification.scss","hash":"87e1aae9e3097c59833d34e72f7ae8414f667cdb","modified":1584724117876},{"_id":"themes/subspace/source/css/components/_prism-highlighting.scss","hash":"f8471f2667d53a43cb3b6003d7ecafc811283c24","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_spotlightbox.scss","hash":"2a38ea8c753890d1683b435e33e8377fb17671dc","modified":1584642530758},{"_id":"themes/subspace/source/css/components/_teaser.scss","hash":"c653e382a5a7074f5f86b89c6640a56e083b8471","modified":1584642530758},{"_id":"themes/subspace/source/css/components/_user.scss","hash":"b3663cc7b8c0afdf5f8a69031da7ac3365e844a9","modified":1584642530758},{"_id":"themes/subspace/source/css/components/_whisperbox.scss","hash":"3852852e8644c71b6604915342a10abbfd681d4b","modified":1584642530758},{"_id":"themes/subspace/source/css/objects/_actionbar.scss","hash":"195c09931d611dbfcaf9822413504ebb0e77076b","modified":1584642530758},{"_id":"themes/subspace/source/css/components/_popup.scss","hash":"ccacb82e0b24378a96841d7a480e6530630d882d","modified":1584642530757},{"_id":"themes/subspace/source/css/objects/_content.scss","hash":"4ef659a6c260c847813fabb8718f990c5c126792","modified":1584642530758},{"_id":"themes/subspace/source/css/objects/_distance.scss","hash":"7ad96acdb01f35bbd8941d61f59b055568c6e545","modified":1584642530758},{"_id":"themes/subspace/source/css/objects/_heading.scss","hash":"6569220491e75b751070f2b589fea348745e27d1","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_list.scss","hash":"ed672664d7e4a2f041ce3e3dcc6b3c9f3ebbfa7e","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_media.scss","hash":"be25ab7a3c1e3bccfaaa5fdbeeccf9308694921d","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_navigation.scss","hash":"64e3b33422ccccf702e630125a9b3ca52999c2d6","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_grid.scss","hash":"4dc75ce1b1d58e4ca6624db8115ffd196c996733","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_side-navigation.scss","hash":"231d32b8a6137f3bd4d4ac2aa24476620f558f61","modified":1584642530759},{"_id":"themes/subspace/source/css/settings/_config.scss","hash":"a27b23a9d0e1a77c4361c4cb1f7ad0468906bbb3","modified":1584642530759},{"_id":"themes/subspace/source/css/settings/_preset.scss","hash":"36ed217633bf1a18f5221299e0f60277271eecb4","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/.DS_Store","hash":"5fcb0ec5a267305e0c44b7fa11ae2793b4f428c6","modified":1584642530758},{"_id":"themes/subspace/source/css/settings/_typography.scss","hash":"6cd55798081c53c48e7ad0324a0799b53fc5ff17","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_column.scss","hash":"9e79a4e3b4ab33091af14704d35ca2ab4263b741","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-brand-color.scss","hash":"5e773a10bb143a2b423287b7faff79ac5ce3fcac","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-color.scss","hash":"c7b667b92df7fa246be2f32f395ebbde23ea0355","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-font.scss","hash":"b2895a7ef8c26ba6b34c34f1f2fb2ea5449f89cd","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-index.scss","hash":"72281c30f7e3db2060898d3c9b250bc6c8829216","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-layout-color.scss","hash":"8e57145b98219bc874041197bde973193e2ff7a8","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-notification-color.scss","hash":"761e671fe7cbd70c190254818c8e55e6d3d7ee90","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-semantic-color.scss","hash":"316f7baaa9aeac4f891901882479b37230b5c591","modified":1584642530761},{"_id":"themes/subspace/source/css/tools/_get-spacing.scss","hash":"fc5b46752f7e37da64ddad94392450d7d4f40a87","modified":1584642530761},{"_id":"themes/subspace/source/css/tools/_list-reset.scss","hash":"ed3aa5ee39890dd0454c695e1bf0a45f751c5b04","modified":1584642530761},{"_id":"themes/subspace/source/css/tools/_respond.scss","hash":"ba73d16c16235365bea5da78df0672d990ba4579","modified":1584642530761},{"_id":"themes/subspace/source/css/utilities/text-color.scss","hash":"414a963b70ee7a6250a247bdbd03f2e67e5bbdcd","modified":1584642530761},{"_id":"themes/subspace/source/css/utilities/text-size.scss","hash":"93494af1f3f44293fc9357bd726eadedf76d9516","modified":1584642530761},{"_id":"themes/subspace/source/fonts/Roboto-Regular.ttf","hash":"dd1b1db13ff1f72138c134c62f38fef83749f36a","modified":1584642530762},{"_id":"themes/subspace/source/fonts/Roboto-Bold.ttf","hash":"0ce37ced9c5fcac9bdc452a432c1258870ba4677","modified":1584642530762},{"_id":"public/integrations.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/api.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/apollo-client.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/getting-started.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/how-it-works.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/reactive-graphql.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/react.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/integrations-overview.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/redux.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/tutorial.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/redux-observable.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/readme.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/vue.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/integrations.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/api.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/apollo-client.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/getting-started.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/how-it-works.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/index.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/reactive-graphql.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/react.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/integrations-overview.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/redux.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/redux-observable.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/tutorial.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/readme.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/vue.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/index.html","hash":"f78940c9cc6789a8ebe9e87f038b29570a7551ee","modified":1584642922115},{"_id":"public/CNAME","hash":"545c29d0214716b4d25f490ba92f7fc192267fa9","modified":1584642922115},{"_id":"public/icons/accounting-calculator.svg","hash":"7891b12b3fd13594b3ae17c10b3523208265be33","modified":1584642922115},{"_id":"public/icons/book-address.svg","hash":"e2635b49f36833ec0f3373d53e3c5819a3446c24","modified":1584642922115},{"_id":"public/icons/contactless-payment.svg","hash":"6674a6a6c06539d7be7bcb2459448d4895541051","modified":1584642922115},{"_id":"public/icons/close.svg","hash":"07c332a892c2b2a107bf53a055425064006b7161","modified":1584642922115},{"_id":"public/icons/cloud-lock.svg","hash":"b76429f6da1aaa8a1f1d1e72ae7167899976e7aa","modified":1584642922115},{"_id":"public/icons/crypto-currency-bitcoin-give.svg","hash":"a07cb23aa2c7b81167289cfee51450e110dd46d2","modified":1584642922115},{"_id":"public/icons/crypto-currency-bitcoin-lock.svg","hash":"27219b9e068b7dc5323217e3f49bad16f6555470","modified":1584642922115},{"_id":"public/icons/facebook.svg","hash":"0cf65e7228226ff7aa72c74d35368db7599c884b","modified":1584642922115},{"_id":"public/icons/gesture-tap-2.svg","hash":"8e9a60be2d1080c184f8863d8059472ae1051432","modified":1584642922115},{"_id":"public/icons/gauge-dashboard-1-alternate.svg","hash":"4ab202003ecb28775848f4b6fa61a45b4cdc8a7c","modified":1584642922115},{"_id":"public/icons/credit-card-1.svg","hash":"2c6082035b515eff854f84905cca61a53275aa8e","modified":1584642922115},{"_id":"public/icons/navigation-menu.svg","hash":"d6b4d9e2da8849ac362bcb8d634725b921ebf46c","modified":1584642922115},{"_id":"public/icons/half-circles.svg","hash":"0be6efb2cd315348a5f2f1404da205d11d5e78c3","modified":1584642922115},{"_id":"public/icons/twitter.svg","hash":"dab32630d9eb04c293f9c4775271953d57eb8642","modified":1584642922115},{"_id":"public/icons/github.svg","hash":"4ad3447484a193da8e10d9705ebb598de10873e6","modified":1584642922115},{"_id":"public/images/embark-logo.svg","hash":"682af62e01cd85c11235bd2258b8f87ee9b44afb","modified":1584642922115},{"_id":"public/images/favicon.png","hash":"7f0c4305cd9711e9dd20ac94a5559f4d67a9fe9b","modified":1584642922115},{"_id":"public/images/logo.svg","hash":"e7d3c651b56c2bb890b567a67dd860fc96ad6579","modified":1584642922115},{"_id":"public/images/circles.png","hash":"ca3ed456a67c9c329e638990b9a8805a2f33c68c","modified":1584642922115},{"_id":"public/fonts/LICENSE.txt","hash":"47b573e3824cd5e02a1a3ae99e2735b49e0256e4","modified":1584642922115},{"_id":"public/javascripts/scripts.js","hash":"1f0ee8c12b179a9607cb1848710254652a7332b2","modified":1584642922115},{"_id":"public/css/utilities/text-size.css","hash":"6340d74612d186555e471c57175a5f0a3f661cdc","modified":1584642922115},{"_id":"public/css/utilities/text-color.css","hash":"3d763e25e9078d5375b4fd0d9b100aa1b8a91d93","modified":1584642922115},{"_id":"public/javascripts/jquery.js","hash":"9592732de681f4365e9b7016dc5cf76e2a55ee9b","modified":1584642922115},{"_id":"public/css/application.css","hash":"e7e477ef203d3d902df2518d63ef12731d0a50f8","modified":1584642922115},{"_id":"public/d1.png","hash":"615cbb4801559261ddeaedcda06679dd13ff8f26","modified":1584642922115},{"_id":"public/fonts/Roboto-Bold.ttf","hash":"0ce37ced9c5fcac9bdc452a432c1258870ba4677","modified":1584642922115},{"_id":"public/d4.png","hash":"5cc6b8b2d141e41719bf9ace46d2be80d8236a69","modified":1584642922115},{"_id":"public/d3.png","hash":"ca19a6ae5bf461a92af770d0ed7e82170c27da4a","modified":1584642922115},{"_id":"public/fonts/Roboto-Regular.ttf","hash":"dd1b1db13ff1f72138c134c62f38fef83749f36a","modified":1584642922115},{"_id":"public/d2.png","hash":"87c8eaa980edbe019c706ab8463148227bd25192","modified":1584642922115},{"_id":"source/packages/docs/_data/sidebar.yml","hash":"09bc83728b4dc7a9db44fdfce15769972c1eec3a","modified":1584642530730},{"_id":"source/packages/docs/_posts/hello-world.md","hash":"7d98d6592de80fdcd2949bd7401cec12afd98cdf","modified":1584642530730},{"_id":"source/packages/docs/.DS_Store","hash":"078fc163bb0c365b31f211f49a5e78e2703b3f12","modified":1584643079469},{"_id":"themes/subspace/layout/partial/analytics.ejs","hash":"bf68e467c9adc5e07591ddf1e74da824750948f2","modified":1584726372396},{"_id":"src/integrations.md","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584723381904},{"_id":"src/CNAME","hash":"545c29d0214716b4d25f490ba92f7fc192267fa9","modified":1584723381896},{"_id":"src/api.md","hash":"ffde01913e2d96ec29385876a11263bc11fabceb","modified":1584723815864},{"_id":"src/apollo-client.md","hash":"cc160f89cce8517911336cee5b25cdf65917deff","modified":1584724636348},{"_id":"src/getting-started.md","hash":"1042b4f008235f64d7ea68bb2c2bda1ead199e55","modified":1584725507304},{"_id":"src/how-it-works.md","hash":"d63d4586abfc27e244c79fadc6bd511177000f93","modified":1583767514948},{"_id":"src/index.md","hash":"c7f9f58861a13ea8feab62f9b1bdd77dbda50332","modified":1584723381904},{"_id":"src/integrations-overview.md","hash":"27810364f74ec73eb6dad0c8de9d72d9b8b51819","modified":1583767514948},{"_id":"src/react.md","hash":"9535a6f86f81f41f7fc15abda4fa0b643445ca01","modified":1584724578524},{"_id":"src/reactive-graphql.md","hash":"94b59d798d01c251bdb6a6f68d7ea3488fedb100","modified":1584724721872},{"_id":"src/readme.md","hash":"87edb67efc2d3ff34adb4cdaf253af19602ad901","modified":1583767514948},{"_id":"src/redux-observable.md","hash":"704cffb8c78cdd277e113bc36341b7ea3dc39e76","modified":1584725239448},{"_id":"src/tutorial.md","hash":"baadad45a3c4192b5b32636c0552e32f00e75076","modified":1583767514948},{"_id":"src/redux.md","hash":"a1e05949d04ccb860ecdf1dbbc0c0910eb08dc3a","modified":1584725185944},{"_id":"src/vue.md","hash":"eae7d13431ff55dcb68392cf78abef0cdb7b4e4e","modified":1584724932780},{"_id":"src/_data/sidebar.yml","hash":"09bc83728b4dc7a9db44fdfce15769972c1eec3a","modified":1584723381896},{"_id":"src/_posts/hello-world.md","hash":"7d98d6592de80fdcd2949bd7401cec12afd98cdf","modified":1584723381896},{"_id":"src/d1.png","hash":"615cbb4801559261ddeaedcda06679dd13ff8f26","modified":1584723381896},{"_id":"src/d2.png","hash":"87c8eaa980edbe019c706ab8463148227bd25192","modified":1584723381900},{"_id":"src/d4.png","hash":"5cc6b8b2d141e41719bf9ace46d2be80d8236a69","modified":1584723381904},{"_id":"src/d3.png","hash":"ca19a6ae5bf461a92af770d0ed7e82170c27da4a","modified":1584723381904}],"Category":[],"Data":[{"_id":"sidebar","data":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}],"Page":[{"_content":"","source":"integrations.md","raw":"","date":"2020-03-20T16:56:21.904Z","updated":"2020-03-20T16:56:21.904Z","path":"integrations.html","title":"","comments":1,"layout":"page","_id":"ck80hf5kd0000m4jeh9dp1k1h","content":"","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":""},{"title":"Homepage","_content":"","source":"index.md","raw":"title: Homepage\n---\n","date":"2020-03-20T16:56:21.904Z","updated":"2020-03-20T16:56:21.904Z","path":"index.html","comments":1,"layout":"page","_id":"ck80hf5kp0001m4je0wxk5zrk","content":"","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":""},{"_content":"# How it works?\n\n### Setup\n\n1. A ÐApp requests `Subspace` to track an event, property, or balance.\n2. `Subspace` creates a observable for that event, and a web3 subscription to retrieve events from the chain\n3. The ÐApp subscribes to the observable to receive events.\n\n### Receiving events\n\nDepending on the filter parameters used to track the events, once an event is found, it is stored in `localStorage` and it is also pushed to the observable which delivers it to the ÐApp subscription.\n\n### Tracking already known events \nAfter restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of `Subspace` will change: \n\n1. The Dapp will request `Subspace` to track an event it already knows, creating an observable and subscription for that event\n2. It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again. \n\n\nThe web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step\n","source":"how-it-works.md","raw":"# How it works?\n\n### Setup\n\n1. A ÐApp requests `Subspace` to track an event, property, or balance.\n2. `Subspace` creates a observable for that event, and a web3 subscription to retrieve events from the chain\n3. The ÐApp subscribes to the observable to receive events.\n\n### Receiving events\n\nDepending on the filter parameters used to track the events, once an event is found, it is stored in `localStorage` and it is also pushed to the observable which delivers it to the ÐApp subscription.\n\n### Tracking already known events \nAfter restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of `Subspace` will change: \n\n1. The Dapp will request `Subspace` to track an event it already knows, creating an observable and subscription for that event\n2. It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again. \n\n\nThe web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step\n","date":"2020-03-20T17:02:58.892Z","updated":"2020-03-09T15:25:14.948Z","path":"how-it-works.html","title":"","comments":1,"layout":"page","_id":"ck80hf5ks0002m4jebndqdftx","content":"
How it works?
Setup
\n\n
A ÐApp requests Subspace to track an event, property, or balance.
\n
Subspace creates a observable for that event, and a web3 subscription to retrieve events from the chain
\n
The ÐApp subscribes to the observable to receive events.
\n\n
Receiving events
Depending on the filter parameters used to track the events, once an event is found, it is stored in localStorage and it is also pushed to the observable which delivers it to the ÐApp subscription.
\n
Tracking already known events
After restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of Subspace will change:
\n\n
The Dapp will request Subspace to track an event it already knows, creating an observable and subscription for that event
\n
It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again.
\n\n
The web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
How it works?
Setup
\n\n
A ÐApp requests Subspace to track an event, property, or balance.
\n
Subspace creates a observable for that event, and a web3 subscription to retrieve events from the chain
\n
The ÐApp subscribes to the observable to receive events.
\n\n
Receiving events
Depending on the filter parameters used to track the events, once an event is found, it is stored in localStorage and it is also pushed to the observable which delivers it to the ÐApp subscription.
\n
Tracking already known events
After restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of Subspace will change:
\n\n
The Dapp will request Subspace to track an event it already knows, creating an observable and subscription for that event
\n
It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again.
\n\n
The web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step
\n"},{"_content":"# apollo-client\nTo use **Subspace** with `apollo-client`, a `ReactiveSchemaLink` from `apollo-link-reactive-schema` must be used with a custom schema.\n\n```js\nimport {InMemoryCache} from \"apollo-cache-inmemory\";\nimport ApolloClient from \"apollo-client\";\nimport {ReactiveSchemaLink} from \"apollo-link-reactive-schema\";\n\nconst schema = makeExecutableSchema({typeDefs, resolvers});\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n\n```\n\n### Example\n\n```js{35-45}\nimport { ApolloClient } from \"apollo-client\";\nimport { InMemoryCache } from \"apollo-cache-inmemory\";\nimport {ReactiveSchemaLink} from \"apollo-link-reactive-schema\";\nimport Subspace from \"@embarklabs/subspace\";\n\n// ...\n\n// Initialize Subspace\nconst subspace = new Subspace(web3);\nawait subspace.init();\n\nconst MyContractInstance = ...; // TODO: obtain a web3.eth.Contract instance\n\nconst typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n`;\n\nconst resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})\n }\n};\n\nconst schema = makeExecutableSchema({ typeDefs, resolvers });\n\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n```\n\n\n
\n
Using Apollo with Subspace
\nA practical example can also be found in examples/react-apollo.\n
","source":"apollo-client.md","raw":"# apollo-client\nTo use **Subspace** with `apollo-client`, a `ReactiveSchemaLink` from `apollo-link-reactive-schema` must be used with a custom schema.\n\n```js\nimport {InMemoryCache} from \"apollo-cache-inmemory\";\nimport ApolloClient from \"apollo-client\";\nimport {ReactiveSchemaLink} from \"apollo-link-reactive-schema\";\n\nconst schema = makeExecutableSchema({typeDefs, resolvers});\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n\n```\n\n### Example\n\n```js{35-45}\nimport { ApolloClient } from \"apollo-client\";\nimport { InMemoryCache } from \"apollo-cache-inmemory\";\nimport {ReactiveSchemaLink} from \"apollo-link-reactive-schema\";\nimport Subspace from \"@embarklabs/subspace\";\n\n// ...\n\n// Initialize Subspace\nconst subspace = new Subspace(web3);\nawait subspace.init();\n\nconst MyContractInstance = ...; // TODO: obtain a web3.eth.Contract instance\n\nconst typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n`;\n\nconst resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})\n }\n};\n\nconst schema = makeExecutableSchema({ typeDefs, resolvers });\n\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n```\n\n\n
\n
Using Apollo with Subspace
\nA practical example can also be found in examples/react-apollo.\n
To use Subspace with apollo-client, a ReactiveSchemaLink from apollo-link-reactive-schema must be used with a custom schema.
\n\n\n
import {InMemoryCache} from "apollo-cache-inmemory";\nimport ApolloClient from "apollo-client";\nimport {ReactiveSchemaLink} from "apollo-link-reactive-schema";\n\nconst schema = makeExecutableSchema({typeDefs, resolvers});\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n
\n\n\n\n
Example
\n\n
import { ApolloClient } from "apollo-client";\nimport { InMemoryCache } from "apollo-cache-inmemory";\nimport {ReactiveSchemaLink} from "apollo-link-reactive-schema";\nimport Subspace from "@embarklabs/subspace";\n\n// ...\n\n// Initialize Subspace\nconst subspace = new Subspace(web3);\nawait subspace.init();\n\nconst MyContractInstance = ...; // TODO: obtain a web3.eth.Contract instance\n\nconst typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n`;\n\nconst resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})\n }\n};\n\nconst schema = makeExecutableSchema({ typeDefs, resolvers });\n\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n
\n\n\n\n
\n
Using Apollo with Subspace
\nA practical example can also be found in examples/react-apollo.\n
","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
apollo-client
To use Subspace with apollo-client, a ReactiveSchemaLink from apollo-link-reactive-schema must be used with a custom schema.
\n\n\n
import {InMemoryCache} from "apollo-cache-inmemory";\nimport ApolloClient from "apollo-client";\nimport {ReactiveSchemaLink} from "apollo-link-reactive-schema";\n\nconst schema = makeExecutableSchema({typeDefs, resolvers});\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n
\n\n\n\n
Example
\n\n
import { ApolloClient } from "apollo-client";\nimport { InMemoryCache } from "apollo-cache-inmemory";\nimport {ReactiveSchemaLink} from "apollo-link-reactive-schema";\nimport Subspace from "@embarklabs/subspace";\n\n// ...\n\n// Initialize Subspace\nconst subspace = new Subspace(web3);\nawait subspace.init();\n\nconst MyContractInstance = ...; // TODO: obtain a web3.eth.Contract instance\n\nconst typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n`;\n\nconst resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})\n }\n};\n\nconst schema = makeExecutableSchema({ typeDefs, resolvers });\n\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n
\n\n\n\n
\n
Using Apollo with Subspace
\nA practical example can also be found in examples/react-apollo.\n
"},{"_content":"# React\nSubspace also provides a set of components that simplifies its usage within React projects through the `@embarklabs/subspace-react` package.\n\n### Install\nYou can install it through npm or yarn:\n```\nnpm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies\n```\n\n### Usage\n\n#### SubspaceProvider\nTo use most of the `subspace-react` components, you need to wrap your app with the `` component. This will make Subspace available to any nested components that accesses it via the `useSubspace` hook or has been wrapped in the `withSubspace` higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The `SubspaceProvider` requires a web3 object\n\n```js\n// index.js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport MyApp from './MyApp'\nimport { SubspaceProvider } from '@embarklabs/subspace-react';\n\nconst web3 = new Web3(\"ws://localhost:8545\");\n\nconst rootElement = document.getElementById('root')\nReactDOM.render(\n \n \n ,\n rootElement\n);\n```\n\n\n#### useSubspace\nRather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the `useSubspace` hook. Be sure that your entire dApp is wrapped with a `` to have it available througout the component tree.\n```js\n// index.js\nimport React from 'react'\nimport { useSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = () => {\n const subspace = useSubspace();\n\n // do something....\n // subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default MyComponent\n```\n\n\n#### withSubspace\nThis higher order component is provided as an alternative to the `useSubspace` hook. This injects the `subspace` property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a ``.\n\n```js\n// index.js\nimport React from 'react'\nimport { withSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = (props) => {\n // do something....\n // props.subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default withSubspace(MyComponent);\n```\n\n\n#### observe\n\nUseful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.\n\n\n```js\nimport { observe } from '@embarklabs/subspace-react';\n\nconst ObserverComponent = observe(WrappedComponent);\n```\n\n##### Example usage:\n```js\nconst MyComponent = ({eventData}) => {\n // Handle initial state when no data is available\n if (!eventData) {\n return
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address that has been enhanced with subspace.contract(). You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';.\n
\n\n\n
\nTo learn more about how to use subspace-react, there are full working examples available in Github \n
\n","source":"react.md","raw":"# React\nSubspace also provides a set of components that simplifies its usage within React projects through the `@embarklabs/subspace-react` package.\n\n### Install\nYou can install it through npm or yarn:\n```\nnpm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies\n```\n\n### Usage\n\n#### SubspaceProvider\nTo use most of the `subspace-react` components, you need to wrap your app with the `` component. This will make Subspace available to any nested components that accesses it via the `useSubspace` hook or has been wrapped in the `withSubspace` higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The `SubspaceProvider` requires a web3 object\n\n```js\n// index.js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport MyApp from './MyApp'\nimport { SubspaceProvider } from '@embarklabs/subspace-react';\n\nconst web3 = new Web3(\"ws://localhost:8545\");\n\nconst rootElement = document.getElementById('root')\nReactDOM.render(\n \n \n ,\n rootElement\n);\n```\n\n\n#### useSubspace\nRather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the `useSubspace` hook. Be sure that your entire dApp is wrapped with a `` to have it available througout the component tree.\n```js\n// index.js\nimport React from 'react'\nimport { useSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = () => {\n const subspace = useSubspace();\n\n // do something....\n // subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default MyComponent\n```\n\n\n#### withSubspace\nThis higher order component is provided as an alternative to the `useSubspace` hook. This injects the `subspace` property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a ``.\n\n```js\n// index.js\nimport React from 'react'\nimport { withSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = (props) => {\n // do something....\n // props.subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default withSubspace(MyComponent);\n```\n\n\n#### observe\n\nUseful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.\n\n\n```js\nimport { observe } from '@embarklabs/subspace-react';\n\nconst ObserverComponent = observe(WrappedComponent);\n```\n\n##### Example usage:\n```js\nconst MyComponent = ({eventData}) => {\n // Handle initial state when no data is available\n if (!eventData) {\n return
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address that has been enhanced with subspace.contract(). You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';.\n
\n\n\n
\nTo learn more about how to use subspace-react, there are full working examples available in Github \n
Subspace also provides a set of components that simplifies its usage within React projects through the @embarklabs/subspace-react package.
\n
Install
You can install it through npm or yarn:
\n\n\n
npm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies\n
\n\n\n\n
Usage
SubspaceProvider
To use most of the subspace-react components, you need to wrap your app with the <SubspaceProvider web3={web3} /> component. This will make Subspace available to any nested components that accesses it via the useSubspace hook or has been wrapped in the withSubspace higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The SubspaceProvider requires a web3 object
\n\n\n
// index.js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport MyApp from './MyApp'\nimport { SubspaceProvider } from '@embarklabs/subspace-react';\n\nconst web3 = new Web3("ws://localhost:8545");\n\nconst rootElement = document.getElementById('root')\nReactDOM.render(\n <SubspaceProvider web3={web3}>\n <MyApp />\n </SubspaceProvider>,\n rootElement\n);\n
\n\n\n\n
useSubspace
Rather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the useSubspace hook. Be sure that your entire dApp is wrapped with a <SubspaceProvider /> to have it available througout the component tree.
\n\n\n
// index.js\nimport React from 'react'\nimport { useSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = () => {\n const subspace = useSubspace();\n\n // do something....\n // subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default MyComponent\n
\n\n\n\n
withSubspace
This higher order component is provided as an alternative to the useSubspace hook. This injects the subspace property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a <SubspaceProvider />.
\n\n\n
// index.js\nimport React from 'react'\nimport { withSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = (props) => {\n // do something....\n // props.subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default withSubspace(MyComponent);\n
\n\n\n\n
observe
Useful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.
\n\n\n
import { observe } from '@embarklabs/subspace-react';\n\nconst ObserverComponent = observe(WrappedComponent);\n
\n\n\n\n
Example usage:
\n\n
const MyComponent = ({eventData}) => {\n // Handle initial state when no data is available\n if (!eventData) {\n return <p>No data</p>;\n }\n \n return <p>Value: {eventData.someReturnValue}</p>\n};\n\n\nconst MyEnhancedComponent = observe(MyComponent);\n\n\nconst SomeOtherComponent = () => {\n const myObservable$ = MyContractInstance.events.MyEvent.track({fromBlock: 1});\n return <MyEnhancedComponent myProp={myObservable$} />;\n}\n
\n\n\n\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address that has been enhanced with subspace.contract(). You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';.\n
\n\n\n
\nTo learn more about how to use subspace-react, there are full working examples available in Github \n
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
React
Subspace also provides a set of components that simplifies its usage within React projects through the @embarklabs/subspace-react package.
\n
Install
You can install it through npm or yarn:
\n\n\n
npm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies\n
\n\n\n\n
Usage
SubspaceProvider
To use most of the subspace-react components, you need to wrap your app with the <SubspaceProvider web3={web3} /> component. This will make Subspace available to any nested components that accesses it via the useSubspace hook or has been wrapped in the withSubspace higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The SubspaceProvider requires a web3 object
\n\n\n
// index.js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport MyApp from './MyApp'\nimport { SubspaceProvider } from '@embarklabs/subspace-react';\n\nconst web3 = new Web3("ws://localhost:8545");\n\nconst rootElement = document.getElementById('root')\nReactDOM.render(\n <SubspaceProvider web3={web3}>\n <MyApp />\n </SubspaceProvider>,\n rootElement\n);\n
\n\n\n\n
useSubspace
Rather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the useSubspace hook. Be sure that your entire dApp is wrapped with a <SubspaceProvider /> to have it available througout the component tree.
\n\n\n
// index.js\nimport React from 'react'\nimport { useSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = () => {\n const subspace = useSubspace();\n\n // do something....\n // subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default MyComponent\n
\n\n\n\n
withSubspace
This higher order component is provided as an alternative to the useSubspace hook. This injects the subspace property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a <SubspaceProvider />.
\n\n\n
// index.js\nimport React from 'react'\nimport { withSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = (props) => {\n // do something....\n // props.subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default withSubspace(MyComponent);\n
\n\n\n\n
observe
Useful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.
\n\n\n
import { observe } from '@embarklabs/subspace-react';\n\nconst ObserverComponent = observe(WrappedComponent);\n
\n\n\n\n
Example usage:
\n\n
const MyComponent = ({eventData}) => {\n // Handle initial state when no data is available\n if (!eventData) {\n return <p>No data</p>;\n }\n \n return <p>Value: {eventData.someReturnValue}</p>\n};\n\n\nconst MyEnhancedComponent = observe(MyComponent);\n\n\nconst SomeOtherComponent = () => {\n const myObservable$ = MyContractInstance.events.MyEvent.track({fromBlock: 1});\n return <MyEnhancedComponent myProp={myObservable$} />;\n}\n
\n\n\n\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address that has been enhanced with subspace.contract(). You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';.\n
\n\n\n
\nTo learn more about how to use subspace-react, there are full working examples available in Github \n
\n"},{"_content":"# Integrations with other frameworks\n\n**Subspace** does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate **Subspace** with various frontend frameworks and libraries","source":"integrations-overview.md","raw":"# Integrations with other frameworks\n\n**Subspace** does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate **Subspace** with various frontend frameworks and libraries","date":"2020-03-20T17:02:59.624Z","updated":"2020-03-09T15:25:14.948Z","path":"integrations-overview.html","title":"","comments":1,"layout":"page","_id":"ck80hf5kz0005m4je7srf4c8n","content":"
Integrations with other frameworks
Subspace does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate Subspace with various frontend frameworks and libraries
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
Integrations with other frameworks
Subspace does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate Subspace with various frontend frameworks and libraries
\n"},{"_content":"# reactive-graphql\n\nUsing `reactive-graphql` you can execute GraphQL queries against **Subspace** observables after you create your own type definitions and resolvers.\n\n### Example\n\n\n```js\nconst Subspace = require('@embarklabs/subspace');\nconst MyContract = require('./MyContract');\nconst { pluck } = require('rxjs/operators');\nconst { makeExecutableSchema } = require(\"graphql-tools\");\nconst gql = require(\"graphql-tag\");\nconst { graphql } = require(\"reactive-graphql\");\n\nconst run = async () => {\n const subspace = new Subspace(web3);\n await subspace.init();\n\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n `;\n\n const resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', { filter: {}, fromBlock: 1 })\n }\n };\n\n const schema = makeExecutableSchema({ typeDefs, resolvers });\n\n const query = gql`\n query {\n myEvents {\n someValue\n anotherValue\n }\n }\n `;\n\n const stream = graphql(schema, query).pipe(pluck('data', 'myEvents'));\n stream.subscribe(data => {\n console.log(data);\n })\n\n}\n\nrun();\n```\n\n
","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
reactive-graphql
Using reactive-graphql you can execute GraphQL queries against Subspace observables after you create your own type definitions and resolvers.
"},{"_content":"# redux-observable\n\n[redux-observables](https://redux-observable.js.org/) can be used to manage side effects via `Epics` (their core primitive to receive and create stream of actions). **Subspace** can be configured inside these epics. \n\nIt's recommended to compose these epics by using [mergeMap](https://www.learnrxjs.io/operators/transformation/mergemap.html) or [switchMap](https://www.learnrxjs.io/operators/transformation/switchmap.html) operators.\n\nHere's an example on how to use **Subspace** to subscribe to an Event when the action `SOME_ACTION` is dispatched, and then it will trigger `myAction` when the observable emits a value.\n\n```js\n// ...\n\nconst myEpic = action$ =>\n action$.pipe(\n ofType(\"SOME_ACTION\"), // Execute when the action type is 'INIT'\n switchMap(action =>\n subspace\n .trackEvent(MyContract, \"MyEventName\", { filter: {}, fromBlock: 1})\n .pipe(\n map(myAction) // Trigger redux action: MY_ACTION with the eventData\n )\n )\n );\n\n// ...\n```\n\n
\n\n#### Further read\n- [Epics](https://redux-observable.js.org/docs/basics/Epics.html)\n\n","source":"redux-observable.md","raw":"# redux-observable\n\n[redux-observables](https://redux-observable.js.org/) can be used to manage side effects via `Epics` (their core primitive to receive and create stream of actions). **Subspace** can be configured inside these epics. \n\nIt's recommended to compose these epics by using [mergeMap](https://www.learnrxjs.io/operators/transformation/mergemap.html) or [switchMap](https://www.learnrxjs.io/operators/transformation/switchmap.html) operators.\n\nHere's an example on how to use **Subspace** to subscribe to an Event when the action `SOME_ACTION` is dispatched, and then it will trigger `myAction` when the observable emits a value.\n\n```js\n// ...\n\nconst myEpic = action$ =>\n action$.pipe(\n ofType(\"SOME_ACTION\"), // Execute when the action type is 'INIT'\n switchMap(action =>\n subspace\n .trackEvent(MyContract, \"MyEventName\", { filter: {}, fromBlock: 1})\n .pipe(\n map(myAction) // Trigger redux action: MY_ACTION with the eventData\n )\n )\n );\n\n// ...\n```\n\n
\n\n#### Further read\n- [Epics](https://redux-observable.js.org/docs/basics/Epics.html)\n\n","date":"2020-03-20T17:27:19.448Z","updated":"2020-03-20T17:27:19.448Z","path":"redux-observable.html","title":"","comments":1,"layout":"page","_id":"ck80hf5l10007m4jef2a15n0a","content":"
redux-observable
redux-observables can be used to manage side effects via Epics (their core primitive to receive and create stream of actions). Subspace can be configured inside these epics.
\n
It’s recommended to compose these epics by using mergeMap or switchMap operators.
\n
Here’s an example on how to use Subspace to subscribe to an Event when the action SOME_ACTION is dispatched, and then it will trigger myAction when the observable emits a value.
\n\n\n
// ...\n\nconst myEpic = action$ =>\n action$.pipe(\n ofType("SOME_ACTION"), // Execute when the action type is 'INIT'\n switchMap(action =>\n subspace\n .trackEvent(MyContract, "MyEventName", { filter: {}, fromBlock: 1})\n .pipe(\n map(myAction) // Trigger redux action: MY_ACTION with the eventData\n )\n )\n );\n\n// ...\n
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
redux-observable
redux-observables can be used to manage side effects via Epics (their core primitive to receive and create stream of actions). Subspace can be configured inside these epics.
\n
It’s recommended to compose these epics by using mergeMap or switchMap operators.
\n
Here’s an example on how to use Subspace to subscribe to an Event when the action SOME_ACTION is dispatched, and then it will trigger myAction when the observable emits a value.
\n\n\n
// ...\n\nconst myEpic = action$ =>\n action$.pipe(\n ofType("SOME_ACTION"), // Execute when the action type is 'INIT'\n switchMap(action =>\n subspace\n .trackEvent(MyContract, "MyEventName", { filter: {}, fromBlock: 1})\n .pipe(\n map(myAction) // Trigger redux action: MY_ACTION with the eventData\n )\n )\n );\n\n// ...\n
\n"},{"home":true,"heroImage":"/assets/img/logo.svg","heroText":" ","actionText":"Get Started","actionLink":"/getting-started/","footer":"MIT Licensed | Subspace is part of the Status Network","features":[{"title":"Automatic Syncing","details":"Subspace takes care of syncing under the hood, syncing exactly what you need when you need it. It saves the state to a local database ensuring the DApp always syncs from the last known point even after reloading the DApp."},{"title":"Reactive","details":"Subspace embraces reactive programming with RxJS. It provides methods to track and subscribe to events, contract state & balances, and react to changes via observables."},{"title":"Framework Agnostic","details":"Subspace is framework agnostic and integrates well with your favourite frameworks, from React to Angular. It works in the browser and in nodejs."}],"_content":"\n---\n\n\n","source":"readme.md","raw":"---\nhome: true\nheroImage: /assets/img/logo.svg\nheroText: \" \"\nactionText: Get Started\nactionLink: /getting-started/\nfooter: MIT Licensed | Subspace is part of the Status Network \nfeatures:\n- title: Automatic Syncing\n details: Subspace takes care of syncing under the hood, syncing exactly what you need when you need it. It saves the state to a local database ensuring the DApp always syncs from the last known point even after reloading the DApp.\n- title: Reactive\n details: Subspace embraces reactive programming with RxJS. It provides methods to track and subscribe to events, contract state & balances, and react to changes via observables.\n- title: Framework Agnostic\n details: Subspace is framework agnostic and integrates well with your favourite frameworks, from React to Angular. It works in the browser and in nodejs.\n\n---\n\n---\n\n\n","date":"2020-03-20T17:03:01.692Z","updated":"2020-03-09T15:25:14.948Z","path":"readme.html","title":"","comments":1,"layout":"page","_id":"ck80hf5l20008m4je0ebg8crs","content":"\n\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"\n\n"},{"_content":"# Creating a reactive ÐApp with React and Subspace\n\nSee example DApp at [https://github.com/embark-framework/subspace/tree/master/examples/react-example1](https://github.com/embark-framework/subspace/tree/master/examples/react-example1)\n\n","source":"tutorial.md","raw":"# Creating a reactive ÐApp with React and Subspace\n\nSee example DApp at [https://github.com/embark-framework/subspace/tree/master/examples/react-example1](https://github.com/embark-framework/subspace/tree/master/examples/react-example1)\n\n","date":"2020-03-20T17:03:03.488Z","updated":"2020-03-09T15:25:14.948Z","path":"tutorial.html","title":"","comments":1,"layout":"page","_id":"ck80hf5l30009m4jeeqo42ds8","content":"
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
\n"},{"_content":"# Vue\nVue provides the official npm package `vue-rx` that provides RxJS integration, which simplifies the use of Subspace with Vue.js\n\n### Example\n\n
\n\n\n\n```\n\n\n\n#### Further read\n- [vue-rx](https://www.npmjs.com/package/vue-rx)\n","source":"vue.md","raw":"# Vue\nVue provides the official npm package `vue-rx` that provides RxJS integration, which simplifies the use of Subspace with Vue.js\n\n### Example\n\n
\n\n\n\n```\n\n\n\n#### Further read\n- [vue-rx](https://www.npmjs.com/package/vue-rx)\n","date":"2020-03-20T17:22:12.780Z","updated":"2020-03-20T17:22:12.780Z","path":"vue.html","title":"","comments":1,"layout":"page","_id":"ck80hf5l4000am4je19p60327","content":"
Vue
Vue provides the official npm package vue-rx that provides RxJS integration, which simplifies the use of Subspace with Vue.js
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
Vue
Vue provides the official npm package vue-rx that provides RxJS integration, which simplifies the use of Subspace with Vue.js
\n"},{"_content":"# redux \n\n**Subspace** can be used with [redux](https://redux.js.org/). **Subspace** returns [`Observables`](https://rxjs-dev.firebaseapp.com/guide/observable), which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.\n\n### Example\nHere's a simple example on how to setup **Subspace** to work with `redux`:\n\n
\n\n#### index.js\n```js\nimport store from './store';\nimport web3 from './web3';\nimport Subspace from '@embarklabs/subspace';\nimport { myAction } from './actions';\n\nconst run = async () => {\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const subspace = new Subspace(web3);\n await subspace.init();\n \n subspace.trackEvent(MyContractInstance, \"MyEvent\", {filter: {}, fromBlock: 1 })\n .subscribe(eventData => {\n store.dispatch(myAction(eventData));\n });\n}\n\nrun();\n```\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address. You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';, or use web3.js directly (just like in the example source code)\n
\nA practical example can also be found in examples/react-redux.\n
","source":"redux.md","raw":"# redux \n\n**Subspace** can be used with [redux](https://redux.js.org/). **Subspace** returns [`Observables`](https://rxjs-dev.firebaseapp.com/guide/observable), which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.\n\n### Example\nHere's a simple example on how to setup **Subspace** to work with `redux`:\n\n
\n\n#### index.js\n```js\nimport store from './store';\nimport web3 from './web3';\nimport Subspace from '@embarklabs/subspace';\nimport { myAction } from './actions';\n\nconst run = async () => {\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const subspace = new Subspace(web3);\n await subspace.init();\n \n subspace.trackEvent(MyContractInstance, \"MyEvent\", {filter: {}, fromBlock: 1 })\n .subscribe(eventData => {\n store.dispatch(myAction(eventData));\n });\n}\n\nrun();\n```\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address. You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';, or use web3.js directly (just like in the example source code)\n
Subspace can be used with redux. Subspace returns Observables, which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.
\n
Example
Here’s a simple example on how to setup Subspace to work with redux:
import store from './store';\nimport web3 from './web3';\nimport Subspace from '@embarklabs/subspace';\nimport { myAction } from './actions';\n\nconst run = async () => {\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const subspace = new Subspace(web3);\n await subspace.init();\n \n subspace.trackEvent(MyContractInstance, "MyEvent", {filter: {}, fromBlock: 1 })\n .subscribe(eventData => {\n store.dispatch(myAction(eventData));\n });\n}\n\nrun();\n
\n\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address. You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';, or use web3.js directly (just like in the example source code)\n
\n\n
store.js
\n\n
import { createStore } from 'redux';\nimport {myReducer} from './reducer';\n\nexport default store = createStore(myReducer);\n
\nA practical example can also be found in examples/react-redux.\n
","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
redux
Subspace can be used with redux. Subspace returns Observables, which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.
\n
Example
Here’s a simple example on how to setup Subspace to work with redux:
import store from './store';\nimport web3 from './web3';\nimport Subspace from '@embarklabs/subspace';\nimport { myAction } from './actions';\n\nconst run = async () => {\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const subspace = new Subspace(web3);\n await subspace.init();\n \n subspace.trackEvent(MyContractInstance, "MyEvent", {filter: {}, fromBlock: 1 })\n .subscribe(eventData => {\n store.dispatch(myAction(eventData));\n });\n}\n\nrun();\n
\n\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address. You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';, or use web3.js directly (just like in the example source code)\n
\n\n
store.js
\n\n
import { createStore } from 'redux';\nimport {myReducer} from './reducer';\n\nexport default store = createStore(myReducer);\n
\nA practical example can also be found in examples/react-redux.\n
"},{"_content":"# API\n\n## General\n\n### `new Subspace(web3 [, options])`\nConstructor. \n\n**Parameters**\n1. `web3` - `Object`: a `web3.js` object.\n2. `options` - `Object` (optional): Options used to initialize Subspace\n\t- `dbFilename` - `String` (optional): Name of the database where the information will be stored (default `'subspace.db'`)\n - `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).\n - `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),\n - `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)\n\n\n### `init()`\nInitializes **Subspace**\n\n**Returns**\n`Promise` that once it's resolved, will mean that **Subspace** is available to use\n\n### `close()`\nDispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution.\n\n### `contract(instance|{abi,address})`\nAdds a `track` method to the web3 contract objects. You can obtain this functionality by passing a `web3.eth.Contract` instance, or the `abi` and `address` of your contract\n\n**Returns**\n`web3.eth.Contract` object enhanced with `.track()` functions for methods and events.\n\n## Contract methods\n\n### `myContract.events.MyEvent.track([options])`\nTrack a contract event.\n\n**Parameters**\n1. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters\n - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `\"myNumber\"` is `12` or `13`.\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `\"latest\"`)\n - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.\n\n**Returns**\n`RxJS Observable` which will stream the event `returnValues`.\n\n\n### `myContract.methods.myMethod([param1[, ...]]).track([callOptions])`\nTrack a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `callOptions` - `Object` (optional): The options used for calling.\n - `from` - `String` (optional): The address the call “transaction” should be made from.\n - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.\n - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).\n\n**Returns**\n`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked. \n\n\n### `myContract.trackBalance(address [, tokenAddress])`\nTrack a contract's balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `address` - `String`: The address to get the balance of.\n2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.\n\n**Returns**\n`RxJS Observable` which will stream a string containing the address balance.\n\n\n## Blocks, gas price and block time\n\n### `trackBlock()`\nReceive the block information for any new block. It's the reactive equivalent to `web3.eth.getBlock(\"latest\")`.\n\n**Returns**\n`RxJS Observable` which will stream a block object for the latest block received\n\n### `trackBlockNumber()`\nReturns the latest block number. It's the reactive equivalent to `web3.eth.getBlockNumber`.\n\n**Returns**\n`RxJS Observable` with the latest block number\n\n### `trackGasPrice()`\nReturns the current gas price oracle. It's the reactive equivalent to `web3.eth.getGasPrice`.\n\n**Returns**\n`RxJS Observable` with the average gas price in wei.\n\n### `trackAverageBlocktime()`\nAverage block time of the last 10 blocks.\n\n**Returns**\n`RxJS Observable` with the moving average block time of the last 10 blocks. The time is returned in milliseconds:\n\n\n## Low level API for data tracking\n\nThese are used in case you don't want to decorate your web3 contract objects, or if you want to track the balance for an specific address.\n\n### `trackEvent(contractObject, eventName [, options])`\nTrack a contract event.\n\n**Parameters**\n1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.\n2. `eventName` - `String`: The name of the event to subscribe.\n3. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters\n - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `\"myNumber\"` is `12` or `13`.\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `\"latest\"`)\n - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.\n\n**Returns**\n`RxJS Observable` which will stream the event `returnValues`.\n\n### `trackProperty(contractObject, functionName [, functionArgs] [, callOptions])`\nTrack a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.\n2. `functionName` - `String`: Name of the function or variable whose values will be tracked.\n3. `functionArgs` - `Array` (optional): Array of arguments that the tracked function receives\n4. `callOptions` - `Object` (optional): The options used for calling.\n - `from` - `String` (optional): The address the call “transaction” should be made from.\n - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.\n - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).\n\n**Returns**\n`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked. \n\n### `trackBalance(address [, tokenAddress])`\nTrack balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `address` - `String`: The address to get the balance of.\n2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.\n\n**Returns**\n`RxJS Observable` which will stream a string containing the address balance.\n\n### `trackLogs(options [, abi])`\nTracks incoming logs, filtered by the given options.\n\n**Parameters**\n1. `options` - `Object` (optional): web3 filter options object to limit the number of logs\n - `address` - `String|Array` (optional): An address or a list of addresses to only get logs from particular account(s).\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `topics` - `Array` (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, '0x00...']. You can also pass another array for each topic with options for that topic e.g. [null, ['option1', 'option2']].\n2. `abi` - `Array` (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.\n\n**Returns**\n`RxJS Observable` which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.","source":"api.md","raw":"# API\n\n## General\n\n### `new Subspace(web3 [, options])`\nConstructor. \n\n**Parameters**\n1. `web3` - `Object`: a `web3.js` object.\n2. `options` - `Object` (optional): Options used to initialize Subspace\n\t- `dbFilename` - `String` (optional): Name of the database where the information will be stored (default `'subspace.db'`)\n - `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).\n - `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),\n - `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)\n\n\n### `init()`\nInitializes **Subspace**\n\n**Returns**\n`Promise` that once it's resolved, will mean that **Subspace** is available to use\n\n### `close()`\nDispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution.\n\n### `contract(instance|{abi,address})`\nAdds a `track` method to the web3 contract objects. You can obtain this functionality by passing a `web3.eth.Contract` instance, or the `abi` and `address` of your contract\n\n**Returns**\n`web3.eth.Contract` object enhanced with `.track()` functions for methods and events.\n\n## Contract methods\n\n### `myContract.events.MyEvent.track([options])`\nTrack a contract event.\n\n**Parameters**\n1. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters\n - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `\"myNumber\"` is `12` or `13`.\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `\"latest\"`)\n - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.\n\n**Returns**\n`RxJS Observable` which will stream the event `returnValues`.\n\n\n### `myContract.methods.myMethod([param1[, ...]]).track([callOptions])`\nTrack a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `callOptions` - `Object` (optional): The options used for calling.\n - `from` - `String` (optional): The address the call “transaction” should be made from.\n - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.\n - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).\n\n**Returns**\n`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked. \n\n\n### `myContract.trackBalance(address [, tokenAddress])`\nTrack a contract's balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `address` - `String`: The address to get the balance of.\n2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.\n\n**Returns**\n`RxJS Observable` which will stream a string containing the address balance.\n\n\n## Blocks, gas price and block time\n\n### `trackBlock()`\nReceive the block information for any new block. It's the reactive equivalent to `web3.eth.getBlock(\"latest\")`.\n\n**Returns**\n`RxJS Observable` which will stream a block object for the latest block received\n\n### `trackBlockNumber()`\nReturns the latest block number. It's the reactive equivalent to `web3.eth.getBlockNumber`.\n\n**Returns**\n`RxJS Observable` with the latest block number\n\n### `trackGasPrice()`\nReturns the current gas price oracle. It's the reactive equivalent to `web3.eth.getGasPrice`.\n\n**Returns**\n`RxJS Observable` with the average gas price in wei.\n\n### `trackAverageBlocktime()`\nAverage block time of the last 10 blocks.\n\n**Returns**\n`RxJS Observable` with the moving average block time of the last 10 blocks. The time is returned in milliseconds:\n\n\n## Low level API for data tracking\n\nThese are used in case you don't want to decorate your web3 contract objects, or if you want to track the balance for an specific address.\n\n### `trackEvent(contractObject, eventName [, options])`\nTrack a contract event.\n\n**Parameters**\n1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.\n2. `eventName` - `String`: The name of the event to subscribe.\n3. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters\n - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `\"myNumber\"` is `12` or `13`.\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `\"latest\"`)\n - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.\n\n**Returns**\n`RxJS Observable` which will stream the event `returnValues`.\n\n### `trackProperty(contractObject, functionName [, functionArgs] [, callOptions])`\nTrack a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.\n2. `functionName` - `String`: Name of the function or variable whose values will be tracked.\n3. `functionArgs` - `Array` (optional): Array of arguments that the tracked function receives\n4. `callOptions` - `Object` (optional): The options used for calling.\n - `from` - `String` (optional): The address the call “transaction” should be made from.\n - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.\n - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).\n\n**Returns**\n`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked. \n\n### `trackBalance(address [, tokenAddress])`\nTrack balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `address` - `String`: The address to get the balance of.\n2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.\n\n**Returns**\n`RxJS Observable` which will stream a string containing the address balance.\n\n### `trackLogs(options [, abi])`\nTracks incoming logs, filtered by the given options.\n\n**Parameters**\n1. `options` - `Object` (optional): web3 filter options object to limit the number of logs\n - `address` - `String|Array` (optional): An address or a list of addresses to only get logs from particular account(s).\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `topics` - `Array` (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, '0x00...']. You can also pass another array for each topic with options for that topic e.g. [null, ['option1', 'option2']].\n2. `abi` - `Array` (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.\n\n**Returns**\n`RxJS Observable` which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.","date":"2020-03-20T17:03:35.864Z","updated":"2020-03-20T17:03:35.864Z","path":"api.html","title":"","comments":1,"layout":"page","_id":"ck80hf5ld000cm4je2y3gcger","content":"
API
General
new Subspace(web3 [, options])
Constructor.
\n
Parameters
\n\n
web3 - Object: a web3.js object.
\n
options - Object (optional): Options used to initialize Subspace
\n
dbFilename - String (optional): Name of the database where the information will be stored (default 'subspace.db')
\n
callInterval - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It’s only used with HttpProviders (default: undefined. Obtains data every block using the average block time as an interval).
\n
refreshLastNBlocks - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
\n
disableSubscriptions - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
\n
\n
\n\n
init()
Initializes Subspace
\n
Returns Promise that once it’s resolved, will mean that Subspace is available to use
\n
close()
Dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by Subspace during its normal execution.
\n
contract(instance|{abi,address})
Adds a track method to the web3 contract objects. You can obtain this functionality by passing a web3.eth.Contract instance, or the abi and address of your contract
\n
Returns web3.eth.Contract object enhanced with .track() functions for methods and events.
\n
Contract methods
myContract.events.MyEvent.track([options])
Track a contract event.
\n
Parameters
\n\n
options - Object (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
\n
filter - Object (optional): Lets you filter events by indexed parameters, e.g. {filter: {myNumber: [12,13]}} means all events where "myNumber" is 12 or 13.
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
toBlock - Number (optional): The block number to get events up to (Defaults to "latest")
\n
topics - Array (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (topic[0]) will not be set automatically.
\n
\n
\n\n
Returns RxJS Observable which will stream the event returnValues.
Track a constant function / contract state variable on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
callOptions - Object (optional): The options used for calling.
\n
from - String (optional): The address the call “transaction” should be made from.
\n
gasPrice - String (optional): The gas price in wei to use for this call “transaction”.
\n
gas - Number (optional): The maximum gas provided for this call “transaction” (gas limit).
\n
\n
\n\n
Returns RxJS Observable which will stream the function / variable values. Data type will depend on the contract function invoked.
\n
myContract.trackBalance(address [, tokenAddress])
Track a contract’s balance changes for an address on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
address - String: The address to get the balance of.
\n
tokenAddress - String (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
\n\n
Returns RxJS Observable which will stream a string containing the address balance.
\n
Blocks, gas price and block time
trackBlock()
Receive the block information for any new block. It’s the reactive equivalent to web3.eth.getBlock("latest").
\n
Returns RxJS Observable which will stream a block object for the latest block received
\n
trackBlockNumber()
Returns the latest block number. It’s the reactive equivalent to web3.eth.getBlockNumber.
\n
Returns RxJS Observable with the latest block number
\n
trackGasPrice()
Returns the current gas price oracle. It’s the reactive equivalent to web3.eth.getGasPrice.
\n
Returns RxJS Observable with the average gas price in wei.
\n
trackAverageBlocktime()
Average block time of the last 10 blocks.
\n
Returns RxJS Observable with the moving average block time of the last 10 blocks. The time is returned in milliseconds:
\n
Low level API for data tracking
These are used in case you don’t want to decorate your web3 contract objects, or if you want to track the balance for an specific address.
\n
trackEvent(contractObject, eventName [, options])
Track a contract event.
\n
Parameters
\n\n
contractObject - web3.eth.Contract: An already initialized contract object pointing to an address and containing a valid ABI.
\n
eventName - String: The name of the event to subscribe.
\n
options - Object (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
\n
filter - Object (optional): Lets you filter events by indexed parameters, e.g. {filter: {myNumber: [12,13]}} means all events where "myNumber" is 12 or 13.
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
toBlock - Number (optional): The block number to get events up to (Defaults to "latest")
\n
topics - Array (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (topic[0]) will not be set automatically.
\n
\n
\n\n
Returns RxJS Observable which will stream the event returnValues.
Track a constant function / contract state variable on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
contractObject - web3.eth.Contract: An already initialized contract object pointing to an address and containing a valid ABI.
\n
functionName - String: Name of the function or variable whose values will be tracked.
\n
functionArgs - Array (optional): Array of arguments that the tracked function receives
\n
callOptions - Object (optional): The options used for calling.
\n
from - String (optional): The address the call “transaction” should be made from.
\n
gasPrice - String (optional): The gas price in wei to use for this call “transaction”.
\n
gas - Number (optional): The maximum gas provided for this call “transaction” (gas limit).
\n
\n
\n\n
Returns RxJS Observable which will stream the function / variable values. Data type will depend on the contract function invoked.
\n
trackBalance(address [, tokenAddress])
Track balance changes for an address on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
address - String: The address to get the balance of.
\n
tokenAddress - String (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
\n\n
Returns RxJS Observable which will stream a string containing the address balance.
\n
trackLogs(options [, abi])
Tracks incoming logs, filtered by the given options.
\n
Parameters
\n\n
options - Object (optional): web3 filter options object to limit the number of logs
\n
address - String|Array (optional): An address or a list of addresses to only get logs from particular account(s).
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
topics - Array (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, ‘0x00…’]. You can also pass another array for each topic with options for that topic e.g. [null, [‘option1’, ‘option2’]].
\n
\n
\n
abi - Array (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.
\n\n
Returns RxJS Observable which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
API
General
new Subspace(web3 [, options])
Constructor.
\n
Parameters
\n\n
web3 - Object: a web3.js object.
\n
options - Object (optional): Options used to initialize Subspace
\n
dbFilename - String (optional): Name of the database where the information will be stored (default 'subspace.db')
\n
callInterval - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It’s only used with HttpProviders (default: undefined. Obtains data every block using the average block time as an interval).
\n
refreshLastNBlocks - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
\n
disableSubscriptions - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
\n
\n
\n\n
init()
Initializes Subspace
\n
Returns Promise that once it’s resolved, will mean that Subspace is available to use
\n
close()
Dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by Subspace during its normal execution.
\n
contract(instance|{abi,address})
Adds a track method to the web3 contract objects. You can obtain this functionality by passing a web3.eth.Contract instance, or the abi and address of your contract
\n
Returns web3.eth.Contract object enhanced with .track() functions for methods and events.
\n
Contract methods
myContract.events.MyEvent.track([options])
Track a contract event.
\n
Parameters
\n\n
options - Object (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
\n
filter - Object (optional): Lets you filter events by indexed parameters, e.g. {filter: {myNumber: [12,13]}} means all events where "myNumber" is 12 or 13.
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
toBlock - Number (optional): The block number to get events up to (Defaults to "latest")
\n
topics - Array (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (topic[0]) will not be set automatically.
\n
\n
\n\n
Returns RxJS Observable which will stream the event returnValues.
Track a constant function / contract state variable on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
callOptions - Object (optional): The options used for calling.
\n
from - String (optional): The address the call “transaction” should be made from.
\n
gasPrice - String (optional): The gas price in wei to use for this call “transaction”.
\n
gas - Number (optional): The maximum gas provided for this call “transaction” (gas limit).
\n
\n
\n\n
Returns RxJS Observable which will stream the function / variable values. Data type will depend on the contract function invoked.
\n
myContract.trackBalance(address [, tokenAddress])
Track a contract’s balance changes for an address on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
address - String: The address to get the balance of.
\n
tokenAddress - String (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
\n\n
Returns RxJS Observable which will stream a string containing the address balance.
\n
Blocks, gas price and block time
trackBlock()
Receive the block information for any new block. It’s the reactive equivalent to web3.eth.getBlock("latest").
\n
Returns RxJS Observable which will stream a block object for the latest block received
\n
trackBlockNumber()
Returns the latest block number. It’s the reactive equivalent to web3.eth.getBlockNumber.
\n
Returns RxJS Observable with the latest block number
\n
trackGasPrice()
Returns the current gas price oracle. It’s the reactive equivalent to web3.eth.getGasPrice.
\n
Returns RxJS Observable with the average gas price in wei.
\n
trackAverageBlocktime()
Average block time of the last 10 blocks.
\n
Returns RxJS Observable with the moving average block time of the last 10 blocks. The time is returned in milliseconds:
\n
Low level API for data tracking
These are used in case you don’t want to decorate your web3 contract objects, or if you want to track the balance for an specific address.
\n
trackEvent(contractObject, eventName [, options])
Track a contract event.
\n
Parameters
\n\n
contractObject - web3.eth.Contract: An already initialized contract object pointing to an address and containing a valid ABI.
\n
eventName - String: The name of the event to subscribe.
\n
options - Object (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
\n
filter - Object (optional): Lets you filter events by indexed parameters, e.g. {filter: {myNumber: [12,13]}} means all events where "myNumber" is 12 or 13.
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
toBlock - Number (optional): The block number to get events up to (Defaults to "latest")
\n
topics - Array (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (topic[0]) will not be set automatically.
\n
\n
\n\n
Returns RxJS Observable which will stream the event returnValues.
Track a constant function / contract state variable on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
contractObject - web3.eth.Contract: An already initialized contract object pointing to an address and containing a valid ABI.
\n
functionName - String: Name of the function or variable whose values will be tracked.
\n
functionArgs - Array (optional): Array of arguments that the tracked function receives
\n
callOptions - Object (optional): The options used for calling.
\n
from - String (optional): The address the call “transaction” should be made from.
\n
gasPrice - String (optional): The gas price in wei to use for this call “transaction”.
\n
gas - Number (optional): The maximum gas provided for this call “transaction” (gas limit).
\n
\n
\n\n
Returns RxJS Observable which will stream the function / variable values. Data type will depend on the contract function invoked.
\n
trackBalance(address [, tokenAddress])
Track balance changes for an address on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
address - String: The address to get the balance of.
\n
tokenAddress - String (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
\n\n
Returns RxJS Observable which will stream a string containing the address balance.
\n
trackLogs(options [, abi])
Tracks incoming logs, filtered by the given options.
\n
Parameters
\n\n
options - Object (optional): web3 filter options object to limit the number of logs
\n
address - String|Array (optional): An address or a list of addresses to only get logs from particular account(s).
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
topics - Array (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, ‘0x00…’]. You can also pass another array for each topic with options for that topic e.g. [null, [‘option1’, ‘option2’]].
\n
\n
\n
abi - Array (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.
\n\n
Returns RxJS Observable which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.
\n"},{"title":"Getting Started","_content":"# Getting Started\n\n## Installation\n**Subspace** can be used in browser, node and native script environments. To get started install the package `@embarklabs/subspace` using `npm` or `yarn` by executing this command in your project directory:\n```bash\n# Using npm\nnpm install --save @embarklabs/subspace\n\n# Using yarn\nyarn add @embarklabs/subspace \n```\n\n## Importing the library\n\n```js\n// ESM (might require babel / browserify)\nimport Subspace from '@embarklabs/subspace'; \n\n// CommonJS\nconst Subspace = require('@embarklabs/subspace'); \n```\n\n\n## Connecting to a web3 provider\nTo interact with the EVM, **Subspace** requires a valid Web3 object, connected to a provider\n\n```js\nconst subspace = new Subspace(web3);\nawait subspace.init();\n```\n\nIn addition to the provider, `Subspace` also accepts an `options` object with settings that can change its behavior:\n- `dbFilename` - Name of the database where the information will be stored (default `'subspace.db'`)\n- `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).\n- `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),\n- `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: `undefined`)\n\n\n## Enhancing your contract objects\nSubspace provides a method to enhance your web3 Contract objects: `subspace.contract(instance|{abi,address})`. Calling this method will return a new contract object decorated with a `.track()` method for your contract view functions and events.\n\n```js\nconst myRxContract = subspace.contract(myContractInstance);\n```\n\nYou can also instantiate a contract directly by passing the contract ABI and its address:\n\n```js\nconst myRXContract = subspace.contract({abi: ...., address: '0x1234...CDEF'})\n```\n\n## Reacting to data\nOnce it's initialized, you can use **Subspace**'s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.\n\n
\n
What is an Observable?
\nThe Observable type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:\n- Compositional: Observables can be composed with higher-order combinators.\n- Lazy: Observables do not start emitting data until an observer has subscribed.\n
\n\n#### Further read\n- [RxJS Observables](https://rxjs-dev.firebaseapp.com/guide/observable)\n\n## Tracking state\nYou can track changes to a contract state variable, by specifying the view function and arguments to call and query the contract. \n```js\nconst stateObservable$ = Contract.methods.functionName(functionArgs).track();\n```\n\n
\n
Tracking the public variables of a contract
\nState variables implicity create a view function when they're defined as public. The functionName would be the same as the variable name, and functionArgs will have a value when the type is a mapping or array (since these require an index value to query them).\n
\n\nExample:\n\n```js\nconst productTitle$ = ProductList.methods.products(0).track().map(\"title\");\nproductTitle$.subscribe((title) => console.log(\"product title is \" + title));\n\n\n// Alternative using Subspace low level API\nconst producTitle$ = subspace.trackProperty(ProductList, \"products\", [0], {from: web3.eth.defaultAccount});\n...\n```\n\nThe subscription will be triggered whenever the title changes\n\n## Tracking events\nYou can track events and react to their returned values.\n```js\nconst eventObservable$ = Contract.event.eventName.track();\n```\n\nExample:\n\n```js\nconst rating$ = Product.events.Rating.track().map(\"rating\")).pipe(map(x => parseInt(x)));\nrating$.subscribe((rating) => console.log(\"rating received: \" + rating));\n\n\n// Alternative using Subspace low level API\nconst rating$ = subspace.trackEvent(Product, \"Rating\", {fromBlock: 0});\n...\n```\n\n**Event Sourcing**\n\nYou can easily do event sourcing with subspace.\n\nFor e.g: if you needed to get the average rating of the last 5 events:\n\n```js\nimport { $average, $latest } from \"@embarklabs/subspace\";\n\nconst rating$ = Product.events.Rating.track().map(\"rating\")).pipe(map(x => parseInt(x)));\n\nrating$.pipe($latest(5), $average()).subscribe((rating) => {\n console.log(\"average rating of the last 5 events is \" + rating)\n});\n```\n\n## Tracking balances\nYou can also track changes in both ETH and ERC20 token balances for each mined block or time interval depending on the `callInterval` configured. \n\nTracking ETH balance in an address:\n\n```js\nconst address = \"0x0001020304050607080900010203040506070809\";\n\nsubspace.trackBalance(address).subscribe((balance) => {\n console.log(\"ETH balance is \", balance)\n});\n```\n\nTracking ETH balance in a Contract:\n\n```js\nContract.trackBalance().subscribe((balance) => {\n console.log(\"ETH balance is \", balance)\n});\n```\n\nTracking an ERC20 balance in a Contract:\n\n```js\nconst tokenAddress = \"0x744d70fdbe2ba4cf95131626614a1763df805b9e\"; // SNT Address\n\nconst myBalanceObservable$ = Contract.trackBalance(tokenAddress);\n```\n\n
\nBalances are returned as a string containing the value in wei.\n
\n\n\n\n## Getting block data, gas prices and block time\nSubspace also provides a way to always receive the latest block object: \n```js\nsubspace.trackBlock().subscribe(block => {\n console.log(\"The latest block data: \", block);\n});\n```\n\nIf you don't need all the block information, but just the block number, you can use instead:\n```js\nsubspace.trackBlockNumber().subscribe(blockNumber => {\n console.log(\"The latest block number: \", blockNumber);\n});\n```\n\nYou can also access the average block time. This takes in account only the last 10 blocks:\n\n```js\nsubspace.trackAverageBlocktime().subscribe(blocktimeMS => {\n console.log(\"The average block time in milliseconds is: \", blocktimeMS);\n});\n```\n\nFinally, if you want to obtain the most up to date median gas price:\n\n```js\nsubspace.trackGasPrice().subscribe(gasPrice => {\n console.log(\"Gas price in wei\", gasPrice);\n});\n```\n\n\n## Subscriptions\nOnce you have an `Observable`, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.\n\nSubscriptions can be disposed by executing the method `unsubscribe()` liberating the resource held by it:\n\n```js\nconst myBalanceObservable$ = subspace.trackBalance(address, tokenAddress);\nconst subscription = myBalanceObservable$.subscribe(value => { \n console.log(\"The balance is: \", value); \n});\n\n// ...\n\nsubscription.unsubscribe();\n```\n\n#### Further read\n- [RxJS Subscriptions](https://rxjs-dev.firebaseapp.com/guide/subscription)\n\n## Cleanup\nIf **Subspace** is not needed anymore, you need can invoke `close()` to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution, thus avoiding any potential memory leak.\n\n```\nsubspace.close();\n```\n
\n
What about subscriptions created with our observables?
\nclose() will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package subsink can be used to clear all the observables' subscriptions at once.\n
\n\n","source":"getting-started.md","raw":"---\ntitle: Getting Started\n---\n# Getting Started\n\n## Installation\n**Subspace** can be used in browser, node and native script environments. To get started install the package `@embarklabs/subspace` using `npm` or `yarn` by executing this command in your project directory:\n```bash\n# Using npm\nnpm install --save @embarklabs/subspace\n\n# Using yarn\nyarn add @embarklabs/subspace \n```\n\n## Importing the library\n\n```js\n// ESM (might require babel / browserify)\nimport Subspace from '@embarklabs/subspace'; \n\n// CommonJS\nconst Subspace = require('@embarklabs/subspace'); \n```\n\n\n## Connecting to a web3 provider\nTo interact with the EVM, **Subspace** requires a valid Web3 object, connected to a provider\n\n```js\nconst subspace = new Subspace(web3);\nawait subspace.init();\n```\n\nIn addition to the provider, `Subspace` also accepts an `options` object with settings that can change its behavior:\n- `dbFilename` - Name of the database where the information will be stored (default `'subspace.db'`)\n- `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).\n- `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),\n- `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: `undefined`)\n\n\n## Enhancing your contract objects\nSubspace provides a method to enhance your web3 Contract objects: `subspace.contract(instance|{abi,address})`. Calling this method will return a new contract object decorated with a `.track()` method for your contract view functions and events.\n\n```js\nconst myRxContract = subspace.contract(myContractInstance);\n```\n\nYou can also instantiate a contract directly by passing the contract ABI and its address:\n\n```js\nconst myRXContract = subspace.contract({abi: ...., address: '0x1234...CDEF'})\n```\n\n## Reacting to data\nOnce it's initialized, you can use **Subspace**'s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.\n\n
\n
What is an Observable?
\nThe Observable type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:\n- Compositional: Observables can be composed with higher-order combinators.\n- Lazy: Observables do not start emitting data until an observer has subscribed.\n
\n\n#### Further read\n- [RxJS Observables](https://rxjs-dev.firebaseapp.com/guide/observable)\n\n## Tracking state\nYou can track changes to a contract state variable, by specifying the view function and arguments to call and query the contract. \n```js\nconst stateObservable$ = Contract.methods.functionName(functionArgs).track();\n```\n\n
\n
Tracking the public variables of a contract
\nState variables implicity create a view function when they're defined as public. The functionName would be the same as the variable name, and functionArgs will have a value when the type is a mapping or array (since these require an index value to query them).\n
\n\nExample:\n\n```js\nconst productTitle$ = ProductList.methods.products(0).track().map(\"title\");\nproductTitle$.subscribe((title) => console.log(\"product title is \" + title));\n\n\n// Alternative using Subspace low level API\nconst producTitle$ = subspace.trackProperty(ProductList, \"products\", [0], {from: web3.eth.defaultAccount});\n...\n```\n\nThe subscription will be triggered whenever the title changes\n\n## Tracking events\nYou can track events and react to their returned values.\n```js\nconst eventObservable$ = Contract.event.eventName.track();\n```\n\nExample:\n\n```js\nconst rating$ = Product.events.Rating.track().map(\"rating\")).pipe(map(x => parseInt(x)));\nrating$.subscribe((rating) => console.log(\"rating received: \" + rating));\n\n\n// Alternative using Subspace low level API\nconst rating$ = subspace.trackEvent(Product, \"Rating\", {fromBlock: 0});\n...\n```\n\n**Event Sourcing**\n\nYou can easily do event sourcing with subspace.\n\nFor e.g: if you needed to get the average rating of the last 5 events:\n\n```js\nimport { $average, $latest } from \"@embarklabs/subspace\";\n\nconst rating$ = Product.events.Rating.track().map(\"rating\")).pipe(map(x => parseInt(x)));\n\nrating$.pipe($latest(5), $average()).subscribe((rating) => {\n console.log(\"average rating of the last 5 events is \" + rating)\n});\n```\n\n## Tracking balances\nYou can also track changes in both ETH and ERC20 token balances for each mined block or time interval depending on the `callInterval` configured. \n\nTracking ETH balance in an address:\n\n```js\nconst address = \"0x0001020304050607080900010203040506070809\";\n\nsubspace.trackBalance(address).subscribe((balance) => {\n console.log(\"ETH balance is \", balance)\n});\n```\n\nTracking ETH balance in a Contract:\n\n```js\nContract.trackBalance().subscribe((balance) => {\n console.log(\"ETH balance is \", balance)\n});\n```\n\nTracking an ERC20 balance in a Contract:\n\n```js\nconst tokenAddress = \"0x744d70fdbe2ba4cf95131626614a1763df805b9e\"; // SNT Address\n\nconst myBalanceObservable$ = Contract.trackBalance(tokenAddress);\n```\n\n
\nBalances are returned as a string containing the value in wei.\n
\n\n\n\n## Getting block data, gas prices and block time\nSubspace also provides a way to always receive the latest block object: \n```js\nsubspace.trackBlock().subscribe(block => {\n console.log(\"The latest block data: \", block);\n});\n```\n\nIf you don't need all the block information, but just the block number, you can use instead:\n```js\nsubspace.trackBlockNumber().subscribe(blockNumber => {\n console.log(\"The latest block number: \", blockNumber);\n});\n```\n\nYou can also access the average block time. This takes in account only the last 10 blocks:\n\n```js\nsubspace.trackAverageBlocktime().subscribe(blocktimeMS => {\n console.log(\"The average block time in milliseconds is: \", blocktimeMS);\n});\n```\n\nFinally, if you want to obtain the most up to date median gas price:\n\n```js\nsubspace.trackGasPrice().subscribe(gasPrice => {\n console.log(\"Gas price in wei\", gasPrice);\n});\n```\n\n\n## Subscriptions\nOnce you have an `Observable`, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.\n\nSubscriptions can be disposed by executing the method `unsubscribe()` liberating the resource held by it:\n\n```js\nconst myBalanceObservable$ = subspace.trackBalance(address, tokenAddress);\nconst subscription = myBalanceObservable$.subscribe(value => { \n console.log(\"The balance is: \", value); \n});\n\n// ...\n\nsubscription.unsubscribe();\n```\n\n#### Further read\n- [RxJS Subscriptions](https://rxjs-dev.firebaseapp.com/guide/subscription)\n\n## Cleanup\nIf **Subspace** is not needed anymore, you need can invoke `close()` to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution, thus avoiding any potential memory leak.\n\n```\nsubspace.close();\n```\n
\n
What about subscriptions created with our observables?
\nclose() will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package subsink can be used to clear all the observables' subscriptions at once.\n
Subspace can be used in browser, node and native script environments. To get started install the package @embarklabs/subspace using npm or yarn by executing this command in your project directory:
\n\n\n
# Using npm\nnpm install --save @embarklabs/subspace\n\n# Using yarn\nyarn add @embarklabs/subspace \n
To interact with the EVM, Subspace requires a valid Web3 object, connected to a provider
\n\n\n
const subspace = new Subspace(web3);\nawait subspace.init();\n
\n\n\n\n
In addition to the provider, Subspace also accepts an options object with settings that can change its behavior:
\n
\n
dbFilename - Name of the database where the information will be stored (default 'subspace.db')
\n
callInterval - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It’s only used with HttpProviders (default: undefined. Obtains data every block using the average block time as an interval).
\n
refreshLastNBlocks - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
\n
disableSubscriptions - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
\n
\n
Enhancing your contract objects
Subspace provides a method to enhance your web3 Contract objects: subspace.contract(instance|{abi,address}). Calling this method will return a new contract object decorated with a .track() method for your contract view functions and events.
Once it’s initialized, you can use Subspace‘s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.
\n
\n
What is an Observable?
\nThe Observable type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:\n- Compositional: Observables can be composed with higher-order combinators.\n- Lazy: Observables do not start emitting data until an observer has subscribed.\n
\nState variables implicity create a view function when they're defined as public. The functionName would be the same as the variable name, and functionArgs will have a value when the type is a mapping or array (since these require an index value to query them).\n
\n\n
Example:
\n\n\n
const productTitle$ = ProductList.methods.products(0).track().map("title");\nproductTitle$.subscribe((title) => console.log("product title is " + title));\n\n\n// Alternative using Subspace low level API\nconst producTitle$ = subspace.trackProperty(ProductList, "products", [0], {from: web3.eth.defaultAccount});\n...\n
\n\n\n\n
The subscription will be triggered whenever the title changes
\n
Tracking events
You can track events and react to their returned values.
You can also access the average block time. This takes in account only the last 10 blocks:
\n\n\n
subspace.trackAverageBlocktime().subscribe(blocktimeMS => {\n console.log("The average block time in milliseconds is: ", blocktimeMS);\n});\n
\n\n\n\n
Finally, if you want to obtain the most up to date median gas price:
\n\n\n
subspace.trackGasPrice().subscribe(gasPrice => {\n console.log("Gas price in wei", gasPrice);\n});\n
\n\n\n\n
Subscriptions
Once you have an Observable, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.
\n
Subscriptions can be disposed by executing the method unsubscribe() liberating the resource held by it:
If Subspace is not needed anymore, you need can invoke close() to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by Subspace during its normal execution, thus avoiding any potential memory leak.
\n\n\n
subspace.close();\n
\n\n
\n
What about subscriptions created with our observables?
\nclose() will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package subsink can be used to clear all the observables' subscriptions at once.\n
\n\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
Getting Started
Installation
Subspace can be used in browser, node and native script environments. To get started install the package @embarklabs/subspace using npm or yarn by executing this command in your project directory:
\n\n\n
# Using npm\nnpm install --save @embarklabs/subspace\n\n# Using yarn\nyarn add @embarklabs/subspace \n
To interact with the EVM, Subspace requires a valid Web3 object, connected to a provider
\n\n\n
const subspace = new Subspace(web3);\nawait subspace.init();\n
\n\n\n\n
In addition to the provider, Subspace also accepts an options object with settings that can change its behavior:
\n
\n
dbFilename - Name of the database where the information will be stored (default 'subspace.db')
\n
callInterval - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It’s only used with HttpProviders (default: undefined. Obtains data every block using the average block time as an interval).
\n
refreshLastNBlocks - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
\n
disableSubscriptions - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
\n
\n
Enhancing your contract objects
Subspace provides a method to enhance your web3 Contract objects: subspace.contract(instance|{abi,address}). Calling this method will return a new contract object decorated with a .track() method for your contract view functions and events.
Once it’s initialized, you can use Subspace‘s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.
\n
\n
What is an Observable?
\nThe Observable type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:\n- Compositional: Observables can be composed with higher-order combinators.\n- Lazy: Observables do not start emitting data until an observer has subscribed.\n
\nState variables implicity create a view function when they're defined as public. The functionName would be the same as the variable name, and functionArgs will have a value when the type is a mapping or array (since these require an index value to query them).\n
\n\n
Example:
\n\n\n
const productTitle$ = ProductList.methods.products(0).track().map("title");\nproductTitle$.subscribe((title) => console.log("product title is " + title));\n\n\n// Alternative using Subspace low level API\nconst producTitle$ = subspace.trackProperty(ProductList, "products", [0], {from: web3.eth.defaultAccount});\n...\n
\n\n\n\n
The subscription will be triggered whenever the title changes
\n
Tracking events
You can track events and react to their returned values.
You can also access the average block time. This takes in account only the last 10 blocks:
\n\n\n
subspace.trackAverageBlocktime().subscribe(blocktimeMS => {\n console.log("The average block time in milliseconds is: ", blocktimeMS);\n});\n
\n\n\n\n
Finally, if you want to obtain the most up to date median gas price:
\n\n\n
subspace.trackGasPrice().subscribe(gasPrice => {\n console.log("Gas price in wei", gasPrice);\n});\n
\n\n\n\n
Subscriptions
Once you have an Observable, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.
\n
Subscriptions can be disposed by executing the method unsubscribe() liberating the resource held by it:
If Subspace is not needed anymore, you need can invoke close() to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by Subspace during its normal execution, thus avoiding any potential memory leak.
\n\n\n
subspace.close();\n
\n\n
\n
What about subscriptions created with our observables?
\nclose() will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package subsink can be used to clear all the observables' subscriptions at once.\n
\n\n"}],"Post":[{"title":"Hello World","_content":"Welcome to [Hexo](https://hexo.io/)! This is your very first post. Check [documentation](https://hexo.io/docs/) for more info. If you get any problems when using Hexo, you can find the answer in [troubleshooting](https://hexo.io/docs/troubleshooting.html) or you can ask me on [GitHub](https://github.com/hexojs/hexo/issues).\n\n## Quick Start\n\n### Create a new post\n\n``` bash\n$ hexo new \"My New Post\"\n```\n\nMore info: [Writing](https://hexo.io/docs/writing.html)\n\n### Run server\n\n``` bash\n$ hexo server\n```\n\nMore info: [Server](https://hexo.io/docs/server.html)\n\n### Generate static files\n\n``` bash\n$ hexo generate\n```\n\nMore info: [Generating](https://hexo.io/docs/generating.html)\n\n### Deploy to remote sites\n\n``` bash\n$ hexo deploy\n```\n\nMore info: [Deployment](https://hexo.io/docs/one-command-deployment.html)\n","source":"_posts/hello-world.md","raw":"---\ntitle: Hello World\n---\nWelcome to [Hexo](https://hexo.io/)! This is your very first post. Check [documentation](https://hexo.io/docs/) for more info. If you get any problems when using Hexo, you can find the answer in [troubleshooting](https://hexo.io/docs/troubleshooting.html) or you can ask me on [GitHub](https://github.com/hexojs/hexo/issues).\n\n## Quick Start\n\n### Create a new post\n\n``` bash\n$ hexo new \"My New Post\"\n```\n\nMore info: [Writing](https://hexo.io/docs/writing.html)\n\n### Run server\n\n``` bash\n$ hexo server\n```\n\nMore info: [Server](https://hexo.io/docs/server.html)\n\n### Generate static files\n\n``` bash\n$ hexo generate\n```\n\nMore info: [Generating](https://hexo.io/docs/generating.html)\n\n### Deploy to remote sites\n\n``` bash\n$ hexo deploy\n```\n\nMore info: [Deployment](https://hexo.io/docs/one-command-deployment.html)\n","slug":"hello-world","published":1,"date":"2020-03-20T16:56:21.896Z","updated":"2020-03-20T16:56:21.896Z","comments":1,"layout":"post","photos":[],"link":"","_id":"ck80hf5me000em4je1x9gdg0y","content":"
Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.
\n"}],"PostAsset":[],"PostCategory":[],"PostTag":[],"Tag":[]}}
\ No newline at end of file
diff --git a/packages/docs/getting-started.md b/packages/docs/getting-started.md
deleted file mode 100644
index 01e2673..0000000
--- a/packages/docs/getting-started.md
+++ /dev/null
@@ -1,217 +0,0 @@
-# Getting Started
-
-## Installation
-**Subspace** can be used in browser, node and native script environments. To get started install the package `@embarklabs/subspace` using `npm` or `yarn` by executing this command in your project directory:
-```bash
-# Using npm
-npm install --save @embarklabs/subspace
-
-# Using yarn
-yarn add @embarklabs/subspace
-```
-
-## Importing the library
-
-```js
-// ESM (might require babel / browserify)
-import Subspace from '@embarklabs/subspace';
-
-// CommonJS
-const Subspace = require('@embarklabs/subspace');
-```
-
-
-## Connecting to a web3 provider
-To interact with the EVM, **Subspace** requires a valid Web3 object, connected to a provider
-
-```js
-const subspace = new Subspace(web3);
-await subspace.init();
-```
-
-In addition to the provider, `Subspace` also accepts an `options` object with settings that can change its behavior:
-- `dbFilename` - Name of the database where the information will be stored (default `'subspace.db'`)
-- `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).
-- `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
-- `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: `undefined`)
-
-
-## Enhancing your contract objects
-Subspace provides a method to enhance your web3 Contract objects: `subspace.contract(instance|{abi,address})`. Calling this method will return a new contract object decorated with a `.track()` method for your contract view functions and events.
-
-```js
-const myRxContract = subspace.contract(myContractInstance);
-```
-
-You can also instantiate a contract directly by passing the contract ABI and its address:
-
-```js
-const myRXContract = subspace.contract({abi: ...., address: '0x1234...CDEF'})
-```
-
-## Reacting to data
-Once it's initialized, you can use **Subspace**'s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.
-
-::: tip What is an Observable?
-The `Observable` type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:
-- Compositional: Observables can be composed with higher-order combinators.
-- Lazy: Observables do not start emitting data until an observer has subscribed.
-:::
-
-#### Further read
-- [RxJS Observables](https://rxjs-dev.firebaseapp.com/guide/observable)
-
-## Tracking state
-You can track changes to a contract state variable, by specifying the view function and arguments to call and query the contract.
-```js
-const stateObservable$ = Contract.methods.functionName(functionArgs).track();
-```
-
-::: tip Tracking the public variables of a contract
-State variables implicity create a `view` function when they're defined as `public`. The `functionName` would be the same as the variable name, and `functionArgs` will have a value when the type is a `mapping` or `array` (since these require an index value to query them).
-:::
-
-Example:
-
-```js
-const productTitle$ = ProductList.methods.products(0).track().map("title");
-productTitle$.subscribe((title) => console.log("product title is " + title));
-
-
-// Alternative using Subspace low level API
-const producTitle$ = subspace.trackProperty(ProductList, "products", [0], {from: web3.eth.defaultAccount});
-...
-```
-
-The subscription will be triggered whenever the title changes
-
-## Tracking events
-You can track events and react to their returned values.
-```js
-const eventObservable$ = Contract.event.eventName.track();
-```
-
-Example:
-
-```js
-const rating$ = Product.events.Rating.track().map("rating")).pipe(map(x => parseInt(x)));
-rating$.subscribe((rating) => console.log("rating received: " + rating));
-
-
-// Alternative using Subspace low level API
-const rating$ = subspace.trackEvent(Product, "Rating", {fromBlock: 0});
-...
-```
-
-**Event Sourcing**
-
-You can easily do event sourcing with subspace.
-
-For e.g: if you needed to get the average rating of the last 5 events:
-
-```js
-import { $average, $latest } from "@embarklabs/subspace";
-
-const rating$ = Product.events.Rating.track().map("rating")).pipe(map(x => parseInt(x)));
-
-rating$.pipe($latest(5), $average()).subscribe((rating) => {
- console.log("average rating of the last 5 events is " + rating)
-});
-```
-
-## Tracking balances
-You can also track changes in both ETH and ERC20 token balances for each mined block or time interval depending on the `callInterval` configured.
-
-Tracking ETH balance in an address:
-
-```js
-const address = "0x0001020304050607080900010203040506070809";
-
-subspace.trackBalance(address).subscribe((balance) => {
- console.log("ETH balance is ", balance)
-});
-```
-
-Tracking ETH balance in a Contract:
-
-```js
-Contract.trackBalance().subscribe((balance) => {
- console.log("ETH balance is ", balance)
-});
-```
-
-Tracking an ERC20 balance in a Contract:
-
-```js
-const tokenAddress = "0x744d70fdbe2ba4cf95131626614a1763df805b9e"; // SNT Address
-
-const myBalanceObservable$ = Contract.trackBalance(tokenAddress);
-```
-
-::: warning
-Balances are returned as a string containing the value in *wei*.
-:::
-
-
-
-## Getting block data, gas prices and block time
-Subspace also provides a way to always receive the latest block object:
-```js
-subspace.trackBlock().subscribe(block => {
- console.log("The latest block data: ", block);
-});
-```
-
-If you don't need all the block information, but just the block number, you can use instead:
-```js
-subspace.trackBlockNumber().subscribe(blockNumber => {
- console.log("The latest block number: ", blockNumber);
-});
-```
-
-You can also access the average block time. This takes in account only the last 10 blocks:
-
-```js
-subspace.trackAverageBlocktime().subscribe(blocktimeMS => {
- console.log("The average block time in milliseconds is: ", blocktimeMS);
-});
-```
-
-Finally, if you want to obtain the most up to date median gas price:
-
-```js
-subspace.trackGasPrice().subscribe(gasPrice => {
- console.log("Gas price in wei", gasPrice);
-});
-```
-
-
-## Subscriptions
-Once you have an `Observable`, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.
-
-Subscriptions can be disposed by executing the method `unsubscribe()` liberating the resource held by it:
-
-```js
-const myBalanceObservable$ = subspace.trackBalance(address, tokenAddress);
-const subscription = myBalanceObservable$.subscribe(value => {
- console.log("The balance is: ", value);
-});
-
-// ...
-
-subscription.unsubscribe();
-```
-
-#### Further read
-- [RxJS Subscriptions](https://rxjs-dev.firebaseapp.com/guide/subscription)
-
-## Cleanup
-If **Subspace** is not needed anymore, you need can invoke `close()` to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution, thus avoiding any potential memory leak.
-
-```
-subspace.close();
-```
-::: warning What about subscriptions created with our observables?
-`close()` will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package `subsink` can be used to clear all the observables' subscriptions at once.
-:::
-
diff --git a/packages/docs/package.json b/packages/docs/package.json
index 3b27ae3..1eed260 100644
--- a/packages/docs/package.json
+++ b/packages/docs/package.json
@@ -1,15 +1,8 @@
{
- "name": "@embarklabs/subspace-docs",
+ "name": "subspace-docs",
"version": "0.0.1",
"description": "Subspace Website",
"main": "index.js",
- "scripts": {
- "clean": "rimraf .vuepress/dist",
- "build": "vuepress build",
- "push-dir": "push-dir --dir=.vuepress/dist --branch=gh-pages",
- "publish": "npm-run-all clean build push-dir",
- "start": "vuepress dev"
- },
"repository": {
"type": "git",
"url": "git+https://github.com/embarklabs/subspace-docs.git"
@@ -31,9 +24,29 @@
"homepage": "https://github.com/richard-ramos"
}
],
- "homepage": "https://github.com/embarklabs/subspace",
- "devDependencies": {
- "push-dir": "^0.4.1",
- "vuepress": "^1.0.3"
+ "homepage": "https://github.com/embarklabs/subspace-docs#readme",
+ "scripts": {
+ "build": "hexo generate",
+ "clean": "hexo clean",
+ "deploy": "hexo deploy",
+ "server": "hexo server"
+ },
+ "hexo": {
+ "version": "4.2.0"
+ },
+ "dependencies": {
+ "hexo": "^4.0.0",
+ "hexo-autoprefixer": "^2.0.0",
+ "hexo-generator-archive": "^1.0.0",
+ "hexo-generator-category": "^1.0.0",
+ "hexo-generator-i18n": "^0.0.7",
+ "hexo-generator-index": "^1.0.0",
+ "hexo-generator-tag": "^1.0.0",
+ "hexo-prism-plus": "^1.1.0",
+ "hexo-renderer-ejs": "^1.0.0",
+ "hexo-renderer-marked": "^2.0.0",
+ "hexo-renderer-sass": "^0.4.0",
+ "hexo-renderer-stylus": "^1.1.0",
+ "hexo-server": "^1.0.0"
}
}
diff --git a/packages/docs/.vuepress/public/CNAME b/packages/docs/public/CNAME
similarity index 100%
rename from packages/docs/.vuepress/public/CNAME
rename to packages/docs/public/CNAME
diff --git a/packages/site/public/api.html b/packages/docs/public/api.html
similarity index 100%
rename from packages/site/public/api.html
rename to packages/docs/public/api.html
diff --git a/packages/site/public/apollo-client.html b/packages/docs/public/apollo-client.html
similarity index 100%
rename from packages/site/public/apollo-client.html
rename to packages/docs/public/apollo-client.html
diff --git a/packages/site/public/css/application.css b/packages/docs/public/css/application.css
similarity index 100%
rename from packages/site/public/css/application.css
rename to packages/docs/public/css/application.css
diff --git a/packages/site/public/css/utilities/text-color.css b/packages/docs/public/css/utilities/text-color.css
similarity index 100%
rename from packages/site/public/css/utilities/text-color.css
rename to packages/docs/public/css/utilities/text-color.css
diff --git a/packages/site/public/css/utilities/text-size.css b/packages/docs/public/css/utilities/text-size.css
similarity index 100%
rename from packages/site/public/css/utilities/text-size.css
rename to packages/docs/public/css/utilities/text-size.css
diff --git a/packages/site/d1.png b/packages/docs/public/d1.png
similarity index 100%
rename from packages/site/d1.png
rename to packages/docs/public/d1.png
diff --git a/packages/site/d2.png b/packages/docs/public/d2.png
similarity index 100%
rename from packages/site/d2.png
rename to packages/docs/public/d2.png
diff --git a/packages/site/d3.png b/packages/docs/public/d3.png
similarity index 100%
rename from packages/site/d3.png
rename to packages/docs/public/d3.png
diff --git a/packages/site/d4.png b/packages/docs/public/d4.png
similarity index 100%
rename from packages/site/d4.png
rename to packages/docs/public/d4.png
diff --git a/packages/site/public/de/api.html b/packages/docs/public/de/api.html
similarity index 100%
rename from packages/site/public/de/api.html
rename to packages/docs/public/de/api.html
diff --git a/packages/site/public/de/apollo-client.html b/packages/docs/public/de/apollo-client.html
similarity index 100%
rename from packages/site/public/de/apollo-client.html
rename to packages/docs/public/de/apollo-client.html
diff --git a/packages/site/public/de/getting-started.html b/packages/docs/public/de/getting-started.html
similarity index 100%
rename from packages/site/public/de/getting-started.html
rename to packages/docs/public/de/getting-started.html
diff --git a/packages/site/public/de/how-it-works.html b/packages/docs/public/de/how-it-works.html
similarity index 100%
rename from packages/site/public/de/how-it-works.html
rename to packages/docs/public/de/how-it-works.html
diff --git a/packages/site/public/de/index.html b/packages/docs/public/de/index.html
similarity index 100%
rename from packages/site/public/de/index.html
rename to packages/docs/public/de/index.html
diff --git a/packages/site/public/de/integrations-overview.html b/packages/docs/public/de/integrations-overview.html
similarity index 100%
rename from packages/site/public/de/integrations-overview.html
rename to packages/docs/public/de/integrations-overview.html
diff --git a/packages/site/public/de/integrations.html b/packages/docs/public/de/integrations.html
similarity index 100%
rename from packages/site/public/de/integrations.html
rename to packages/docs/public/de/integrations.html
diff --git a/packages/site/public/de/react.html b/packages/docs/public/de/react.html
similarity index 100%
rename from packages/site/public/de/react.html
rename to packages/docs/public/de/react.html
diff --git a/packages/site/public/de/reactive-graphql.html b/packages/docs/public/de/reactive-graphql.html
similarity index 100%
rename from packages/site/public/de/reactive-graphql.html
rename to packages/docs/public/de/reactive-graphql.html
diff --git a/packages/site/public/de/readme.html b/packages/docs/public/de/readme.html
similarity index 100%
rename from packages/site/public/de/readme.html
rename to packages/docs/public/de/readme.html
diff --git a/packages/site/public/de/redux-observable.html b/packages/docs/public/de/redux-observable.html
similarity index 100%
rename from packages/site/public/de/redux-observable.html
rename to packages/docs/public/de/redux-observable.html
diff --git a/packages/site/public/de/redux.html b/packages/docs/public/de/redux.html
similarity index 100%
rename from packages/site/public/de/redux.html
rename to packages/docs/public/de/redux.html
diff --git a/packages/site/public/de/tutorial.html b/packages/docs/public/de/tutorial.html
similarity index 100%
rename from packages/site/public/de/tutorial.html
rename to packages/docs/public/de/tutorial.html
diff --git a/packages/site/public/de/vue.html b/packages/docs/public/de/vue.html
similarity index 100%
rename from packages/site/public/de/vue.html
rename to packages/docs/public/de/vue.html
diff --git a/packages/site/public/fonts/LICENSE.txt b/packages/docs/public/fonts/LICENSE.txt
similarity index 100%
rename from packages/site/public/fonts/LICENSE.txt
rename to packages/docs/public/fonts/LICENSE.txt
diff --git a/packages/site/public/fonts/Roboto-Bold.ttf b/packages/docs/public/fonts/Roboto-Bold.ttf
similarity index 100%
rename from packages/site/public/fonts/Roboto-Bold.ttf
rename to packages/docs/public/fonts/Roboto-Bold.ttf
diff --git a/packages/site/public/fonts/Roboto-Regular.ttf b/packages/docs/public/fonts/Roboto-Regular.ttf
similarity index 100%
rename from packages/site/public/fonts/Roboto-Regular.ttf
rename to packages/docs/public/fonts/Roboto-Regular.ttf
diff --git a/packages/site/public/getting-started.html b/packages/docs/public/getting-started.html
similarity index 100%
rename from packages/site/public/getting-started.html
rename to packages/docs/public/getting-started.html
diff --git a/packages/site/public/how-it-works.html b/packages/docs/public/how-it-works.html
similarity index 100%
rename from packages/site/public/how-it-works.html
rename to packages/docs/public/how-it-works.html
diff --git a/packages/site/public/icons/accounting-calculator.svg b/packages/docs/public/icons/accounting-calculator.svg
similarity index 100%
rename from packages/site/public/icons/accounting-calculator.svg
rename to packages/docs/public/icons/accounting-calculator.svg
diff --git a/packages/site/public/icons/book-address.svg b/packages/docs/public/icons/book-address.svg
similarity index 100%
rename from packages/site/public/icons/book-address.svg
rename to packages/docs/public/icons/book-address.svg
diff --git a/packages/site/public/icons/close.svg b/packages/docs/public/icons/close.svg
similarity index 100%
rename from packages/site/public/icons/close.svg
rename to packages/docs/public/icons/close.svg
diff --git a/packages/site/public/icons/cloud-lock.svg b/packages/docs/public/icons/cloud-lock.svg
similarity index 100%
rename from packages/site/public/icons/cloud-lock.svg
rename to packages/docs/public/icons/cloud-lock.svg
diff --git a/packages/site/public/icons/contactless-payment.svg b/packages/docs/public/icons/contactless-payment.svg
similarity index 100%
rename from packages/site/public/icons/contactless-payment.svg
rename to packages/docs/public/icons/contactless-payment.svg
diff --git a/packages/site/public/icons/credit-card-1.svg b/packages/docs/public/icons/credit-card-1.svg
similarity index 100%
rename from packages/site/public/icons/credit-card-1.svg
rename to packages/docs/public/icons/credit-card-1.svg
diff --git a/packages/site/public/icons/crypto-currency-bitcoin-give.svg b/packages/docs/public/icons/crypto-currency-bitcoin-give.svg
similarity index 100%
rename from packages/site/public/icons/crypto-currency-bitcoin-give.svg
rename to packages/docs/public/icons/crypto-currency-bitcoin-give.svg
diff --git a/packages/site/public/icons/crypto-currency-bitcoin-lock.svg b/packages/docs/public/icons/crypto-currency-bitcoin-lock.svg
similarity index 100%
rename from packages/site/public/icons/crypto-currency-bitcoin-lock.svg
rename to packages/docs/public/icons/crypto-currency-bitcoin-lock.svg
diff --git a/packages/site/public/icons/facebook.svg b/packages/docs/public/icons/facebook.svg
similarity index 100%
rename from packages/site/public/icons/facebook.svg
rename to packages/docs/public/icons/facebook.svg
diff --git a/packages/site/public/icons/gauge-dashboard-1-alternate.svg b/packages/docs/public/icons/gauge-dashboard-1-alternate.svg
similarity index 100%
rename from packages/site/public/icons/gauge-dashboard-1-alternate.svg
rename to packages/docs/public/icons/gauge-dashboard-1-alternate.svg
diff --git a/packages/site/public/icons/gesture-tap-2.svg b/packages/docs/public/icons/gesture-tap-2.svg
similarity index 100%
rename from packages/site/public/icons/gesture-tap-2.svg
rename to packages/docs/public/icons/gesture-tap-2.svg
diff --git a/packages/site/public/icons/github.svg b/packages/docs/public/icons/github.svg
similarity index 100%
rename from packages/site/public/icons/github.svg
rename to packages/docs/public/icons/github.svg
diff --git a/packages/site/public/icons/half-circles.svg b/packages/docs/public/icons/half-circles.svg
similarity index 100%
rename from packages/site/public/icons/half-circles.svg
rename to packages/docs/public/icons/half-circles.svg
diff --git a/packages/site/public/icons/navigation-menu.svg b/packages/docs/public/icons/navigation-menu.svg
similarity index 100%
rename from packages/site/public/icons/navigation-menu.svg
rename to packages/docs/public/icons/navigation-menu.svg
diff --git a/packages/site/public/icons/twitter.svg b/packages/docs/public/icons/twitter.svg
similarity index 100%
rename from packages/site/public/icons/twitter.svg
rename to packages/docs/public/icons/twitter.svg
diff --git a/packages/site/public/images/circles.png b/packages/docs/public/images/circles.png
similarity index 100%
rename from packages/site/public/images/circles.png
rename to packages/docs/public/images/circles.png
diff --git a/packages/site/public/images/embark-logo.svg b/packages/docs/public/images/embark-logo.svg
similarity index 100%
rename from packages/site/public/images/embark-logo.svg
rename to packages/docs/public/images/embark-logo.svg
diff --git a/packages/site/public/images/favicon.png b/packages/docs/public/images/favicon.png
similarity index 100%
rename from packages/site/public/images/favicon.png
rename to packages/docs/public/images/favicon.png
diff --git a/packages/site/public/images/logo.svg b/packages/docs/public/images/logo.svg
similarity index 100%
rename from packages/site/public/images/logo.svg
rename to packages/docs/public/images/logo.svg
diff --git a/packages/site/public/index.html b/packages/docs/public/index.html
similarity index 100%
rename from packages/site/public/index.html
rename to packages/docs/public/index.html
diff --git a/packages/site/public/integrations-overview.html b/packages/docs/public/integrations-overview.html
similarity index 100%
rename from packages/site/public/integrations-overview.html
rename to packages/docs/public/integrations-overview.html
diff --git a/packages/site/public/integrations.html b/packages/docs/public/integrations.html
similarity index 100%
rename from packages/site/public/integrations.html
rename to packages/docs/public/integrations.html
diff --git a/packages/site/public/javascripts/jquery.js b/packages/docs/public/javascripts/jquery.js
similarity index 100%
rename from packages/site/public/javascripts/jquery.js
rename to packages/docs/public/javascripts/jquery.js
diff --git a/packages/site/public/javascripts/scripts.js b/packages/docs/public/javascripts/scripts.js
similarity index 100%
rename from packages/site/public/javascripts/scripts.js
rename to packages/docs/public/javascripts/scripts.js
diff --git a/packages/site/public/react.html b/packages/docs/public/react.html
similarity index 100%
rename from packages/site/public/react.html
rename to packages/docs/public/react.html
diff --git a/packages/site/public/reactive-graphql.html b/packages/docs/public/reactive-graphql.html
similarity index 100%
rename from packages/site/public/reactive-graphql.html
rename to packages/docs/public/reactive-graphql.html
diff --git a/packages/site/public/readme.html b/packages/docs/public/readme.html
similarity index 100%
rename from packages/site/public/readme.html
rename to packages/docs/public/readme.html
diff --git a/packages/site/public/redux-observable.html b/packages/docs/public/redux-observable.html
similarity index 100%
rename from packages/site/public/redux-observable.html
rename to packages/docs/public/redux-observable.html
diff --git a/packages/site/public/redux.html b/packages/docs/public/redux.html
similarity index 100%
rename from packages/site/public/redux.html
rename to packages/docs/public/redux.html
diff --git a/packages/site/public/tutorial.html b/packages/docs/public/tutorial.html
similarity index 100%
rename from packages/site/public/tutorial.html
rename to packages/docs/public/tutorial.html
diff --git a/packages/site/public/vue.html b/packages/docs/public/vue.html
similarity index 100%
rename from packages/site/public/vue.html
rename to packages/docs/public/vue.html
diff --git a/packages/docs/react.md b/packages/docs/react.md
deleted file mode 100644
index efb7729..0000000
--- a/packages/docs/react.md
+++ /dev/null
@@ -1,111 +0,0 @@
-# React
-Subspace also provides a set of components that simplifies its usage within React projects through the `@embarklabs/subspace-react` package.
-
-### Install
-You can install it through npm or yarn:
-```
-npm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies
-```
-
-### Usage
-
-#### SubspaceProvider
-To use most of the `subspace-react` components, you need to wrap your app with the `` component. This will make Subspace available to any nested components that accesses it via the `useSubspace` hook or has been wrapped in the `withSubspace` higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The `SubspaceProvider` requires a web3 object
-
-```js
-// index.js
-import React from 'react'
-import ReactDOM from 'react-dom'
-import MyApp from './MyApp'
-import { SubspaceProvider } from '@embarklabs/subspace-react';
-
-const web3 = new Web3("ws://localhost:8545");
-
-const rootElement = document.getElementById('root')
-ReactDOM.render(
-
-
- ,
- rootElement
-);
-```
-
-
-#### useSubspace
-Rather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the `useSubspace` hook. Be sure that your entire dApp is wrapped with a `` to have it available througout the component tree.
-```js
-// index.js
-import React from 'react'
-import { useSubspace } from '@embarklabs/subspace-react';
-
-const MyComponent = () => {
- const subspace = useSubspace();
-
- // do something....
- // subspace.trackBalance(web3.eth.defaultAccount);
-
- return ...;
-}
-
-export default MyComponent
-```
-
-
-#### withSubspace
-This higher order component is provided as an alternative to the `useSubspace` hook. This injects the `subspace` property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a ``.
-
-```js
-// index.js
-import React from 'react'
-import { withSubspace } from '@embarklabs/subspace-react';
-
-const MyComponent = (props) => {
- // do something....
- // props.subspace.trackBalance(web3.eth.defaultAccount);
-
- return ...;
-}
-
-export default withSubspace(MyComponent);
-```
-
-
-#### observe
-
-Useful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.
-
-
-```js
-import { observe } from '@embarklabs/subspace-react';
-
-const ObserverComponent = observe(WrappedComponent);
-```
-
-##### Example usage:
-```js
-const MyComponent = ({eventData}) => {
- // Handle initial state when no data is available
- if (!eventData) {
- return
No data
;
- }
-
- return
Value: {eventData.someReturnValue}
-};
-
-
-const MyEnhancedComponent = observe(MyComponent);
-
-
-const SomeOtherComponent = () => {
- const myObservable$ = MyContractInstance.events.MyEvent.track({fromBlock: 1});
- return ;
-}
-```
-
-::: warning Handling Contract Objects
-The variable `MyContractInstance` is a `web3.eth.Contract` object pointing to a deployed contract address that has been enhanced with `subspace.contract()`. You can use a DApp framework like [Embark](https://embark.status.im/docs/contracts_javascript.html) to easily import that contract instance: `import { MyContract } from './embarkArtifacts/contracts';`.
-:::
-
-::: tip
-To learn more about how to use `subspace-react`, there are full working examples available in [Github](https://github.com/embark-framework/subspace/tree/master/examples/)
-:::
diff --git a/packages/docs/reactive-graphql.md b/packages/docs/reactive-graphql.md
deleted file mode 100644
index 5306ad2..0000000
--- a/packages/docs/reactive-graphql.md
+++ /dev/null
@@ -1,61 +0,0 @@
-# reactive-graphql
-
-Using `reactive-graphql` you can execute GraphQL queries against **Subspace** observables after you create your own type definitions and resolvers.
-
-### Example
-
-
-```js
-const Subspace = require('@embarklabs/subspace');
-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 subspace = new Subspace(web3);
- await subspace.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: () => subspace.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/embarklabs/subspace/tree/master/examples/reactive-graphql)
-:::
\ No newline at end of file
diff --git a/packages/docs/redux-observable.md b/packages/docs/redux-observable.md
deleted file mode 100644
index 684053e..0000000
--- a/packages/docs/redux-observable.md
+++ /dev/null
@@ -1,33 +0,0 @@
-# redux-observable
-
-[redux-observables](https://redux-observable.js.org/) can be used to manage side effects via `Epics` (their core primitive to receive and create stream of actions). **Subspace** can be configured inside these epics.
-
-It's recommended to compose these epics by using [mergeMap](https://www.learnrxjs.io/operators/transformation/mergemap.html) or [switchMap](https://www.learnrxjs.io/operators/transformation/switchmap.html) operators.
-
-Here's an example on how to use **Subspace** to subscribe to an Event when the action `SOME_ACTION` is dispatched, and then it will trigger `myAction` when the observable emits a value.
-
-```js
-// ...
-
-const myEpic = action$ =>
- action$.pipe(
- ofType("SOME_ACTION"), // Execute when the action type is 'INIT'
- switchMap(action =>
- subspace
- .trackEvent(MyContract, "MyEventName", { filter: {}, fromBlock: 1})
- .pipe(
- map(myAction) // Trigger redux action: MY_ACTION with the eventData
- )
- )
- );
-
-// ...
-```
-
-::: tip
-An example is available in [Github](https://github.com/embarklabs/subspace/tree/master/examples/redux-observable)
-:::
-
-#### Further read
-- [Epics](https://redux-observable.js.org/docs/basics/Epics.html)
-
diff --git a/packages/docs/redux.md b/packages/docs/redux.md
deleted file mode 100644
index b80bf11..0000000
--- a/packages/docs/redux.md
+++ /dev/null
@@ -1,77 +0,0 @@
-# redux
-
-**Subspace** can be used with [redux](https://redux.js.org/). **Subspace** returns [`Observables`](https://rxjs-dev.firebaseapp.com/guide/observable), which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.
-
-### Example
-Here's a simple example on how to setup **Subspace** to work with `redux`:
-
-::: tip
-This example is available in [Github](https://github.com/embarklabs/subspace/tree/master/examples/redux)
-:::
-
-#### index.js
-```js
-import store from './store';
-import web3 from './web3';
-import Subspace from '@embarklabs/subspace';
-import { myAction } from './actions';
-
-const run = async () => {
- const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance
-
- const subspace = new Subspace(web3);
- await subspace.init();
-
- subspace.trackEvent(MyContractInstance, "MyEvent", {filter: {}, fromBlock: 1 })
- .subscribe(eventData => {
- store.dispatch(myAction(eventData));
- });
-}
-
-run();
-```
-::: warning Handling Contract Objects
-The variable `MyContractInstance` is a `web3.eth.Contract` object pointing to a deployed contract address. You can use a DApp framework like [Embark](https://embark.status.im/docs/contracts_javascript.html) to easily import that contract instance: `import { MyContract } from './embarkArtifacts/contracts';`, or use web3.js directly (just like in the example [source code](https://github.com/embarklabs/subspace/blob/master/examples/redux/src/MyContract.js#L36-L42))
-:::
-
-#### store.js
-```js
-import { createStore } from 'redux';
-import {myReducer} from './reducer';
-
-export default store = createStore(myReducer);
-```
-
-#### reducer.js
-```js
-import { MY_ACTION } from "./constants";
-
-const initialState = {
- data: {}
-};
-
-export const myReducer = (state = initialState, action) => {
- switch (action.type) {
- case MY_ACTION:
- return { data: action.eventData };
- default:
- return state;
- }
-};
-```
-
-#### constants.js
-```js
-export const MY_ACTION = 'MY_ACTION';
-```
-
-#### actions.js
-```js
-import {MY_ACTION} from './constants.js';
-
-export const myAction = eventData => ({type: MY_ACTION, eventData});
-```
-
-::: tip Using React and Redux
-A practical example can also be found in `examples/react-redux`.
-:::
\ No newline at end of file
diff --git a/packages/site/scaffolds/draft.md b/packages/docs/scaffolds/draft.md
similarity index 100%
rename from packages/site/scaffolds/draft.md
rename to packages/docs/scaffolds/draft.md
diff --git a/packages/site/scaffolds/page.md b/packages/docs/scaffolds/page.md
similarity index 100%
rename from packages/site/scaffolds/page.md
rename to packages/docs/scaffolds/page.md
diff --git a/packages/site/scaffolds/post.md b/packages/docs/scaffolds/post.md
similarity index 100%
rename from packages/site/scaffolds/post.md
rename to packages/docs/scaffolds/post.md
diff --git a/packages/site/scripts/helpers.js b/packages/docs/scripts/helpers.js
similarity index 100%
rename from packages/site/scripts/helpers.js
rename to packages/docs/scripts/helpers.js
diff --git a/packages/site/public/CNAME b/packages/docs/src/CNAME
similarity index 100%
rename from packages/site/public/CNAME
rename to packages/docs/src/CNAME
diff --git a/packages/site/source/packages/docs/_data/sidebar.yml b/packages/docs/src/_data/sidebar.yml
similarity index 100%
rename from packages/site/source/packages/docs/_data/sidebar.yml
rename to packages/docs/src/_data/sidebar.yml
diff --git a/packages/site/source/packages/docs/_posts/hello-world.md b/packages/docs/src/_posts/hello-world.md
similarity index 100%
rename from packages/site/source/packages/docs/_posts/hello-world.md
rename to packages/docs/src/_posts/hello-world.md
diff --git a/packages/site/source/packages/docs/api.md b/packages/docs/src/api.md
similarity index 100%
rename from packages/site/source/packages/docs/api.md
rename to packages/docs/src/api.md
diff --git a/packages/site/source/packages/docs/apollo-client.md b/packages/docs/src/apollo-client.md
similarity index 100%
rename from packages/site/source/packages/docs/apollo-client.md
rename to packages/docs/src/apollo-client.md
diff --git a/packages/site/public/d1.png b/packages/docs/src/d1.png
similarity index 100%
rename from packages/site/public/d1.png
rename to packages/docs/src/d1.png
diff --git a/packages/site/public/d2.png b/packages/docs/src/d2.png
similarity index 100%
rename from packages/site/public/d2.png
rename to packages/docs/src/d2.png
diff --git a/packages/site/public/d3.png b/packages/docs/src/d3.png
similarity index 100%
rename from packages/site/public/d3.png
rename to packages/docs/src/d3.png
diff --git a/packages/site/public/d4.png b/packages/docs/src/d4.png
similarity index 100%
rename from packages/site/public/d4.png
rename to packages/docs/src/d4.png
diff --git a/packages/site/source/packages/docs/getting-started.md b/packages/docs/src/getting-started.md
similarity index 100%
rename from packages/site/source/packages/docs/getting-started.md
rename to packages/docs/src/getting-started.md
diff --git a/packages/docs/how-it-works.md b/packages/docs/src/how-it-works.md
similarity index 100%
rename from packages/docs/how-it-works.md
rename to packages/docs/src/how-it-works.md
diff --git a/packages/site/source/packages/docs/index.md b/packages/docs/src/index.md
similarity index 100%
rename from packages/site/source/packages/docs/index.md
rename to packages/docs/src/index.md
diff --git a/packages/docs/integrations-overview.md b/packages/docs/src/integrations-overview.md
similarity index 100%
rename from packages/docs/integrations-overview.md
rename to packages/docs/src/integrations-overview.md
diff --git a/packages/site/source/packages/docs/integrations.md b/packages/docs/src/integrations.md
similarity index 100%
rename from packages/site/source/packages/docs/integrations.md
rename to packages/docs/src/integrations.md
diff --git a/packages/site/source/packages/docs/react.md b/packages/docs/src/react.md
similarity index 100%
rename from packages/site/source/packages/docs/react.md
rename to packages/docs/src/react.md
diff --git a/packages/site/source/packages/docs/reactive-graphql.md b/packages/docs/src/reactive-graphql.md
similarity index 100%
rename from packages/site/source/packages/docs/reactive-graphql.md
rename to packages/docs/src/reactive-graphql.md
diff --git a/packages/docs/readme.md b/packages/docs/src/readme.md
similarity index 100%
rename from packages/docs/readme.md
rename to packages/docs/src/readme.md
diff --git a/packages/site/source/packages/docs/redux-observable.md b/packages/docs/src/redux-observable.md
similarity index 100%
rename from packages/site/source/packages/docs/redux-observable.md
rename to packages/docs/src/redux-observable.md
diff --git a/packages/site/source/packages/docs/redux.md b/packages/docs/src/redux.md
similarity index 100%
rename from packages/site/source/packages/docs/redux.md
rename to packages/docs/src/redux.md
diff --git a/packages/docs/tutorial.md b/packages/docs/src/tutorial.md
similarity index 100%
rename from packages/docs/tutorial.md
rename to packages/docs/src/tutorial.md
diff --git a/packages/site/source/packages/docs/vue.md b/packages/docs/src/vue.md
similarity index 100%
rename from packages/site/source/packages/docs/vue.md
rename to packages/docs/src/vue.md
diff --git a/packages/site/themes/landscape/.gitignore b/packages/docs/themes/landscape/.gitignore
similarity index 100%
rename from packages/site/themes/landscape/.gitignore
rename to packages/docs/themes/landscape/.gitignore
diff --git a/packages/site/themes/landscape/Gruntfile.js b/packages/docs/themes/landscape/Gruntfile.js
similarity index 100%
rename from packages/site/themes/landscape/Gruntfile.js
rename to packages/docs/themes/landscape/Gruntfile.js
diff --git a/packages/site/themes/landscape/LICENSE b/packages/docs/themes/landscape/LICENSE
similarity index 100%
rename from packages/site/themes/landscape/LICENSE
rename to packages/docs/themes/landscape/LICENSE
diff --git a/packages/site/themes/landscape/README.md b/packages/docs/themes/landscape/README.md
similarity index 100%
rename from packages/site/themes/landscape/README.md
rename to packages/docs/themes/landscape/README.md
diff --git a/packages/site/themes/landscape/_config.yml b/packages/docs/themes/landscape/_config.yml
similarity index 100%
rename from packages/site/themes/landscape/_config.yml
rename to packages/docs/themes/landscape/_config.yml
diff --git a/packages/site/themes/landscape/languages/de.yml b/packages/docs/themes/landscape/languages/de.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/de.yml
rename to packages/docs/themes/landscape/languages/de.yml
diff --git a/packages/site/themes/landscape/languages/default.yml b/packages/docs/themes/landscape/languages/default.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/default.yml
rename to packages/docs/themes/landscape/languages/default.yml
diff --git a/packages/site/themes/landscape/languages/es.yml b/packages/docs/themes/landscape/languages/es.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/es.yml
rename to packages/docs/themes/landscape/languages/es.yml
diff --git a/packages/site/themes/landscape/languages/fr.yml b/packages/docs/themes/landscape/languages/fr.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/fr.yml
rename to packages/docs/themes/landscape/languages/fr.yml
diff --git a/packages/site/themes/landscape/languages/ja.yml b/packages/docs/themes/landscape/languages/ja.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/ja.yml
rename to packages/docs/themes/landscape/languages/ja.yml
diff --git a/packages/site/themes/landscape/languages/ko.yml b/packages/docs/themes/landscape/languages/ko.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/ko.yml
rename to packages/docs/themes/landscape/languages/ko.yml
diff --git a/packages/site/themes/landscape/languages/nl.yml b/packages/docs/themes/landscape/languages/nl.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/nl.yml
rename to packages/docs/themes/landscape/languages/nl.yml
diff --git a/packages/site/themes/landscape/languages/no.yml b/packages/docs/themes/landscape/languages/no.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/no.yml
rename to packages/docs/themes/landscape/languages/no.yml
diff --git a/packages/site/themes/landscape/languages/pt.yml b/packages/docs/themes/landscape/languages/pt.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/pt.yml
rename to packages/docs/themes/landscape/languages/pt.yml
diff --git a/packages/site/themes/landscape/languages/ru.yml b/packages/docs/themes/landscape/languages/ru.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/ru.yml
rename to packages/docs/themes/landscape/languages/ru.yml
diff --git a/packages/site/themes/landscape/languages/zh-CN.yml b/packages/docs/themes/landscape/languages/zh-CN.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/zh-CN.yml
rename to packages/docs/themes/landscape/languages/zh-CN.yml
diff --git a/packages/site/themes/landscape/languages/zh-TW.yml b/packages/docs/themes/landscape/languages/zh-TW.yml
similarity index 100%
rename from packages/site/themes/landscape/languages/zh-TW.yml
rename to packages/docs/themes/landscape/languages/zh-TW.yml
diff --git a/packages/site/themes/landscape/layout/_partial/after-footer.ejs b/packages/docs/themes/landscape/layout/_partial/after-footer.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/after-footer.ejs
rename to packages/docs/themes/landscape/layout/_partial/after-footer.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/analytics.ejs b/packages/docs/themes/landscape/layout/_partial/analytics.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/analytics.ejs
rename to packages/docs/themes/landscape/layout/_partial/analytics.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/archive-post.ejs b/packages/docs/themes/landscape/layout/_partial/archive-post.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/archive-post.ejs
rename to packages/docs/themes/landscape/layout/_partial/archive-post.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/archive.ejs b/packages/docs/themes/landscape/layout/_partial/archive.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/archive.ejs
rename to packages/docs/themes/landscape/layout/_partial/archive.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/article.ejs b/packages/docs/themes/landscape/layout/_partial/article.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/article.ejs
rename to packages/docs/themes/landscape/layout/_partial/article.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/footer.ejs b/packages/docs/themes/landscape/layout/_partial/footer.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/footer.ejs
rename to packages/docs/themes/landscape/layout/_partial/footer.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/head.ejs b/packages/docs/themes/landscape/layout/_partial/head.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/head.ejs
rename to packages/docs/themes/landscape/layout/_partial/head.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/header.ejs b/packages/docs/themes/landscape/layout/_partial/header.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/header.ejs
rename to packages/docs/themes/landscape/layout/_partial/header.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/mobile-nav.ejs b/packages/docs/themes/landscape/layout/_partial/mobile-nav.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/mobile-nav.ejs
rename to packages/docs/themes/landscape/layout/_partial/mobile-nav.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/post/category.ejs b/packages/docs/themes/landscape/layout/_partial/post/category.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/post/category.ejs
rename to packages/docs/themes/landscape/layout/_partial/post/category.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/post/date.ejs b/packages/docs/themes/landscape/layout/_partial/post/date.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/post/date.ejs
rename to packages/docs/themes/landscape/layout/_partial/post/date.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/post/gallery.ejs b/packages/docs/themes/landscape/layout/_partial/post/gallery.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/post/gallery.ejs
rename to packages/docs/themes/landscape/layout/_partial/post/gallery.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/post/nav.ejs b/packages/docs/themes/landscape/layout/_partial/post/nav.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/post/nav.ejs
rename to packages/docs/themes/landscape/layout/_partial/post/nav.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/post/tag.ejs b/packages/docs/themes/landscape/layout/_partial/post/tag.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/post/tag.ejs
rename to packages/docs/themes/landscape/layout/_partial/post/tag.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/post/title.ejs b/packages/docs/themes/landscape/layout/_partial/post/title.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/post/title.ejs
rename to packages/docs/themes/landscape/layout/_partial/post/title.ejs
diff --git a/packages/site/themes/landscape/layout/_partial/sidebar.ejs b/packages/docs/themes/landscape/layout/_partial/sidebar.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_partial/sidebar.ejs
rename to packages/docs/themes/landscape/layout/_partial/sidebar.ejs
diff --git a/packages/site/themes/landscape/layout/_widget/archive.ejs b/packages/docs/themes/landscape/layout/_widget/archive.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_widget/archive.ejs
rename to packages/docs/themes/landscape/layout/_widget/archive.ejs
diff --git a/packages/site/themes/landscape/layout/_widget/category.ejs b/packages/docs/themes/landscape/layout/_widget/category.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_widget/category.ejs
rename to packages/docs/themes/landscape/layout/_widget/category.ejs
diff --git a/packages/site/themes/landscape/layout/_widget/recent_posts.ejs b/packages/docs/themes/landscape/layout/_widget/recent_posts.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_widget/recent_posts.ejs
rename to packages/docs/themes/landscape/layout/_widget/recent_posts.ejs
diff --git a/packages/site/themes/landscape/layout/_widget/tag.ejs b/packages/docs/themes/landscape/layout/_widget/tag.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_widget/tag.ejs
rename to packages/docs/themes/landscape/layout/_widget/tag.ejs
diff --git a/packages/site/themes/landscape/layout/_widget/tagcloud.ejs b/packages/docs/themes/landscape/layout/_widget/tagcloud.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/_widget/tagcloud.ejs
rename to packages/docs/themes/landscape/layout/_widget/tagcloud.ejs
diff --git a/packages/site/themes/landscape/layout/archive.ejs b/packages/docs/themes/landscape/layout/archive.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/archive.ejs
rename to packages/docs/themes/landscape/layout/archive.ejs
diff --git a/packages/site/themes/landscape/layout/category.ejs b/packages/docs/themes/landscape/layout/category.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/category.ejs
rename to packages/docs/themes/landscape/layout/category.ejs
diff --git a/packages/site/themes/landscape/layout/index.ejs b/packages/docs/themes/landscape/layout/index.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/index.ejs
rename to packages/docs/themes/landscape/layout/index.ejs
diff --git a/packages/site/themes/landscape/layout/layout.ejs b/packages/docs/themes/landscape/layout/layout.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/layout.ejs
rename to packages/docs/themes/landscape/layout/layout.ejs
diff --git a/packages/site/themes/landscape/layout/page.ejs b/packages/docs/themes/landscape/layout/page.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/page.ejs
rename to packages/docs/themes/landscape/layout/page.ejs
diff --git a/packages/site/themes/landscape/layout/post.ejs b/packages/docs/themes/landscape/layout/post.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/post.ejs
rename to packages/docs/themes/landscape/layout/post.ejs
diff --git a/packages/site/themes/landscape/layout/tag.ejs b/packages/docs/themes/landscape/layout/tag.ejs
similarity index 100%
rename from packages/site/themes/landscape/layout/tag.ejs
rename to packages/docs/themes/landscape/layout/tag.ejs
diff --git a/packages/site/themes/landscape/package.json b/packages/docs/themes/landscape/package.json
similarity index 100%
rename from packages/site/themes/landscape/package.json
rename to packages/docs/themes/landscape/package.json
diff --git a/packages/site/themes/landscape/scripts/fancybox.js b/packages/docs/themes/landscape/scripts/fancybox.js
similarity index 100%
rename from packages/site/themes/landscape/scripts/fancybox.js
rename to packages/docs/themes/landscape/scripts/fancybox.js
diff --git a/packages/site/themes/landscape/source/css/_extend.styl b/packages/docs/themes/landscape/source/css/_extend.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_extend.styl
rename to packages/docs/themes/landscape/source/css/_extend.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/archive.styl b/packages/docs/themes/landscape/source/css/_partial/archive.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/archive.styl
rename to packages/docs/themes/landscape/source/css/_partial/archive.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/article.styl b/packages/docs/themes/landscape/source/css/_partial/article.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/article.styl
rename to packages/docs/themes/landscape/source/css/_partial/article.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/comment.styl b/packages/docs/themes/landscape/source/css/_partial/comment.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/comment.styl
rename to packages/docs/themes/landscape/source/css/_partial/comment.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/footer.styl b/packages/docs/themes/landscape/source/css/_partial/footer.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/footer.styl
rename to packages/docs/themes/landscape/source/css/_partial/footer.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/header.styl b/packages/docs/themes/landscape/source/css/_partial/header.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/header.styl
rename to packages/docs/themes/landscape/source/css/_partial/header.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/highlight.styl b/packages/docs/themes/landscape/source/css/_partial/highlight.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/highlight.styl
rename to packages/docs/themes/landscape/source/css/_partial/highlight.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/mobile.styl b/packages/docs/themes/landscape/source/css/_partial/mobile.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/mobile.styl
rename to packages/docs/themes/landscape/source/css/_partial/mobile.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/sidebar-aside.styl b/packages/docs/themes/landscape/source/css/_partial/sidebar-aside.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/sidebar-aside.styl
rename to packages/docs/themes/landscape/source/css/_partial/sidebar-aside.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/sidebar-bottom.styl b/packages/docs/themes/landscape/source/css/_partial/sidebar-bottom.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/sidebar-bottom.styl
rename to packages/docs/themes/landscape/source/css/_partial/sidebar-bottom.styl
diff --git a/packages/site/themes/landscape/source/css/_partial/sidebar.styl b/packages/docs/themes/landscape/source/css/_partial/sidebar.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_partial/sidebar.styl
rename to packages/docs/themes/landscape/source/css/_partial/sidebar.styl
diff --git a/packages/site/themes/landscape/source/css/_util/grid.styl b/packages/docs/themes/landscape/source/css/_util/grid.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_util/grid.styl
rename to packages/docs/themes/landscape/source/css/_util/grid.styl
diff --git a/packages/site/themes/landscape/source/css/_util/mixin.styl b/packages/docs/themes/landscape/source/css/_util/mixin.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_util/mixin.styl
rename to packages/docs/themes/landscape/source/css/_util/mixin.styl
diff --git a/packages/site/themes/landscape/source/css/_variables.styl b/packages/docs/themes/landscape/source/css/_variables.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/_variables.styl
rename to packages/docs/themes/landscape/source/css/_variables.styl
diff --git a/packages/site/themes/landscape/source/css/fonts/FontAwesome.otf b/packages/docs/themes/landscape/source/css/fonts/FontAwesome.otf
similarity index 100%
rename from packages/site/themes/landscape/source/css/fonts/FontAwesome.otf
rename to packages/docs/themes/landscape/source/css/fonts/FontAwesome.otf
diff --git a/packages/site/themes/landscape/source/css/fonts/fontawesome-webfont.eot b/packages/docs/themes/landscape/source/css/fonts/fontawesome-webfont.eot
similarity index 100%
rename from packages/site/themes/landscape/source/css/fonts/fontawesome-webfont.eot
rename to packages/docs/themes/landscape/source/css/fonts/fontawesome-webfont.eot
diff --git a/packages/site/themes/landscape/source/css/fonts/fontawesome-webfont.svg b/packages/docs/themes/landscape/source/css/fonts/fontawesome-webfont.svg
similarity index 100%
rename from packages/site/themes/landscape/source/css/fonts/fontawesome-webfont.svg
rename to packages/docs/themes/landscape/source/css/fonts/fontawesome-webfont.svg
diff --git a/packages/site/themes/landscape/source/css/fonts/fontawesome-webfont.ttf b/packages/docs/themes/landscape/source/css/fonts/fontawesome-webfont.ttf
similarity index 100%
rename from packages/site/themes/landscape/source/css/fonts/fontawesome-webfont.ttf
rename to packages/docs/themes/landscape/source/css/fonts/fontawesome-webfont.ttf
diff --git a/packages/site/themes/landscape/source/css/fonts/fontawesome-webfont.woff b/packages/docs/themes/landscape/source/css/fonts/fontawesome-webfont.woff
similarity index 100%
rename from packages/site/themes/landscape/source/css/fonts/fontawesome-webfont.woff
rename to packages/docs/themes/landscape/source/css/fonts/fontawesome-webfont.woff
diff --git a/packages/site/themes/landscape/source/css/images/banner.jpg b/packages/docs/themes/landscape/source/css/images/banner.jpg
similarity index 100%
rename from packages/site/themes/landscape/source/css/images/banner.jpg
rename to packages/docs/themes/landscape/source/css/images/banner.jpg
diff --git a/packages/site/themes/landscape/source/css/style.styl b/packages/docs/themes/landscape/source/css/style.styl
similarity index 100%
rename from packages/site/themes/landscape/source/css/style.styl
rename to packages/docs/themes/landscape/source/css/style.styl
diff --git a/packages/site/themes/landscape/source/fancybox/blank.gif b/packages/docs/themes/landscape/source/fancybox/blank.gif
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/blank.gif
rename to packages/docs/themes/landscape/source/fancybox/blank.gif
diff --git a/packages/site/themes/landscape/source/fancybox/fancybox_loading.gif b/packages/docs/themes/landscape/source/fancybox/fancybox_loading.gif
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/fancybox_loading.gif
rename to packages/docs/themes/landscape/source/fancybox/fancybox_loading.gif
diff --git a/packages/site/themes/landscape/source/fancybox/fancybox_loading@2x.gif b/packages/docs/themes/landscape/source/fancybox/fancybox_loading@2x.gif
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/fancybox_loading@2x.gif
rename to packages/docs/themes/landscape/source/fancybox/fancybox_loading@2x.gif
diff --git a/packages/site/themes/landscape/source/fancybox/fancybox_overlay.png b/packages/docs/themes/landscape/source/fancybox/fancybox_overlay.png
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/fancybox_overlay.png
rename to packages/docs/themes/landscape/source/fancybox/fancybox_overlay.png
diff --git a/packages/site/themes/landscape/source/fancybox/fancybox_sprite.png b/packages/docs/themes/landscape/source/fancybox/fancybox_sprite.png
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/fancybox_sprite.png
rename to packages/docs/themes/landscape/source/fancybox/fancybox_sprite.png
diff --git a/packages/site/themes/landscape/source/fancybox/fancybox_sprite@2x.png b/packages/docs/themes/landscape/source/fancybox/fancybox_sprite@2x.png
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/fancybox_sprite@2x.png
rename to packages/docs/themes/landscape/source/fancybox/fancybox_sprite@2x.png
diff --git a/packages/site/themes/landscape/source/fancybox/helpers/fancybox_buttons.png b/packages/docs/themes/landscape/source/fancybox/helpers/fancybox_buttons.png
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/helpers/fancybox_buttons.png
rename to packages/docs/themes/landscape/source/fancybox/helpers/fancybox_buttons.png
diff --git a/packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-buttons.css b/packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-buttons.css
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-buttons.css
rename to packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-buttons.css
diff --git a/packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-buttons.js b/packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-buttons.js
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-buttons.js
rename to packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-buttons.js
diff --git a/packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-media.js b/packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-media.js
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-media.js
rename to packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-media.js
diff --git a/packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-thumbs.css b/packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-thumbs.css
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-thumbs.css
rename to packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-thumbs.css
diff --git a/packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-thumbs.js b/packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-thumbs.js
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/helpers/jquery.fancybox-thumbs.js
rename to packages/docs/themes/landscape/source/fancybox/helpers/jquery.fancybox-thumbs.js
diff --git a/packages/site/themes/landscape/source/fancybox/jquery.fancybox.css b/packages/docs/themes/landscape/source/fancybox/jquery.fancybox.css
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/jquery.fancybox.css
rename to packages/docs/themes/landscape/source/fancybox/jquery.fancybox.css
diff --git a/packages/site/themes/landscape/source/fancybox/jquery.fancybox.js b/packages/docs/themes/landscape/source/fancybox/jquery.fancybox.js
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/jquery.fancybox.js
rename to packages/docs/themes/landscape/source/fancybox/jquery.fancybox.js
diff --git a/packages/site/themes/landscape/source/fancybox/jquery.fancybox.pack.js b/packages/docs/themes/landscape/source/fancybox/jquery.fancybox.pack.js
similarity index 100%
rename from packages/site/themes/landscape/source/fancybox/jquery.fancybox.pack.js
rename to packages/docs/themes/landscape/source/fancybox/jquery.fancybox.pack.js
diff --git a/packages/site/themes/landscape/source/js/script.js b/packages/docs/themes/landscape/source/js/script.js
similarity index 100%
rename from packages/site/themes/landscape/source/js/script.js
rename to packages/docs/themes/landscape/source/js/script.js
diff --git a/packages/site/themes/subspace/languages/en.yml b/packages/docs/themes/subspace/languages/en.yml
similarity index 100%
rename from packages/site/themes/subspace/languages/en.yml
rename to packages/docs/themes/subspace/languages/en.yml
diff --git a/packages/site/themes/subspace/layout/404.ejs b/packages/docs/themes/subspace/layout/404.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/404.ejs
rename to packages/docs/themes/subspace/layout/404.ejs
diff --git a/packages/site/themes/subspace/layout/about-us.ejs b/packages/docs/themes/subspace/layout/about-us.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/about-us.ejs
rename to packages/docs/themes/subspace/layout/about-us.ejs
diff --git a/packages/site/themes/subspace/layout/index.ejs b/packages/docs/themes/subspace/layout/index.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/index.ejs
rename to packages/docs/themes/subspace/layout/index.ejs
diff --git a/packages/site/themes/subspace/layout/layout.ejs b/packages/docs/themes/subspace/layout/layout.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/layout.ejs
rename to packages/docs/themes/subspace/layout/layout.ejs
diff --git a/packages/site/themes/subspace/layout/page.ejs b/packages/docs/themes/subspace/layout/page.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/page.ejs
rename to packages/docs/themes/subspace/layout/page.ejs
diff --git a/packages/site/themes/subspace/layout/partial/analytics.ejs b/packages/docs/themes/subspace/layout/partial/analytics.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/partial/analytics.ejs
rename to packages/docs/themes/subspace/layout/partial/analytics.ejs
diff --git a/packages/site/themes/subspace/layout/partial/footer.ejs b/packages/docs/themes/subspace/layout/partial/footer.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/partial/footer.ejs
rename to packages/docs/themes/subspace/layout/partial/footer.ejs
diff --git a/packages/site/themes/subspace/layout/partial/head.ejs b/packages/docs/themes/subspace/layout/partial/head.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/partial/head.ejs
rename to packages/docs/themes/subspace/layout/partial/head.ejs
diff --git a/packages/site/themes/subspace/layout/partial/header-short.ejs b/packages/docs/themes/subspace/layout/partial/header-short.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/partial/header-short.ejs
rename to packages/docs/themes/subspace/layout/partial/header-short.ejs
diff --git a/packages/site/themes/subspace/layout/partial/header.ejs b/packages/docs/themes/subspace/layout/partial/header.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/partial/header.ejs
rename to packages/docs/themes/subspace/layout/partial/header.ejs
diff --git a/packages/site/themes/subspace/layout/partial/mailpopup.ejs b/packages/docs/themes/subspace/layout/partial/mailpopup.ejs
similarity index 100%
rename from packages/site/themes/subspace/layout/partial/mailpopup.ejs
rename to packages/docs/themes/subspace/layout/partial/mailpopup.ejs
diff --git a/packages/site/themes/subspace/source/css/application.scss b/packages/docs/themes/subspace/source/css/application.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/application.scss
rename to packages/docs/themes/subspace/source/css/application.scss
diff --git a/packages/site/themes/subspace/source/css/components/_accentbox.scss b/packages/docs/themes/subspace/source/css/components/_accentbox.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_accentbox.scss
rename to packages/docs/themes/subspace/source/css/components/_accentbox.scss
diff --git a/packages/site/themes/subspace/source/css/components/_button.scss b/packages/docs/themes/subspace/source/css/components/_button.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_button.scss
rename to packages/docs/themes/subspace/source/css/components/_button.scss
diff --git a/packages/site/themes/subspace/source/css/components/_footer.scss b/packages/docs/themes/subspace/source/css/components/_footer.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_footer.scss
rename to packages/docs/themes/subspace/source/css/components/_footer.scss
diff --git a/packages/site/themes/subspace/source/css/components/_ghostbox.scss b/packages/docs/themes/subspace/source/css/components/_ghostbox.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_ghostbox.scss
rename to packages/docs/themes/subspace/source/css/components/_ghostbox.scss
diff --git a/packages/site/themes/subspace/source/css/components/_header.scss b/packages/docs/themes/subspace/source/css/components/_header.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_header.scss
rename to packages/docs/themes/subspace/source/css/components/_header.scss
diff --git a/packages/site/themes/subspace/source/css/components/_icons.scss b/packages/docs/themes/subspace/source/css/components/_icons.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_icons.scss
rename to packages/docs/themes/subspace/source/css/components/_icons.scss
diff --git a/packages/site/themes/subspace/source/css/components/_logo.scss b/packages/docs/themes/subspace/source/css/components/_logo.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_logo.scss
rename to packages/docs/themes/subspace/source/css/components/_logo.scss
diff --git a/packages/site/themes/subspace/source/css/components/_notification.scss b/packages/docs/themes/subspace/source/css/components/_notification.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_notification.scss
rename to packages/docs/themes/subspace/source/css/components/_notification.scss
diff --git a/packages/site/themes/subspace/source/css/components/_popup.scss b/packages/docs/themes/subspace/source/css/components/_popup.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_popup.scss
rename to packages/docs/themes/subspace/source/css/components/_popup.scss
diff --git a/packages/site/themes/subspace/source/css/components/_prism-highlighting.scss b/packages/docs/themes/subspace/source/css/components/_prism-highlighting.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_prism-highlighting.scss
rename to packages/docs/themes/subspace/source/css/components/_prism-highlighting.scss
diff --git a/packages/site/themes/subspace/source/css/components/_spotlightbox.scss b/packages/docs/themes/subspace/source/css/components/_spotlightbox.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_spotlightbox.scss
rename to packages/docs/themes/subspace/source/css/components/_spotlightbox.scss
diff --git a/packages/site/themes/subspace/source/css/components/_teaser.scss b/packages/docs/themes/subspace/source/css/components/_teaser.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_teaser.scss
rename to packages/docs/themes/subspace/source/css/components/_teaser.scss
diff --git a/packages/site/themes/subspace/source/css/components/_user.scss b/packages/docs/themes/subspace/source/css/components/_user.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_user.scss
rename to packages/docs/themes/subspace/source/css/components/_user.scss
diff --git a/packages/site/themes/subspace/source/css/components/_whisperbox.scss b/packages/docs/themes/subspace/source/css/components/_whisperbox.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/components/_whisperbox.scss
rename to packages/docs/themes/subspace/source/css/components/_whisperbox.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_actionbar.scss b/packages/docs/themes/subspace/source/css/objects/_actionbar.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_actionbar.scss
rename to packages/docs/themes/subspace/source/css/objects/_actionbar.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_content.scss b/packages/docs/themes/subspace/source/css/objects/_content.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_content.scss
rename to packages/docs/themes/subspace/source/css/objects/_content.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_distance.scss b/packages/docs/themes/subspace/source/css/objects/_distance.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_distance.scss
rename to packages/docs/themes/subspace/source/css/objects/_distance.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_grid.scss b/packages/docs/themes/subspace/source/css/objects/_grid.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_grid.scss
rename to packages/docs/themes/subspace/source/css/objects/_grid.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_heading.scss b/packages/docs/themes/subspace/source/css/objects/_heading.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_heading.scss
rename to packages/docs/themes/subspace/source/css/objects/_heading.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_list.scss b/packages/docs/themes/subspace/source/css/objects/_list.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_list.scss
rename to packages/docs/themes/subspace/source/css/objects/_list.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_media.scss b/packages/docs/themes/subspace/source/css/objects/_media.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_media.scss
rename to packages/docs/themes/subspace/source/css/objects/_media.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_navigation.scss b/packages/docs/themes/subspace/source/css/objects/_navigation.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_navigation.scss
rename to packages/docs/themes/subspace/source/css/objects/_navigation.scss
diff --git a/packages/site/themes/subspace/source/css/objects/_side-navigation.scss b/packages/docs/themes/subspace/source/css/objects/_side-navigation.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/objects/_side-navigation.scss
rename to packages/docs/themes/subspace/source/css/objects/_side-navigation.scss
diff --git a/packages/site/themes/subspace/source/css/settings/_config.scss b/packages/docs/themes/subspace/source/css/settings/_config.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/settings/_config.scss
rename to packages/docs/themes/subspace/source/css/settings/_config.scss
diff --git a/packages/site/themes/subspace/source/css/settings/_preset.scss b/packages/docs/themes/subspace/source/css/settings/_preset.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/settings/_preset.scss
rename to packages/docs/themes/subspace/source/css/settings/_preset.scss
diff --git a/packages/site/themes/subspace/source/css/settings/_typography.scss b/packages/docs/themes/subspace/source/css/settings/_typography.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/settings/_typography.scss
rename to packages/docs/themes/subspace/source/css/settings/_typography.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_column.scss b/packages/docs/themes/subspace/source/css/tools/_column.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_column.scss
rename to packages/docs/themes/subspace/source/css/tools/_column.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_get-brand-color.scss b/packages/docs/themes/subspace/source/css/tools/_get-brand-color.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_get-brand-color.scss
rename to packages/docs/themes/subspace/source/css/tools/_get-brand-color.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_get-color.scss b/packages/docs/themes/subspace/source/css/tools/_get-color.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_get-color.scss
rename to packages/docs/themes/subspace/source/css/tools/_get-color.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_get-font.scss b/packages/docs/themes/subspace/source/css/tools/_get-font.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_get-font.scss
rename to packages/docs/themes/subspace/source/css/tools/_get-font.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_get-index.scss b/packages/docs/themes/subspace/source/css/tools/_get-index.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_get-index.scss
rename to packages/docs/themes/subspace/source/css/tools/_get-index.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_get-layout-color.scss b/packages/docs/themes/subspace/source/css/tools/_get-layout-color.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_get-layout-color.scss
rename to packages/docs/themes/subspace/source/css/tools/_get-layout-color.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_get-notification-color.scss b/packages/docs/themes/subspace/source/css/tools/_get-notification-color.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_get-notification-color.scss
rename to packages/docs/themes/subspace/source/css/tools/_get-notification-color.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_get-semantic-color.scss b/packages/docs/themes/subspace/source/css/tools/_get-semantic-color.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_get-semantic-color.scss
rename to packages/docs/themes/subspace/source/css/tools/_get-semantic-color.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_get-spacing.scss b/packages/docs/themes/subspace/source/css/tools/_get-spacing.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_get-spacing.scss
rename to packages/docs/themes/subspace/source/css/tools/_get-spacing.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_list-reset.scss b/packages/docs/themes/subspace/source/css/tools/_list-reset.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_list-reset.scss
rename to packages/docs/themes/subspace/source/css/tools/_list-reset.scss
diff --git a/packages/site/themes/subspace/source/css/tools/_respond.scss b/packages/docs/themes/subspace/source/css/tools/_respond.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/tools/_respond.scss
rename to packages/docs/themes/subspace/source/css/tools/_respond.scss
diff --git a/packages/site/themes/subspace/source/css/utilities/text-color.scss b/packages/docs/themes/subspace/source/css/utilities/text-color.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/utilities/text-color.scss
rename to packages/docs/themes/subspace/source/css/utilities/text-color.scss
diff --git a/packages/site/themes/subspace/source/css/utilities/text-size.scss b/packages/docs/themes/subspace/source/css/utilities/text-size.scss
similarity index 100%
rename from packages/site/themes/subspace/source/css/utilities/text-size.scss
rename to packages/docs/themes/subspace/source/css/utilities/text-size.scss
diff --git a/packages/site/themes/subspace/source/fonts/LICENSE.txt b/packages/docs/themes/subspace/source/fonts/LICENSE.txt
similarity index 100%
rename from packages/site/themes/subspace/source/fonts/LICENSE.txt
rename to packages/docs/themes/subspace/source/fonts/LICENSE.txt
diff --git a/packages/site/themes/subspace/source/fonts/Roboto-Bold.ttf b/packages/docs/themes/subspace/source/fonts/Roboto-Bold.ttf
similarity index 100%
rename from packages/site/themes/subspace/source/fonts/Roboto-Bold.ttf
rename to packages/docs/themes/subspace/source/fonts/Roboto-Bold.ttf
diff --git a/packages/site/themes/subspace/source/fonts/Roboto-Regular.ttf b/packages/docs/themes/subspace/source/fonts/Roboto-Regular.ttf
similarity index 100%
rename from packages/site/themes/subspace/source/fonts/Roboto-Regular.ttf
rename to packages/docs/themes/subspace/source/fonts/Roboto-Regular.ttf
diff --git a/packages/site/themes/subspace/source/icons/accounting-calculator.svg b/packages/docs/themes/subspace/source/icons/accounting-calculator.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/accounting-calculator.svg
rename to packages/docs/themes/subspace/source/icons/accounting-calculator.svg
diff --git a/packages/site/themes/subspace/source/icons/book-address.svg b/packages/docs/themes/subspace/source/icons/book-address.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/book-address.svg
rename to packages/docs/themes/subspace/source/icons/book-address.svg
diff --git a/packages/site/themes/subspace/source/icons/close.svg b/packages/docs/themes/subspace/source/icons/close.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/close.svg
rename to packages/docs/themes/subspace/source/icons/close.svg
diff --git a/packages/site/themes/subspace/source/icons/cloud-lock.svg b/packages/docs/themes/subspace/source/icons/cloud-lock.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/cloud-lock.svg
rename to packages/docs/themes/subspace/source/icons/cloud-lock.svg
diff --git a/packages/site/themes/subspace/source/icons/contactless-payment.svg b/packages/docs/themes/subspace/source/icons/contactless-payment.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/contactless-payment.svg
rename to packages/docs/themes/subspace/source/icons/contactless-payment.svg
diff --git a/packages/site/themes/subspace/source/icons/credit-card-1.svg b/packages/docs/themes/subspace/source/icons/credit-card-1.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/credit-card-1.svg
rename to packages/docs/themes/subspace/source/icons/credit-card-1.svg
diff --git a/packages/site/themes/subspace/source/icons/crypto-currency-bitcoin-give.svg b/packages/docs/themes/subspace/source/icons/crypto-currency-bitcoin-give.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/crypto-currency-bitcoin-give.svg
rename to packages/docs/themes/subspace/source/icons/crypto-currency-bitcoin-give.svg
diff --git a/packages/site/themes/subspace/source/icons/crypto-currency-bitcoin-lock.svg b/packages/docs/themes/subspace/source/icons/crypto-currency-bitcoin-lock.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/crypto-currency-bitcoin-lock.svg
rename to packages/docs/themes/subspace/source/icons/crypto-currency-bitcoin-lock.svg
diff --git a/packages/site/themes/subspace/source/icons/facebook.svg b/packages/docs/themes/subspace/source/icons/facebook.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/facebook.svg
rename to packages/docs/themes/subspace/source/icons/facebook.svg
diff --git a/packages/site/themes/subspace/source/icons/gauge-dashboard-1-alternate.svg b/packages/docs/themes/subspace/source/icons/gauge-dashboard-1-alternate.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/gauge-dashboard-1-alternate.svg
rename to packages/docs/themes/subspace/source/icons/gauge-dashboard-1-alternate.svg
diff --git a/packages/site/themes/subspace/source/icons/gesture-tap-2.svg b/packages/docs/themes/subspace/source/icons/gesture-tap-2.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/gesture-tap-2.svg
rename to packages/docs/themes/subspace/source/icons/gesture-tap-2.svg
diff --git a/packages/site/themes/subspace/source/icons/github.svg b/packages/docs/themes/subspace/source/icons/github.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/github.svg
rename to packages/docs/themes/subspace/source/icons/github.svg
diff --git a/packages/site/themes/subspace/source/icons/half-circles.svg b/packages/docs/themes/subspace/source/icons/half-circles.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/half-circles.svg
rename to packages/docs/themes/subspace/source/icons/half-circles.svg
diff --git a/packages/site/themes/subspace/source/icons/navigation-menu.svg b/packages/docs/themes/subspace/source/icons/navigation-menu.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/navigation-menu.svg
rename to packages/docs/themes/subspace/source/icons/navigation-menu.svg
diff --git a/packages/site/themes/subspace/source/icons/twitter.svg b/packages/docs/themes/subspace/source/icons/twitter.svg
similarity index 100%
rename from packages/site/themes/subspace/source/icons/twitter.svg
rename to packages/docs/themes/subspace/source/icons/twitter.svg
diff --git a/packages/site/themes/subspace/source/images/circles.png b/packages/docs/themes/subspace/source/images/circles.png
similarity index 100%
rename from packages/site/themes/subspace/source/images/circles.png
rename to packages/docs/themes/subspace/source/images/circles.png
diff --git a/packages/site/themes/subspace/source/images/embark-logo.svg b/packages/docs/themes/subspace/source/images/embark-logo.svg
similarity index 100%
rename from packages/site/themes/subspace/source/images/embark-logo.svg
rename to packages/docs/themes/subspace/source/images/embark-logo.svg
diff --git a/packages/site/themes/subspace/source/images/favicon.png b/packages/docs/themes/subspace/source/images/favicon.png
similarity index 100%
rename from packages/site/themes/subspace/source/images/favicon.png
rename to packages/docs/themes/subspace/source/images/favicon.png
diff --git a/packages/site/themes/subspace/source/images/logo.svg b/packages/docs/themes/subspace/source/images/logo.svg
similarity index 100%
rename from packages/site/themes/subspace/source/images/logo.svg
rename to packages/docs/themes/subspace/source/images/logo.svg
diff --git a/packages/site/themes/subspace/source/javascripts/jquery.js b/packages/docs/themes/subspace/source/javascripts/jquery.js
similarity index 100%
rename from packages/site/themes/subspace/source/javascripts/jquery.js
rename to packages/docs/themes/subspace/source/javascripts/jquery.js
diff --git a/packages/site/themes/subspace/source/javascripts/scripts.js b/packages/docs/themes/subspace/source/javascripts/scripts.js
similarity index 100%
rename from packages/site/themes/subspace/source/javascripts/scripts.js
rename to packages/docs/themes/subspace/source/javascripts/scripts.js
diff --git a/packages/docs/vue.md b/packages/docs/vue.md
deleted file mode 100644
index e8e3ba8..0000000
--- a/packages/docs/vue.md
+++ /dev/null
@@ -1,81 +0,0 @@
-# Vue
-Vue provides the official npm package `vue-rx` that provides RxJS integration, which simplifies the use of Subspace with Vue.js
-
-### Example
-
-::: tip
-This example is available in [Github](https://github.com/embark-framework/subspace/tree/master/examples/vue)
-:::
-
-
-#### MyComponent.vue
-```js
-
-
-
someValue: {{eventData$.someValue}}
-
anotherValue: {{eventData$.anotherValue}}
-
-
-
-
-```
-
-#### App.vue
-```js
-
-
-
-
-
-
-
-
-```
-
-
-
-#### Further read
-- [vue-rx](https://www.npmjs.com/package/vue-rx)
diff --git a/packages/site/yarn.lock b/packages/docs/yarn.lock
similarity index 100%
rename from packages/site/yarn.lock
rename to packages/docs/yarn.lock
diff --git a/packages/site/.gitignore b/packages/site/.gitignore
deleted file mode 100644
index 59074d3..0000000
--- a/packages/site/.gitignore
+++ /dev/null
@@ -1,13 +0,0 @@
-node_modules/
-.vscode/
-phoenix.db
-subspace.db
-TODO
-test.js
-dist/
-lib/
-module/
-/examples/react-example1/src/contract.json
-coverage/
-lerna-debug.log
-.DS_Store
\ No newline at end of file
diff --git a/packages/site/LICENSE b/packages/site/LICENSE
deleted file mode 100644
index feec255..0000000
--- a/packages/site/LICENSE
+++ /dev/null
@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2019 Status
-
-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.
diff --git a/packages/site/db.json b/packages/site/db.json
deleted file mode 100644
index 9a710ff..0000000
--- a/packages/site/db.json
+++ /dev/null
@@ -1 +0,0 @@
-{"meta":{"version":1,"warehouse":"3.0.2"},"models":{"Asset":[{"_id":"source/packages/docs/CNAME","path":"CNAME","modified":0,"renderable":0},{"_id":"source/packages/docs/d1.png","path":"d1.png","modified":0,"renderable":0},{"_id":"source/packages/docs/d2.png","path":"d2.png","modified":0,"renderable":0},{"_id":"source/packages/docs/d4.png","path":"d4.png","modified":0,"renderable":0},{"_id":"source/packages/docs/d3.png","path":"d3.png","modified":0,"renderable":0},{"_id":"themes/subspace/source/css/application.scss","path":"css/application.scss","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/accounting-calculator.svg","path":"icons/accounting-calculator.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/book-address.svg","path":"icons/book-address.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/contactless-payment.svg","path":"icons/contactless-payment.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/close.svg","path":"icons/close.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/cloud-lock.svg","path":"icons/cloud-lock.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/crypto-currency-bitcoin-give.svg","path":"icons/crypto-currency-bitcoin-give.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/crypto-currency-bitcoin-lock.svg","path":"icons/crypto-currency-bitcoin-lock.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/facebook.svg","path":"icons/facebook.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/gauge-dashboard-1-alternate.svg","path":"icons/gauge-dashboard-1-alternate.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/credit-card-1.svg","path":"icons/credit-card-1.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/gesture-tap-2.svg","path":"icons/gesture-tap-2.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/navigation-menu.svg","path":"icons/navigation-menu.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/half-circles.svg","path":"icons/half-circles.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/twitter.svg","path":"icons/twitter.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/icons/github.svg","path":"icons/github.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/images/embark-logo.svg","path":"images/embark-logo.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/images/favicon.png","path":"images/favicon.png","modified":0,"renderable":1},{"_id":"themes/subspace/source/images/circles.png","path":"images/circles.png","modified":0,"renderable":1},{"_id":"themes/subspace/source/images/logo.svg","path":"images/logo.svg","modified":0,"renderable":1},{"_id":"themes/subspace/source/javascripts/scripts.js","path":"javascripts/scripts.js","modified":0,"renderable":1},{"_id":"themes/subspace/source/fonts/LICENSE.txt","path":"fonts/LICENSE.txt","modified":0,"renderable":1},{"_id":"themes/subspace/source/javascripts/jquery.js","path":"javascripts/jquery.js","modified":0,"renderable":1},{"_id":"themes/subspace/source/css/utilities/text-color.scss","path":"css/utilities/text-color.scss","modified":0,"renderable":1},{"_id":"themes/subspace/source/css/utilities/text-size.scss","path":"css/utilities/text-size.scss","modified":0,"renderable":1},{"_id":"themes/subspace/source/fonts/Roboto-Regular.ttf","path":"fonts/Roboto-Regular.ttf","modified":0,"renderable":1},{"_id":"themes/subspace/source/fonts/Roboto-Bold.ttf","path":"fonts/Roboto-Bold.ttf","modified":0,"renderable":1}],"Cache":[{"_id":"source/packages/docs/integrations.md","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642530738},{"_id":"source/packages/docs/CNAME","hash":"545c29d0214716b4d25f490ba92f7fc192267fa9","modified":1584642530729},{"_id":"source/packages/docs/api.md","hash":"ffde01913e2d96ec29385876a11263bc11fabceb","modified":1584723815864},{"_id":"source/packages/docs/apollo-client.md","hash":"cc160f89cce8517911336cee5b25cdf65917deff","modified":1584724636348},{"_id":"source/packages/docs/getting-started.md","hash":"1042b4f008235f64d7ea68bb2c2bda1ead199e55","modified":1584725507304},{"_id":"source/packages/docs/how-it-works.md","hash":"d63d4586abfc27e244c79fadc6bd511177000f93","modified":1584642530738},{"_id":"source/packages/docs/react.md","hash":"9535a6f86f81f41f7fc15abda4fa0b643445ca01","modified":1584724578524},{"_id":"source/packages/docs/index.md","hash":"c7f9f58861a13ea8feab62f9b1bdd77dbda50332","modified":1584642530738},{"_id":"source/packages/docs/reactive-graphql.md","hash":"94b59d798d01c251bdb6a6f68d7ea3488fedb100","modified":1584724721872},{"_id":"source/packages/docs/integrations-overview.md","hash":"27810364f74ec73eb6dad0c8de9d72d9b8b51819","modified":1584642530738},{"_id":"source/packages/docs/redux.md","hash":"a1e05949d04ccb860ecdf1dbbc0c0910eb08dc3a","modified":1584725185944},{"_id":"source/packages/docs/redux-observable.md","hash":"704cffb8c78cdd277e113bc36341b7ea3dc39e76","modified":1584725239448},{"_id":"source/packages/docs/tutorial.md","hash":"baadad45a3c4192b5b32636c0552e32f00e75076","modified":1584642530739},{"_id":"source/packages/docs/readme.md","hash":"87edb67efc2d3ff34adb4cdaf253af19602ad901","modified":1584642530739},{"_id":"source/packages/docs/vue.md","hash":"eae7d13431ff55dcb68392cf78abef0cdb7b4e4e","modified":1584724932780},{"_id":"source/packages/docs/d1.png","hash":"615cbb4801559261ddeaedcda06679dd13ff8f26","modified":1584642530731},{"_id":"themes/subspace/languages/en.yml","hash":"52b19a8059904b1c4d7024cb5f2e7a8071b0ab57","modified":1584642530754},{"_id":"themes/subspace/languages/.DS_Store","hash":"d76a2d7ac0d577c6351a42a52cde25f60bbe2e26","modified":1584642530754},{"_id":"themes/subspace/layout/about-us.ejs","hash":"906fffa56cbe7211846775e0b4844db1825230a7","modified":1584642530754},{"_id":"themes/subspace/layout/layout.ejs","hash":"38e9ef77f035f17fb6c4a46d3f2204d2c5f51459","modified":1584642530755},{"_id":"themes/subspace/layout/index.ejs","hash":"b104f0b2eaae87f8c90a6cdafc18e2f5c699d02a","modified":1584642530755},{"_id":"themes/subspace/layout/page.ejs","hash":"e006206018c66a2c2937215010c9c3cd705f05ad","modified":1584642530755},{"_id":"themes/subspace/layout/404.ejs","hash":"52679437dd54e18877ce4d3d6d9989b3515ff6bf","modified":1584642530754},{"_id":"source/packages/docs/d2.png","hash":"87c8eaa980edbe019c706ab8463148227bd25192","modified":1584642530733},{"_id":"source/packages/docs/d4.png","hash":"5cc6b8b2d141e41719bf9ace46d2be80d8236a69","modified":1584642530737},{"_id":"source/packages/docs/d3.png","hash":"ca19a6ae5bf461a92af770d0ed7e82170c27da4a","modified":1584642530735},{"_id":"themes/subspace/layout/partial/head.ejs","hash":"7b788f51a2f5cc3891dd2bc9db8590580a6c47da","modified":1584642530755},{"_id":"themes/subspace/source/css/application.scss","hash":"424452ff93d472ea4097d60437a5c2fb8be74e49","modified":1584642530756},{"_id":"themes/subspace/layout/partial/header.ejs","hash":"a6cbefc575f7d67895463ffce2813eee00cdc1d0","modified":1584642530756},{"_id":"themes/subspace/source/css/.DS_Store","hash":"6d11537ea7ac951519f8387948002c67d58ac9ef","modified":1584642530756},{"_id":"themes/subspace/layout/partial/footer.ejs","hash":"15e41147f066c4ae9fed03f0f10f7b821a3c54e7","modified":1584726309720},{"_id":"themes/subspace/layout/partial/mailpopup.ejs","hash":"edb6ea1449c8f419c1f6cd3fa0f3f6bac709675d","modified":1584642530756},{"_id":"themes/subspace/layout/partial/header-short.ejs","hash":"fcf71590daa7f07a0d898a9cd432faebb7b06ea9","modified":1584642530755},{"_id":"themes/subspace/source/icons/accounting-calculator.svg","hash":"7891b12b3fd13594b3ae17c10b3523208265be33","modified":1584642530762},{"_id":"themes/subspace/source/icons/book-address.svg","hash":"e2635b49f36833ec0f3373d53e3c5819a3446c24","modified":1584642530762},{"_id":"themes/subspace/source/icons/contactless-payment.svg","hash":"6674a6a6c06539d7be7bcb2459448d4895541051","modified":1584642530763},{"_id":"themes/subspace/source/icons/close.svg","hash":"07c332a892c2b2a107bf53a055425064006b7161","modified":1584642530763},{"_id":"themes/subspace/source/icons/cloud-lock.svg","hash":"b76429f6da1aaa8a1f1d1e72ae7167899976e7aa","modified":1584642530763},{"_id":"themes/subspace/source/icons/crypto-currency-bitcoin-give.svg","hash":"a07cb23aa2c7b81167289cfee51450e110dd46d2","modified":1584642530763},{"_id":"themes/subspace/source/icons/crypto-currency-bitcoin-lock.svg","hash":"27219b9e068b7dc5323217e3f49bad16f6555470","modified":1584642530763},{"_id":"themes/subspace/source/icons/facebook.svg","hash":"0cf65e7228226ff7aa72c74d35368db7599c884b","modified":1584642530763},{"_id":"themes/subspace/source/icons/gauge-dashboard-1-alternate.svg","hash":"4ab202003ecb28775848f4b6fa61a45b4cdc8a7c","modified":1584642530763},{"_id":"themes/subspace/source/icons/credit-card-1.svg","hash":"2c6082035b515eff854f84905cca61a53275aa8e","modified":1584642530763},{"_id":"themes/subspace/source/icons/gesture-tap-2.svg","hash":"8e9a60be2d1080c184f8863d8059472ae1051432","modified":1584642530763},{"_id":"themes/subspace/source/icons/navigation-menu.svg","hash":"d6b4d9e2da8849ac362bcb8d634725b921ebf46c","modified":1584642530764},{"_id":"themes/subspace/source/icons/half-circles.svg","hash":"0be6efb2cd315348a5f2f1404da205d11d5e78c3","modified":1584642530764},{"_id":"themes/subspace/source/icons/twitter.svg","hash":"dab32630d9eb04c293f9c4775271953d57eb8642","modified":1584642530764},{"_id":"themes/subspace/source/images/.DS_Store","hash":"df2fbeb1400acda0909a32c1cf6bf492f1121e07","modified":1584642530764},{"_id":"themes/subspace/source/icons/github.svg","hash":"4ad3447484a193da8e10d9705ebb598de10873e6","modified":1584642530764},{"_id":"themes/subspace/source/images/embark-logo.svg","hash":"682af62e01cd85c11235bd2258b8f87ee9b44afb","modified":1584642530765},{"_id":"themes/subspace/source/images/favicon.png","hash":"7f0c4305cd9711e9dd20ac94a5559f4d67a9fe9b","modified":1584642530765},{"_id":"themes/subspace/source/images/circles.png","hash":"ca3ed456a67c9c329e638990b9a8805a2f33c68c","modified":1584642530764},{"_id":"themes/subspace/source/images/logo.svg","hash":"e7d3c651b56c2bb890b567a67dd860fc96ad6579","modified":1584642530765},{"_id":"themes/subspace/source/javascripts/scripts.js","hash":"1f0ee8c12b179a9607cb1848710254652a7332b2","modified":1584642530766},{"_id":"themes/subspace/source/css/components/_footer.scss","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642530756},{"_id":"themes/subspace/source/fonts/LICENSE.txt","hash":"47b573e3824cd5e02a1a3ae99e2735b49e0256e4","modified":1584642530761},{"_id":"themes/subspace/source/javascripts/jquery.js","hash":"9592732de681f4365e9b7016dc5cf76e2a55ee9b","modified":1584642530765},{"_id":"themes/subspace/source/css/components/_accentbox.scss","hash":"d29f556f2e24edec1332ccc00e86426015de422a","modified":1584642530756},{"_id":"themes/subspace/source/css/components/_button.scss","hash":"0888de9a954f5bfb3b84bbfdeed13372d250f69d","modified":1584642530756},{"_id":"themes/subspace/source/css/components/_ghostbox.scss","hash":"1105139aba422228bc5a64863d28d8405d700d15","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_header.scss","hash":"e83d6db7e7c928f4d7d5fd2d57643fe1a551cffc","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_icons.scss","hash":"cb036eb40ed0c2525ca1918e59d73d6a592272ba","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_logo.scss","hash":"c3734c435890094b95a9f340337dbfc682bc1e1a","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_notification.scss","hash":"87e1aae9e3097c59833d34e72f7ae8414f667cdb","modified":1584724117876},{"_id":"themes/subspace/source/css/components/_prism-highlighting.scss","hash":"f8471f2667d53a43cb3b6003d7ecafc811283c24","modified":1584642530757},{"_id":"themes/subspace/source/css/components/_spotlightbox.scss","hash":"2a38ea8c753890d1683b435e33e8377fb17671dc","modified":1584642530758},{"_id":"themes/subspace/source/css/components/_teaser.scss","hash":"c653e382a5a7074f5f86b89c6640a56e083b8471","modified":1584642530758},{"_id":"themes/subspace/source/css/components/_user.scss","hash":"b3663cc7b8c0afdf5f8a69031da7ac3365e844a9","modified":1584642530758},{"_id":"themes/subspace/source/css/components/_whisperbox.scss","hash":"3852852e8644c71b6604915342a10abbfd681d4b","modified":1584642530758},{"_id":"themes/subspace/source/css/objects/_actionbar.scss","hash":"195c09931d611dbfcaf9822413504ebb0e77076b","modified":1584642530758},{"_id":"themes/subspace/source/css/components/_popup.scss","hash":"ccacb82e0b24378a96841d7a480e6530630d882d","modified":1584642530757},{"_id":"themes/subspace/source/css/objects/_content.scss","hash":"4ef659a6c260c847813fabb8718f990c5c126792","modified":1584642530758},{"_id":"themes/subspace/source/css/objects/_distance.scss","hash":"7ad96acdb01f35bbd8941d61f59b055568c6e545","modified":1584642530758},{"_id":"themes/subspace/source/css/objects/_heading.scss","hash":"6569220491e75b751070f2b589fea348745e27d1","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_list.scss","hash":"ed672664d7e4a2f041ce3e3dcc6b3c9f3ebbfa7e","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_media.scss","hash":"be25ab7a3c1e3bccfaaa5fdbeeccf9308694921d","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_navigation.scss","hash":"64e3b33422ccccf702e630125a9b3ca52999c2d6","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_grid.scss","hash":"4dc75ce1b1d58e4ca6624db8115ffd196c996733","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/_side-navigation.scss","hash":"231d32b8a6137f3bd4d4ac2aa24476620f558f61","modified":1584642530759},{"_id":"themes/subspace/source/css/settings/_config.scss","hash":"a27b23a9d0e1a77c4361c4cb1f7ad0468906bbb3","modified":1584642530759},{"_id":"themes/subspace/source/css/settings/_preset.scss","hash":"36ed217633bf1a18f5221299e0f60277271eecb4","modified":1584642530759},{"_id":"themes/subspace/source/css/objects/.DS_Store","hash":"5fcb0ec5a267305e0c44b7fa11ae2793b4f428c6","modified":1584642530758},{"_id":"themes/subspace/source/css/settings/_typography.scss","hash":"6cd55798081c53c48e7ad0324a0799b53fc5ff17","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_column.scss","hash":"9e79a4e3b4ab33091af14704d35ca2ab4263b741","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-brand-color.scss","hash":"5e773a10bb143a2b423287b7faff79ac5ce3fcac","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-color.scss","hash":"c7b667b92df7fa246be2f32f395ebbde23ea0355","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-font.scss","hash":"b2895a7ef8c26ba6b34c34f1f2fb2ea5449f89cd","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-index.scss","hash":"72281c30f7e3db2060898d3c9b250bc6c8829216","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-layout-color.scss","hash":"8e57145b98219bc874041197bde973193e2ff7a8","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-notification-color.scss","hash":"761e671fe7cbd70c190254818c8e55e6d3d7ee90","modified":1584642530760},{"_id":"themes/subspace/source/css/tools/_get-semantic-color.scss","hash":"316f7baaa9aeac4f891901882479b37230b5c591","modified":1584642530761},{"_id":"themes/subspace/source/css/tools/_get-spacing.scss","hash":"fc5b46752f7e37da64ddad94392450d7d4f40a87","modified":1584642530761},{"_id":"themes/subspace/source/css/tools/_list-reset.scss","hash":"ed3aa5ee39890dd0454c695e1bf0a45f751c5b04","modified":1584642530761},{"_id":"themes/subspace/source/css/tools/_respond.scss","hash":"ba73d16c16235365bea5da78df0672d990ba4579","modified":1584642530761},{"_id":"themes/subspace/source/css/utilities/text-color.scss","hash":"414a963b70ee7a6250a247bdbd03f2e67e5bbdcd","modified":1584642530761},{"_id":"themes/subspace/source/css/utilities/text-size.scss","hash":"93494af1f3f44293fc9357bd726eadedf76d9516","modified":1584642530761},{"_id":"themes/subspace/source/fonts/Roboto-Regular.ttf","hash":"dd1b1db13ff1f72138c134c62f38fef83749f36a","modified":1584642530762},{"_id":"themes/subspace/source/fonts/Roboto-Bold.ttf","hash":"0ce37ced9c5fcac9bdc452a432c1258870ba4677","modified":1584642530762},{"_id":"public/integrations.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/api.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/apollo-client.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/getting-started.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/how-it-works.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/reactive-graphql.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/react.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/integrations-overview.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/redux.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/tutorial.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/redux-observable.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/readme.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/vue.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/integrations.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/api.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/apollo-client.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/getting-started.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/how-it-works.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/index.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/reactive-graphql.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/react.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/integrations-overview.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/redux.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/redux-observable.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/tutorial.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/readme.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/de/vue.html","hash":"da39a3ee5e6b4b0d3255bfef95601890afd80709","modified":1584642922115},{"_id":"public/index.html","hash":"f78940c9cc6789a8ebe9e87f038b29570a7551ee","modified":1584642922115},{"_id":"public/CNAME","hash":"545c29d0214716b4d25f490ba92f7fc192267fa9","modified":1584642922115},{"_id":"public/icons/accounting-calculator.svg","hash":"7891b12b3fd13594b3ae17c10b3523208265be33","modified":1584642922115},{"_id":"public/icons/book-address.svg","hash":"e2635b49f36833ec0f3373d53e3c5819a3446c24","modified":1584642922115},{"_id":"public/icons/contactless-payment.svg","hash":"6674a6a6c06539d7be7bcb2459448d4895541051","modified":1584642922115},{"_id":"public/icons/close.svg","hash":"07c332a892c2b2a107bf53a055425064006b7161","modified":1584642922115},{"_id":"public/icons/cloud-lock.svg","hash":"b76429f6da1aaa8a1f1d1e72ae7167899976e7aa","modified":1584642922115},{"_id":"public/icons/crypto-currency-bitcoin-give.svg","hash":"a07cb23aa2c7b81167289cfee51450e110dd46d2","modified":1584642922115},{"_id":"public/icons/crypto-currency-bitcoin-lock.svg","hash":"27219b9e068b7dc5323217e3f49bad16f6555470","modified":1584642922115},{"_id":"public/icons/facebook.svg","hash":"0cf65e7228226ff7aa72c74d35368db7599c884b","modified":1584642922115},{"_id":"public/icons/gesture-tap-2.svg","hash":"8e9a60be2d1080c184f8863d8059472ae1051432","modified":1584642922115},{"_id":"public/icons/gauge-dashboard-1-alternate.svg","hash":"4ab202003ecb28775848f4b6fa61a45b4cdc8a7c","modified":1584642922115},{"_id":"public/icons/credit-card-1.svg","hash":"2c6082035b515eff854f84905cca61a53275aa8e","modified":1584642922115},{"_id":"public/icons/navigation-menu.svg","hash":"d6b4d9e2da8849ac362bcb8d634725b921ebf46c","modified":1584642922115},{"_id":"public/icons/half-circles.svg","hash":"0be6efb2cd315348a5f2f1404da205d11d5e78c3","modified":1584642922115},{"_id":"public/icons/twitter.svg","hash":"dab32630d9eb04c293f9c4775271953d57eb8642","modified":1584642922115},{"_id":"public/icons/github.svg","hash":"4ad3447484a193da8e10d9705ebb598de10873e6","modified":1584642922115},{"_id":"public/images/embark-logo.svg","hash":"682af62e01cd85c11235bd2258b8f87ee9b44afb","modified":1584642922115},{"_id":"public/images/favicon.png","hash":"7f0c4305cd9711e9dd20ac94a5559f4d67a9fe9b","modified":1584642922115},{"_id":"public/images/logo.svg","hash":"e7d3c651b56c2bb890b567a67dd860fc96ad6579","modified":1584642922115},{"_id":"public/images/circles.png","hash":"ca3ed456a67c9c329e638990b9a8805a2f33c68c","modified":1584642922115},{"_id":"public/fonts/LICENSE.txt","hash":"47b573e3824cd5e02a1a3ae99e2735b49e0256e4","modified":1584642922115},{"_id":"public/javascripts/scripts.js","hash":"1f0ee8c12b179a9607cb1848710254652a7332b2","modified":1584642922115},{"_id":"public/css/utilities/text-size.css","hash":"6340d74612d186555e471c57175a5f0a3f661cdc","modified":1584642922115},{"_id":"public/css/utilities/text-color.css","hash":"3d763e25e9078d5375b4fd0d9b100aa1b8a91d93","modified":1584642922115},{"_id":"public/javascripts/jquery.js","hash":"9592732de681f4365e9b7016dc5cf76e2a55ee9b","modified":1584642922115},{"_id":"public/css/application.css","hash":"e7e477ef203d3d902df2518d63ef12731d0a50f8","modified":1584642922115},{"_id":"public/d1.png","hash":"615cbb4801559261ddeaedcda06679dd13ff8f26","modified":1584642922115},{"_id":"public/fonts/Roboto-Bold.ttf","hash":"0ce37ced9c5fcac9bdc452a432c1258870ba4677","modified":1584642922115},{"_id":"public/d4.png","hash":"5cc6b8b2d141e41719bf9ace46d2be80d8236a69","modified":1584642922115},{"_id":"public/d3.png","hash":"ca19a6ae5bf461a92af770d0ed7e82170c27da4a","modified":1584642922115},{"_id":"public/fonts/Roboto-Regular.ttf","hash":"dd1b1db13ff1f72138c134c62f38fef83749f36a","modified":1584642922115},{"_id":"public/d2.png","hash":"87c8eaa980edbe019c706ab8463148227bd25192","modified":1584642922115},{"_id":"source/packages/docs/_data/sidebar.yml","hash":"09bc83728b4dc7a9db44fdfce15769972c1eec3a","modified":1584642530730},{"_id":"source/packages/docs/_posts/hello-world.md","hash":"7d98d6592de80fdcd2949bd7401cec12afd98cdf","modified":1584642530730},{"_id":"source/packages/docs/.DS_Store","hash":"078fc163bb0c365b31f211f49a5e78e2703b3f12","modified":1584643079469},{"_id":"themes/subspace/layout/partial/analytics.ejs","hash":"bf68e467c9adc5e07591ddf1e74da824750948f2","modified":1584726372396}],"Category":[],"Data":[{"_id":"sidebar","data":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}],"Page":[{"_content":"","source":"integrations.md","raw":"","date":"2020-03-19T18:30:37.782Z","updated":"2020-03-19T18:28:50.738Z","path":"integrations.html","title":"","comments":1,"layout":"page","_id":"ck7z3hcks00005cbn2gap6jkg","content":"","site":{"data":{}},"excerpt":"","more":""},{"_content":"# API\n\n## General\n\n### `new Subspace(web3 [, options])`\nConstructor. \n\n**Parameters**\n1. `web3` - `Object`: a `web3.js` object.\n2. `options` - `Object` (optional): Options used to initialize Subspace\n\t- `dbFilename` - `String` (optional): Name of the database where the information will be stored (default `'subspace.db'`)\n - `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).\n - `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),\n - `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)\n\n\n### `init()`\nInitializes **Subspace**\n\n**Returns**\n`Promise` that once it's resolved, will mean that **Subspace** is available to use\n\n### `close()`\nDispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution.\n\n### `contract(instance|{abi,address})`\nAdds a `track` method to the web3 contract objects. You can obtain this functionality by passing a `web3.eth.Contract` instance, or the `abi` and `address` of your contract\n\n**Returns**\n`web3.eth.Contract` object enhanced with `.track()` functions for methods and events.\n\n## Contract methods\n\n### `myContract.events.MyEvent.track([options])`\nTrack a contract event.\n\n**Parameters**\n1. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters\n - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `\"myNumber\"` is `12` or `13`.\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `\"latest\"`)\n - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.\n\n**Returns**\n`RxJS Observable` which will stream the event `returnValues`.\n\n\n### `myContract.methods.myMethod([param1[, ...]]).track([callOptions])`\nTrack a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `callOptions` - `Object` (optional): The options used for calling.\n - `from` - `String` (optional): The address the call “transaction” should be made from.\n - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.\n - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).\n\n**Returns**\n`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked. \n\n\n### `myContract.trackBalance(address [, tokenAddress])`\nTrack a contract's balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `address` - `String`: The address to get the balance of.\n2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.\n\n**Returns**\n`RxJS Observable` which will stream a string containing the address balance.\n\n\n## Blocks, gas price and block time\n\n### `trackBlock()`\nReceive the block information for any new block. It's the reactive equivalent to `web3.eth.getBlock(\"latest\")`.\n\n**Returns**\n`RxJS Observable` which will stream a block object for the latest block received\n\n### `trackBlockNumber()`\nReturns the latest block number. It's the reactive equivalent to `web3.eth.getBlockNumber`.\n\n**Returns**\n`RxJS Observable` with the latest block number\n\n### `trackGasPrice()`\nReturns the current gas price oracle. It's the reactive equivalent to `web3.eth.getGasPrice`.\n\n**Returns**\n`RxJS Observable` with the average gas price in wei.\n\n### `trackAverageBlocktime()`\nAverage block time of the last 10 blocks.\n\n**Returns**\n`RxJS Observable` with the moving average block time of the last 10 blocks. The time is returned in milliseconds:\n\n\n## Low level API for data tracking\n\nThese are used in case you don't want to decorate your web3 contract objects, or if you want to track the balance for an specific address.\n\n### `trackEvent(contractObject, eventName [, options])`\nTrack a contract event.\n\n**Parameters**\n1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.\n2. `eventName` - `String`: The name of the event to subscribe.\n3. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters\n - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `\"myNumber\"` is `12` or `13`.\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `\"latest\"`)\n - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.\n\n**Returns**\n`RxJS Observable` which will stream the event `returnValues`.\n\n### `trackProperty(contractObject, functionName [, functionArgs] [, callOptions])`\nTrack a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.\n2. `functionName` - `String`: Name of the function or variable whose values will be tracked.\n3. `functionArgs` - `Array` (optional): Array of arguments that the tracked function receives\n4. `callOptions` - `Object` (optional): The options used for calling.\n - `from` - `String` (optional): The address the call “transaction” should be made from.\n - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.\n - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).\n\n**Returns**\n`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked. \n\n### `trackBalance(address [, tokenAddress])`\nTrack balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `address` - `String`: The address to get the balance of.\n2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.\n\n**Returns**\n`RxJS Observable` which will stream a string containing the address balance.\n\n### `trackLogs(options [, abi])`\nTracks incoming logs, filtered by the given options.\n\n**Parameters**\n1. `options` - `Object` (optional): web3 filter options object to limit the number of logs\n - `address` - `String|Array` (optional): An address or a list of addresses to only get logs from particular account(s).\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `topics` - `Array` (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, '0x00...']. You can also pass another array for each topic with options for that topic e.g. [null, ['option1', 'option2']].\n2. `abi` - `Array` (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.\n\n**Returns**\n`RxJS Observable` which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.","source":"api.md","raw":"# API\n\n## General\n\n### `new Subspace(web3 [, options])`\nConstructor. \n\n**Parameters**\n1. `web3` - `Object`: a `web3.js` object.\n2. `options` - `Object` (optional): Options used to initialize Subspace\n\t- `dbFilename` - `String` (optional): Name of the database where the information will be stored (default `'subspace.db'`)\n - `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).\n - `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),\n - `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)\n\n\n### `init()`\nInitializes **Subspace**\n\n**Returns**\n`Promise` that once it's resolved, will mean that **Subspace** is available to use\n\n### `close()`\nDispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution.\n\n### `contract(instance|{abi,address})`\nAdds a `track` method to the web3 contract objects. You can obtain this functionality by passing a `web3.eth.Contract` instance, or the `abi` and `address` of your contract\n\n**Returns**\n`web3.eth.Contract` object enhanced with `.track()` functions for methods and events.\n\n## Contract methods\n\n### `myContract.events.MyEvent.track([options])`\nTrack a contract event.\n\n**Parameters**\n1. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters\n - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `\"myNumber\"` is `12` or `13`.\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `\"latest\"`)\n - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.\n\n**Returns**\n`RxJS Observable` which will stream the event `returnValues`.\n\n\n### `myContract.methods.myMethod([param1[, ...]]).track([callOptions])`\nTrack a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `callOptions` - `Object` (optional): The options used for calling.\n - `from` - `String` (optional): The address the call “transaction” should be made from.\n - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.\n - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).\n\n**Returns**\n`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked. \n\n\n### `myContract.trackBalance(address [, tokenAddress])`\nTrack a contract's balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `address` - `String`: The address to get the balance of.\n2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.\n\n**Returns**\n`RxJS Observable` which will stream a string containing the address balance.\n\n\n## Blocks, gas price and block time\n\n### `trackBlock()`\nReceive the block information for any new block. It's the reactive equivalent to `web3.eth.getBlock(\"latest\")`.\n\n**Returns**\n`RxJS Observable` which will stream a block object for the latest block received\n\n### `trackBlockNumber()`\nReturns the latest block number. It's the reactive equivalent to `web3.eth.getBlockNumber`.\n\n**Returns**\n`RxJS Observable` with the latest block number\n\n### `trackGasPrice()`\nReturns the current gas price oracle. It's the reactive equivalent to `web3.eth.getGasPrice`.\n\n**Returns**\n`RxJS Observable` with the average gas price in wei.\n\n### `trackAverageBlocktime()`\nAverage block time of the last 10 blocks.\n\n**Returns**\n`RxJS Observable` with the moving average block time of the last 10 blocks. The time is returned in milliseconds:\n\n\n## Low level API for data tracking\n\nThese are used in case you don't want to decorate your web3 contract objects, or if you want to track the balance for an specific address.\n\n### `trackEvent(contractObject, eventName [, options])`\nTrack a contract event.\n\n**Parameters**\n1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.\n2. `eventName` - `String`: The name of the event to subscribe.\n3. `options` - `Object` (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters\n - `filter` - `Object` (optional): Lets you filter events by indexed parameters, e.g. `{filter: {myNumber: [12,13]}}` means all events where `\"myNumber\"` is `12` or `13`.\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `toBlock` - `Number` (optional): The block number to get events up to (Defaults to `\"latest\"`)\n - `topics` - `Array` (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (`topic[0]`) will not be set automatically.\n\n**Returns**\n`RxJS Observable` which will stream the event `returnValues`.\n\n### `trackProperty(contractObject, functionName [, functionArgs] [, callOptions])`\nTrack a constant function / contract state variable on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `contractObject` - `web3.eth.Contract`: An already initialized contract object pointing to an address and containing a valid ABI.\n2. `functionName` - `String`: Name of the function or variable whose values will be tracked.\n3. `functionArgs` - `Array` (optional): Array of arguments that the tracked function receives\n4. `callOptions` - `Object` (optional): The options used for calling.\n - `from` - `String` (optional): The address the call “transaction” should be made from.\n - `gasPrice` - `String` (optional): The gas price in wei to use for this call “transaction”.\n - `gas` - `Number` (optional): The maximum gas provided for this call “transaction” (gas limit).\n\n**Returns**\n`RxJS Observable` which will stream the function / variable values. Data type will depend on the contract function invoked. \n\n### `trackBalance(address [, tokenAddress])`\nTrack balance changes for an address on each block mined, or depending on the `callInterval` option used during **Subspace** initialization.\n\n**Parameters**\n1. `address` - `String`: The address to get the balance of.\n2. `tokenAddress` - `String` (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.\n\n**Returns**\n`RxJS Observable` which will stream a string containing the address balance.\n\n### `trackLogs(options [, abi])`\nTracks incoming logs, filtered by the given options.\n\n**Parameters**\n1. `options` - `Object` (optional): web3 filter options object to limit the number of logs\n - `address` - `String|Array` (optional): An address or a list of addresses to only get logs from particular account(s).\n - `fromBlock` - `Number` (optional): The block number from which to get events on.\n - `topics` - `Array` (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, '0x00...']. You can also pass another array for each topic with options for that topic e.g. [null, ['option1', 'option2']].\n2. `abi` - `Array` (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.\n\n**Returns**\n`RxJS Observable` which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.","date":"2020-03-20T17:03:35.864Z","updated":"2020-03-20T17:03:35.864Z","path":"api.html","_id":"ck7z3hckv00015cbn10hj90nw","title":"","comments":1,"layout":"page","content":"
API
General
new Subspace(web3 [, options])
Constructor.
\n
Parameters
\n\n
web3 - Object: a web3.js object.
\n
options - Object (optional): Options used to initialize Subspace
\n
dbFilename - String (optional): Name of the database where the information will be stored (default 'subspace.db')
\n
callInterval - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It’s only used with HttpProviders (default: undefined. Obtains data every block using the average block time as an interval).
\n
refreshLastNBlocks - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
\n
disableSubscriptions - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
\n
\n
\n\n
init()
Initializes Subspace
\n
Returns Promise that once it’s resolved, will mean that Subspace is available to use
\n
close()
Dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by Subspace during its normal execution.
\n
contract(instance|{abi,address})
Adds a track method to the web3 contract objects. You can obtain this functionality by passing a web3.eth.Contract instance, or the abi and address of your contract
\n
Returns web3.eth.Contract object enhanced with .track() functions for methods and events.
\n
Contract methods
myContract.events.MyEvent.track([options])
Track a contract event.
\n
Parameters
\n\n
options - Object (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
\n
filter - Object (optional): Lets you filter events by indexed parameters, e.g. {filter: {myNumber: [12,13]}} means all events where "myNumber" is 12 or 13.
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
toBlock - Number (optional): The block number to get events up to (Defaults to "latest")
\n
topics - Array (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (topic[0]) will not be set automatically.
\n
\n
\n\n
Returns RxJS Observable which will stream the event returnValues.
Track a constant function / contract state variable on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
callOptions - Object (optional): The options used for calling.
\n
from - String (optional): The address the call “transaction” should be made from.
\n
gasPrice - String (optional): The gas price in wei to use for this call “transaction”.
\n
gas - Number (optional): The maximum gas provided for this call “transaction” (gas limit).
\n
\n
\n\n
Returns RxJS Observable which will stream the function / variable values. Data type will depend on the contract function invoked.
\n
myContract.trackBalance(address [, tokenAddress])
Track a contract’s balance changes for an address on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
address - String: The address to get the balance of.
\n
tokenAddress - String (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
\n\n
Returns RxJS Observable which will stream a string containing the address balance.
\n
Blocks, gas price and block time
trackBlock()
Receive the block information for any new block. It’s the reactive equivalent to web3.eth.getBlock("latest").
\n
Returns RxJS Observable which will stream a block object for the latest block received
\n
trackBlockNumber()
Returns the latest block number. It’s the reactive equivalent to web3.eth.getBlockNumber.
\n
Returns RxJS Observable with the latest block number
\n
trackGasPrice()
Returns the current gas price oracle. It’s the reactive equivalent to web3.eth.getGasPrice.
\n
Returns RxJS Observable with the average gas price in wei.
\n
trackAverageBlocktime()
Average block time of the last 10 blocks.
\n
Returns RxJS Observable with the moving average block time of the last 10 blocks. The time is returned in milliseconds:
\n
Low level API for data tracking
These are used in case you don’t want to decorate your web3 contract objects, or if you want to track the balance for an specific address.
\n
trackEvent(contractObject, eventName [, options])
Track a contract event.
\n
Parameters
\n\n
contractObject - web3.eth.Contract: An already initialized contract object pointing to an address and containing a valid ABI.
\n
eventName - String: The name of the event to subscribe.
\n
options - Object (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
\n
filter - Object (optional): Lets you filter events by indexed parameters, e.g. {filter: {myNumber: [12,13]}} means all events where "myNumber" is 12 or 13.
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
toBlock - Number (optional): The block number to get events up to (Defaults to "latest")
\n
topics - Array (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (topic[0]) will not be set automatically.
\n
\n
\n\n
Returns RxJS Observable which will stream the event returnValues.
Track a constant function / contract state variable on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
contractObject - web3.eth.Contract: An already initialized contract object pointing to an address and containing a valid ABI.
\n
functionName - String: Name of the function or variable whose values will be tracked.
\n
functionArgs - Array (optional): Array of arguments that the tracked function receives
\n
callOptions - Object (optional): The options used for calling.
\n
from - String (optional): The address the call “transaction” should be made from.
\n
gasPrice - String (optional): The gas price in wei to use for this call “transaction”.
\n
gas - Number (optional): The maximum gas provided for this call “transaction” (gas limit).
\n
\n
\n\n
Returns RxJS Observable which will stream the function / variable values. Data type will depend on the contract function invoked.
\n
trackBalance(address [, tokenAddress])
Track balance changes for an address on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
address - String: The address to get the balance of.
\n
tokenAddress - String (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
\n\n
Returns RxJS Observable which will stream a string containing the address balance.
\n
trackLogs(options [, abi])
Tracks incoming logs, filtered by the given options.
\n
Parameters
\n\n
options - Object (optional): web3 filter options object to limit the number of logs
\n
address - String|Array (optional): An address or a list of addresses to only get logs from particular account(s).
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
topics - Array (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, ‘0x00…’]. You can also pass another array for each topic with options for that topic e.g. [null, [‘option1’, ‘option2’]].
\n
\n
\n
abi - Array (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.
\n\n
Returns RxJS Observable which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
API
General
new Subspace(web3 [, options])
Constructor.
\n
Parameters
\n\n
web3 - Object: a web3.js object.
\n
options - Object (optional): Options used to initialize Subspace
\n
dbFilename - String (optional): Name of the database where the information will be stored (default 'subspace.db')
\n
callInterval - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It’s only used with HttpProviders (default: undefined. Obtains data every block using the average block time as an interval).
\n
refreshLastNBlocks - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
\n
disableSubscriptions - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
\n
\n
\n\n
init()
Initializes Subspace
\n
Returns Promise that once it’s resolved, will mean that Subspace is available to use
\n
close()
Dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by Subspace during its normal execution.
\n
contract(instance|{abi,address})
Adds a track method to the web3 contract objects. You can obtain this functionality by passing a web3.eth.Contract instance, or the abi and address of your contract
\n
Returns web3.eth.Contract object enhanced with .track() functions for methods and events.
\n
Contract methods
myContract.events.MyEvent.track([options])
Track a contract event.
\n
Parameters
\n\n
options - Object (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
\n
filter - Object (optional): Lets you filter events by indexed parameters, e.g. {filter: {myNumber: [12,13]}} means all events where "myNumber" is 12 or 13.
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
toBlock - Number (optional): The block number to get events up to (Defaults to "latest")
\n
topics - Array (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (topic[0]) will not be set automatically.
\n
\n
\n\n
Returns RxJS Observable which will stream the event returnValues.
Track a constant function / contract state variable on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
callOptions - Object (optional): The options used for calling.
\n
from - String (optional): The address the call “transaction” should be made from.
\n
gasPrice - String (optional): The gas price in wei to use for this call “transaction”.
\n
gas - Number (optional): The maximum gas provided for this call “transaction” (gas limit).
\n
\n
\n\n
Returns RxJS Observable which will stream the function / variable values. Data type will depend on the contract function invoked.
\n
myContract.trackBalance(address [, tokenAddress])
Track a contract’s balance changes for an address on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
address - String: The address to get the balance of.
\n
tokenAddress - String (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
\n\n
Returns RxJS Observable which will stream a string containing the address balance.
\n
Blocks, gas price and block time
trackBlock()
Receive the block information for any new block. It’s the reactive equivalent to web3.eth.getBlock("latest").
\n
Returns RxJS Observable which will stream a block object for the latest block received
\n
trackBlockNumber()
Returns the latest block number. It’s the reactive equivalent to web3.eth.getBlockNumber.
\n
Returns RxJS Observable with the latest block number
\n
trackGasPrice()
Returns the current gas price oracle. It’s the reactive equivalent to web3.eth.getGasPrice.
\n
Returns RxJS Observable with the average gas price in wei.
\n
trackAverageBlocktime()
Average block time of the last 10 blocks.
\n
Returns RxJS Observable with the moving average block time of the last 10 blocks. The time is returned in milliseconds:
\n
Low level API for data tracking
These are used in case you don’t want to decorate your web3 contract objects, or if you want to track the balance for an specific address.
\n
trackEvent(contractObject, eventName [, options])
Track a contract event.
\n
Parameters
\n\n
contractObject - web3.eth.Contract: An already initialized contract object pointing to an address and containing a valid ABI.
\n
eventName - String: The name of the event to subscribe.
\n
options - Object (optional): web3 filter options object to limit the number of events based on a block number range, or indexed filters
\n
filter - Object (optional): Lets you filter events by indexed parameters, e.g. {filter: {myNumber: [12,13]}} means all events where "myNumber" is 12 or 13.
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
toBlock - Number (optional): The block number to get events up to (Defaults to "latest")
\n
topics - Array (optional): This allows you to manually set the topics for the event filter. If given the filter property and event signature, (topic[0]) will not be set automatically.
\n
\n
\n\n
Returns RxJS Observable which will stream the event returnValues.
Track a constant function / contract state variable on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
contractObject - web3.eth.Contract: An already initialized contract object pointing to an address and containing a valid ABI.
\n
functionName - String: Name of the function or variable whose values will be tracked.
\n
functionArgs - Array (optional): Array of arguments that the tracked function receives
\n
callOptions - Object (optional): The options used for calling.
\n
from - String (optional): The address the call “transaction” should be made from.
\n
gasPrice - String (optional): The gas price in wei to use for this call “transaction”.
\n
gas - Number (optional): The maximum gas provided for this call “transaction” (gas limit).
\n
\n
\n\n
Returns RxJS Observable which will stream the function / variable values. Data type will depend on the contract function invoked.
\n
trackBalance(address [, tokenAddress])
Track balance changes for an address on each block mined, or depending on the callInterval option used during Subspace initialization.
\n
Parameters
\n\n
address - String: The address to get the balance of.
\n
tokenAddress - String (optional): If you want to track the balance for an ERC20 contract, here you can specify the token address. Otherwise, Only ETH balances will be returned.
\n\n
Returns RxJS Observable which will stream a string containing the address balance.
\n
trackLogs(options [, abi])
Tracks incoming logs, filtered by the given options.
\n
Parameters
\n\n
options - Object (optional): web3 filter options object to limit the number of logs
\n
address - String|Array (optional): An address or a list of addresses to only get logs from particular account(s).
\n
fromBlock - Number (optional): The block number from which to get events on.
\n
topics - Array (optional): An array of values which must each appear in the log entries. The order is important, if you want to leave topics out use null, e.g. [null, ‘0x00…’]. You can also pass another array for each topic with options for that topic e.g. [null, [‘option1’, ‘option2’]].
\n
\n
\n
abi - Array (optional): Array containing the ABI for the inputs of the logs received. It will automatically decode the logs using this ABI instead of returning the hexadecimal data.
\n\n
Returns RxJS Observable which will stream the logs. If the inputs ABI is included in the call, the logs will be automatically decoded.
\n"},{"_content":"# apollo-client\nTo use **Subspace** with `apollo-client`, a `ReactiveSchemaLink` from `apollo-link-reactive-schema` must be used with a custom schema.\n\n```js\nimport {InMemoryCache} from \"apollo-cache-inmemory\";\nimport ApolloClient from \"apollo-client\";\nimport {ReactiveSchemaLink} from \"apollo-link-reactive-schema\";\n\nconst schema = makeExecutableSchema({typeDefs, resolvers});\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n\n```\n\n### Example\n\n```js{35-45}\nimport { ApolloClient } from \"apollo-client\";\nimport { InMemoryCache } from \"apollo-cache-inmemory\";\nimport {ReactiveSchemaLink} from \"apollo-link-reactive-schema\";\nimport Subspace from \"@embarklabs/subspace\";\n\n// ...\n\n// Initialize Subspace\nconst subspace = new Subspace(web3);\nawait subspace.init();\n\nconst MyContractInstance = ...; // TODO: obtain a web3.eth.Contract instance\n\nconst typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n`;\n\nconst resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})\n }\n};\n\nconst schema = makeExecutableSchema({ typeDefs, resolvers });\n\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n```\n\n\n
\n
Using Apollo with Subspace
\nA practical example can also be found in examples/react-apollo.\n
","source":"apollo-client.md","raw":"# apollo-client\nTo use **Subspace** with `apollo-client`, a `ReactiveSchemaLink` from `apollo-link-reactive-schema` must be used with a custom schema.\n\n```js\nimport {InMemoryCache} from \"apollo-cache-inmemory\";\nimport ApolloClient from \"apollo-client\";\nimport {ReactiveSchemaLink} from \"apollo-link-reactive-schema\";\n\nconst schema = makeExecutableSchema({typeDefs, resolvers});\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n\n```\n\n### Example\n\n```js{35-45}\nimport { ApolloClient } from \"apollo-client\";\nimport { InMemoryCache } from \"apollo-cache-inmemory\";\nimport {ReactiveSchemaLink} from \"apollo-link-reactive-schema\";\nimport Subspace from \"@embarklabs/subspace\";\n\n// ...\n\n// Initialize Subspace\nconst subspace = new Subspace(web3);\nawait subspace.init();\n\nconst MyContractInstance = ...; // TODO: obtain a web3.eth.Contract instance\n\nconst typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n`;\n\nconst resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})\n }\n};\n\nconst schema = makeExecutableSchema({ typeDefs, resolvers });\n\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n```\n\n\n
\n
Using Apollo with Subspace
\nA practical example can also be found in examples/react-apollo.\n
To use Subspace with apollo-client, a ReactiveSchemaLink from apollo-link-reactive-schema must be used with a custom schema.
\n\n\n
import {InMemoryCache} from "apollo-cache-inmemory";\nimport ApolloClient from "apollo-client";\nimport {ReactiveSchemaLink} from "apollo-link-reactive-schema";\n\nconst schema = makeExecutableSchema({typeDefs, resolvers});\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n
\n\n\n\n
Example
\n\n
import { ApolloClient } from "apollo-client";\nimport { InMemoryCache } from "apollo-cache-inmemory";\nimport {ReactiveSchemaLink} from "apollo-link-reactive-schema";\nimport Subspace from "@embarklabs/subspace";\n\n// ...\n\n// Initialize Subspace\nconst subspace = new Subspace(web3);\nawait subspace.init();\n\nconst MyContractInstance = ...; // TODO: obtain a web3.eth.Contract instance\n\nconst typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n`;\n\nconst resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})\n }\n};\n\nconst schema = makeExecutableSchema({ typeDefs, resolvers });\n\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n
\n\n\n\n
\n
Using Apollo with Subspace
\nA practical example can also be found in examples/react-apollo.\n
","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
apollo-client
To use Subspace with apollo-client, a ReactiveSchemaLink from apollo-link-reactive-schema must be used with a custom schema.
\n\n\n
import {InMemoryCache} from "apollo-cache-inmemory";\nimport ApolloClient from "apollo-client";\nimport {ReactiveSchemaLink} from "apollo-link-reactive-schema";\n\nconst schema = makeExecutableSchema({typeDefs, resolvers});\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n
\n\n\n\n
Example
\n\n
import { ApolloClient } from "apollo-client";\nimport { InMemoryCache } from "apollo-cache-inmemory";\nimport {ReactiveSchemaLink} from "apollo-link-reactive-schema";\nimport Subspace from "@embarklabs/subspace";\n\n// ...\n\n// Initialize Subspace\nconst subspace = new Subspace(web3);\nawait subspace.init();\n\nconst MyContractInstance = ...; // TODO: obtain a web3.eth.Contract instance\n\nconst typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n`;\n\nconst resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', {filter: {}, fromBlock: 1})\n }\n};\n\nconst schema = makeExecutableSchema({ typeDefs, resolvers });\n\nconst client = new ApolloClient({\n cache: new InMemoryCache(),\n link: new ReactiveSchemaLink({schema)})\n});\n
\n\n\n\n
\n
Using Apollo with Subspace
\nA practical example can also be found in examples/react-apollo.\n
"},{"title":"Getting Started","_content":"# Getting Started\n\n## Installation\n**Subspace** can be used in browser, node and native script environments. To get started install the package `@embarklabs/subspace` using `npm` or `yarn` by executing this command in your project directory:\n```bash\n# Using npm\nnpm install --save @embarklabs/subspace\n\n# Using yarn\nyarn add @embarklabs/subspace \n```\n\n## Importing the library\n\n```js\n// ESM (might require babel / browserify)\nimport Subspace from '@embarklabs/subspace'; \n\n// CommonJS\nconst Subspace = require('@embarklabs/subspace'); \n```\n\n\n## Connecting to a web3 provider\nTo interact with the EVM, **Subspace** requires a valid Web3 object, connected to a provider\n\n```js\nconst subspace = new Subspace(web3);\nawait subspace.init();\n```\n\nIn addition to the provider, `Subspace` also accepts an `options` object with settings that can change its behavior:\n- `dbFilename` - Name of the database where the information will be stored (default `'subspace.db'`)\n- `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).\n- `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),\n- `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: `undefined`)\n\n\n## Enhancing your contract objects\nSubspace provides a method to enhance your web3 Contract objects: `subspace.contract(instance|{abi,address})`. Calling this method will return a new contract object decorated with a `.track()` method for your contract view functions and events.\n\n```js\nconst myRxContract = subspace.contract(myContractInstance);\n```\n\nYou can also instantiate a contract directly by passing the contract ABI and its address:\n\n```js\nconst myRXContract = subspace.contract({abi: ...., address: '0x1234...CDEF'})\n```\n\n## Reacting to data\nOnce it's initialized, you can use **Subspace**'s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.\n\n
\n
What is an Observable?
\nThe Observable type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:\n- Compositional: Observables can be composed with higher-order combinators.\n- Lazy: Observables do not start emitting data until an observer has subscribed.\n
\n\n#### Further read\n- [RxJS Observables](https://rxjs-dev.firebaseapp.com/guide/observable)\n\n## Tracking state\nYou can track changes to a contract state variable, by specifying the view function and arguments to call and query the contract. \n```js\nconst stateObservable$ = Contract.methods.functionName(functionArgs).track();\n```\n\n
\n
Tracking the public variables of a contract
\nState variables implicity create a view function when they're defined as public. The functionName would be the same as the variable name, and functionArgs will have a value when the type is a mapping or array (since these require an index value to query them).\n
\n\nExample:\n\n```js\nconst productTitle$ = ProductList.methods.products(0).track().map(\"title\");\nproductTitle$.subscribe((title) => console.log(\"product title is \" + title));\n\n\n// Alternative using Subspace low level API\nconst producTitle$ = subspace.trackProperty(ProductList, \"products\", [0], {from: web3.eth.defaultAccount});\n...\n```\n\nThe subscription will be triggered whenever the title changes\n\n## Tracking events\nYou can track events and react to their returned values.\n```js\nconst eventObservable$ = Contract.event.eventName.track();\n```\n\nExample:\n\n```js\nconst rating$ = Product.events.Rating.track().map(\"rating\")).pipe(map(x => parseInt(x)));\nrating$.subscribe((rating) => console.log(\"rating received: \" + rating));\n\n\n// Alternative using Subspace low level API\nconst rating$ = subspace.trackEvent(Product, \"Rating\", {fromBlock: 0});\n...\n```\n\n**Event Sourcing**\n\nYou can easily do event sourcing with subspace.\n\nFor e.g: if you needed to get the average rating of the last 5 events:\n\n```js\nimport { $average, $latest } from \"@embarklabs/subspace\";\n\nconst rating$ = Product.events.Rating.track().map(\"rating\")).pipe(map(x => parseInt(x)));\n\nrating$.pipe($latest(5), $average()).subscribe((rating) => {\n console.log(\"average rating of the last 5 events is \" + rating)\n});\n```\n\n## Tracking balances\nYou can also track changes in both ETH and ERC20 token balances for each mined block or time interval depending on the `callInterval` configured. \n\nTracking ETH balance in an address:\n\n```js\nconst address = \"0x0001020304050607080900010203040506070809\";\n\nsubspace.trackBalance(address).subscribe((balance) => {\n console.log(\"ETH balance is \", balance)\n});\n```\n\nTracking ETH balance in a Contract:\n\n```js\nContract.trackBalance().subscribe((balance) => {\n console.log(\"ETH balance is \", balance)\n});\n```\n\nTracking an ERC20 balance in a Contract:\n\n```js\nconst tokenAddress = \"0x744d70fdbe2ba4cf95131626614a1763df805b9e\"; // SNT Address\n\nconst myBalanceObservable$ = Contract.trackBalance(tokenAddress);\n```\n\n
\nBalances are returned as a string containing the value in wei.\n
\n\n\n\n## Getting block data, gas prices and block time\nSubspace also provides a way to always receive the latest block object: \n```js\nsubspace.trackBlock().subscribe(block => {\n console.log(\"The latest block data: \", block);\n});\n```\n\nIf you don't need all the block information, but just the block number, you can use instead:\n```js\nsubspace.trackBlockNumber().subscribe(blockNumber => {\n console.log(\"The latest block number: \", blockNumber);\n});\n```\n\nYou can also access the average block time. This takes in account only the last 10 blocks:\n\n```js\nsubspace.trackAverageBlocktime().subscribe(blocktimeMS => {\n console.log(\"The average block time in milliseconds is: \", blocktimeMS);\n});\n```\n\nFinally, if you want to obtain the most up to date median gas price:\n\n```js\nsubspace.trackGasPrice().subscribe(gasPrice => {\n console.log(\"Gas price in wei\", gasPrice);\n});\n```\n\n\n## Subscriptions\nOnce you have an `Observable`, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.\n\nSubscriptions can be disposed by executing the method `unsubscribe()` liberating the resource held by it:\n\n```js\nconst myBalanceObservable$ = subspace.trackBalance(address, tokenAddress);\nconst subscription = myBalanceObservable$.subscribe(value => { \n console.log(\"The balance is: \", value); \n});\n\n// ...\n\nsubscription.unsubscribe();\n```\n\n#### Further read\n- [RxJS Subscriptions](https://rxjs-dev.firebaseapp.com/guide/subscription)\n\n## Cleanup\nIf **Subspace** is not needed anymore, you need can invoke `close()` to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution, thus avoiding any potential memory leak.\n\n```\nsubspace.close();\n```\n
\n
What about subscriptions created with our observables?
\nclose() will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package subsink can be used to clear all the observables' subscriptions at once.\n
\n\n","source":"getting-started.md","raw":"---\ntitle: Getting Started\n---\n# Getting Started\n\n## Installation\n**Subspace** can be used in browser, node and native script environments. To get started install the package `@embarklabs/subspace` using `npm` or `yarn` by executing this command in your project directory:\n```bash\n# Using npm\nnpm install --save @embarklabs/subspace\n\n# Using yarn\nyarn add @embarklabs/subspace \n```\n\n## Importing the library\n\n```js\n// ESM (might require babel / browserify)\nimport Subspace from '@embarklabs/subspace'; \n\n// CommonJS\nconst Subspace = require('@embarklabs/subspace'); \n```\n\n\n## Connecting to a web3 provider\nTo interact with the EVM, **Subspace** requires a valid Web3 object, connected to a provider\n\n```js\nconst subspace = new Subspace(web3);\nawait subspace.init();\n```\n\nIn addition to the provider, `Subspace` also accepts an `options` object with settings that can change its behavior:\n- `dbFilename` - Name of the database where the information will be stored (default `'subspace.db'`)\n- `callInterval` - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It's only used with HttpProviders (default: `undefined`. Obtains data every block using the average block time as an interval).\n- `refreshLastNBlocks` - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),\n- `disableSubscriptions` - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: `undefined`)\n\n\n## Enhancing your contract objects\nSubspace provides a method to enhance your web3 Contract objects: `subspace.contract(instance|{abi,address})`. Calling this method will return a new contract object decorated with a `.track()` method for your contract view functions and events.\n\n```js\nconst myRxContract = subspace.contract(myContractInstance);\n```\n\nYou can also instantiate a contract directly by passing the contract ABI and its address:\n\n```js\nconst myRXContract = subspace.contract({abi: ...., address: '0x1234...CDEF'})\n```\n\n## Reacting to data\nOnce it's initialized, you can use **Subspace**'s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.\n\n
\n
What is an Observable?
\nThe Observable type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:\n- Compositional: Observables can be composed with higher-order combinators.\n- Lazy: Observables do not start emitting data until an observer has subscribed.\n
\n\n#### Further read\n- [RxJS Observables](https://rxjs-dev.firebaseapp.com/guide/observable)\n\n## Tracking state\nYou can track changes to a contract state variable, by specifying the view function and arguments to call and query the contract. \n```js\nconst stateObservable$ = Contract.methods.functionName(functionArgs).track();\n```\n\n
\n
Tracking the public variables of a contract
\nState variables implicity create a view function when they're defined as public. The functionName would be the same as the variable name, and functionArgs will have a value when the type is a mapping or array (since these require an index value to query them).\n
\n\nExample:\n\n```js\nconst productTitle$ = ProductList.methods.products(0).track().map(\"title\");\nproductTitle$.subscribe((title) => console.log(\"product title is \" + title));\n\n\n// Alternative using Subspace low level API\nconst producTitle$ = subspace.trackProperty(ProductList, \"products\", [0], {from: web3.eth.defaultAccount});\n...\n```\n\nThe subscription will be triggered whenever the title changes\n\n## Tracking events\nYou can track events and react to their returned values.\n```js\nconst eventObservable$ = Contract.event.eventName.track();\n```\n\nExample:\n\n```js\nconst rating$ = Product.events.Rating.track().map(\"rating\")).pipe(map(x => parseInt(x)));\nrating$.subscribe((rating) => console.log(\"rating received: \" + rating));\n\n\n// Alternative using Subspace low level API\nconst rating$ = subspace.trackEvent(Product, \"Rating\", {fromBlock: 0});\n...\n```\n\n**Event Sourcing**\n\nYou can easily do event sourcing with subspace.\n\nFor e.g: if you needed to get the average rating of the last 5 events:\n\n```js\nimport { $average, $latest } from \"@embarklabs/subspace\";\n\nconst rating$ = Product.events.Rating.track().map(\"rating\")).pipe(map(x => parseInt(x)));\n\nrating$.pipe($latest(5), $average()).subscribe((rating) => {\n console.log(\"average rating of the last 5 events is \" + rating)\n});\n```\n\n## Tracking balances\nYou can also track changes in both ETH and ERC20 token balances for each mined block or time interval depending on the `callInterval` configured. \n\nTracking ETH balance in an address:\n\n```js\nconst address = \"0x0001020304050607080900010203040506070809\";\n\nsubspace.trackBalance(address).subscribe((balance) => {\n console.log(\"ETH balance is \", balance)\n});\n```\n\nTracking ETH balance in a Contract:\n\n```js\nContract.trackBalance().subscribe((balance) => {\n console.log(\"ETH balance is \", balance)\n});\n```\n\nTracking an ERC20 balance in a Contract:\n\n```js\nconst tokenAddress = \"0x744d70fdbe2ba4cf95131626614a1763df805b9e\"; // SNT Address\n\nconst myBalanceObservable$ = Contract.trackBalance(tokenAddress);\n```\n\n
\nBalances are returned as a string containing the value in wei.\n
\n\n\n\n## Getting block data, gas prices and block time\nSubspace also provides a way to always receive the latest block object: \n```js\nsubspace.trackBlock().subscribe(block => {\n console.log(\"The latest block data: \", block);\n});\n```\n\nIf you don't need all the block information, but just the block number, you can use instead:\n```js\nsubspace.trackBlockNumber().subscribe(blockNumber => {\n console.log(\"The latest block number: \", blockNumber);\n});\n```\n\nYou can also access the average block time. This takes in account only the last 10 blocks:\n\n```js\nsubspace.trackAverageBlocktime().subscribe(blocktimeMS => {\n console.log(\"The average block time in milliseconds is: \", blocktimeMS);\n});\n```\n\nFinally, if you want to obtain the most up to date median gas price:\n\n```js\nsubspace.trackGasPrice().subscribe(gasPrice => {\n console.log(\"Gas price in wei\", gasPrice);\n});\n```\n\n\n## Subscriptions\nOnce you have an `Observable`, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.\n\nSubscriptions can be disposed by executing the method `unsubscribe()` liberating the resource held by it:\n\n```js\nconst myBalanceObservable$ = subspace.trackBalance(address, tokenAddress);\nconst subscription = myBalanceObservable$.subscribe(value => { \n console.log(\"The balance is: \", value); \n});\n\n// ...\n\nsubscription.unsubscribe();\n```\n\n#### Further read\n- [RxJS Subscriptions](https://rxjs-dev.firebaseapp.com/guide/subscription)\n\n## Cleanup\nIf **Subspace** is not needed anymore, you need can invoke `close()` to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by **Subspace** during its normal execution, thus avoiding any potential memory leak.\n\n```\nsubspace.close();\n```\n
\n
What about subscriptions created with our observables?
\nclose() will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package subsink can be used to clear all the observables' subscriptions at once.\n
Subspace can be used in browser, node and native script environments. To get started install the package @embarklabs/subspace using npm or yarn by executing this command in your project directory:
\n\n\n
# Using npm\nnpm install --save @embarklabs/subspace\n\n# Using yarn\nyarn add @embarklabs/subspace \n
To interact with the EVM, Subspace requires a valid Web3 object, connected to a provider
\n\n\n
const subspace = new Subspace(web3);\nawait subspace.init();\n
\n\n\n\n
In addition to the provider, Subspace also accepts an options object with settings that can change its behavior:
\n
\n
dbFilename - Name of the database where the information will be stored (default 'subspace.db')
\n
callInterval - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It’s only used with HttpProviders (default: undefined. Obtains data every block using the average block time as an interval).
\n
refreshLastNBlocks - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
\n
disableSubscriptions - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
\n
\n
Enhancing your contract objects
Subspace provides a method to enhance your web3 Contract objects: subspace.contract(instance|{abi,address}). Calling this method will return a new contract object decorated with a .track() method for your contract view functions and events.
Once it’s initialized, you can use Subspace‘s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.
\n
\n
What is an Observable?
\nThe Observable type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:\n- Compositional: Observables can be composed with higher-order combinators.\n- Lazy: Observables do not start emitting data until an observer has subscribed.\n
\nState variables implicity create a view function when they're defined as public. The functionName would be the same as the variable name, and functionArgs will have a value when the type is a mapping or array (since these require an index value to query them).\n
\n\n
Example:
\n\n\n
const productTitle$ = ProductList.methods.products(0).track().map("title");\nproductTitle$.subscribe((title) => console.log("product title is " + title));\n\n\n// Alternative using Subspace low level API\nconst producTitle$ = subspace.trackProperty(ProductList, "products", [0], {from: web3.eth.defaultAccount});\n...\n
\n\n\n\n
The subscription will be triggered whenever the title changes
\n
Tracking events
You can track events and react to their returned values.
You can also access the average block time. This takes in account only the last 10 blocks:
\n\n\n
subspace.trackAverageBlocktime().subscribe(blocktimeMS => {\n console.log("The average block time in milliseconds is: ", blocktimeMS);\n});\n
\n\n\n\n
Finally, if you want to obtain the most up to date median gas price:
\n\n\n
subspace.trackGasPrice().subscribe(gasPrice => {\n console.log("Gas price in wei", gasPrice);\n});\n
\n\n\n\n
Subscriptions
Once you have an Observable, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.
\n
Subscriptions can be disposed by executing the method unsubscribe() liberating the resource held by it:
If Subspace is not needed anymore, you need can invoke close() to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by Subspace during its normal execution, thus avoiding any potential memory leak.
\n\n\n
subspace.close();\n
\n\n
\n
What about subscriptions created with our observables?
\nclose() will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package subsink can be used to clear all the observables' subscriptions at once.\n
\n\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
Getting Started
Installation
Subspace can be used in browser, node and native script environments. To get started install the package @embarklabs/subspace using npm or yarn by executing this command in your project directory:
\n\n\n
# Using npm\nnpm install --save @embarklabs/subspace\n\n# Using yarn\nyarn add @embarklabs/subspace \n
To interact with the EVM, Subspace requires a valid Web3 object, connected to a provider
\n\n\n
const subspace = new Subspace(web3);\nawait subspace.init();\n
\n\n\n\n
In addition to the provider, Subspace also accepts an options object with settings that can change its behavior:
\n
\n
dbFilename - Name of the database where the information will be stored (default 'subspace.db')
\n
callInterval - Interval of time in milliseconds to query a contract/address to determine changes in state or balance. It’s only used with HttpProviders (default: undefined. Obtains data every block using the average block time as an interval).
\n
refreshLastNBlocks - Ignores last N blocks (from current block), stored in the local db and refresh them via a web3 subscription. Useful for possible reorgs (default: 12),
\n
disableSubscriptions - Subspace by default will attempt to use websocket subscriptions if the current provider supports them, otherwise it will use polling because it asumes the provider is an HttpProvider. This functionality can be disabled by passing true to this option. (default: undefined)
\n
\n
Enhancing your contract objects
Subspace provides a method to enhance your web3 Contract objects: subspace.contract(instance|{abi,address}). Calling this method will return a new contract object decorated with a .track() method for your contract view functions and events.
Once it’s initialized, you can use Subspace‘s methods to track the contract state, events and balances. These functions return RxJS Observables which you can subscribe to, and obtain and transform the observed data via operators.
\n
\n
What is an Observable?
\nThe Observable type can be used to model push-based data sources such as DOM events, timer intervals, and sockets. In addition, observables are:\n- Compositional: Observables can be composed with higher-order combinators.\n- Lazy: Observables do not start emitting data until an observer has subscribed.\n
\nState variables implicity create a view function when they're defined as public. The functionName would be the same as the variable name, and functionArgs will have a value when the type is a mapping or array (since these require an index value to query them).\n
\n\n
Example:
\n\n\n
const productTitle$ = ProductList.methods.products(0).track().map("title");\nproductTitle$.subscribe((title) => console.log("product title is " + title));\n\n\n// Alternative using Subspace low level API\nconst producTitle$ = subspace.trackProperty(ProductList, "products", [0], {from: web3.eth.defaultAccount});\n...\n
\n\n\n\n
The subscription will be triggered whenever the title changes
\n
Tracking events
You can track events and react to their returned values.
You can also access the average block time. This takes in account only the last 10 blocks:
\n\n\n
subspace.trackAverageBlocktime().subscribe(blocktimeMS => {\n console.log("The average block time in milliseconds is: ", blocktimeMS);\n});\n
\n\n\n\n
Finally, if you want to obtain the most up to date median gas price:
\n\n\n
subspace.trackGasPrice().subscribe(gasPrice => {\n console.log("Gas price in wei", gasPrice);\n});\n
\n\n\n\n
Subscriptions
Once you have an Observable, you may receive a stream of data by creating a subscription. Subscriptions are triggered each time an observable emits a new value. These subscription receive a callback that must have a parameter which represents the value received from the observable (a contract state variable, an event, or the balance of an address); and they return an object representing the subscription.
\n
Subscriptions can be disposed by executing the method unsubscribe() liberating the resource held by it:
If Subspace is not needed anymore, you need can invoke close() to dispose and perform the cleanup necessary to remove the internal subscriptions and interval timers created by Subspace during its normal execution, thus avoiding any potential memory leak.
\n\n\n
subspace.close();\n
\n\n
\n
What about subscriptions created with our observables?
\nclose() will dispose any web3 subscription created when using a Subspace tracking method, however any subscription to an observable must still be unsubscribed manually. The npm package subsink can be used to clear all the observables' subscriptions at once.\n
\n\n"},{"_content":"# How it works?\n\n### Setup\n\n1. A ÐApp requests `Subspace` to track an event, property, or balance.\n2. `Subspace` creates a observable for that event, and a web3 subscription to retrieve events from the chain\n3. The ÐApp subscribes to the observable to receive events.\n\n### Receiving events\n\nDepending on the filter parameters used to track the events, once an event is found, it is stored in `localStorage` and it is also pushed to the observable which delivers it to the ÐApp subscription.\n\n### Tracking already known events \nAfter restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of `Subspace` will change: \n\n1. The Dapp will request `Subspace` to track an event it already knows, creating an observable and subscription for that event\n2. It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again. \n\n\nThe web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step\n","source":"how-it-works.md","raw":"# How it works?\n\n### Setup\n\n1. A ÐApp requests `Subspace` to track an event, property, or balance.\n2. `Subspace` creates a observable for that event, and a web3 subscription to retrieve events from the chain\n3. The ÐApp subscribes to the observable to receive events.\n\n### Receiving events\n\nDepending on the filter parameters used to track the events, once an event is found, it is stored in `localStorage` and it is also pushed to the observable which delivers it to the ÐApp subscription.\n\n### Tracking already known events \nAfter restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of `Subspace` will change: \n\n1. The Dapp will request `Subspace` to track an event it already knows, creating an observable and subscription for that event\n2. It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again. \n\n\nThe web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step\n","date":"2020-03-20T17:02:58.892Z","updated":"2020-03-09T15:25:14.948Z","path":"how-it-works.html","_id":"ck7z3hcl400045cbnewgsc9im","title":"","comments":1,"layout":"page","content":"
How it works?
Setup
\n\n
A ÐApp requests Subspace to track an event, property, or balance.
\n
Subspace creates a observable for that event, and a web3 subscription to retrieve events from the chain
\n
The ÐApp subscribes to the observable to receive events.
\n\n
Receiving events
Depending on the filter parameters used to track the events, once an event is found, it is stored in localStorage and it is also pushed to the observable which delivers it to the ÐApp subscription.
\n
Tracking already known events
After restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of Subspace will change:
\n\n
The Dapp will request Subspace to track an event it already knows, creating an observable and subscription for that event
\n
It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again.
\n\n
The web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
How it works?
Setup
\n\n
A ÐApp requests Subspace to track an event, property, or balance.
\n
Subspace creates a observable for that event, and a web3 subscription to retrieve events from the chain
\n
The ÐApp subscribes to the observable to receive events.
\n\n
Receiving events
Depending on the filter parameters used to track the events, once an event is found, it is stored in localStorage and it is also pushed to the observable which delivers it to the ÐApp subscription.
\n
Tracking already known events
After restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of Subspace will change:
\n\n
The Dapp will request Subspace to track an event it already knows, creating an observable and subscription for that event
\n
It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again.
\n\n
The web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step
\n"},{"title":"Homepage","_content":"","source":"index.md","raw":"title: Homepage\n---\n","date":"2020-03-19T18:30:37.775Z","updated":"2020-03-19T18:28:50.738Z","path":"index.html","comments":1,"layout":"page","_id":"ck7z3hcl400055cbn8ipl2hj7","content":"","site":{"data":{}},"excerpt":"","more":""},{"_content":"# reactive-graphql\n\nUsing `reactive-graphql` you can execute GraphQL queries against **Subspace** observables after you create your own type definitions and resolvers.\n\n### Example\n\n\n```js\nconst Subspace = require('@embarklabs/subspace');\nconst MyContract = require('./MyContract');\nconst { pluck } = require('rxjs/operators');\nconst { makeExecutableSchema } = require(\"graphql-tools\");\nconst gql = require(\"graphql-tag\");\nconst { graphql } = require(\"reactive-graphql\");\n\nconst run = async () => {\n const subspace = new Subspace(web3);\n await subspace.init();\n\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const typeDefs = `\n type MyEvent {\n someValue: Int\n anotherValue: String\n }\n type Query {\n myEvents: MyEvent!\n }\n `;\n\n const resolvers = {\n Query: {\n myEvents: () => subspace.trackEvent(MyContractInstance, 'MyEvent', { filter: {}, fromBlock: 1 })\n }\n };\n\n const schema = makeExecutableSchema({ typeDefs, resolvers });\n\n const query = gql`\n query {\n myEvents {\n someValue\n anotherValue\n }\n }\n `;\n\n const stream = graphql(schema, query).pipe(pluck('data', 'myEvents'));\n stream.subscribe(data => {\n console.log(data);\n })\n\n}\n\nrun();\n```\n\n
","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
reactive-graphql
Using reactive-graphql you can execute GraphQL queries against Subspace observables after you create your own type definitions and resolvers.
"},{"_content":"# React\nSubspace also provides a set of components that simplifies its usage within React projects through the `@embarklabs/subspace-react` package.\n\n### Install\nYou can install it through npm or yarn:\n```\nnpm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies\n```\n\n### Usage\n\n#### SubspaceProvider\nTo use most of the `subspace-react` components, you need to wrap your app with the `` component. This will make Subspace available to any nested components that accesses it via the `useSubspace` hook or has been wrapped in the `withSubspace` higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The `SubspaceProvider` requires a web3 object\n\n```js\n// index.js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport MyApp from './MyApp'\nimport { SubspaceProvider } from '@embarklabs/subspace-react';\n\nconst web3 = new Web3(\"ws://localhost:8545\");\n\nconst rootElement = document.getElementById('root')\nReactDOM.render(\n \n \n ,\n rootElement\n);\n```\n\n\n#### useSubspace\nRather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the `useSubspace` hook. Be sure that your entire dApp is wrapped with a `` to have it available througout the component tree.\n```js\n// index.js\nimport React from 'react'\nimport { useSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = () => {\n const subspace = useSubspace();\n\n // do something....\n // subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default MyComponent\n```\n\n\n#### withSubspace\nThis higher order component is provided as an alternative to the `useSubspace` hook. This injects the `subspace` property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a ``.\n\n```js\n// index.js\nimport React from 'react'\nimport { withSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = (props) => {\n // do something....\n // props.subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default withSubspace(MyComponent);\n```\n\n\n#### observe\n\nUseful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.\n\n\n```js\nimport { observe } from '@embarklabs/subspace-react';\n\nconst ObserverComponent = observe(WrappedComponent);\n```\n\n##### Example usage:\n```js\nconst MyComponent = ({eventData}) => {\n // Handle initial state when no data is available\n if (!eventData) {\n return
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address that has been enhanced with subspace.contract(). You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';.\n
\n\n\n
\nTo learn more about how to use subspace-react, there are full working examples available in Github \n
\n","source":"react.md","raw":"# React\nSubspace also provides a set of components that simplifies its usage within React projects through the `@embarklabs/subspace-react` package.\n\n### Install\nYou can install it through npm or yarn:\n```\nnpm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies\n```\n\n### Usage\n\n#### SubspaceProvider\nTo use most of the `subspace-react` components, you need to wrap your app with the `` component. This will make Subspace available to any nested components that accesses it via the `useSubspace` hook or has been wrapped in the `withSubspace` higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The `SubspaceProvider` requires a web3 object\n\n```js\n// index.js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport MyApp from './MyApp'\nimport { SubspaceProvider } from '@embarklabs/subspace-react';\n\nconst web3 = new Web3(\"ws://localhost:8545\");\n\nconst rootElement = document.getElementById('root')\nReactDOM.render(\n \n \n ,\n rootElement\n);\n```\n\n\n#### useSubspace\nRather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the `useSubspace` hook. Be sure that your entire dApp is wrapped with a `` to have it available througout the component tree.\n```js\n// index.js\nimport React from 'react'\nimport { useSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = () => {\n const subspace = useSubspace();\n\n // do something....\n // subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default MyComponent\n```\n\n\n#### withSubspace\nThis higher order component is provided as an alternative to the `useSubspace` hook. This injects the `subspace` property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a ``.\n\n```js\n// index.js\nimport React from 'react'\nimport { withSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = (props) => {\n // do something....\n // props.subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default withSubspace(MyComponent);\n```\n\n\n#### observe\n\nUseful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.\n\n\n```js\nimport { observe } from '@embarklabs/subspace-react';\n\nconst ObserverComponent = observe(WrappedComponent);\n```\n\n##### Example usage:\n```js\nconst MyComponent = ({eventData}) => {\n // Handle initial state when no data is available\n if (!eventData) {\n return
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address that has been enhanced with subspace.contract(). You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';.\n
\n\n\n
\nTo learn more about how to use subspace-react, there are full working examples available in Github \n
Subspace also provides a set of components that simplifies its usage within React projects through the @embarklabs/subspace-react package.
\n
Install
You can install it through npm or yarn:
\n\n\n
npm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies\n
\n\n\n\n
Usage
SubspaceProvider
To use most of the subspace-react components, you need to wrap your app with the <SubspaceProvider web3={web3} /> component. This will make Subspace available to any nested components that accesses it via the useSubspace hook or has been wrapped in the withSubspace higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The SubspaceProvider requires a web3 object
\n\n\n
// index.js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport MyApp from './MyApp'\nimport { SubspaceProvider } from '@embarklabs/subspace-react';\n\nconst web3 = new Web3("ws://localhost:8545");\n\nconst rootElement = document.getElementById('root')\nReactDOM.render(\n <SubspaceProvider web3={web3}>\n <MyApp />\n </SubspaceProvider>,\n rootElement\n);\n
\n\n\n\n
useSubspace
Rather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the useSubspace hook. Be sure that your entire dApp is wrapped with a <SubspaceProvider /> to have it available througout the component tree.
\n\n\n
// index.js\nimport React from 'react'\nimport { useSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = () => {\n const subspace = useSubspace();\n\n // do something....\n // subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default MyComponent\n
\n\n\n\n
withSubspace
This higher order component is provided as an alternative to the useSubspace hook. This injects the subspace property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a <SubspaceProvider />.
\n\n\n
// index.js\nimport React from 'react'\nimport { withSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = (props) => {\n // do something....\n // props.subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default withSubspace(MyComponent);\n
\n\n\n\n
observe
Useful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.
\n\n\n
import { observe } from '@embarklabs/subspace-react';\n\nconst ObserverComponent = observe(WrappedComponent);\n
\n\n\n\n
Example usage:
\n\n
const MyComponent = ({eventData}) => {\n // Handle initial state when no data is available\n if (!eventData) {\n return <p>No data</p>;\n }\n \n return <p>Value: {eventData.someReturnValue}</p>\n};\n\n\nconst MyEnhancedComponent = observe(MyComponent);\n\n\nconst SomeOtherComponent = () => {\n const myObservable$ = MyContractInstance.events.MyEvent.track({fromBlock: 1});\n return <MyEnhancedComponent myProp={myObservable$} />;\n}\n
\n\n\n\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address that has been enhanced with subspace.contract(). You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';.\n
\n\n\n
\nTo learn more about how to use subspace-react, there are full working examples available in Github \n
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
React
Subspace also provides a set of components that simplifies its usage within React projects through the @embarklabs/subspace-react package.
\n
Install
You can install it through npm or yarn:
\n\n\n
npm install --save @embarklabs/subspace-react web3 rxjs # RxJS and Web3.js are needed peer-dependencies\n
\n\n\n\n
Usage
SubspaceProvider
To use most of the subspace-react components, you need to wrap your app with the <SubspaceProvider web3={web3} /> component. This will make Subspace available to any nested components that accesses it via the useSubspace hook or has been wrapped in the withSubspace higher order component. Any React component might use Subspace so it makes sense to add the provider near the top level of your dApp. The SubspaceProvider requires a web3 object
\n\n\n
// index.js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport MyApp from './MyApp'\nimport { SubspaceProvider } from '@embarklabs/subspace-react';\n\nconst web3 = new Web3("ws://localhost:8545");\n\nconst rootElement = document.getElementById('root')\nReactDOM.render(\n <SubspaceProvider web3={web3}>\n <MyApp />\n </SubspaceProvider>,\n rootElement\n);\n
\n\n\n\n
useSubspace
Rather than relying on global variables or passing Subspace through props, The easiest way to access Subspace features is via the useSubspace hook. Be sure that your entire dApp is wrapped with a <SubspaceProvider /> to have it available througout the component tree.
\n\n\n
// index.js\nimport React from 'react'\nimport { useSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = () => {\n const subspace = useSubspace();\n\n // do something....\n // subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default MyComponent\n
\n\n\n\n
withSubspace
This higher order component is provided as an alternative to the useSubspace hook. This injects the subspace property with an already initialized Subspace instance. Just like with the hook, your entire dApp needs to be wrapped with a <SubspaceProvider />.
\n\n\n
// index.js\nimport React from 'react'\nimport { withSubspace } from '@embarklabs/subspace-react';\n\nconst MyComponent = (props) => {\n // do something....\n // props.subspace.trackBalance(web3.eth.defaultAccount);\n\n return ...;\n}\n\nexport default withSubspace(MyComponent);\n
\n\n\n\n
observe
Useful to make your component subscribe to any observable props it receives when the component is mounted and automatically unsubscribes when the component is unmounted. It can be used with any kind of observables.
\n\n\n
import { observe } from '@embarklabs/subspace-react';\n\nconst ObserverComponent = observe(WrappedComponent);\n
\n\n\n\n
Example usage:
\n\n
const MyComponent = ({eventData}) => {\n // Handle initial state when no data is available\n if (!eventData) {\n return <p>No data</p>;\n }\n \n return <p>Value: {eventData.someReturnValue}</p>\n};\n\n\nconst MyEnhancedComponent = observe(MyComponent);\n\n\nconst SomeOtherComponent = () => {\n const myObservable$ = MyContractInstance.events.MyEvent.track({fromBlock: 1});\n return <MyEnhancedComponent myProp={myObservable$} />;\n}\n
\n\n\n\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address that has been enhanced with subspace.contract(). You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';.\n
\n\n\n
\nTo learn more about how to use subspace-react, there are full working examples available in Github \n
\n"},{"_content":"# Integrations with other frameworks\n\n**Subspace** does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate **Subspace** with various frontend frameworks and libraries","source":"integrations-overview.md","raw":"# Integrations with other frameworks\n\n**Subspace** does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate **Subspace** with various frontend frameworks and libraries","date":"2020-03-20T17:02:59.624Z","updated":"2020-03-09T15:25:14.948Z","path":"integrations-overview.html","_id":"ck7z3hcl600085cbn32fk804l","title":"","comments":1,"layout":"page","content":"
Integrations with other frameworks
Subspace does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate Subspace with various frontend frameworks and libraries
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
Integrations with other frameworks
Subspace does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate Subspace with various frontend frameworks and libraries
\n"},{"_content":"# redux \n\n**Subspace** can be used with [redux](https://redux.js.org/). **Subspace** returns [`Observables`](https://rxjs-dev.firebaseapp.com/guide/observable), which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.\n\n### Example\nHere's a simple example on how to setup **Subspace** to work with `redux`:\n\n
\n\n#### index.js\n```js\nimport store from './store';\nimport web3 from './web3';\nimport Subspace from '@embarklabs/subspace';\nimport { myAction } from './actions';\n\nconst run = async () => {\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const subspace = new Subspace(web3);\n await subspace.init();\n \n subspace.trackEvent(MyContractInstance, \"MyEvent\", {filter: {}, fromBlock: 1 })\n .subscribe(eventData => {\n store.dispatch(myAction(eventData));\n });\n}\n\nrun();\n```\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address. You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';, or use web3.js directly (just like in the example source code)\n
\nA practical example can also be found in examples/react-redux.\n
","source":"redux.md","raw":"# redux \n\n**Subspace** can be used with [redux](https://redux.js.org/). **Subspace** returns [`Observables`](https://rxjs-dev.firebaseapp.com/guide/observable), which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.\n\n### Example\nHere's a simple example on how to setup **Subspace** to work with `redux`:\n\n
\n\n#### index.js\n```js\nimport store from './store';\nimport web3 from './web3';\nimport Subspace from '@embarklabs/subspace';\nimport { myAction } from './actions';\n\nconst run = async () => {\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const subspace = new Subspace(web3);\n await subspace.init();\n \n subspace.trackEvent(MyContractInstance, \"MyEvent\", {filter: {}, fromBlock: 1 })\n .subscribe(eventData => {\n store.dispatch(myAction(eventData));\n });\n}\n\nrun();\n```\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address. You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';, or use web3.js directly (just like in the example source code)\n
Subspace can be used with redux. Subspace returns Observables, which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.
\n
Example
Here’s a simple example on how to setup Subspace to work with redux:
import store from './store';\nimport web3 from './web3';\nimport Subspace from '@embarklabs/subspace';\nimport { myAction } from './actions';\n\nconst run = async () => {\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const subspace = new Subspace(web3);\n await subspace.init();\n \n subspace.trackEvent(MyContractInstance, "MyEvent", {filter: {}, fromBlock: 1 })\n .subscribe(eventData => {\n store.dispatch(myAction(eventData));\n });\n}\n\nrun();\n
\n\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address. You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';, or use web3.js directly (just like in the example source code)\n
\n\n
store.js
\n\n
import { createStore } from 'redux';\nimport {myReducer} from './reducer';\n\nexport default store = createStore(myReducer);\n
\nA practical example can also be found in examples/react-redux.\n
","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
redux
Subspace can be used with redux. Subspace returns Observables, which you can subscribe to, and if this subscription has access to the redux store, it will be able to dispatch actions when the observable emits an event.
\n
Example
Here’s a simple example on how to setup Subspace to work with redux:
import store from './store';\nimport web3 from './web3';\nimport Subspace from '@embarklabs/subspace';\nimport { myAction } from './actions';\n\nconst run = async () => {\n const MyContractInstance = ...; // TODO: obtain a web3.eth.contract instance\n\n const subspace = new Subspace(web3);\n await subspace.init();\n \n subspace.trackEvent(MyContractInstance, "MyEvent", {filter: {}, fromBlock: 1 })\n .subscribe(eventData => {\n store.dispatch(myAction(eventData));\n });\n}\n\nrun();\n
\n\n
\n
Handling Contract Objects
\nThe variable MyContractInstance is a web3.eth.Contract object pointing to a deployed contract address. You can use a DApp framework like Embark to easily import that contract instance: import { MyContract } from './embarkArtifacts/contracts';, or use web3.js directly (just like in the example source code)\n
\n\n
store.js
\n\n
import { createStore } from 'redux';\nimport {myReducer} from './reducer';\n\nexport default store = createStore(myReducer);\n
\nA practical example can also be found in examples/react-redux.\n
"},{"_content":"# redux-observable\n\n[redux-observables](https://redux-observable.js.org/) can be used to manage side effects via `Epics` (their core primitive to receive and create stream of actions). **Subspace** can be configured inside these epics. \n\nIt's recommended to compose these epics by using [mergeMap](https://www.learnrxjs.io/operators/transformation/mergemap.html) or [switchMap](https://www.learnrxjs.io/operators/transformation/switchmap.html) operators.\n\nHere's an example on how to use **Subspace** to subscribe to an Event when the action `SOME_ACTION` is dispatched, and then it will trigger `myAction` when the observable emits a value.\n\n```js\n// ...\n\nconst myEpic = action$ =>\n action$.pipe(\n ofType(\"SOME_ACTION\"), // Execute when the action type is 'INIT'\n switchMap(action =>\n subspace\n .trackEvent(MyContract, \"MyEventName\", { filter: {}, fromBlock: 1})\n .pipe(\n map(myAction) // Trigger redux action: MY_ACTION with the eventData\n )\n )\n );\n\n// ...\n```\n\n
\n\n#### Further read\n- [Epics](https://redux-observable.js.org/docs/basics/Epics.html)\n\n","source":"redux-observable.md","raw":"# redux-observable\n\n[redux-observables](https://redux-observable.js.org/) can be used to manage side effects via `Epics` (their core primitive to receive and create stream of actions). **Subspace** can be configured inside these epics. \n\nIt's recommended to compose these epics by using [mergeMap](https://www.learnrxjs.io/operators/transformation/mergemap.html) or [switchMap](https://www.learnrxjs.io/operators/transformation/switchmap.html) operators.\n\nHere's an example on how to use **Subspace** to subscribe to an Event when the action `SOME_ACTION` is dispatched, and then it will trigger `myAction` when the observable emits a value.\n\n```js\n// ...\n\nconst myEpic = action$ =>\n action$.pipe(\n ofType(\"SOME_ACTION\"), // Execute when the action type is 'INIT'\n switchMap(action =>\n subspace\n .trackEvent(MyContract, \"MyEventName\", { filter: {}, fromBlock: 1})\n .pipe(\n map(myAction) // Trigger redux action: MY_ACTION with the eventData\n )\n )\n );\n\n// ...\n```\n\n
\n\n#### Further read\n- [Epics](https://redux-observable.js.org/docs/basics/Epics.html)\n\n","date":"2020-03-20T17:27:19.448Z","updated":"2020-03-20T17:27:19.448Z","path":"redux-observable.html","_id":"ck7z3hcl8000a5cbn6njw8eta","title":"","comments":1,"layout":"page","content":"
redux-observable
redux-observables can be used to manage side effects via Epics (their core primitive to receive and create stream of actions). Subspace can be configured inside these epics.
\n
It’s recommended to compose these epics by using mergeMap or switchMap operators.
\n
Here’s an example on how to use Subspace to subscribe to an Event when the action SOME_ACTION is dispatched, and then it will trigger myAction when the observable emits a value.
\n\n\n
// ...\n\nconst myEpic = action$ =>\n action$.pipe(\n ofType("SOME_ACTION"), // Execute when the action type is 'INIT'\n switchMap(action =>\n subspace\n .trackEvent(MyContract, "MyEventName", { filter: {}, fromBlock: 1})\n .pipe(\n map(myAction) // Trigger redux action: MY_ACTION with the eventData\n )\n )\n );\n\n// ...\n
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
redux-observable
redux-observables can be used to manage side effects via Epics (their core primitive to receive and create stream of actions). Subspace can be configured inside these epics.
\n
It’s recommended to compose these epics by using mergeMap or switchMap operators.
\n
Here’s an example on how to use Subspace to subscribe to an Event when the action SOME_ACTION is dispatched, and then it will trigger myAction when the observable emits a value.
\n\n\n
// ...\n\nconst myEpic = action$ =>\n action$.pipe(\n ofType("SOME_ACTION"), // Execute when the action type is 'INIT'\n switchMap(action =>\n subspace\n .trackEvent(MyContract, "MyEventName", { filter: {}, fromBlock: 1})\n .pipe(\n map(myAction) // Trigger redux action: MY_ACTION with the eventData\n )\n )\n );\n\n// ...\n
\n"},{"_content":"# Creating a reactive ÐApp with React and Subspace\n\nSee example DApp at [https://github.com/embark-framework/subspace/tree/master/examples/react-example1](https://github.com/embark-framework/subspace/tree/master/examples/react-example1)\n\n","source":"tutorial.md","raw":"# Creating a reactive ÐApp with React and Subspace\n\nSee example DApp at [https://github.com/embark-framework/subspace/tree/master/examples/react-example1](https://github.com/embark-framework/subspace/tree/master/examples/react-example1)\n\n","date":"2020-03-20T17:03:03.488Z","updated":"2020-03-09T15:25:14.948Z","path":"tutorial.html","_id":"ck7z3hcl8000b5cbn9b5ccrit","title":"","comments":1,"layout":"page","content":"
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
\n"},{"home":true,"heroImage":"/assets/img/logo.svg","heroText":" ","actionText":"Get Started","actionLink":"/getting-started/","footer":"MIT Licensed | Subspace is part of the Status Network","features":[{"title":"Automatic Syncing","details":"Subspace takes care of syncing under the hood, syncing exactly what you need when you need it. It saves the state to a local database ensuring the DApp always syncs from the last known point even after reloading the DApp."},{"title":"Reactive","details":"Subspace embraces reactive programming with RxJS. It provides methods to track and subscribe to events, contract state & balances, and react to changes via observables."},{"title":"Framework Agnostic","details":"Subspace is framework agnostic and integrates well with your favourite frameworks, from React to Angular. It works in the browser and in nodejs."}],"_content":"\n---\n\n\n","source":"readme.md","raw":"---\nhome: true\nheroImage: /assets/img/logo.svg\nheroText: \" \"\nactionText: Get Started\nactionLink: /getting-started/\nfooter: MIT Licensed | Subspace is part of the Status Network \nfeatures:\n- title: Automatic Syncing\n details: Subspace takes care of syncing under the hood, syncing exactly what you need when you need it. It saves the state to a local database ensuring the DApp always syncs from the last known point even after reloading the DApp.\n- title: Reactive\n details: Subspace embraces reactive programming with RxJS. It provides methods to track and subscribe to events, contract state & balances, and react to changes via observables.\n- title: Framework Agnostic\n details: Subspace is framework agnostic and integrates well with your favourite frameworks, from React to Angular. It works in the browser and in nodejs.\n\n---\n\n---\n\n\n","date":"2020-03-20T17:03:01.692Z","updated":"2020-03-09T15:25:14.948Z","path":"readme.html","_id":"ck7z3hcl9000c5cbnenkva87k","title":"","comments":1,"layout":"page","content":"\n\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"\n\n"},{"_content":"# Vue\nVue provides the official npm package `vue-rx` that provides RxJS integration, which simplifies the use of Subspace with Vue.js\n\n### Example\n\n
\n\n\n\n```\n\n\n\n#### Further read\n- [vue-rx](https://www.npmjs.com/package/vue-rx)\n","source":"vue.md","raw":"# Vue\nVue provides the official npm package `vue-rx` that provides RxJS integration, which simplifies the use of Subspace with Vue.js\n\n### Example\n\n
\n\n\n\n```\n\n\n\n#### Further read\n- [vue-rx](https://www.npmjs.com/package/vue-rx)\n","date":"2020-03-20T17:22:12.780Z","updated":"2020-03-20T17:22:12.780Z","path":"vue.html","_id":"ck7z3hcla000d5cbnbcbx0pk7","title":"","comments":1,"layout":"page","content":"
Vue
Vue provides the official npm package vue-rx that provides RxJS integration, which simplifies the use of Subspace with Vue.js
\n","site":{"data":{"sidebar":{"docs":[{"title":"How it works","path":"how-it-works.html"},{"title":"Getting Started","path":"getting-started.html","children":[{"title":"Installation","path":"#Installation"},{"title":"Importing the library","path":"#Importing-the-library"},{"title":"Connecting to a web3 provider","path":"#Connecting-to-a-web3-provider"},{"title":"Enhancing your contract objects","path":"#Enhancing-your-contract-objects"},{"title":"Reacting to data","path":"#Reacting-to-data"},{"title":"Tracking state","path":"#Tracking-state"},{"title":"Tracking events","path":"#Tracking-events"},{"title":"Tracking balances","path":"#Tracking-balances"},{"title":"Getting block data, gas prices and block time","path":"#Getting-block-data-gas-prices-and-block-time"},{"title":"Subscriptions","path":"#Subscriptions"},{"title":"Cleanup","path":"#Cleanup"}]},{"title":"Integrations","path":"empty","children":[{"title":"Overview","path":"integrations-overview.html"},{"title":"React","path":"react.html"},{"title":"Vue","path":"vue.html"},{"title":"Redux","path":"empty","children":[{"title":"redux","path":"redux.html"},{"title":"redux-observable","path":"redux-observable.html"}]},{"title":"reactive-graphql","path":"reactive-graphql.html"},{"title":"apollo-client","path":"apollo-client.html"}]},{"title":"Tutorial","path":"tutorial.html"},{"title":"API","path":"api.html","children":[{"title":"General","path":"#general"},{"title":"Contract methods","path":"#Contract-methods"},{"title":"Blocks, gas price and block time","path":"#Blocks-gas-price-and-block-time"},{"title":"Low level API for data tracking","path":"#Low-level-API-for-data-tracking"}]}]}}},"excerpt":"","more":"
Vue
Vue provides the official npm package vue-rx that provides RxJS integration, which simplifies the use of Subspace with Vue.js
\n"}],"Post":[{"title":"Hello World","_content":"Welcome to [Hexo](https://hexo.io/)! This is your very first post. Check [documentation](https://hexo.io/docs/) for more info. If you get any problems when using Hexo, you can find the answer in [troubleshooting](https://hexo.io/docs/troubleshooting.html) or you can ask me on [GitHub](https://github.com/hexojs/hexo/issues).\n\n## Quick Start\n\n### Create a new post\n\n``` bash\n$ hexo new \"My New Post\"\n```\n\nMore info: [Writing](https://hexo.io/docs/writing.html)\n\n### Run server\n\n``` bash\n$ hexo server\n```\n\nMore info: [Server](https://hexo.io/docs/server.html)\n\n### Generate static files\n\n``` bash\n$ hexo generate\n```\n\nMore info: [Generating](https://hexo.io/docs/generating.html)\n\n### Deploy to remote sites\n\n``` bash\n$ hexo deploy\n```\n\nMore info: [Deployment](https://hexo.io/docs/one-command-deployment.html)\n","source":"_posts/hello-world.md","raw":"---\ntitle: Hello World\n---\nWelcome to [Hexo](https://hexo.io/)! This is your very first post. Check [documentation](https://hexo.io/docs/) for more info. If you get any problems when using Hexo, you can find the answer in [troubleshooting](https://hexo.io/docs/troubleshooting.html) or you can ask me on [GitHub](https://github.com/hexojs/hexo/issues).\n\n## Quick Start\n\n### Create a new post\n\n``` bash\n$ hexo new \"My New Post\"\n```\n\nMore info: [Writing](https://hexo.io/docs/writing.html)\n\n### Run server\n\n``` bash\n$ hexo server\n```\n\nMore info: [Server](https://hexo.io/docs/server.html)\n\n### Generate static files\n\n``` bash\n$ hexo generate\n```\n\nMore info: [Generating](https://hexo.io/docs/generating.html)\n\n### Deploy to remote sites\n\n``` bash\n$ hexo deploy\n```\n\nMore info: [Deployment](https://hexo.io/docs/one-command-deployment.html)\n","slug":"hello-world","published":1,"date":"2020-03-19T18:28:50.730Z","updated":"2020-03-19T18:28:50.730Z","comments":1,"layout":"post","photos":[],"link":"","_id":"ck7z3ielc00008pbn2mijc29u","content":"
Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.
Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.
\n"}],"PostAsset":[],"PostCategory":[],"PostTag":[],"Tag":[]}}
\ No newline at end of file
diff --git a/packages/site/package.json b/packages/site/package.json
deleted file mode 100644
index 1eed260..0000000
--- a/packages/site/package.json
+++ /dev/null
@@ -1,52 +0,0 @@
-{
- "name": "subspace-docs",
- "version": "0.0.1",
- "description": "Subspace Website",
- "main": "index.js",
- "repository": {
- "type": "git",
- "url": "git+https://github.com/embarklabs/subspace-docs.git"
- },
- "license": "MIT",
- "bugs": {
- "url": "https://github.com/embarklabs/subspace-docs/issues"
- },
- "author": "Status Research & Development GMBH",
- "authors": [
- {
- "name": "Iuri Matias",
- "email": "iuri.matias@gmail.com",
- "homepage": "https://github.com/iurimatias"
- },
- {
- "name": "Richard Ramos",
- "email": "info@richardramos.me",
- "homepage": "https://github.com/richard-ramos"
- }
- ],
- "homepage": "https://github.com/embarklabs/subspace-docs#readme",
- "scripts": {
- "build": "hexo generate",
- "clean": "hexo clean",
- "deploy": "hexo deploy",
- "server": "hexo server"
- },
- "hexo": {
- "version": "4.2.0"
- },
- "dependencies": {
- "hexo": "^4.0.0",
- "hexo-autoprefixer": "^2.0.0",
- "hexo-generator-archive": "^1.0.0",
- "hexo-generator-category": "^1.0.0",
- "hexo-generator-i18n": "^0.0.7",
- "hexo-generator-index": "^1.0.0",
- "hexo-generator-tag": "^1.0.0",
- "hexo-prism-plus": "^1.1.0",
- "hexo-renderer-ejs": "^1.0.0",
- "hexo-renderer-marked": "^2.0.0",
- "hexo-renderer-sass": "^0.4.0",
- "hexo-renderer-stylus": "^1.1.0",
- "hexo-server": "^1.0.0"
- }
-}
diff --git a/packages/site/source/packages/docs/CNAME b/packages/site/source/packages/docs/CNAME
deleted file mode 100644
index c212bfc..0000000
--- a/packages/site/source/packages/docs/CNAME
+++ /dev/null
@@ -1 +0,0 @@
-subspace.status.im
diff --git a/packages/site/source/packages/docs/d1.png b/packages/site/source/packages/docs/d1.png
deleted file mode 100644
index 592cf75..0000000
Binary files a/packages/site/source/packages/docs/d1.png and /dev/null differ
diff --git a/packages/site/source/packages/docs/d2.png b/packages/site/source/packages/docs/d2.png
deleted file mode 100644
index 7062ff4..0000000
Binary files a/packages/site/source/packages/docs/d2.png and /dev/null differ
diff --git a/packages/site/source/packages/docs/d3.png b/packages/site/source/packages/docs/d3.png
deleted file mode 100644
index ceba120..0000000
Binary files a/packages/site/source/packages/docs/d3.png and /dev/null differ
diff --git a/packages/site/source/packages/docs/d4.png b/packages/site/source/packages/docs/d4.png
deleted file mode 100644
index 2f02b54..0000000
Binary files a/packages/site/source/packages/docs/d4.png and /dev/null differ
diff --git a/packages/site/source/packages/docs/how-it-works.md b/packages/site/source/packages/docs/how-it-works.md
deleted file mode 100644
index 8ba3d5f..0000000
--- a/packages/site/source/packages/docs/how-it-works.md
+++ /dev/null
@@ -1,20 +0,0 @@
-# How it works?
-
-### Setup
-
-1. A ÐApp requests `Subspace` to track an event, property, or balance.
-2. `Subspace` creates a observable for that event, and a web3 subscription to retrieve events from the chain
-3. The ÐApp subscribes to the observable to receive events.
-
-### Receiving events
-
-Depending on the filter parameters used to track the events, once an event is found, it is stored in `localStorage` and it is also pushed to the observable which delivers it to the ÐApp subscription.
-
-### Tracking already known events
-After restarting the ÐApp, either by executing it again in case of a console application or refreshing the browser the behavior of `Subspace` will change:
-
-1. The Dapp will request `Subspace` to track an event it already knows, creating an observable and subscription for that event
-2. It will retrieve events that were previously stored in localStorage and deliver them to the DApp subscription, avoiding having to query the chain for the old events again.
-
-
-The web3 subscription created previously will start from the last known block instead of beginning from scratch. New events will be delivered normally from this step
diff --git a/packages/site/source/packages/docs/integrations-overview.md b/packages/site/source/packages/docs/integrations-overview.md
deleted file mode 100644
index 1d99a87..0000000
--- a/packages/site/source/packages/docs/integrations-overview.md
+++ /dev/null
@@ -1,3 +0,0 @@
-# Integrations with other frameworks
-
-**Subspace** does not force you to change the architecture of your dApps, making it easy to use on existing projects. In this section you can find some examples and tips on how to integrate **Subspace** with various frontend frameworks and libraries
\ No newline at end of file
diff --git a/packages/site/source/packages/docs/readme.md b/packages/site/source/packages/docs/readme.md
deleted file mode 100644
index c6df058..0000000
--- a/packages/site/source/packages/docs/readme.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-home: true
-heroImage: /assets/img/logo.svg
-heroText: " "
-actionText: Get Started
-actionLink: /getting-started/
-footer: MIT Licensed | Subspace is part of the Status Network
-features:
-- title: Automatic Syncing
- details: Subspace takes care of syncing under the hood, syncing exactly what you need when you need it. It saves the state to a local database ensuring the DApp always syncs from the last known point even after reloading the DApp.
-- title: Reactive
- details: Subspace embraces reactive programming with RxJS. It provides methods to track and subscribe to events, contract state & balances, and react to changes via observables.
-- title: Framework Agnostic
- details: Subspace is framework agnostic and integrates well with your favourite frameworks, from React to Angular. It works in the browser and in nodejs.
-
----
-
----
-
-
diff --git a/packages/site/source/packages/docs/tutorial.md b/packages/site/source/packages/docs/tutorial.md
deleted file mode 100644
index 53888ce..0000000
--- a/packages/site/source/packages/docs/tutorial.md
+++ /dev/null
@@ -1,4 +0,0 @@
-# Creating a reactive ÐApp with React and Subspace
-
-See example DApp at [https://github.com/embark-framework/subspace/tree/master/examples/react-example1](https://github.com/embark-framework/subspace/tree/master/examples/react-example1)
-
![\"First](\"./d1.png\")
![\"First](\"./d2.png\")
![\"Second](\"./d3.png\")
![\"Second](\"./d4.png\")