diff --git a/src/components/input/index.js b/src/components/input/index.js
index 125d593..181525c 100644
--- a/src/components/input/index.js
+++ b/src/components/input/index.js
@@ -17,11 +17,6 @@ const styles = theme => ({
});
class Input extends React.Component {
- constructor(props) {
- super(props);
- this.state = { value: props.value ? props.value : 0 };
- }
-
static getDerivedStateFromProps = nextProps => {
if (nextProps.value && nextProps.disable) {
return { value: nextProps.value };
@@ -35,7 +30,8 @@ class Input extends React.Component {
};
render() {
- const { classes, style, disable, min, step, max } = this.props;
+ const { classes, style, disable, min, max, value, step } = this.props;
+
return (
this.onChange(e)}
- value={this.state.value}
+ value={value}
type={'number'}
/>
);
diff --git a/src/components/swaptab/index.js b/src/components/swaptab/index.js
index 8648d94..113f2a8 100644
--- a/src/components/swaptab/index.js
+++ b/src/components/swaptab/index.js
@@ -95,73 +95,95 @@ const styles = theme => ({
});
class SwapTab extends React.Component {
- rate = {};
- quoteAmount = 0;
-
- state = {
- error: false,
- base: 'LTC',
- quote: 'BTC',
- baseAmount: MIN,
- quoteAmount: 0,
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ error: false,
+ base: 'LTC',
+ quote: 'BTC',
+ baseAmount: MIN,
+ quoteAmount: 0,
+ };
+ }
+
+ componentDidUpdate = (prevProps, prevState) => {
+ // Update the rate if the request finished or the currencies changed
+ if (
+ prevProps.loading ||
+ prevState.base !== this.state.base ||
+ prevState.quote !== this.state.quote
+ ) {
+ this.setState({
+ rate: this.props.rates[`${this.state.base}/${this.state.quote}`],
+ });
+ }
+ };
+
+ checkBaseAmount = baseAmount => {
+ const valid = baseAmount <= MAX && baseAmount >= MIN;
+
+ if (!valid) {
+ this.setState({
+ error: true,
+ });
+ }
+ return valid;
};
- setSwapData = baseAmount => {
- if (baseAmount <= MAX && baseAmount >= MIN) {
+ updateBaseAmount = quoteAmount => {
+ const newBaseAmount = (quoteAmount / this.state.rate.rate).toFixed(8);
+
+ if (this.checkBaseAmount(newBaseAmount)) {
this.setState({
- baseAmount,
- quoteAmount: this.calculateQuoteAmount(baseAmount),
+ quoteAmount: Number.parseFloat(quoteAmount).toFixed(8),
+ baseAmount: newBaseAmount,
error: false,
});
- } else {
+ }
+ };
+
+ updateQuoteAmount = baseAmount => {
+ const newQuoteAmount = (baseAmount * this.state.rate.rate).toFixed(8);
+
+ if (this.checkBaseAmount(baseAmount)) {
this.setState({
- error: true,
+ quoteAmount: newQuoteAmount,
+ baseAmount: Number.parseFloat(baseAmount).toFixed(8),
+ error: false,
});
}
};
shouldSubmit = () => {
- const { error } = this.state;
+ const { error, rate } = this.state;
- if (error !== undefined && this.rate !== 'Not found') {
+ if (error === false && this.rate !== 'Not found') {
const state = {
...this.state,
- pair: this.rate.pair,
+ pair: rate.pair,
};
- if (this.state.quoteAmount === 0) {
- this.props.onPress({
- ...state,
- quoteAmount: this.quoteAmount,
- });
- } else {
- this.props.onPress(state);
- }
+ this.props.onPress(state);
}
};
- getRate = (rates, pairId) => {
- const rate = rates[pairId];
+ getRate = () => {
+ const rate = this.state.rate;
if (rate) {
- this.rate = rate;
return rate.rate.toFixed(5);
} else {
return 'Not found';
}
};
- calculateQuoteAmount = baseAmount => {
- return (Number.parseFloat(baseAmount) * this.rate.rate).toFixed(8);
- };
-
render() {
const { classes, rates, currencies, loading } = this.props;
- let { error, base, quote, baseAmount, quoteAmount } = this.state;
+ let { error, base, quote, baseAmount, quoteAmount, rate } = this.state;
- if (quoteAmount === 0) {
- this.quoteAmount = this.calculateQuoteAmount(baseAmount);
- quoteAmount = this.quoteAmount;
+ if (quoteAmount === 0 && rate !== undefined) {
+ this.updateQuoteAmount(baseAmount);
}
return loading ? (
@@ -180,10 +202,7 @@ class SwapTab extends React.Component {
-
+
@@ -194,7 +213,7 @@ class SwapTab extends React.Component {
step={MIN}
error={error}
value={baseAmount}
- onChange={e => this.setSwapData(e)}
+ onChange={e => this.updateQuoteAmount(e)}
/>
-
+ this.updateBaseAmount(e)}
+ />
{
return dispatch => {
const { pair, invoice, keys } = swapInfo;
- console.log({
- pairId: pair.id,
- orderSide: pair.orderSide,
- invoice: invoice,
- refundPublicKey: keys.publicKey,
- });
-
dispatch(swapRequest());
axios
.post(url, {