fix(fees): simplify decimal handling and fix tests

Author: ryanswrt

package.json

@@ -58,6 +58,7 @@
     "react-scripts": "^4.0.3",
     "react-use": "^15.3.4",
     "redux": "^4.1.0",
+    "text-encoding": "^0.7.0",
     "typescript": "^4.0.3",
     "xstate": "^4.17.0"
   },
@@ -79,7 +80,11 @@
   "eslintConfig": {
     "extends": "react-app"
   },
-  "browserslist": [">0.2%", "not dead", "not op_mini all"],
+  "browserslist": [
+    ">0.2%",
+    "not dead",
+    "not op_mini all"
+  ],
   "devDependencies": {
     "@babel/plugin-transform-modules-commonjs": "^7.13.0",
     "netlify-cli": "^2.71.0",

src/features/fees/feesUtils.test.ts

@@ -13,6 +13,7 @@ test("no fees", () => {
     amount: 1,
     type: TxType.MINT,
     fees: null,
+    decimals: 8,
   });
   const expected = {
     conversionTotal: 1,
@@ -30,10 +31,11 @@ describe("burn", () => {
       amount: 1,
       type,
       fees: mockedFees,
+      decimals: 8,
     });
     const expected = {
       conversionTotal: 0.998,
-      networkFee: 0.001,
+      networkFee: 100000 / 10 ** 8, // native amount
       renVMFee: 0.001,
       renVMFeeAmount: 0.001,
     };
@@ -45,6 +47,7 @@ describe("burn", () => {
       amount: 1000,
       type,
       fees: mockedFees,
+      decimals: 8,
     });
     expect(calculated.renVMFeeAmount).toEqual(1); // 0.001 * amount
     expect(calculated.conversionTotal).toEqual(998.999); /// -1 - 0.001
@@ -55,6 +58,7 @@ describe("burn", () => {
       amount: 1.234,
       type,
       fees: mockedFees,
+      decimals: 8,
     });
     expect(calculated.renVMFeeAmount).toEqual(0.001234);
     expect(calculated.conversionTotal).toEqual(1.231766);
@@ -68,6 +72,7 @@ describe("mint", () => {
       amount: 1,
       type,
       fees: mockedFees,
+      decimals: 8,
     });
     const expected = {
       conversionTotal: 0.997,
@@ -83,6 +88,7 @@ describe("mint", () => {
       amount: 1000,
       type,
       fees: mockedFees,
+      decimals: 8,
     });
     expect(calculated.renVMFeeAmount).toEqual(2); // 0.002 * amount
     expect(calculated.conversionTotal).toEqual(997.999); /// -2 - 0.001

src/features/fees/feesUtils.ts

@@ -31,12 +31,14 @@ type GetTransactionsFeesArgs = {
   amount: number;
   fees: SimpleFee | null;
   type: TxType;
+  decimals: number;
 };
 
 export const getTransactionFees = ({
   amount,
   type,
   fees,
+  decimals,
 }: GetTransactionsFeesArgs) => {
   const amountNumber = Number(amount);
   const feeData: CalculatedFee = {
@@ -48,7 +50,7 @@ export const getTransactionFees = ({
   if (fees) {
     const renTxTypeFee = type === TxType.MINT ? fees.mint : fees.burn;
     const networkFee = type === TxType.MINT ? fees.lock : fees.release;
-    feeData.networkFee = Number(networkFee);
+    feeData.networkFee = Number(networkFee) / 10 ** decimals;
     feeData.renVMFee = Number(renTxTypeFee) / 10000; // percent value
     feeData.renVMFeeAmount = Number(amountNumber * feeData.renVMFee);
     const total = Number(

src/features/mint/components/MintStatuses.tsx

@@ -458,7 +458,7 @@ export const MintCompletedStatus: FunctionComponent<MintCompletedStatusProps> =
     mintCurrencyConfig,
     lockChainConfig,
     lockTxLink,
-    lockTxNativeAmount,
+    lockTxAmount,
     mintTxLink,
     decimals,
     mintChainConfig,
@@ -468,11 +468,12 @@ export const MintCompletedStatus: FunctionComponent<MintCompletedStatusProps> =
     TxType.MINT
   );
   const { conversionTotal } = getTransactionFees({
-    amount: Number(lockTxNativeAmount),
+    amount: Number(lockTxAmount),
     fees,
     type: TxType.MINT,
+    decimals,
   });
-  const conversionFormatted = conversionTotal / Math.pow(10, decimals);
+  const conversionFormatted = conversionTotal;
   const handleReturn = useCallback(() => {
     history.push({
       pathname: paths.HOME,

src/features/mint/steps/MintFeesStep.tsx

@@ -108,11 +108,12 @@ export const MintFeesStep: FunctionComponent<TxConfigurationStepProps> = ({
   const amountUsd = amount * currencyUsdRate;
   const { fees, pending } = useFetchFees(currency, TxType.MINT);
   const { conversionTotal } = getTransactionFees({
-    amount: amount * Math.pow(10, decimals),
+    amount,
     fees,
     type: TxType.MINT,
+    decimals,
   });
-  const conversionFormatted = conversionTotal / Math.pow(10, decimals);
+  const conversionFormatted = conversionTotal;
 
   const { GreyIcon } = lockCurrencyConfig;
 

src/features/release/steps/ReleaseFeesStep.tsx

@@ -97,9 +97,10 @@ export const ReleaseFeesStep: FunctionComponent<TxConfigurationStepProps> = ({
         );
 
   const { conversionTotal } = getTransactionFees({
-    amount: amount * Math.pow(10, decimals),
+    amount,
     fees,
     type: TxType.BURN,
+    decimals,
   });
 
   const chainConfig = getChainConfig(chain);
@@ -109,7 +110,7 @@ export const ReleaseFeesStep: FunctionComponent<TxConfigurationStepProps> = ({
     USD_SYMBOL
   );
 
-  const conversionFormatted = conversionTotal / Math.pow(10, decimals);
+  const conversionFormatted = conversionTotal;
 
   const destinationAmountUsd = conversionFormatted * destinationCurrencyUsdRate;
   const destinationCurrencyConfig = getCurrencyConfig(destinationCurrency);

src/features/release/steps/ReleaseInitialStep.tsx

@@ -80,11 +80,12 @@ export const ReleaseInitialStep: FunctionComponent<TxConfigurationStepProps> = (
   );
   const { fees, pending } = useFetchFees(currency, TxType.BURN);
   const { conversionTotal } = getTransactionFees({
-    amount: amount * Math.pow(10, decimals),
+    amount,
     type: TxType.BURN,
     fees,
+    decimals,
   });
-  const conversionFormatted = conversionTotal / Math.pow(10, decimals);
+  const conversionFormatted = conversionTotal;
 
   const usdAmount = useSelector($releaseUsdAmount);
   const handleChainChange = useCallback(

src/features/transactions/components/TransactionFees.tsx

@@ -70,16 +70,12 @@ export const TransactionFees: FunctionComponent<TransactionFeesProps> = ({
   const hasAmount = !isNaN(amount) && amount !== 0;
   const amountUsd = amount * currencyUsdRate;
   const { fees, pending } = useFetchFees(currency, type);
-  const {
-    renVMFee,
-    renVMFeeAmount,
-    networkFee: nativeNetworkFee,
-  } = getTransactionFees({
+  const { renVMFee, renVMFeeAmount, networkFee } = getTransactionFees({
     amount,
     fees,
     type,
+    decimals,
   });
-  const networkFee = nativeNetworkFee / 10 ** decimals;
   const renVMFeeAmountUsd = amountUsd * renVMFee;
   const networkFeeUsd = networkFee * currencyUsdRate;
 

src/setupTests.ts

@@ -3,7 +3,8 @@
 // expect(element).toHaveTextContent(/react/i)
 // learn more: https://github.com/testing-library/jest-dom
 import "@testing-library/jest-dom/extend-expect";
-
+global.TextDecoder = require("text-encoding").TextDecoder;
+global.TextEncoder = require("text-encoding").TextEncoder;
 (global as any).document.createRange = () => ({
   setStart: () => {},
   setEnd: () => {},

yarn.lock

@@ -11,7 +11,7 @@
     deep-eql "^0.1.3"
     keypather "^1.10.2"
 
-"@CoinSpace/bitcore-lib-dogecoin@github:CoinSpace/bitcore-lib-dogecoin":
+"@CoinSpace/bitcore-lib-dogecoin@CoinSpace/bitcore-lib-dogecoin":
   version "8.1.2"
   resolved "https://codeload.github.com/CoinSpace/bitcore-lib-dogecoin/tar.gz/cf8b3f663d6f065c12a643d8eb7c9e7b7f516bf1"
   dependencies:
@@ -5857,7 +5857,7 @@ bitcore-lib-cash@^8.24.2:
     inherits "=2.0.1"
     lodash "^4.17.20"
 
-"bitcore-lib-zcash@github:zcash-hackworks/bitcore-lib-zcash":
+bitcore-lib-zcash@zcash-hackworks/bitcore-lib-zcash:
   version "0.13.19"
   resolved "https://codeload.github.com/zcash-hackworks/bitcore-lib-zcash/tar.gz/e97ae1dd2e9f14d6076d5e5429c75d8965afa4ab"
   dependencies:
@@ -18783,6 +18783,11 @@ text-encoding-utf-8@^1.0.2:
   resolved "https://registry.yarnpkg.com/text-encoding-utf-8/-/text-encoding-utf-8-1.0.2.tgz#585b62197b0ae437e3c7b5d0af27ac1021e10d13"
   integrity sha512-8bw4MY9WjdsD2aMtO0OzOCY3pXGYNx2d2FfHRVUKkiCPDWjKuOlhLVASS+pD7VkLTVjW268LYJHwsnPFlBpbAg==
 
+text-encoding@^0.7.0:
+  version "0.7.0"
+  resolved "https://registry.yarnpkg.com/text-encoding/-/text-encoding-0.7.0.tgz#f895e836e45990624086601798ea98e8f36ee643"
+  integrity sha512-oJQ3f1hrOnbRLOcwKz0Liq2IcrvDeZRHXhd9RgLrsT+DjWY/nty1Hi7v3dtkaEYbPYe0mUoOfzRrMwfXXwgPUA==
+
 [email protected]:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/text-hex/-/text-hex-1.0.0.tgz#69dc9c1b17446ee79a92bf5b884bb4b9127506f5"