LaconicNetwork/mars-v2-frontend
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

MP-2912 Margin trading implementation (#342)

Browse Source 
* fix(useSWR): request hooks revalidation on focus disabled

* [trade] add margin

* [trade] include borrow rate in receipt

* [trade] add tooltip margin and pr comments

* updated regardign comments

---------

Co-authored-by: Yusuf Seyrek <yusuf@delphilabs.io>
This commit is contained in:
Bob van der Helm 2023-08-07 12:51:52 +02:00 committed by GitHub
parent c25d8607e8
commit b35c743286
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 302 additions and 173 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -24,6 +24,7 @@
"bignumber.js": "^9.1.1",
"classnames": "^2.3.2",
"debounce-promise": "^3.1.2",
"lodash.throttle": "^4.1.1",
"moment": "^2.29.4",
"next": "13.4.9",
"react": "^18.2.0",
@ -46,6 +47,7 @@
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^14.0.0",
"@types/debounce-promise": "^3.1.6",
"@types/lodash.throttle": "^4.1.7",
"@types/node": "^20.4.4",
"@types/react": "18.2.14",
"@types/react-dom": "18.2.7",

9
src/components/RangeInput/InputOverlay.tsx
View File

@ -6,12 +6,13 @@ interface Props {
max: number
}
const THUMB_WIDTH = 33
function InputOverlay({ max, value, marginThreshold }: Props) {
// 33 is the thumb width
const thumbPosPercent = 100 / (max / value)
const thumbPadRight = (thumbPosPercent / 100) * 33
const thumbPosPercent = max === 0 ? 0 : 100 / (max / value)
const thumbPadRight = (thumbPosPercent / 100) * THUMB_WIDTH
const markPosPercent = 100 / (max / (marginThreshold ?? 1))
const markPadRight = (markPosPercent / 100) * 33
const markPadRight = (markPosPercent / 100) * THUMB_WIDTH
const hasPastMarginThreshold = marginThreshold ? value >= marginThreshold : undefined
return (

6
src/components/RangeInput/index.tsx
View File

@ -3,6 +3,8 @@ import classNames from 'classnames'
import InputOverlay from 'components/RangeInput/InputOverlay'
const LEFT_MARGIN = 5
type Props = {
max: number
value: number
@ -23,6 +25,8 @@ function RangeInput(props: Props) {
[onChange],
)
const markPosPercent = 100 / (max / (marginThreshold ?? 1))
return (
<div
className={classNames(className.containerDefault, wrapperClassName, {
@ -46,7 +50,7 @@ function RangeInput(props: Props) {
/>
</div>
<div className={className.legendWrapper}>
<span>0</span>
<span>{markPosPercent > LEFT_MARGIN ? 0 : ''}</span>
<span>{max.toFixed(2)}</span>
</div>
</div>

4
src/components/Trade/TradeChart/OsmosisTheGraphDataFeed.ts
View File

@ -202,8 +202,8 @@ export class OsmosisTheGraphDataFeed implements IDatafeedChartApi {
body: JSON.stringify({ query }),
})
.then((res) => res.json())
.then((json: { data: { candles: BarQueryData[] } }) => {
return this.resolveBarData(json.data.candles, base)
.then((json: { data?: { candles: BarQueryData[] } }) => {
return this.resolveBarData(json.data?.candles || [], base)
})
.catch((err) => {
if (this.debug) console.error(err)

15
src/components/Trade/TradeModule/SwapForm/MarginToggle.tsx
View File

@ -7,6 +7,7 @@ import ConditionalWrapper from 'hocs/ConditionalWrapper'
interface Props {
checked: boolean
onChange: (value: boolean) => void
borrowAssetSymbol: string
disabled?: boolean
}
@ -18,14 +19,24 @@ export default function MarginToggle(props: Props) {
<ConditionalWrapper
condition={!!props.disabled}
wrapper={(children) => (
<Tooltip type='info' content={<Text size='sm'>Margin is not supported yet.</Text>}>
<Tooltip
type='info'
content={
<Text size='sm'>
{props.borrowAssetSymbol} is not a borrowable asset. Please choose another asset to
sell in order to margin trade.
</Text>
}
>
{children}
</Tooltip>
)}
>
<div className='flex flex-row'>
<Switch {...props} name='margin' />
<InfoCircle width={16} height={16} className='ml-2 mt-0.5 opacity-20' />
{props.disabled && (
<InfoCircle width={16} height={16} className='ml-2 mt-0.5 opacity-20' />
)}
</div>
</ConditionalWrapper>
</div>

28
src/components/Trade/TradeModule/SwapForm/TradeSummary.tsx
View File

@ -1,18 +1,21 @@
import classNames from 'classnames'
import { useCallback, useMemo, useState } from 'react'
import { useMemo } from 'react'
import ActionButton from 'components/Button/ActionButton'
import useSwapRoute from 'hooks/useSwapRoute'
import { getAssetByDenom } from 'utils/assets'
import { hardcodedFee } from 'utils/constants'
import { formatAmountWithSymbol } from 'utils/formatters'
import { formatAmountWithSymbol, formatPercent } from 'utils/formatters'
interface Props {
buyAsset: Asset
sellAsset: Asset
borrowRate?: number | null
buyButtonDisabled: boolean
containerClassName?: string
showProgressIndicator: boolean
isMargin?: boolean
borrowAmount: BigNumber
buyAction: () => void
}
@ -20,9 +23,12 @@ export default function TradeSummary(props: Props) {
const {
buyAsset,
sellAsset,
borrowRate,
buyAction,
buyButtonDisabled,
containerClassName,
isMargin,
borrowAmount,
showProgressIndicator,
} = props
const { data: routes, isLoading: isRouteLoading } = useSwapRoute(sellAsset.denom, buyAsset.denom)
@ -49,6 +55,24 @@ export default function TradeSummary(props: Props) {
<span className={className.infoLineLabel}>Fees</span>
<span>{formatAmountWithSymbol(hardcodedFee.amount[0])}</span>
</div>
{isMargin && (
<>
<div className={className.infoLine}>
<span className={className.infoLineLabel}>Borrowing</span>
<span>
{formatAmountWithSymbol({
denom: sellAsset.denom,
amount: borrowAmount.toString(),
})}
</span>
</div>
<div className={className.infoLine}>
<span className={className.infoLineLabel}>Borrow rate</span>
<span>{formatPercent(borrowRate || 0)}</span>
</div>
</>
)}
<div className={className.infoLine}>
<span className={className.infoLineLabel}>Route</span>
<span>{parsedRoutes}</span>

183
src/components/Trade/TradeModule/SwapForm/index.tsx
View File

@ -8,10 +8,10 @@ import useCurrentAccount from 'hooks/useCurrentAccount'
import useLocalStorage from 'hooks/useLocalStorage'
import usePrices from 'hooks/usePrices'
import useStore from 'store'
import { byDenom } from 'utils/array'
import { byDenom, byTokenDenom } from 'utils/array'
import { hardcodedFee } from 'utils/constants'
import RangeInput from 'components/RangeInput'
import { BN } from 'utils/helpers'
import { asyncThrottle, BN } from 'utils/helpers'
import AssetAmountInput from 'components/Trade/TradeModule/SwapForm/AssetAmountInput'
import MarginToggle from 'components/Trade/TradeModule/SwapForm/MarginToggle'
import OrderTypeSelector from 'components/Trade/TradeModule/SwapForm/OrderTypeSelector'
@ -20,6 +20,7 @@ import TradeSummary from 'components/Trade/TradeModule/SwapForm/TradeSummary'
import { BNCoin } from 'types/classes/BNCoin'
import estimateExactIn from 'api/swap/estimateExactIn'
import useHealthComputer from 'hooks/useHealthComputer'
import useMarketBorrowings from 'hooks/useMarketBorrowings'
interface Props {
buyAsset: Asset
@ -33,20 +34,77 @@ export default function SwapForm(props: Props) {
const swap = useStore((s) => s.swap)
const [slippage] = useLocalStorage(SLIPPAGE_KEY, DEFAULT_SETTINGS.slippage)
const { computeMaxSwapAmount } = useHealthComputer(account)
const buyAmountEstimationTimeout = useRef<NodeJS.Timeout | undefined>(undefined)
const { data: borrowAssets } = useMarketBorrowings()
const [isMarginChecked, setMarginChecked] = useState(false)
const [buyAssetAmount, setBuyAssetAmount] = useState(BN_ZERO)
const [sellAssetAmount, setSellAssetAmount] = useState(BN_ZERO)
const focusedInput = useRef<'buy' | 'sell' | null>(null)
const [maxBuyableAmountEstimation, setMaxBuyableAmountEstimation] = useState(BN_ZERO)
const [selectedOrderType, setSelectedOrderType] = useState<AvailableOrderType>('Market')
const [isTransactionExecuting, setTransactionExecuting] = useState(false)
const [isConfirming, setIsConfirming] = useState(false)
const [maxSellAssetAmount, maxSellAssetAmountStr] = useMemo(() => {
const amount = computeMaxSwapAmount(sellAsset.denom, buyAsset.denom, 'default')
return [amount, amount.toString()]
}, [computeMaxSwapAmount, sellAsset.denom, buyAsset.denom])
const throttledEstimateExactIn = useMemo(() => asyncThrottle(estimateExactIn, 250), [])
const borrowAsset = useMemo(
() => borrowAssets.find(byDenom(sellAsset.denom)),
[borrowAssets, sellAsset.denom],
)
const onChangeSellAmount = useCallback(
(amount: BigNumber) => {
setSellAssetAmount(amount)
throttledEstimateExactIn(
{ denom: sellAsset.denom, amount: amount.toString() },
buyAsset.denom,
).then(setBuyAssetAmount)
},
[sellAsset.denom, throttledEstimateExactIn, buyAsset.denom],
)
const onChangeBuyAmount = useCallback(
(amount: BigNumber) => {
setBuyAssetAmount(amount)
const swapFrom = {
denom: buyAsset.denom,
amount: amount.toString(),
}
throttledEstimateExactIn(swapFrom, sellAsset.denom).then(setSellAssetAmount)
},
[buyAsset.denom, throttledEstimateExactIn, sellAsset.denom],
)
const handleRangeInputChange = useCallback(
(value: number) => {
onChangeSellAmount(BN(value).shiftedBy(sellAsset.decimals).integerValue())
},
[sellAsset.decimals, onChangeSellAmount],
)
const [maxSellAmount, marginThreshold] = useMemo(() => {
const maxAmount = computeMaxSwapAmount(sellAsset.denom, buyAsset.denom, 'default')
const maxAmountOnMargin = computeMaxSwapAmount(sellAsset.denom, buyAsset.denom, 'margin')
estimateExactIn(
{
denom: sellAsset.denom,
amount: (isMarginChecked ? maxAmountOnMargin : maxAmount).toString(),
},
buyAsset.denom,
).then(setMaxBuyableAmountEstimation)
if (isMarginChecked) return [maxAmountOnMargin, maxAmount]
if (sellAssetAmount.isGreaterThan(maxAmount)) onChangeSellAmount(maxAmount)
return [maxAmount, maxAmount]
}, [
computeMaxSwapAmount,
sellAsset.denom,
buyAsset.denom,
isMarginChecked,
onChangeSellAmount,
sellAssetAmount,
])
const [buyAssetValue, sellAssetValue] = useMemo(() => {
const buyAssetPrice = prices.find(byDenom(buyAsset.denom))?.amount ?? BN_ZERO
@ -67,55 +125,22 @@ export default function SwapForm(props: Props) {
])
useEffect(() => {
focusedInput.current = null
setBuyAssetAmount(BN_ZERO)
setSellAssetAmount(BN_ZERO)
}, [buyAsset.denom, sellAsset.denom])
useEffect(() => {
estimateExactIn({ denom: sellAsset.denom, amount: maxSellAssetAmountStr }, buyAsset.denom).then(
setMaxBuyableAmountEstimation,
)
}, [maxSellAssetAmountStr, buyAsset.denom, sellAsset.denom])
useEffect(() => {
if (focusedInput.current === 'sell') {
if (buyAmountEstimationTimeout.current) {
clearTimeout(buyAmountEstimationTimeout.current)
}
buyAmountEstimationTimeout.current = setTimeout(
() =>
estimateExactIn(
{ denom: sellAsset.denom, amount: sellAssetAmount.toString() },
buyAsset.denom,
)
.then(setBuyAssetAmount)
.then(() => clearTimeout(buyAmountEstimationTimeout?.current)),
250,
)
}
}, [buyAsset.denom, focusedInput, sellAsset.denom, sellAssetAmount])
useEffect(() => {
if (focusedInput.current === 'buy') {
estimateExactIn(
{
denom: buyAsset.denom,
amount: buyAssetAmount.toString(),
},
sellAsset.denom,
).then(setSellAssetAmount)
}
}, [buyAsset.denom, buyAssetAmount, focusedInput, sellAsset.denom])
const handleBuyClick = useCallback(async () => {
if (account?.id) {
setTransactionExecuting(true)
setIsConfirming(true)
const borrowCoin = sellAssetAmount.isGreaterThan(marginThreshold)
? BNCoin.fromDenomAndBigNumber(sellAsset.denom, sellAssetAmount.minus(marginThreshold))
: undefined
const isSucceeded = await swap({
fee: hardcodedFee,
accountId: account.id,
coinIn: BNCoin.fromDenomAndBigNumber(sellAsset.denom, sellAssetAmount.integerValue()),
borrow: borrowCoin,
denomOut: buyAsset.denom,
slippage,
})
@ -123,72 +148,78 @@ export default function SwapForm(props: Props) {
setSellAssetAmount(BN_ZERO)
setBuyAssetAmount(BN_ZERO)
}
setTransactionExecuting(false)
setIsConfirming(false)
}
}, [account?.id, buyAsset.denom, sellAsset.denom, sellAssetAmount, slippage, swap])
const dismissInputFocus = useCallback(() => (focusedInput.current = null), [])
const handleRangeInputChange = useCallback(
(value: number) => {
focusedInput.current = 'sell'
setSellAssetAmount(BN(value).shiftedBy(sellAsset.decimals).integerValue())
},
[sellAsset.decimals],
)
}, [
account?.id,
buyAsset.denom,
sellAsset.denom,
sellAssetAmount,
slippage,
swap,
marginThreshold,
])
return (
<>
<Divider />
<MarginToggle checked={isMarginChecked} onChange={setMarginChecked} disabled />
<MarginToggle
checked={isMarginChecked}
onChange={setMarginChecked}
disabled={!borrowAsset?.isMarket}
borrowAssetSymbol={sellAsset.symbol}
/>
<Divider />
<OrderTypeSelector selected={selectedOrderType} onChange={setSelectedOrderType} />
<AssetAmountInput
label='Buy'
max={maxBuyableAmountEstimation}
amount={buyAssetAmount}
setAmount={setBuyAssetAmount}
setAmount={onChangeBuyAmount}
asset={buyAsset}
assetUSDValue={buyAssetValue}
maxButtonLabel='Max Amount:'
containerClassName='mx-3 my-6'
onBlur={dismissInputFocus}
onFocus={() => (focusedInput.current = 'buy')}
disabled={isTransactionExecuting}
disabled={isConfirming}
/>
<RangeInput
wrapperClassName='p-4'
onBlur={dismissInputFocus}
disabled={isTransactionExecuting || maxSellAssetAmount.isZero()}
disabled={isConfirming || maxSellAmount.isZero()}
onChange={handleRangeInputChange}
value={sellAssetAmount.shiftedBy(-sellAsset.decimals).toNumber()}
max={maxSellAssetAmount.shiftedBy(-sellAsset.decimals).toNumber()}
max={maxSellAmount.shiftedBy(-sellAsset.decimals).toNumber()}
marginThreshold={
isMarginChecked ? marginThreshold.shiftedBy(-sellAsset.decimals).toNumber() : undefined
}
/>
<AssetAmountInput
label='Sell'
max={maxSellAssetAmount}
max={maxSellAmount}
amount={sellAssetAmount}
setAmount={setSellAssetAmount}
setAmount={onChangeSellAmount}
assetUSDValue={sellAssetValue}
asset={sellAsset}
maxButtonLabel='Balance:'
containerClassName='mx-3'
onBlur={dismissInputFocus}
onFocus={() => (focusedInput.current = 'sell')}
disabled={isTransactionExecuting}
disabled={isConfirming}
/>
<TradeSummary
containerClassName='m-3 mt-10'
buyAsset={buyAsset}
sellAsset={sellAsset}
borrowRate={borrowAsset?.borrowRate}
buyAction={handleBuyClick}
buyButtonDisabled={sellAssetAmount.isZero()}
showProgressIndicator={isTransactionExecuting}
showProgressIndicator={isConfirming}
isMargin={isMarginChecked}
borrowAmount={
sellAssetAmount.isGreaterThan(marginThreshold)
? sellAssetAmount.minus(marginThreshold)
: BN_ZERO
}
/>
</>
)

98
src/components/Wallet/WalletConnecting.tsx
View File

@ -1,6 +1,6 @@
import { CosmWasmClient } from '@cosmjs/cosmwasm-stargate'
import { useShuttle } from '@delphi-labs/shuttle-react'
import { useEffect } from 'react'
import { useCallback, useEffect } from 'react'
import { CircularProgress } from 'components/CircularProgress'
import FullOverlayContent from 'components/FullOverlayContent'
@ -35,48 +35,64 @@ export default function WalletConnecting(props: Props) {
const providerId = props.providerId ?? recentWallet?.providerId
const isAutoConnect = props.autoConnect
const handleConnect = async (extensionProviderId: string) => {
setIsConnecting(true)
const handleConnect = useCallback(
(extensionProviderId: string) => {
async function handleConnectAsync() {
setIsConnecting(true)
try {
const provider = extensionProviders.find((p) => p.id === providerId)
const response =
isAutoConnect && provider
? await provider.connect({ chainId: currentChainId })
: await connect({ extensionProviderId, chainId: currentChainId })
const cosmClient = await CosmWasmClient.connect(response.network.rpc)
const walletClient: WalletClient = {
broadcast,
cosmWasmClient: cosmClient,
connectedWallet: response,
sign,
simulate,
try {
const provider = extensionProviders.find((p) => p.id === providerId)
const response =
isAutoConnect && provider
? await provider.connect({ chainId: currentChainId })
: await connect({ extensionProviderId, chainId: currentChainId })
const cosmClient = await CosmWasmClient.connect(response.network.rpc)
const walletClient: WalletClient = {
broadcast,
cosmWasmClient: cosmClient,
connectedWallet: response,
sign,
simulate,
}
setIsConnecting(false)
useStore.setState({
client: walletClient,
address: response.account.address,
focusComponent: <WalletFetchBalancesAndAccounts />,
})
} catch (error) {
if (error instanceof Error) {
setIsConnecting(false)
useStore.setState({
client: undefined,
address: undefined,
accounts: null,
focusComponent: (
<WalletSelect
error={{
title: 'Failed to connect to wallet',
message: mapErrorMessages(extensionProviderId, error.message),
}}
/>
),
})
}
}
}
setIsConnecting(false)
useStore.setState({
client: walletClient,
address: response.account.address,
focusComponent: <WalletFetchBalancesAndAccounts />,
})
} catch (error) {
if (error instanceof Error) {
setIsConnecting(false)
useStore.setState({
client: undefined,
address: undefined,
accounts: null,
focusComponent: (
<WalletSelect
error={{
title: 'Failed to connect to wallet',
message: mapErrorMessages(extensionProviderId, error.message),
}}
/>
),
})
}
}
}
handleConnectAsync()
},
[
broadcast,
connect,
extensionProviders,
isAutoConnect,
providerId,
setIsConnecting,
sign,
simulate,
],
)
useEffect(() => {
if (isConnecting || !providerId) return

100
src/hooks/useHealthComputer.tsx
View File

@ -43,57 +43,66 @@ export default function useHealthComputer(account?: Account) {
const vaultPositionValues = useMemo(() => {
if (!account?.vaults) return null
return account.vaults.reduce((prev, curr) => {
const baseCoinPrice = prices.find((price) => price.denom === curr.denoms.lp)?.amount || 0
prev[curr.address] = {
base_coin: {
amount: '0', // Not used by healthcomputer
denom: curr.denoms.lp,
value: curr.amounts.unlocking.times(baseCoinPrice).integerValue().toString(),
},
vault_coin: {
amount: '0', // Not used by healthcomputer
denom: curr.denoms.vault,
value: curr.values.primary
.div(baseCurrencyPrice)
.plus(curr.values.secondary.div(baseCurrencyPrice))
.integerValue()
.toString(),
},
}
return prev
}, {} as { [key: string]: VaultPositionValue })
return account.vaults.reduce(
(prev, curr) => {
const baseCoinPrice = prices.find((price) => price.denom === curr.denoms.lp)?.amount || 0
prev[curr.address] = {
base_coin: {
amount: '0', // Not used by healthcomputer
denom: curr.denoms.lp,
value: curr.amounts.unlocking.times(baseCoinPrice).integerValue().toString(),
},
vault_coin: {
amount: '0', // Not used by healthcomputer
denom: curr.denoms.vault,
value: curr.values.primary
.div(baseCurrencyPrice)
.plus(curr.values.secondary.div(baseCurrencyPrice))
.integerValue()
.toString(),
},
}
return prev
},
{} as { [key: string]: VaultPositionValue },
)
}, [account?.vaults, prices, baseCurrencyPrice])
const priceData = useMemo(() => {
const baseCurrencyPrice =
prices.find((price) => price.denom === baseCurrency.denom)?.amount || 0
return prices.reduce((prev, curr) => {
prev[curr.denom] = curr.amount.div(baseCurrencyPrice).decimalPlaces(18).toString()
return prev
}, {} as { [key: string]: string })
return prices.reduce(
(prev, curr) => {
prev[curr.denom] = curr.amount.div(baseCurrencyPrice).decimalPlaces(18).toString()
return prev
},
{} as { [key: string]: string },
)
}, [prices, baseCurrency.denom])
const denomsData = useMemo(
() =>
assetParams.reduce((prev, curr) => {
const params: AssetParamsBaseForAddr = {
...curr,
// The following overrides are required as testnet is 'broken' and new contracts are not updated yet
// These overrides are not used by the healthcomputer internally, so they're not important anyways.
protocol_liquidation_fee: '1',
liquidation_bonus: {
max_lb: '1',
min_lb: '1',
slope: '1',
starting_lb: '1',
},
}
prev[params.denom] = params
assetParams.reduce(
(prev, curr) => {
const params: AssetParamsBaseForAddr = {
...curr,
// The following overrides are required as testnet is 'broken' and new contracts are not updated yet
// These overrides are not used by the healthcomputer internally, so they're not important anyways.
protocol_liquidation_fee: '1',
liquidation_bonus: {
max_lb: '1',
min_lb: '1',
slope: '1',
starting_lb: '1',
},
}
prev[params.denom] = params
return prev
}, {} as { [key: string]: AssetParamsBaseForAddr }),
return prev
},
{} as { [key: string]: AssetParamsBaseForAddr },
),
[assetParams],
)
@ -103,10 +112,13 @@ export default function useHealthComputer(account?: Account) {
const vaultPositionDenoms = positions.vaults.map((vault) => vault.vault.address)
return vaultConfigs
.filter((config) => vaultPositionDenoms.includes(config.addr))
.reduce((prev, curr) => {
prev[curr.addr] = curr
return prev
}, {} as { [key: string]: VaultConfigBaseForString })
.reduce(
(prev, curr) => {
prev[curr.addr] = curr
return prev
},
{} as { [key: string]: VaultConfigBaseForString },
)
}, [vaultConfigs, positions])
const healthComputer: HealthComputer | null = useMemo(() => {

2
src/store/slices/broadcast.ts
View File

@ -363,6 +363,7 @@ export default function createBroadcastSlice(
fee: StdFee
accountId: string
coinIn: BNCoin
borrow?: BNCoin
denomOut: string
slippage: number
}) => {
@ -370,6 +371,7 @@ export default function createBroadcastSlice(
update_credit_account: {
account_id: options.accountId,
actions: [
...(options.borrow ? [{ borrow: options.borrow.toCoin() }] : []),
{
swap_exact_in: {
coin_in: options.coinIn.toActionCoin(),

1
src/types/interfaces/store/broadcast.d.ts vendored
View File

@ -61,6 +61,7 @@ interface BroadcastSlice {
fee: StdFee
accountId: string
coinIn: BNCoin
borrow: BNCoin
denomOut: string
slippage: number
}) => Promise<boolean>

2
src/utils/accounts.ts
View File

@ -100,7 +100,7 @@ export function convertAccountToPositions(account: Account): Positions {
],
},
},
} as VaultPosition),
}) as VaultPosition,
),
}
}

13
src/utils/helpers.ts
View File

@ -1,4 +1,5 @@
import BigNumber from 'bignumber.js'
import throttle from 'lodash.throttle'
BigNumber.config({ EXPONENTIAL_AT: 1e9 })
export function BN(n: BigNumber.Value) {
@ -10,3 +11,15 @@ export function getApproximateHourlyInterest(amount: string, borrowRate: number)
.dividedBy(24 * 365)
.multipliedBy(amount)
}
export function asyncThrottle<F extends (...args: any[]) => Promise<any>>(func: F, wait?: number) {
const throttled = throttle((resolve, reject, args: Parameters<F>) => {
func(...args)
.then(resolve)
.catch(reject)
}, wait)
return (...args: Parameters<F>): ReturnType<F> =>
new Promise((resolve, reject) => {
throttled(resolve, reject, args)
}) as ReturnType<F>
}

12
yarn.lock
View File

@ -3564,6 +3564,13 @@
resolved "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz"
integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==
"@types/lodash.throttle@^4.1.7":
version "4.1.7"
resolved "https://registry.yarnpkg.com/@types/lodash.throttle/-/lodash.throttle-4.1.7.tgz#4ef379eb4f778068022310ef166625f420b6ba58"
integrity sha512-znwGDpjCHQ4FpLLx19w4OXDqq8+OvREa05H89obtSyXyOFKL3dDjCslsmfBz0T2FU8dmf5Wx1QvogbINiGIu9g==
dependencies:
"@types/lodash" "*"
"@types/lodash.values@^4.3.6":
version "4.3.7"
resolved "https://registry.npmjs.org/@types/lodash.values/-/lodash.values-4.3.7.tgz"
@ -7317,6 +7324,11 @@ lodash.sortby@^4.7.0:
resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438"
integrity sha512-HDWXG8isMntAyRF5vZ7xKuEvOhT4AhlRt/3czTSjvGUxjYCBVRQY48ViDHyfYz9VIoBkW4TMGQNapx+l3RUwdA==
lodash.throttle@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/lodash.throttle/-/lodash.throttle-4.1.1.tgz#c23e91b710242ac70c37f1e1cda9274cc39bf2f4"
integrity sha512-wIkUCfVKpVsWo3JSZlc+8MB5it+2AN5W8J7YVMST30UrvcQNZ1Okbj+rbVniijTWE6FGYy4XJq/rHkas8qJMLQ==
lodash.values@^4.3.0:
version "4.3.0"
resolved "https://registry.npmjs.org/lodash.values/-/lodash.values-4.3.0.tgz"