* 🔧 Small fixes * ✨ Deposit into HLS Vault + Groudnwork for HLS Staking * Adjusted according to feedback * Adjusted according to feedback
45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
import React from 'react'
|
|
|
|
import Button from 'components/Button'
|
|
import { ArrowRight } from 'components/Icons'
|
|
import AssetSummary from 'components/Modals/HLS/Summary/AssetSummary'
|
|
import YourPosition from 'components/Modals/HLS/Summary/YourPosition'
|
|
import useBorrowAsset from 'hooks/useBorrowAsset'
|
|
import { BNCoin } from 'types/classes/BNCoin'
|
|
|
|
interface Props {
|
|
apy: number
|
|
borrowAmount: BigNumber
|
|
borrowAsset: Asset
|
|
collateralAsset: Asset
|
|
depositAmount: BigNumber
|
|
leverage: number
|
|
onClickBtn: () => void
|
|
positionValue: BigNumber
|
|
}
|
|
|
|
export default function Summary(props: Props) {
|
|
const borrowAsset = useBorrowAsset(props.borrowAsset.denom)
|
|
|
|
if (!borrowAsset) return null
|
|
|
|
return (
|
|
<div className='p-4 flex flex-col gap-4'>
|
|
<AssetSummary asset={props.collateralAsset} amount={props.depositAmount} />
|
|
<AssetSummary asset={borrowAsset} amount={props.borrowAmount} isBorrow />
|
|
<YourPosition
|
|
positionValue={BNCoin.fromDenomAndBigNumber('usd', props.positionValue)}
|
|
baseApy={props.apy || 0}
|
|
borrowRate={borrowAsset.borrowRate || 0}
|
|
leverage={props.leverage}
|
|
/>
|
|
<Button
|
|
onClick={props.onClickBtn}
|
|
text='Approve Funding Transaction'
|
|
rightIcon={<ArrowRight />}
|
|
className='mt-1'
|
|
/>
|
|
</div>
|
|
)
|
|
}
|