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) => {
export const SWAP_ORIGIN_KIND_TO = value => {
return {
type: SWAP_ORIGIN_KIND,
value
};
};
export const SWAP_DESTINATION_KIND_TO = (value) => {
export const SWAP_DESTINATION_KIND_TO = value => {
return {
type: SWAP_DESTINATION_KIND,
value
}
};
};
export const SWAP_ORIGIN_AMOUNT_TO = (value) => {
export const SWAP_ORIGIN_AMOUNT_TO = value => {
return {
type: SWAP_ORIGIN_AMOUNT,
value
};
};
export const SWAP_DESTINATION_AMOUNT_TO = (value) => {
export const SWAP_DESTINATION_AMOUNT_TO = value => {
return {
type: SWAP_DESTINATION_AMOUNT,
value
}
};
};
export const SWAP_UPDATE_BITY_RATES_TO = (value) => {
export const SWAP_UPDATE_BITY_RATES_TO = value => {
return {
type: SWAP_UPDATE_BITY_RATES,
value
}
};
};

View File

@ -6,10 +6,10 @@ 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())
args.forEach(each => {
newString = newString.concat(each.toUpperCase());
});
return newString
return newString;
}
export default class Bity {
@ -29,36 +29,34 @@ export default class Bity {
*/
getMultipleRates(arrayOfOriginAndDestinationDicts) {
const mappedRates = {};
return this.requestAllRates()
.then((bityRates) => {
arrayOfOriginAndDestinationDicts.forEach((each) => {
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)
mappedRates[pairName] = parseFloat(rate.rate_we_sell);
});
return mappedRates;
});
return mappedRates
})
// TODO - catch errors
}
getAllRates() {
const mappedRates = {};
return this.requestAllRates()
.then((bityRates) => {
bityRates.data.objects.forEach((each) => {
return this.requestAllRates().then(bityRates => {
bityRates.data.objects.forEach(each => {
const pairName = each.pair;
mappedRates[pairName] = parseFloat(each.rate_we_sell)
mappedRates[pairName] = parseFloat(each.rate_we_sell);
});
return mappedRates;
});
return mappedRates
})
// TODO - catch errors
}
requestAllRates() {
const path = '/v1/rate2/';
const bityURL = bityConfig.bityAPI + path;
return axios.get(bityURL)
return axios.get(bityURL);
}
}

View File

@ -15,4 +15,4 @@ export default {
'Content-Type': 'application/json; charse:UTF-8'
}
}
}
};

View File

@ -1,8 +1,7 @@
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);
@ -11,7 +10,7 @@ export default class CurrentRates extends Component {
ETHREPAmount: 1,
BTCETHAmount: 1,
BTCREPAmount: 1
}
};
}
static propTypes = {
@ -21,7 +20,7 @@ export default class CurrentRates extends Component {
BTCREP: PropTypes.number
};
onChange = (event) => {
onChange = event => {
const target = event.target;
const value = target.value;
const name = target.name;
@ -35,39 +34,84 @@ export default class CurrentRates extends Component {
return (
<article className="swap-rates">
<section className="row">
<h5 className="col-xs-6 col-xs-offset-3">{translate('SWAP_rates')}</h5>
<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>
<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>
<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>
<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>
<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
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,7 +1,7 @@
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,
@ -37,13 +37,17 @@ class Swap extends Component {
};
componentDidMount() {
let {bityRates} = this.props;
let { bityRates } = this.props;
if (!bityRates.ETHBTC || !bityRates.ETHREP || !bityRates.BTCETH || !bityRates.BTCREP) {
this.bity.getAllRates()
.then((data) => {
if (
!bityRates.ETHBTC ||
!bityRates.ETHREP ||
!bityRates.BTCETH ||
!bityRates.BTCREP
) {
this.bity.getAllRates().then(data => {
this.props.swapUpdateBityRatesTo(data);
})
});
}
}
@ -79,15 +83,15 @@ class Swap extends Component {
};
return (
<section className="container" style={{minHeight: '50%'}}>
<section className="container" style={{ minHeight: '50%' }}>
<div className="tab-content">
<main className="tab-pane swap-tab">
<CurrentRates {...bityRates}/>
<WantToSwapMy {...wantToSwapMyProps}/>
<CurrentRates {...bityRates} />
<WantToSwapMy {...wantToSwapMyProps} />
</main>
</div>
</section>
)
);
}
}
@ -100,31 +104,38 @@ function mapStateToProps(state) {
destinationKindOptions: state.swap.destinationKindOptions,
originKindOptions: state.swap.originKindOptions,
bityRates: state.swap.bityRates
}
};
}
function mapDispatchToProps(dispatch) {
return {
swapOriginKindTo: (originValue) => {
dispatch(SWAP_ORIGIN_KIND_TO(originValue))
swapOriginKindTo: originValue => {
dispatch(SWAP_ORIGIN_KIND_TO(originValue));
},
swapDestinationKindTo: (destinationValue) => {
dispatch(SWAP_DESTINATION_KIND_TO(destinationValue))
swapDestinationKindTo: destinationValue => {
dispatch(SWAP_DESTINATION_KIND_TO(destinationValue));
},
swapOriginAmountTo: (originAmount) => {
dispatch(SWAP_ORIGIN_AMOUNT_TO(originAmount))
swapOriginAmountTo: originAmount => {
dispatch(SWAP_ORIGIN_AMOUNT_TO(originAmount));
},
swapDestinationAmountTo: (destinationValue) => {
dispatch(SWAP_DESTINATION_AMOUNT_TO(destinationValue))
swapDestinationAmountTo: destinationValue => {
dispatch(SWAP_DESTINATION_AMOUNT_TO(destinationValue));
},
swapUpdateBityRatesTo: (bityRates) => {
dispatch(SWAP_UPDATE_BITY_RATES_TO(bityRates))
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))
}
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

@ -8,26 +8,34 @@ import {
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'),
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)
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: {
@ -55,6 +63,6 @@ export function swap(state = initialState, action) {
}
};
default:
return state
return state;
}
}