35 lines
1.0 KiB
TypeScript
35 lines
1.0 KiB
TypeScript
import { FormattedNumber } from 'components/FormattedNumber'
|
|
import Text from 'components/Text'
|
|
|
|
interface Props {
|
|
availableLiquidity: BigNumber
|
|
asset: BorrowAsset
|
|
}
|
|
|
|
export default function AvailableLiquidityMessage(props: Props) {
|
|
const { availableLiquidity, asset } = props
|
|
return (
|
|
<div className='flex items-start p-4 bg-white/5'>
|
|
<div className='flex flex-col gap-2'>
|
|
<Text size='sm'>Not enough Liquidty!</Text>
|
|
<Text size='xs' className='text-white/40'>
|
|
{`This transaction would exceed the amount of ${asset.symbol} currently available for borrowing on Mars.`}
|
|
</Text>
|
|
|
|
<div className='flex gap-1'>
|
|
<Text size='xs'>Available Liquidity:</Text>
|
|
<FormattedNumber
|
|
amount={availableLiquidity.toNumber()}
|
|
options={{
|
|
abbreviated: true,
|
|
decimals: asset.decimals,
|
|
suffix: ` ${asset.symbol}`,
|
|
}}
|
|
className='text-xs text-white/60'
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|