fix slider performance

This commit is contained in:
tjs 2022-07-22 16:46:33 -04:00
parent 653168fb62
commit 27612f0a6a
1 changed files with 5 additions and 5 deletions

View File

@ -46,7 +46,7 @@ const Swap = () => {
const set = mangoStore.getState().set const set = mangoStore.getState().set
const tokens = mangoStore((s) => s.jupiterTokens) const tokens = mangoStore((s) => s.jupiterTokens)
const connected = mangoStore((s) => s.connected) const connected = mangoStore((s) => s.connected)
const debouncedAmountIn = useDebounce(amountIn, 500) const debouncedAmountIn = useDebounce(amountIn, 400)
useEffect(() => { useEffect(() => {
const connection = mangoStore.getState().connection const connection = mangoStore.getState().connection
@ -71,14 +71,14 @@ const Swap = () => {
const inputBank = group!.banksMap.get(inputToken) const inputBank = group!.banksMap.get(inputToken)
const outputBank = group!.banksMap.get(outputToken) const outputBank = group!.banksMap.get(outputToken)
if (!inputBank || !outputBank) return if (!inputBank || !outputBank) return
if (!amountIn) { if (!debouncedAmountIn) {
setAmountOut(undefined) setAmountOut(undefined)
setSelectedRoute(undefined) setSelectedRoute(undefined)
} else { } else {
const computedRoutes = await jupiter?.computeRoutes({ const computedRoutes = await jupiter?.computeRoutes({
inputMint: inputBank.mint, // Mint address of the input token inputMint: inputBank.mint, // Mint address of the input token
outputMint: outputBank.mint, // Mint address of the output token outputMint: outputBank.mint, // Mint address of the output token
inputAmount: Number(amountIn) * 10 ** inputBank.mintDecimals, // raw input amount of tokens inputAmount: Number(debouncedAmountIn) * 10 ** inputBank.mintDecimals, // raw input amount of tokens
slippage, // The slippage in % terms slippage, // The slippage in % terms
filterTopNResult: 10, filterTopNResult: 10,
onlyDirectRoutes: true, onlyDirectRoutes: true,
@ -107,7 +107,7 @@ const Swap = () => {
} }
loadRoutes() loadRoutes()
}, [inputToken, outputToken, jupiter, slippage, amountIn]) }, [inputToken, outputToken, jupiter, slippage, debouncedAmountIn])
const handleAmountInChange = useCallback( const handleAmountInChange = useCallback(
(e: ChangeEvent<HTMLInputElement>) => { (e: ChangeEvent<HTMLInputElement>) => {
@ -333,7 +333,7 @@ const Swap = () => {
<> <>
<div className="mb-2 flex items-center justify-between"> <div className="mb-2 flex items-center justify-between">
<p className="text-th-fgd-3">{t('leverage')}</p> <p className="text-th-fgd-3">{t('leverage')}</p>
<p className="font-bold text-th-fgd-1">0.00x</p> <p className="text-th-fgd-3">0.00x</p>
</div> </div>
<LeverageSlider <LeverageSlider
inputToken={inputToken} inputToken={inputToken}