This commit is contained in:
Daniel Ternyak 2017-06-19 00:39:07 -05:00
parent f32a2d6631
commit 67a5eee0a9
6 changed files with 373 additions and 316 deletions

View File

@ -3,42 +3,38 @@ export const SWAP_DESTINATION_KIND = 'SWAP_DESTINATION_KIND';
export const SWAP_ORIGIN_AMOUNT = 'SWAP_ORIGIN_AMOUNT';
export const SWAP_DESTINATION_AMOUNT = 'SWAP_DESTINATION_AMOUNT';
export const SWAP_UPDATE_BITY_RATES = 'SWAP_UPDATE_BITY_RATES';
export const SWAP_DESTINATION_KIND_OPTIONS = 'SWAP_DESTINATION_KIND_OPTIONS'
export const SWAP_ORIGIN_KIND_TO = (value) => {
return {
type: SWAP_ORIGIN_KIND,
value
};
export const SWAP_ORIGIN_KIND_TO = value => {
return {
type: SWAP_ORIGIN_KIND,
value
};
};
export const SWAP_DESTINATION_KIND_TO = (value) => {
return {
type: SWAP_DESTINATION_KIND,
value
}
export const SWAP_DESTINATION_KIND_TO = value => {
return {
type: SWAP_DESTINATION_KIND,
value
};
};
export const SWAP_ORIGIN_AMOUNT_TO = (value) => {
return {
type: SWAP_ORIGIN_AMOUNT,
value
};
export const SWAP_ORIGIN_AMOUNT_TO = value => {
return {
type: SWAP_ORIGIN_AMOUNT,
value
};
};
export const SWAP_DESTINATION_AMOUNT_TO = (value) => {
return {
type: SWAP_DESTINATION_AMOUNT,
value
}
export const SWAP_DESTINATION_AMOUNT_TO = value => {
return {
type: SWAP_DESTINATION_AMOUNT,
value
};
};
export const SWAP_UPDATE_BITY_RATES_TO = (value) => {
return {
type: SWAP_UPDATE_BITY_RATES,
value
}
export const SWAP_UPDATE_BITY_RATES_TO = value => {
return {
type: SWAP_UPDATE_BITY_RATES,
value
};
};

View File

@ -3,62 +3,60 @@ import bityConfig from 'config/bity';
// https://stackoverflow.com/questions/9828684/how-to-get-all-arguments-of-a-callback-function
export function combineAndUpper() {
const args = [];
let newString = '';
for (let i = 0; i < arguments.length; ++i) args[i] = arguments[i];
args.forEach((each) => {
newString = newString.concat(each.toUpperCase())
});
return newString
const args = [];
let newString = '';
for (let i = 0; i < arguments.length; ++i) args[i] = arguments[i];
args.forEach(each => {
newString = newString.concat(each.toUpperCase());
});
return newString;
}
export default class Bity {
findRateFromBityRateList(rateObjects, pairName) {
return rateObjects.find(x => x.pair === pairName);
}
findRateFromBityRateList(rateObjects, pairName) {
return rateObjects.find(x => x.pair === pairName);
}
_getRate(bityRates, origin, destination) {
const pairName = combineAndUpper(origin, destination);
const rateObjects = bityRates.data.objects;
return this.findRateFromBityRateList(rateObjects, pairName);
}
_getRate(bityRates, origin, destination) {
const pairName = combineAndUpper(origin, destination);
const rateObjects = bityRates.data.objects;
return this.findRateFromBityRateList(rateObjects, pairName);
}
/**
/**
* Gives you multiple rates from Bitys API without making multiple API calls
* @param arrayOfOriginAndDestinationDicts - [{origin: 'BTC', destination: 'ETH'}, {origin: 'BTC', destination: 'REP}]
*/
getMultipleRates(arrayOfOriginAndDestinationDicts) {
const mappedRates = {};
return this.requestAllRates()
.then((bityRates) => {
arrayOfOriginAndDestinationDicts.forEach((each) => {
const origin = each.origin;
const destination = each.destination;
const pairName = combineAndUpper(origin, destination);
const rate = this._getRate(bityRates, origin, destination);
mappedRates[pairName] = parseFloat(rate.rate_we_sell)
});
return mappedRates
})
// TODO - catch errors
}
getMultipleRates(arrayOfOriginAndDestinationDicts) {
const mappedRates = {};
return this.requestAllRates().then(bityRates => {
arrayOfOriginAndDestinationDicts.forEach(each => {
const origin = each.origin;
const destination = each.destination;
const pairName = combineAndUpper(origin, destination);
const rate = this._getRate(bityRates, origin, destination);
mappedRates[pairName] = parseFloat(rate.rate_we_sell);
});
return mappedRates;
});
// TODO - catch errors
}
getAllRates() {
const mappedRates = {};
return this.requestAllRates()
.then((bityRates) => {
bityRates.data.objects.forEach((each) => {
const pairName = each.pair;
mappedRates[pairName] = parseFloat(each.rate_we_sell)
});
return mappedRates
})
// TODO - catch errors
}
getAllRates() {
const mappedRates = {};
return this.requestAllRates().then(bityRates => {
bityRates.data.objects.forEach(each => {
const pairName = each.pair;
mappedRates[pairName] = parseFloat(each.rate_we_sell);
});
return mappedRates;
});
// TODO - catch errors
}
requestAllRates() {
const path = '/v1/rate2/';
const bityURL = bityConfig.bityAPI + path;
return axios.get(bityURL)
}
requestAllRates() {
const path = '/v1/rate2/';
const bityURL = bityConfig.bityAPI + path;
return axios.get(bityURL);
}
}

View File

@ -1,18 +1,18 @@
export default {
SERVERURL: 'https://myetherapi.com',
bityAPI: 'https://bity.com/api',
decimals: 6,
ethExplorer: 'https://etherscan.io/tx/[[txHash]]',
btcExplorer: 'https://blockchain.info/tx/[[txHash]]',
validStatus: ['RCVE', 'FILL', 'CONF', 'EXEC'],
invalidStatus: ['CANC'],
mainPairs: ['REP', 'ETH'],
min: 0.01,
max: 3,
priceLoaded: false,
postConfig: {
headers: {
'Content-Type': 'application/json; charse:UTF-8'
}
SERVERURL: 'https://myetherapi.com',
bityAPI: 'https://bity.com/api',
decimals: 6,
ethExplorer: 'https://etherscan.io/tx/[[txHash]]',
btcExplorer: 'https://blockchain.info/tx/[[txHash]]',
validStatus: ['RCVE', 'FILL', 'CONF', 'EXEC'],
invalidStatus: ['CANC'],
mainPairs: ['REP', 'ETH'],
min: 0.01,
max: 3,
priceLoaded: false,
postConfig: {
headers: {
'Content-Type': 'application/json; charse:UTF-8'
}
}
}
};

View File

@ -1,73 +1,117 @@
import React, {Component} from 'react';
import React, { Component } from 'react';
import translate from 'translations';
import PropTypes from 'prop-types';
export default class CurrentRates extends Component {
constructor(props) {
super(props);
this.state = {
ETHBTCAmount: 1,
ETHREPAmount: 1,
BTCETHAmount: 1,
BTCREPAmount: 1
}
}
static propTypes = {
ETHBTC: PropTypes.number,
ETHREP: PropTypes.number,
BTCETH: PropTypes.number,
BTCREP: PropTypes.number
constructor(props) {
super(props);
this.state = {
ETHBTCAmount: 1,
ETHREPAmount: 1,
BTCETHAmount: 1,
BTCREPAmount: 1
};
}
onChange = (event) => {
const target = event.target;
const value = target.value;
const name = target.name;
this.setState({
[name]: value
});
};
static propTypes = {
ETHBTC: PropTypes.number,
ETHREP: PropTypes.number,
BTCETH: PropTypes.number,
BTCREP: PropTypes.number
};
// TODO - A little code duplication here, but simple enough to where it doesn't seem worth the time to fix.
render() {
return (
<article className="swap-rates">
<section className="row">
<h5 className="col-xs-6 col-xs-offset-3">{translate('SWAP_rates')}</h5>
</section>
<section className="row order-panel">
<div className="col-sm-6 order-info">
<p className="mono">
<input className="form-control input-sm" onChange={this.onChange}
value={this.state.ETHBTCAmount} name="ETHBTCAmount"/>
<span>ETH = {(this.state.ETHBTCAmount * this.props.ETHBTC).toFixed(6)} BTC</span>
</p>
<p className="mono">
<input className="form-control input-sm" onChange={this.onChange}
value={this.state.ETHREPAmount} name="ETHREPAmount"/>
<span>ETH = {(this.state.ETHREPAmount * this.props.ETHREP).toFixed(6)} REP</span>
</p>
</div>
<div className="col-sm-6 order-info">
<p className="mono">
<input className="form-control input-sm" onChange={this.onChange}
value={this.state.BTCETHAmount} name="BTCETHAmount"/>
<span>BTC = {(this.state.BTCETHAmount * this.props.BTCETH).toFixed(6)} ETH</span>
</p>
<p className="mono">
<input className="form-control input-sm" onChange={this.onChange}
value={this.state.BTCREPAmount} name="BTCREPAmount"/>
<span>BTC = {(this.state.BTCREPAmount * this.props.BTCREP).toFixed(6)} REP</span>
</p>
</div>
<a className="link bity-logo" href="https://bity.com/af/jshkb37v" target="_blank">
<img src={'https://www.myetherwallet.com/images/logo-bity-white.svg'}
width={120} height={49}/>
</a>
</section>
</article>
)
}
onChange = event => {
const target = event.target;
const value = target.value;
const name = target.name;
this.setState({
[name]: value
});
};
// TODO - A little code duplication here, but simple enough to where it doesn't seem worth the time to fix.
render() {
return (
<article className="swap-rates">
<section className="row">
<h5 className="col-xs-6 col-xs-offset-3">
{translate('SWAP_rates')}
</h5>
</section>
<section className="row order-panel">
<div className="col-sm-6 order-info">
<p className="mono">
<input
className="form-control input-sm"
onChange={this.onChange}
value={this.state.ETHBTCAmount}
name="ETHBTCAmount"
/>
<span>
ETH = {(this.state.ETHBTCAmount * this.props.ETHBTC).toFixed(
6
)}{' '}
BTC
</span>
</p>
<p className="mono">
<input
className="form-control input-sm"
onChange={this.onChange}
value={this.state.ETHREPAmount}
name="ETHREPAmount"
/>
<span>
ETH = {(this.state.ETHREPAmount * this.props.ETHREP).toFixed(
6
)}{' '}
REP
</span>
</p>
</div>
<div className="col-sm-6 order-info">
<p className="mono">
<input
className="form-control input-sm"
onChange={this.onChange}
value={this.state.BTCETHAmount}
name="BTCETHAmount"
/>
<span>
BTC = {(this.state.BTCETHAmount * this.props.BTCETH).toFixed(
6
)}{' '}
ETH
</span>
</p>
<p className="mono">
<input
className="form-control input-sm"
onChange={this.onChange}
value={this.state.BTCREPAmount}
name="BTCREPAmount"
/>
<span>
BTC = {(this.state.BTCREPAmount * this.props.BTCREP).toFixed(
6
)}{' '}
REP
</span>
</p>
</div>
<a
className="link bity-logo"
href="https://bity.com/af/jshkb37v"
target="_blank"
>
<img
src={'https://www.myetherwallet.com/images/logo-bity-white.svg'}
width={120}
height={49}
/>
</a>
</section>
</article>
);
}
}

View File

@ -1,130 +1,141 @@
import React, {Component} from 'react';
import React, { Component } from 'react';
import WantToSwapMy from './components/wantToSwapMy';
import CurrentRates from './components/currentRates';
import {connect} from 'react-redux';
import { connect } from 'react-redux';
import {
SWAP_DESTINATION_AMOUNT_TO,
SWAP_DESTINATION_KIND_TO,
SWAP_ORIGIN_AMOUNT_TO,
SWAP_ORIGIN_KIND_AND_DESTINATION_KIND_AND_DESTINATION_OPTIONS_TO,
SWAP_ORIGIN_KIND_TO,
SWAP_UPDATE_BITY_RATES_TO
SWAP_DESTINATION_AMOUNT_TO,
SWAP_DESTINATION_KIND_TO,
SWAP_ORIGIN_AMOUNT_TO,
SWAP_ORIGIN_KIND_AND_DESTINATION_KIND_AND_DESTINATION_OPTIONS_TO,
SWAP_ORIGIN_KIND_TO,
SWAP_UPDATE_BITY_RATES_TO
} from 'actions/swap';
import PropTypes from 'prop-types';
import Bity from 'api/bity';
class Swap extends Component {
constructor(props) {
super(props);
this.bity = new Bity();
}
constructor(props) {
super(props);
this.bity = new Bity();
}
static propTypes = {
bityRates: PropTypes.any,
originAmount: PropTypes.any,
destinationAmount: PropTypes.any,
originKind: PropTypes.string,
destinationKind: PropTypes.string,
destinationKindOptions: PropTypes.array,
originKindOptions: PropTypes.array,
swapOriginKindTo: PropTypes.func,
swapDestinationKindTo: PropTypes.func,
swapOriginAmountTo: PropTypes.func,
swapDestinationAmountTo: PropTypes.func,
swapUpdateBityRatesTo: PropTypes.func,
swapOriginKindAndDestinationKindAndDestinationOptionsTo: PropTypes.func
static propTypes = {
bityRates: PropTypes.any,
originAmount: PropTypes.any,
destinationAmount: PropTypes.any,
originKind: PropTypes.string,
destinationKind: PropTypes.string,
destinationKindOptions: PropTypes.array,
originKindOptions: PropTypes.array,
swapOriginKindTo: PropTypes.func,
swapDestinationKindTo: PropTypes.func,
swapOriginAmountTo: PropTypes.func,
swapDestinationAmountTo: PropTypes.func,
swapUpdateBityRatesTo: PropTypes.func,
swapOriginKindAndDestinationKindAndDestinationOptionsTo: PropTypes.func
};
componentDidMount() {
let { bityRates } = this.props;
if (
!bityRates.ETHBTC ||
!bityRates.ETHREP ||
!bityRates.BTCETH ||
!bityRates.BTCREP
) {
this.bity.getAllRates().then(data => {
this.props.swapUpdateBityRatesTo(data);
});
}
}
render() {
let {
bityRates,
originAmount,
destinationAmount,
originKind,
destinationKind,
destinationKindOptions,
originKindOptions,
swapOriginKindTo,
swapDestinationKindTo,
swapOriginAmountTo,
swapDestinationAmountTo,
swapOriginKindAndDestinationKindAndDestinationOptionsTo
} = this.props;
let wantToSwapMyProps = {
bityRates,
originAmount,
destinationAmount,
originKind,
destinationKind,
destinationKindOptions,
originKindOptions,
swapOriginKindTo,
swapDestinationKindTo,
swapOriginAmountTo,
swapDestinationAmountTo,
swapOriginKindAndDestinationKindAndDestinationOptionsTo
};
componentDidMount() {
let {bityRates} = this.props;
if (!bityRates.ETHBTC || !bityRates.ETHREP || !bityRates.BTCETH || !bityRates.BTCREP) {
this.bity.getAllRates()
.then((data) => {
this.props.swapUpdateBityRatesTo(data);
})
}
}
render() {
let {
bityRates,
originAmount,
destinationAmount,
originKind,
destinationKind,
destinationKindOptions,
originKindOptions,
swapOriginKindTo,
swapDestinationKindTo,
swapOriginAmountTo,
swapDestinationAmountTo,
swapOriginKindAndDestinationKindAndDestinationOptionsTo
} = this.props;
let wantToSwapMyProps = {
bityRates,
originAmount,
destinationAmount,
originKind,
destinationKind,
destinationKindOptions,
originKindOptions,
swapOriginKindTo,
swapDestinationKindTo,
swapOriginAmountTo,
swapDestinationAmountTo,
swapOriginKindAndDestinationKindAndDestinationOptionsTo
};
return (
<section className="container" style={{minHeight: '50%'}}>
<div className="tab-content">
<main className="tab-pane swap-tab">
<CurrentRates {...bityRates}/>
<WantToSwapMy {...wantToSwapMyProps}/>
</main>
</div>
</section>
)
}
return (
<section className="container" style={{ minHeight: '50%' }}>
<div className="tab-content">
<main className="tab-pane swap-tab">
<CurrentRates {...bityRates} />
<WantToSwapMy {...wantToSwapMyProps} />
</main>
</div>
</section>
);
}
}
function mapStateToProps(state) {
return {
originAmount: state.swap.originAmount,
destinationAmount: state.swap.destinationAmount,
originKind: state.swap.originKind,
destinationKind: state.swap.destinationKind,
destinationKindOptions: state.swap.destinationKindOptions,
originKindOptions: state.swap.originKindOptions,
bityRates: state.swap.bityRates
}
return {
originAmount: state.swap.originAmount,
destinationAmount: state.swap.destinationAmount,
originKind: state.swap.originKind,
destinationKind: state.swap.destinationKind,
destinationKindOptions: state.swap.destinationKindOptions,
originKindOptions: state.swap.originKindOptions,
bityRates: state.swap.bityRates
};
}
function mapDispatchToProps(dispatch) {
return {
swapOriginKindTo: (originValue) => {
dispatch(SWAP_ORIGIN_KIND_TO(originValue))
},
swapDestinationKindTo: (destinationValue) => {
dispatch(SWAP_DESTINATION_KIND_TO(destinationValue))
},
swapOriginAmountTo: (originAmount) => {
dispatch(SWAP_ORIGIN_AMOUNT_TO(originAmount))
},
swapDestinationAmountTo: (destinationValue) => {
dispatch(SWAP_DESTINATION_AMOUNT_TO(destinationValue))
},
swapUpdateBityRatesTo: (bityRates) => {
dispatch(SWAP_UPDATE_BITY_RATES_TO(bityRates))
},
swapOriginKindAndDestinationKindAndDestinationOptionsTo: (originKind, destinationKind) => {
dispatch(SWAP_ORIGIN_KIND_AND_DESTINATION_KIND_AND_DESTINATION_OPTIONS_TO(originKind, destinationKind))
}
return {
swapOriginKindTo: originValue => {
dispatch(SWAP_ORIGIN_KIND_TO(originValue));
},
swapDestinationKindTo: destinationValue => {
dispatch(SWAP_DESTINATION_KIND_TO(destinationValue));
},
swapOriginAmountTo: originAmount => {
dispatch(SWAP_ORIGIN_AMOUNT_TO(originAmount));
},
swapDestinationAmountTo: destinationValue => {
dispatch(SWAP_DESTINATION_AMOUNT_TO(destinationValue));
},
swapUpdateBityRatesTo: bityRates => {
dispatch(SWAP_UPDATE_BITY_RATES_TO(bityRates));
},
swapOriginKindAndDestinationKindAndDestinationOptionsTo: (
originKind,
destinationKind
) => {
dispatch(
SWAP_ORIGIN_KIND_AND_DESTINATION_KIND_AND_DESTINATION_OPTIONS_TO(
originKind,
destinationKind
)
);
}
};
}
export default connect(mapStateToProps, mapDispatchToProps)(Swap)
export default connect(mapStateToProps, mapDispatchToProps)(Swap);

View File

@ -1,60 +1,68 @@
import {
SWAP_DESTINATION_AMOUNT,
SWAP_DESTINATION_KIND,
SWAP_ORIGIN_AMOUNT,
SWAP_ORIGIN_KIND,
SWAP_UPDATE_BITY_RATES
SWAP_DESTINATION_AMOUNT,
SWAP_DESTINATION_KIND,
SWAP_ORIGIN_AMOUNT,
SWAP_ORIGIN_KIND,
SWAP_UPDATE_BITY_RATES
} from 'actions/swap';
export const ALL_CRYPTO_KIND_OPTIONS = ['BTC', 'ETH', 'REP'];
const initialState = {
originAmount: 0,
destinationAmount: 0,
originKind: 'BTC',
destinationKind: 'ETH',
destinationKindOptions: ALL_CRYPTO_KIND_OPTIONS.filter(element => element !== 'BTC'),
originKindOptions: ALL_CRYPTO_KIND_OPTIONS.filter(element => element !== 'REP'),
bityRates: {}
originAmount: 0,
destinationAmount: 0,
originKind: 'BTC',
destinationKind: 'ETH',
destinationKindOptions: ALL_CRYPTO_KIND_OPTIONS.filter(
element => element !== 'BTC'
),
originKindOptions: ALL_CRYPTO_KIND_OPTIONS.filter(
element => element !== 'REP'
),
bityRates: {}
};
export function swap(state = initialState, action) {
switch (action.type) {
case SWAP_ORIGIN_KIND: {
return {
...state,
originKind: action.value,
destinationKind: action.value === state.destinationKind ? ALL_CRYPTO_KIND_OPTIONS.filter(element => element !== action.value)[0] : state.destinationKind,
destinationKindOptions: ALL_CRYPTO_KIND_OPTIONS.filter(element => element !== action.value)
};
}
case SWAP_DESTINATION_KIND: {
return {
...state,
destinationKind: action.value
};
}
case SWAP_ORIGIN_AMOUNT:
return {
...state,
originAmount: action.value
};
case SWAP_DESTINATION_AMOUNT:
return {
...state,
destinationAmount: action.value
};
case SWAP_UPDATE_BITY_RATES:
return {
...state,
bityRates: {
...state.bityRates,
...action.value
}
};
default:
return state
switch (action.type) {
case SWAP_ORIGIN_KIND: {
return {
...state,
originKind: action.value,
destinationKind: action.value === state.destinationKind
? ALL_CRYPTO_KIND_OPTIONS.filter(
element => element !== action.value
)[0]
: state.destinationKind,
destinationKindOptions: ALL_CRYPTO_KIND_OPTIONS.filter(
element => element !== action.value
)
};
}
case SWAP_DESTINATION_KIND: {
return {
...state,
destinationKind: action.value
};
}
case SWAP_ORIGIN_AMOUNT:
return {
...state,
originAmount: action.value
};
case SWAP_DESTINATION_AMOUNT:
return {
...state,
destinationAmount: action.value
};
case SWAP_UPDATE_BITY_RATES:
return {
...state,
bityRates: {
...state.bityRates,
...action.value
}
};
default:
return state;
}
}