* ✨Add basic modal for HLS staking * ✨UI components for Manage * ✨All Manage actions (except change lev) * 🐛hls intro icons + checkbox, hide repay when no debt, clickable dropdown * fix build
32 lines
918 B
TypeScript
32 lines
918 B
TypeScript
import React from 'react'
|
|
|
|
import Button from 'components/Button'
|
|
import { ArrowRight } from 'components/Icons'
|
|
import LeverageSummary from 'components/Modals/HLS/Deposit/LeverageSummary'
|
|
import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
|
|
|
|
interface Props {
|
|
amount: BigNumber
|
|
asset: Asset
|
|
max: BigNumber
|
|
onChangeAmount: (amount: BigNumber) => void
|
|
onClickBtn: () => void
|
|
positionValue: BigNumber
|
|
}
|
|
|
|
export default function Leverage(props: Props) {
|
|
return (
|
|
<div className='p-4 flex-col gap-6 flex'>
|
|
<TokenInputWithSlider
|
|
amount={props.amount}
|
|
asset={props.asset}
|
|
max={props.max}
|
|
onChange={props.onChangeAmount}
|
|
maxText='Max borrow'
|
|
/>
|
|
<LeverageSummary asset={props.asset} positionValue={props.positionValue} />
|
|
<Button onClick={props.onClickBtn} text='Continue' rightIcon={<ArrowRight />} />
|
|
</div>
|
|
)
|
|
}
|