Merge branch 'alpha' into main

components/BorrowForm.tsx

@@ -10,7 +10,10 @@ import Decimal from 'decimal.js'
 import { useTranslation } from 'next-i18next'
 import Image from 'next/legacy/image'
 import React, { useCallback, useMemo, useState } from 'react'
-import NumberFormat, { NumberFormatValues } from 'react-number-format'
+import NumberFormat, {
+  NumberFormatValues,
+  SourceInfo,
+} from 'react-number-format'
 import mangoStore from '@store/mangoStore'
 import {
   ACCOUNT_ACTION_MODAL_INNER_HEIGHT,
@@ -79,10 +82,6 @@ function BorrowForm({ onSuccess, token }: BorrowFormProps) {
       : new Decimal(0)
   }, [mangoAccount, bank])
 
-  const setMax = useCallback(() => {
-    setInputAmount(tokenMax.toFixed())
-  }, [tokenMax])
-
   const handleSizePercentage = useCallback(
     (percentage: string) => {
       if (!bank) return
@@ -93,6 +92,11 @@ function BorrowForm({ onSuccess, token }: BorrowFormProps) {
     [tokenMax, bank]
   )
 
+  const setMax = useCallback(() => {
+    setInputAmount(tokenMax.toFixed())
+    handleSizePercentage('100')
+  }, [tokenMax, handleSizePercentage])
+
   const handleSelectToken = (token: string) => {
     setSelectedToken(token)
     setShowTokenList(false)
@@ -158,6 +162,13 @@ function BorrowForm({ onSuccess, token }: BorrowFormProps) {
     return []
   }, [mangoAccount, group])
 
+  const handleInputChange = (e: NumberFormatValues, info: SourceInfo) => {
+    if (info.source === 'event') {
+      setSizePercentage('')
+    }
+    setInputAmount(!Number.isNaN(Number(e.value)) ? e.value : '')
+  }
+
   const initHealth = useMemo(() => {
     return group && mangoAccount
       ? mangoAccount.getHealthRatioUi(group, HealthType.init)
@@ -258,11 +269,7 @@ function BorrowForm({ onSuccess, token }: BorrowFormProps) {
                   className="w-full rounded-lg rounded-l-none border border-th-input-border bg-th-input-bkg p-3 text-right font-mono text-xl tracking-wider text-th-fgd-1 focus:border-th-input-border-hover focus:outline-none md:hover:border-th-input-border-hover"
                   placeholder="0.00"
                   value={inputAmount}
-                  onValueChange={(e: NumberFormatValues) =>
-                    setInputAmount(
-                      !Number.isNaN(Number(e.value)) ? e.value : ''
-                    )
-                  }
+                  onValueChange={handleInputChange}
                   isAllowed={withValueLimit}
                 />
               </div>

components/swap/SwapReviewRouteInfo.tsx

@@ -333,7 +333,7 @@ const SwapReviewRouteInfo = ({
             </p>
           </div>
         </div>
-        <div className="thin-scroll max-h-[218px] space-y-2 overflow-auto px-6 lg:max-h-[222px]">
+        <div className="space-y-2 overflow-auto px-6">
           <div className="flex justify-between">
             <p className="text-sm text-th-fgd-3">{t('swap:rate')}</p>
             <div>