View EXAMPLES.md

Examples

Please note that WETH and ETH will be used interchangeably in the following discussion.

The b0x network allows anyone with ERC20 tokens to loan it out for interest on a margin trading platform.

Example 1: Alice holds a lot of ETH tokens and instead of letting it sit, she wants to lend it to traders who are looking to borrow money so that they can trade on margin. Alice creates a b0x order specifying the type of token she is lending out (i.e. loanToken) and the type of token that she wants the interest to be paid in (i.e. interestToken).

The lender can specify the specific margin amounts that the borrower must have in order to fill the order and maintain the loan.

View Navbar.jsx
import React from "react";
import styled from "styled-components";
const Container = styled.nav`
background: darkred;
/* make this a fixed navbar at the top, with fixed height */
position: fixed;
top: 0;
right: 0;
View bootstrap_grail.jsx
import React from "react";
import styled from "styled-components";
const Container = styled.div`
/* make it full height and width */
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
View UserIsTypingIndicator.js
import React from "react";
import styled, { keyframes } from "styled-components";
import { Subject } from "rxjs/Subject";
import "rxjs/add/operator/do"
import "rxjs/add/operator/debounceTime"
const rotate360 = keyframes`
from {
transform: rotate(0deg);
}
View Spinner.js
import styled, { keyframes } from "styled-components";
const rotate360 = keyframes`
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
View withWeb3Usage.js
import React from 'react'
import withWeb3 from './withWeb3'
const MyComponent = ({ web3 }) =>
<div>
<h1>My Dapp</h1>
<pre>{JSON.stringify(web3, null, 4)}</pre>
</div>
export default withWeb3(MyComponent)
View getWeb3.js
import Web3 from 'web3'
const resolveWeb3 = (resolve) => {
let { web3 } = window
const alreadyInjected = typeof web3 !== 'undefined' // i.e. Mist/Metamask
const localProvider = `http://localhost:9545`
if (alreadyInjected) {
console.log(`Injected web3 detected.`)
web3 = new Web3(web3.currentProvider)
View withWeb3.js
import React from 'react'
import getWeb3 from './getWeb3'
const withWeb3 = PassedComponent => class extends React.Component {
state = { web3: null }
async componentDidMount () {
try {
const web3 = await getWeb3()
this.setState({ web3 })
View getWeb3.js
import Web3 from 'web3'
const resolveWeb3 = (resolve) => {
let { web3 } = window
const alreadyInjected = typeof web3 !== 'undefined' // i.e. Mist/Metamask
if (alreadyInjected) {
web3 = new Web3(web3.currentProvider)
console.log(`Injected web3 detected.`)
resolve(web3)
View dapp.js
import React from 'react'
import withWeb3 from '../lib/withWeb3'
// Demonstration of a basic dapp with the withWeb3 higher-order component
class Dapp extends React.Component {
state = { balance: null }
storeValue = async () => {
const { accounts, contract } = this.props
const response = await contract.set(5, { from: accounts[0] })