fix: fee calculation (#192)

* fix: fee calculation

* fix: correct base amount on voila page for normal swaps

package.json

@@ -26,9 +26,9 @@
     "url": "git+https://github.com/BoltzExchange/boltz-frontend.git"
   },
   "dependencies": {
-    "axios": "^0.18.0",
-    "bignumber.js": "^8.1.1",
-    "bitcoinjs-lib": "^5.0.4",
+    "axios": "^0.19.0",
+    "bignumber.js": "^9.0.0",
+    "bitcoinjs-lib": "^5.0.5",
     "boltz-core": "^0.0.7",
     "eventsource": "^1.0.7",
     "lodash.throttle": "^4.1.1",

src/__test__/unit/reducers/SwapReducer.spec.js

@@ -1,5 +1,6 @@
-import swapReducer, { initialState } from '../../../reducers/swapReducer';
+import { toWholeCoins } from '../../../utils';
 import * as actions from '../../../constants/actions';
+import swapReducer, { initialState } from '../../../reducers/swapReducer';
 
 describe('swap reducer', () => {
   it('should return the initial state', () => {
@@ -23,18 +24,28 @@ describe('swap reducer', () => {
   });
 
   it(`should handle ${actions.SWAP_RESPONSE}`, () => {
+    const payload = {
+      response: {
+        someOther: 'data',
+        expectedAmount: 123456789,
+      },
+    };
+
     expect(
       swapReducer(
         {},
         {
+          payload,
           type: actions.SWAP_RESPONSE,
-          payload: 'payload',
         }
       )
     ).toEqual({
       retry: true,
       isFetching: false,
-      swapResponse: 'payload',
+      swapInfo: {
+        baseAmount: toWholeCoins(payload.response.expectedAmount),
+      },
+      swapResponse: payload,
     });
   });
 

src/actions/reverseActions.js

@@ -70,8 +70,8 @@ export const startReverseSwap = (swapInfo, nextStage, timelockExpired) => {
     dispatch(reverseSwapRequest());
     axios
       .post(url, {
-        amount,
         pairId: pair.id,
+        invoiceAmount: amount,
         orderSide: pair.orderSide,
         claimPublicKey: keys.publicKey,
       })

src/components/swaptab/desktopswaptab.js

@@ -34,9 +34,9 @@ const DeskTopSwapTabContent = ({
 }) => (
   <View className={classes.wrapper}>
     <View className={classes.stats}>
-      <InfoText title="Min amount" text={`${minAmount}`} />
-      <InfoText title="Max amount" text={`${maxAmount}`} />
-      <InfoText title="Fee" text={`${feeAmount}`} />
+      <InfoText title="Min amount" text={`${minAmount} ${base}`} />
+      <InfoText title="Max amount" text={`${maxAmount} ${base}`} />
+      <InfoText title="Fee" text={`${feeAmount} ${base}`} />
       <InfoText title="Rate" text={`${rate}`} />
     </View>
     <View className={classes.options}>

src/components/swaptab/mobileswaptab.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import injectSheet from 'react-jss';
-import SwapTabWrapper from './swaptabwrapper';
+import { MdCompareArrows } from 'react-icons/md';
 import View from '../view';
-import Text, { InfoText } from '../text';
 import Input from '../input';
-import DropDown from '../dropdown';
-import { MdCompareArrows } from 'react-icons/md';
 import Controls from '../controls';
+import DropDown from '../dropdown';
+import Text, { InfoText } from '../text';
+import SwapTabWrapper from './swaptabwrapper';
 
 const MobileSwapTabContent = ({
   classes,
@@ -34,9 +34,9 @@ const MobileSwapTabContent = ({
 }) => (
   <View className={classes.wrapper}>
     <View className={classes.info}>
-      <InfoText title="Min amount" text={`${minAmount}`} />
-      <InfoText title="Max amount" text={`${maxAmount}`} />
-      <InfoText title="Fee" text={`${feeAmount}`} />
+      <InfoText title="Min amount" text={`${minAmount} ${base}`} />
+      <InfoText title="Max amount" text={`${maxAmount} ${base}`} />
+      <InfoText title="Fee" text={`${feeAmount} ${base}`} />
       <InfoText title="Rate" text={`${rate}`} />
     </View>
     <View className={classes.inputs}>

src/components/swaptab/swaptabwrapper.js

@@ -166,6 +166,9 @@ class SwapTabWrapper extends React.Component {
     }
   };
 
+  /**
+   * @returns the miner fee in the smallest denomination of the currency
+   */
   calculateMinerFee = () => {
     const { minerFees } = this.props.fees;
 
@@ -180,20 +183,24 @@ class SwapTabWrapper extends React.Component {
 
   /**
    * @param { BigNumber } baseAmount
+   * @param { BigNumber } rate
    */
-  calculateFee = baseAmount => {
+  calculateFee = (baseAmount, rate) => {
     const feePercentage = new BigNumber(this.state.feePercentage);
 
     const percentageFee = feePercentage.times(baseAmount);
-    const minerFee = new BigNumber(this.calculateMinerFee()).dividedBy(
-      decimals
-    );
 
-    let fee = percentageFee.plus(minerFee);
-    if (isNaN(fee.toNumber())) {
-      fee = new BigNumber('0');
+    let minerFee = new BigNumber(this.calculateMinerFee()).dividedBy(decimals);
+
+    if (this.baseAsset.isLightning) {
+      minerFee = minerFee.times(new BigNumber(1).dividedBy(rate));
+    }
+
+    if (isNaN(percentageFee.toNumber())) {
+      return new BigNumber(0);
     }
-    return fee;
+
+    return percentageFee.plus(minerFee);
   };
 
   /**
@@ -223,11 +230,11 @@ class SwapTabWrapper extends React.Component {
     const rate = new BigNumber(this.state.rate.rate);
 
     const newBase = amount.dividedBy(rate);
-    const fee = this.calculateFee(newBase);
+    const fee = this.calculateFee(newBase, rate);
 
     const newBaseWithFee = fee.plus(newBase);
-
     const inputError = !this.checkBaseAmount(newBaseWithFee);
+
     this.setState({
       quoteAmount: amount,
       baseAmount: new BigNumber(newBaseWithFee.toFixed(8)),
@@ -239,24 +246,23 @@ class SwapTabWrapper extends React.Component {
 
   updateQuoteAmount = baseAmount => {
     if (!this.state.rate) return;
+
     const amount = new BigNumber(baseAmount.toString());
     const rate = new BigNumber(this.state.rate.rate);
-    const { orderSide } = this.state.rate;
-    let fee = this.calculateFee(amount);
 
-    if (orderSide === 'sell') {
-      fee = fee.times(rate);
-    }
+    let fee = this.calculateFee(amount, rate);
 
     const quote = amount
       .times(rate)
-      .minus(fee)
+      .minus(fee.times(rate))
       .toFixed(8);
 
     let newQuote = new BigNumber(quote);
+
     if (newQuote.isLessThanOrEqualTo(0)) {
       newQuote = new BigNumber('0');
     }
+
     const inputError = !this.checkBaseAmount(amount);
     this.setState({
       quoteAmount: newQuote,

src/reducers/swapReducer.js

@@ -1,4 +1,5 @@
 import * as actionTypes from '../constants/actions';
+import { toWholeCoins } from '../utils';
 
 export const initialState = {
   retry: true,
@@ -36,6 +37,10 @@ const reducer = (state = initialState, action) => {
         ...state,
         isFetching: false,
         retry: true,
+        swapInfo: {
+          ...state.swapInfo,
+          baseAmount: toWholeCoins(action.payload.response.expectedAmount),
+        },
         swapResponse: action.payload,
       };