From 906de6b217e7a4a4643d3b34454989a89cf2d23f Mon Sep 17 00:00:00 2001
From: Sebastian Scatularo <sebastian.scatularo@xlabs.xyz>
Date: Mon, 14 Aug 2023 21:35:37 -0300
Subject: [PATCH] code review observations

---
 src/components/Transfer/Source.tsx |  8 +++--
 src/hooks/useMinimumAmountGuard.ts | 53 +++++++++++++++++++-----------
 2 files changed, 40 insertions(+), 21 deletions(-)

diff --git a/src/components/Transfer/Source.tsx b/src/components/Transfer/Source.tsx
index a4ba0c7e1..05f4108af 100644
--- a/src/components/Transfer/Source.tsx
+++ b/src/components/Transfer/Source.tsx
@@ -171,7 +171,7 @@ function Source() {
   );
   /* End pandle token check */
   const { decimals = 0, isNativeAsset = false } = parsedTokenAccount || {};
-  const isBelowMinimum = useMinimumAmountGuard({
+  const { isBelowMinimum, minimum } = useMinimumAmountGuard({
     amount,
     sourceChain,
     decimals,
@@ -268,7 +268,11 @@ function Source() {
               onChange={handleAmountChange}
               disabled={isTransferDisabled || shouldLockFields}
               error={isBelowMinimum}
-              helperText={isBelowMinimum ? "Amount is below minimum" : ""}
+              helperText={
+                isBelowMinimum
+                  ? `Amount sent is too small. The amount must be equal or greater than ${minimum}.`
+                  : ""
+              }
               onMaxClick={
                 uiAmountString && !parsedTokenAccount.isNativeAsset
                   ? handleMaxClick
diff --git a/src/hooks/useMinimumAmountGuard.ts b/src/hooks/useMinimumAmountGuard.ts
index 9a82c8272..dc21e4dd8 100644
--- a/src/hooks/useMinimumAmountGuard.ts
+++ b/src/hooks/useMinimumAmountGuard.ts
@@ -1,20 +1,10 @@
 import { useMemo } from "react";
 import { ChainId, isEVMChain } from "@certusone/wormhole-sdk";
 
-function checkIfIsBelowMinimum(amount: string, decimals: number) {
-  try {
-    const divider = Math.pow(10, decimals);
-    const floatAmount = parseFloat(amount);
-    const intAmount = floatAmount * divider;
-    return Math.trunc(intAmount) <= 0;
-  } catch (err: any) {
-    console.error(err);
-    return true;
-  }
+function getDivider(decimals: number) {
+  return Math.pow(10, decimals);
 }
 
-const EIGHT_DECIMALS = 8;
-
 function getAdjustedDecimals(
   chainId: ChainId,
   isNativeAsset: boolean,
@@ -25,6 +15,23 @@ function getAdjustedDecimals(
     : decimals;
 }
 
+function getMinimum(divider: number, adjustedDecimals: number) {
+  return (1 / divider).toFixed(adjustedDecimals);
+}
+
+function checkIfIsBelowMinimum(amount: string, divider: number) {
+  try {
+    const floatAmount = parseFloat(amount);
+    const intAmount = floatAmount * divider;
+    return Math.trunc(intAmount) <= 0;
+  } catch (err: any) {
+    console.error(err);
+    return true;
+  }
+}
+
+const EIGHT_DECIMALS = 8;
+
 export type MinimumAmountGuardArgs = {
   amount: string;
   sourceChain: ChainId;
@@ -38,13 +45,21 @@ export default function useMinimumAmountGuard({
   decimals = 0,
   isNativeAsset = false,
 }: MinimumAmountGuardArgs) {
+  const adjustedDecimals = useMemo(
+    () => getAdjustedDecimals(sourceChain, isNativeAsset, decimals),
+    [sourceChain, isNativeAsset, decimals]
+  );
+  const divider = useMemo(
+    () => getDivider(adjustedDecimals),
+    [adjustedDecimals]
+  );
   const isBelowMinimum = useMemo(
-    () =>
-      checkIfIsBelowMinimum(
-        amount,
-        getAdjustedDecimals(sourceChain, isNativeAsset, decimals)
-      ),
-    [amount, sourceChain, isNativeAsset, decimals]
+    () => checkIfIsBelowMinimum(amount, divider),
+    [amount, divider]
+  );
+  const minimum = useMemo(
+    () => getMinimum(divider, adjustedDecimals),
+    [divider, adjustedDecimals]
   );
-  return isBelowMinimum;
+  return { isBelowMinimum, minimum };
 }