c08ee627fc
* feat: handle URLs with or without trailing slash (#803) * feat: handle URLs with or without trailing slash * tidy: cleanup slashes * Fix docker build (#805) * fix: fixed the docker build * tidy: cleanup * env: remove env contents (#808) * Portfolio fix (#809) * fix: fixed the portfolio account detail page layout * fix: fixed portfolio cards * tidy: refactor * align buttons, perps row clickable (#807) * align buttons, perps row clickable * fix comments * update to v2.2.4 * fix borrowbutton logic, add vault deposit manage btn, fix icon size vault modal --------- Co-authored-by: Linkie Link <linkielink.dev@gmail.com> --------- Co-authored-by: Bob van der Helm <34470358+bobthebuidlr@users.noreply.github.com>
61 lines
1.9 KiB
TypeScript
61 lines
1.9 KiB
TypeScript
import ActionButton from 'components/common/Button/ActionButton'
|
||
import { ArrowUpLine } from 'components/common/Icons'
|
||
import Text from 'components/common/Text'
|
||
import { Tooltip } from 'components/common/Tooltip'
|
||
import ConditionalWrapper from 'hocs/ConditionalWrapper'
|
||
import useAccountId from 'hooks/useAccountId'
|
||
import useCurrentAccountDeposits from 'hooks/useCurrentAccountDeposits'
|
||
import useLendAndReclaimModal from 'hooks/useLendAndReclaimModal'
|
||
import useStore from 'store'
|
||
import { byDenom } from 'utils/array'
|
||
|
||
export const LEND_BUTTON_META = {
|
||
accessorKey: 'lend',
|
||
enableSorting: false,
|
||
header: '',
|
||
}
|
||
|
||
interface Props {
|
||
data: LendingMarketTableData
|
||
}
|
||
export default function LendButton(props: Props) {
|
||
const { openLend } = useLendAndReclaimModal()
|
||
const accountDeposits = useCurrentAccountDeposits()
|
||
const assetDepositAmount = accountDeposits.find(byDenom(props.data.asset.denom))?.amount
|
||
const address = useStore((s) => s.address)
|
||
const accountId = useAccountId()
|
||
const hasNoDeposit = !!(!assetDepositAmount && address && accountId)
|
||
|
||
return (
|
||
<div className='flex justify-end'>
|
||
<ConditionalWrapper
|
||
condition={hasNoDeposit}
|
||
wrapper={(children) => (
|
||
<Tooltip
|
||
type='warning'
|
||
content={
|
||
<Text size='sm'>{`You don’t have any ${props.data.asset.symbol}.
|
||
Please first deposit ${props.data.asset.symbol} into your Credit Account before lending.`}</Text>
|
||
}
|
||
contentClassName='max-w-[200px]'
|
||
className='ml-auto'
|
||
>
|
||
{children}
|
||
</Tooltip>
|
||
)}
|
||
>
|
||
<ActionButton
|
||
leftIcon={<ArrowUpLine />}
|
||
disabled={hasNoDeposit}
|
||
color='tertiary'
|
||
onClick={(e) => {
|
||
openLend(props.data)
|
||
e.stopPropagation()
|
||
}}
|
||
text='Lend'
|
||
/>
|
||
</ConditionalWrapper>
|
||
</div>
|
||
)
|
||
}
|