mars-v2-frontend/src/components/Modals/HLS/Summary/index.tsx
Bob van der Helm 0325e311cb
Mp 3360 create vault position (#607)
* 🔧 Small fixes

*  Deposit into HLS Vault + Groudnwork for HLS Staking

* Adjusted according to feedback

* Adjusted according to feedback
2023-11-02 10:40:34 +01:00

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>
)
}