Refacto handle percent fn

massalabs · Oct 25, 2023 · d8f4891 · d8f4891
1 parent 3dfd408
commit d8f4891
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 26 deletions.
diff --git a/web-frontend/cypress/e2e/acceptance/home/send.cy.tsx b/web-frontend/cypress/e2e/acceptance/home/send.cy.tsx
@@ -8,6 +8,7 @@ import {
   formatStandard,
   maskAddress,
 } from '../../../../src/utils/massaFormat';
+import { handlePercent } from '../../../../src/utils/math';
 import { compareSnapshot } from '../../../compareSnapshot';
 
 describe('E2E | Acceptance | Home', () => {
@@ -78,18 +79,6 @@ describe('E2E | Acceptance | Home', () => {
       }
     }
 
-    // mimics handlepercent fn in sendForm.tsx
-    // TODO: refactor handlePercent to be a util function
-    function handlePercent(amount = 0, percent: number, fees, balance) {
-      let newAmount = amount * percent;
-      const feesAsNumber = Number(fees);
-
-      if (newAmount > balance - feesAsNumber)
-        newAmount = Math.max(balance - feesAsNumber, 0);
-
-      return toMASS(newAmount);
-    }
-
     // standardize percent testing
     function performPercentAction(percentValue, account, fees) {
       const balance = Number(account?.candidateBalance);

diff --git a/web-frontend/src/pages/TransferCoins/SendCoins/SendForm.tsx b/web-frontend/src/pages/TransferCoins/SendCoins/SendForm.tsx
@@ -16,6 +16,7 @@ import {
   reverseFormatStandard,
   fetchAccounts,
 } from '@/utils';
+import { handlePercent } from '@/utils/math';
 
 interface InputsErrors {
   amount?: string;
@@ -51,16 +52,6 @@ export function SendForm({ ...props }) {
     setRecipient(to);
   }, []);
 
-  function handlePercent(amount = 0, percent: number) {
-    let newAmount = amount * percent;
-    const feesAsNumber = Number(fees);
-
-    if (newAmount > balance - feesAsNumber)
-      newAmount = Math.max(balance - feesAsNumber, 0);
-
-    setAmount(toMASS(newAmount));
-  }
-
   function validate(formObject: IForm) {
     const { amount, recipient } = formObject;
 
@@ -137,28 +128,36 @@ export function SendForm({ ...props }) {
           <ul className="flex flex-row mas-body2">
             <li
               data-testid="send-percent-25"
-              onClick={() => handlePercent(balance, 0.25)}
+              onClick={() =>
+                setAmount(handlePercent(balance, 0.25, fees, balance))
+              }
               className="mr-3.5 hover:cursor-pointer"
             >
               25%
             </li>
             <li
               data-testid="send-percent-50"
-              onClick={() => handlePercent(balance, 0.5)}
+              onClick={() =>
+                setAmount(handlePercent(balance, 0.5, fees, balance))
+              }
               className="mr-3.5 hover:cursor-pointer"
             >
               50%
             </li>
             <li
               data-testid="send-percent-75"
-              onClick={() => handlePercent(balance, 0.75)}
+              onClick={() =>
+                setAmount(handlePercent(balance, 0.75, fees, balance))
+              }
               className="mr-3.5 hover:cursor-pointer"
             >
               75%
             </li>
             <li
               data-testid="send-percent-100"
-              onClick={() => handlePercent(balance, 1)}
+              onClick={() =>
+                setAmount(handlePercent(balance, 1, fees, balance))
+              }
               className="mr-3.5 hover:cursor-pointer"
             >
               Max

diff --git a/web-frontend/src/utils/math.ts b/web-frontend/src/utils/math.ts
@@ -0,0 +1,17 @@
+import { toMASS } from './massaFormat';
+
+export function handlePercent(
+  amount = 0,
+  percent: number,
+  fees: string,
+  balance: number,
+) {
+  let newAmount = amount * percent;
+  const feesAsNumber = Number(fees);
+
+  if (newAmount > balance - feesAsNumber)
+    newAmount = Math.max(balance - feesAsNumber, 0);
+
+  return toMASS(newAmount);
+  // setAmount(toMASS(newAmount));
+}