feat: Input upper limit checking

packages/canonical-bridge-sdk/src/shared/number.ts

@@ -18,7 +18,7 @@ export const formatNumber = (
   useGrouping = true
 ) => {
   const num = removeAfterDecimals(value, decimals);
-  return num.toLocaleString('fullwide', {
+  return Number(num).toLocaleString('fullwide', {
     maximumFractionDigits: decimals,
     useGrouping,
   });

packages/canonical-bridge-widget/src/core/utils/number.ts

@@ -1,6 +1,6 @@
 export const formatNumber = (value: number, decimals = 18, useGrouping = true) => {
   const num = removeAfterDecimals(value, decimals);
-  return num.toLocaleString('fullwide', {
+  return Number(num).toLocaleString('fullwide', {
     maximumFractionDigits: decimals,
     useGrouping,
   });

packages/canonical-bridge-widget/src/modules/aggregator/adapters/layerZero/components/LayerZeroOption.tsx

@@ -32,7 +32,6 @@ export const LayerZeroOption = () => {
       ? `${formatNumber(
           Number(formatUnits(BigInt(estimatedAmount?.['layerZero']), getToDecimals()['layerZero'])),
           8,
-          false,
         )}`
       : '--';
   }, [estimatedAmount, toTokenInfo, sendValue, getToDecimals]);

packages/canonical-bridge-widget/src/modules/transfer/hooks/useInputValidation.ts

@@ -7,12 +7,20 @@ import { useAppSelector } from '@/modules/store/StoreProvider';
 import { useSolanaBalance } from '@/modules/wallet/hooks/useSolanaBalance';
 import { MIN_SOL_TO_ENABLED_TX } from '@/core/constants';
 import { useIsWalletCompatible } from '@/modules/wallet/hooks/useIsWalletCompatible';
+import { useTokenUpperLimit } from '@/modules/aggregator/hooks/useTokenUpperLimit';
+import { useBridgeConfig } from '@/index';
 
 export const useInputValidation = () => {
   const { data } = useSolanaBalance();
   const isWalletCompatible = useIsWalletCompatible();
+  const {
+    transfer: { dollarUpperLimit },
+  } = useBridgeConfig();
   const solBalance = Number(data?.formatted);
   const fromChain = useAppSelector((state) => state.transfer.fromChain);
+  const selectedToken = useAppSelector((state) => state.transfer.selectedToken);
+
+  const priceInfo = useTokenUpperLimit(selectedToken);
   const validateInput = useCallback(
     ({
       balance,
@@ -39,6 +47,15 @@ export const useInputValidation = () => {
             isError: true,
           };
         }
+        // Check upper limit
+        if (priceInfo?.upperLimit && Number(value) >= Number(priceInfo?.upperLimit)) {
+          return {
+            text: `Transfer value over $${formatNumber(dollarUpperLimit)} (${formatNumber(
+              priceInfo.upperLimit,
+            )} ${selectedToken?.symbol}) or equivalent is not allowed`,
+            isError: true,
+          };
+        }
         // check if send amount is greater than token balance
         if (!!balance && value > balance) {
           return { text: `You have insufficient balance`, isError: true };
@@ -71,7 +88,14 @@ export const useInputValidation = () => {
         console.log(e);
       }
     },
-    [fromChain?.chainType, solBalance, isWalletCompatible],
+    [
+      fromChain?.chainType,
+      solBalance,
+      isWalletCompatible,
+      priceInfo,
+      dollarUpperLimit,
+      selectedToken?.symbol,
+    ],
   );
 
   return {