diff --git a/components/modals/BorrowModal.tsx b/components/modals/BorrowModal.tsx index 72ced98c..8b948983 100644 --- a/components/modals/BorrowModal.tsx +++ b/components/modals/BorrowModal.tsx @@ -1,5 +1,6 @@ import { toUiDecimals } from '@blockworks-foundation/mango-v4' import { ChevronDownIcon } from '@heroicons/react/solid' +import Decimal from 'decimal.js' import { useTranslation } from 'next-i18next' import Image from 'next/image' import React, { ChangeEvent, useCallback, useMemo, useState } from 'react' @@ -176,6 +177,7 @@ function BorrowModal({ isOpen, onClose, token }: ModalCombinedProps) {

0.00x

setInputAmount(x)} /> diff --git a/components/swap/LeverageSlider.tsx b/components/swap/LeverageSlider.tsx index 02ca1460..0b90ce30 100644 --- a/components/swap/LeverageSlider.tsx +++ b/components/swap/LeverageSlider.tsx @@ -1,9 +1,10 @@ import { ChangeEvent, useEffect, useMemo, useRef, useState } from 'react' import { toUiDecimals } from '@blockworks-foundation/mango-v4' import mangoStore from '../../store/state' +import Decimal from 'decimal.js' type LeverageSliderProps = { - amount?: number + amount: Decimal inputToken?: string outputToken?: string onChange: (x: string) => void @@ -14,11 +15,11 @@ const LeverageSlider = ({ leverageMax, onChange, }: { - amount?: number + amount: Decimal leverageMax: number onChange: (x: any) => any }) => { - const [value, setValue] = useState(0) + const [value, setValue] = useState(new Decimal(0)) const inputEl = useRef(null) useEffect(() => { @@ -30,16 +31,14 @@ const LeverageSlider = ({ target.style.backgroundSize = max - min === 0 ? '0% 100%' - : ((value - min) * 100) / (max - min) + '% 100%' + : ((value.toNumber() - min) * 100) / (max - min) + '% 100%' } }, [leverageMax, value]) useEffect(() => { - if (amount) { - onChange(amount) - setValue(amount) - } - }, [amount]) + onChange(amount.toString()) + setValue(amount) + }, [amount, onChange]) const handleSliderChange = (e: ChangeEvent) => { let target = e.target @@ -50,7 +49,7 @@ const LeverageSlider = ({ target.style.backgroundSize = ((val - min) * 100) / (max - min) + '% 100%' onChange(e.target.value) - setValue(parseFloat(e.target.value)) + setValue(new Decimal(e.target.value)) } return ( @@ -65,7 +64,7 @@ const LeverageSlider = ({ step={0.000001} className="w-full" onChange={handleSliderChange} - value={value} + value={value.toNumber()} > ) @@ -113,15 +112,21 @@ export const SwapLeverageSlider = ({ } export const BorrowLeverageSlider = ({ + amount, tokenMax, onChange, }: { + amount: Decimal tokenMax: number onChange: (x: any) => any }) => { return ( <> - + ) } diff --git a/components/swap/Swap.tsx b/components/swap/Swap.tsx index 9958582a..f81347db 100644 --- a/components/swap/Swap.tsx +++ b/components/swap/Swap.tsx @@ -123,7 +123,7 @@ const Swap = () => { s.swap.inputTokenInfo = outputTokenInfo s.swap.outputTokenInfo = inputTokenInfo }) - + setAmountInformValue('') setAnimateSwitchArrow( (prevanimateSwitchArrow) => prevanimateSwitchArrow + 1 ) @@ -320,7 +320,7 @@ const Swap = () => {

0.00x

setAmountInformValue(x)}