fix: max button when balace is lower than rent + fee (#419)

Aims to fix these:
MetaMask/metamask-mobile#15786
MetaMask/metamask-extension#32051
MetaMask/metamask-extension#32815

Please test them manually

Author: aganglada

packages/snap/snap.manifest.json

@@ -7,7 +7,7 @@
     "url": "https://github.com/MetaMask/snap-solana-wallet.git"
   },
   "source": {
-    "shasum": "WkwHuMRrHCDJcjBTlRH2F585oAj+/2fs5mSxWBaTZh8=",
+    "shasum": "hvVGh0uUMQKth6GUR+9uUbpagjPJVOSxLF2C4YWdOFk=",
     "location": {
       "npm": {
         "filePath": "dist/bundle.js",

packages/snap/src/features/confirmation/views/ConfirmTransactionRequest/render.tsx

@@ -183,8 +183,8 @@ export async function render(
         options,
       })
       .then(async (scan) => {
-        updatedContext2.scanFetchStatus = 'fetched';
         updatedContext2.scan = scan;
+        updatedContext2.scanFetchStatus = scan ? 'fetched' : 'error';
       })
       .catch(() => {
         updatedContext2.scan = null;

packages/snap/src/features/send/components/AmountInput/AmountInput.tsx

@@ -18,7 +18,6 @@ type AmountInputProps = {
   currency: string;
   currencyType: SendCurrencyType;
   locale: Locale;
-  error?: string;
   swapCurrencyButtonDisabled?: boolean;
 };
 
@@ -28,7 +27,6 @@ export const AmountInput: SnapComponent<AmountInputProps> = ({
   tokenSymbol,
   currency,
   currencyType,
-  error,
   locale,
   swapCurrencyButtonDisabled = false,
 }) => {
@@ -39,7 +37,7 @@ export const AmountInput: SnapComponent<AmountInputProps> = ({
       : tokenSymbol;
 
   return (
-    <Field label={translate('send.amountField')} error={error}>
+    <Field label={translate('send.amountField')}>
       <Input
         name={name}
         type="number"

packages/snap/src/features/send/validation/form.test.ts

@@ -126,6 +126,9 @@ describe('send form validation', () => {
           scope: Network.Testnet,
           currencyType: SendCurrencyType.TOKEN,
           feeEstimatedInSol: '0.000005',
+          selectedTokenMetadata: {
+            symbol: 'SOL',
+          },
           balances: {
             [MOCK_SOLANA_KEYRING_ACCOUNT_0.id]: {
               [KnownCaip19Id.SolTestnet]: {
@@ -155,7 +158,7 @@ describe('send form validation', () => {
         const context = createSolContext();
         const validator = amountInput(context);
         expect(validator('0')).toStrictEqual({
-          message: '',
+          message: 'Amount must be greater than 0.002',
           value: '0',
         });
       });
@@ -164,7 +167,7 @@ describe('send form validation', () => {
         const context = createSolContext();
         const validator = amountInput(context);
         expect(validator('1.5')).toStrictEqual({
-          message: 'Insufficient balance',
+          message: 'Insufficient balance: 1 SOL',
           value: '1.5',
         });
       });
@@ -213,6 +216,9 @@ describe('send form validation', () => {
           scope: Network.Testnet,
           currencyType: SendCurrencyType.TOKEN,
           feeEstimatedInSol: '0.000005',
+          selectedTokenMetadata: {
+            symbol: 'EURC',
+          },
           balances: {
             [MOCK_SOLANA_KEYRING_ACCOUNT_0.id]: {
               [KnownCaip19Id.EurcDevnet]: {
@@ -260,7 +266,7 @@ describe('send form validation', () => {
         const context = createSplContext();
         const validator = amountInput(context);
         expect(validator('150')).toStrictEqual({
-          message: 'Insufficient balance',
+          message: 'Insufficient balance: 100 EURC',
           value: '150',
         });
       });

packages/snap/src/features/send/validation/form.ts

@@ -133,6 +133,7 @@ export const amountInput = (context: SendContext) => {
     minimumBalanceForRentExemptionSol,
     preferences: { locale },
     feeEstimatedInSol,
+    selectedTokenMetadata,
   } = context;
   const translate = i18n(locale);
 
@@ -153,33 +154,19 @@ export const amountInput = (context: SendContext) => {
     const minimumBalanceForRentExemptionLamports = solToLamports(
       minimumBalanceForRentExemptionSol ?? '0',
     );
-
-    // If the value parses to 0, it's invalid but we don't want to show an error
-    if (tokenAmountLamports.isZero()) {
-      return { message: '', value };
-    }
+    const solBalance = getNativeTokenBalance(context);
+    const solBalanceLamports = solToLamports(solBalance);
+    const isNativeToken = getIsNativeToken(context);
 
     // If you try to send more than your balance, it's invalid
     const isAmountGreaterThanBalance = tokenAmountLamports.gt(balanceLamports);
     if (isAmountGreaterThanBalance) {
       return {
-        message: translate('send.insufficientBalance'),
+        message: `${translate('send.insufficientBalance')}: ${balance} ${selectedTokenMetadata?.symbol ?? ''}`,
         value,
       };
     }
 
-    // If you have 0 SOL, you can't pay for the fee, it's invalid
-    const solBalance = getNativeTokenBalance(context);
-    const solBalanceLamports = solToLamports(solBalance);
-    if (solBalanceLamports.isZero()) {
-      return {
-        message: translate('send.insuffientSolToCoverFee'),
-        value,
-      };
-    }
-
-    const isNativeToken = getIsNativeToken(context);
-
     if (isNativeToken) {
       // If the value is lower than the minimum balance for rent exemption, it's invalid
       const valueLowerThanMinimum = tokenAmountLamports.lt(
@@ -225,6 +212,19 @@ export const amountInput = (context: SendContext) => {
       }
     }
 
+    // If the value parses to 0, it's invalid but we don't want to show an error
+    if (tokenAmountLamports.isZero()) {
+      return { message: '', value };
+    }
+
+    // If you have 0 SOL, you can't pay for the fee, it's invalid
+    if (solBalanceLamports.isZero()) {
+      return {
+        message: translate('send.insuffientSolToCoverFee'),
+        value,
+      };
+    }
+
     return null;
   };
 };

packages/snap/src/features/send/views/SendForm/SendForm.tsx

@@ -105,6 +105,14 @@ export const SendForm = ({
 
   const showClearAddressButton = Boolean(toAddress && toAddress.length > 0);
 
+  const amountInputIsError = Boolean(
+    validation?.[SendFormNames.AmountInput]?.message,
+  );
+
+  const balanceText = amountInputIsError
+    ? (validation?.[SendFormNames.AmountInput]?.message ?? '')
+    : `${translate('send.balance')}: ${balance}`;
+
   const canReview =
     fromAccountId.length > 0 &&
     (amount ? amount.length > 0 : false) &&
@@ -178,7 +186,6 @@ export const SendForm = ({
                 </Field>
                 <AmountInput
                   name={SendFormNames.AmountInput}
-                  error={validation?.[SendFormNames.AmountInput]?.message ?? ''}
                   currencyType={currencyType}
                   tokenSymbol={tokenSymbol}
                   currency={currency}
@@ -189,14 +196,19 @@ export const SendForm = ({
                   }
                 />
               </Box>
-              <Box direction="horizontal" alignment="space-between" center>
-                {balance ? (
-                  <Text size="sm" color="muted">{`${translate(
-                    'send.balance',
-                  )}: ${balance}`}</Text>
-                ) : (
-                  <Box>{null}</Box>
-                )}
+              <Box
+                direction="horizontal"
+                alignment="space-between"
+                crossAlignment="start"
+              >
+                <Box direction="vertical" alignment="start">
+                  <Text
+                    size="sm"
+                    color={amountInputIsError ? 'error' : 'muted'}
+                  >
+                    {balanceText}
+                  </Text>
+                </Box>
                 <Button
                   size="sm"
                   name={SendFormNames.MaxAmountButton}

packages/snap/src/features/send/views/SendForm/events.tsx

@@ -295,7 +295,9 @@ async function onMaxAmountButtonClick({
 
     const maxAmountLamports = BigNumber.maximum(
       balanceInLamportsAfterCost,
-      BigNumber(0),
+      balanceInLamportsAfterCost.isNegative()
+        ? balanceInLamports
+        : BigNumber(0),
     );
 
     const maxAmountSol = lamportsToSol(maxAmountLamports);