fix: introduce shortened connect button

This commit is contained in:
Linkie Link 2024-02-23 11:46:12 +01:00
parent 860079b071
commit 103246261f
No known key found for this signature in database
GPG Key ID: 5318B0F2564D38EA
8 changed files with 15 additions and 3 deletions

View File

@ -15,6 +15,7 @@ interface Props {
color?: ButtonProps['color'] color?: ButtonProps['color']
variant?: ButtonProps['variant'] variant?: ButtonProps['variant']
size?: ButtonProps['size'] size?: ButtonProps['size']
short?: boolean
} }
export default function WalletConnectButton(props: Props) { export default function WalletConnectButton(props: Props) {

View File

@ -75,6 +75,7 @@ export default function AccountBalancesTable(props: Props) {
}, },
}) })
}} }}
short
/> />
</div> </div>
</ConditionalWrapper> </ConditionalWrapper>

View File

@ -54,6 +54,7 @@ export default function BorrowButton(props: Props) {
e.stopPropagation() e.stopPropagation()
}} }}
text='Borrow' text='Borrow'
short
/> />
</ConditionalWrapper> </ConditionalWrapper>
</div> </div>

View File

@ -9,8 +9,12 @@ import useAccountIds from 'hooks/accounts/useAccountIds'
import useAccountId from 'hooks/useAccountId' import useAccountId from 'hooks/useAccountId'
import useStore from 'store' import useStore from 'store'
export default function ActionButton(props: ButtonProps) { interface Props extends ButtonProps {
const { className, color, variant, size } = props short?: boolean
}
export default function ActionButton(props: Props) {
const { className, color, variant, size, short } = props
const defaultProps = { className, color, variant, size } const defaultProps = { className, color, variant, size }
const address = useStore((s) => s.address) const address = useStore((s) => s.address)
const isV1 = useStore((s) => s.isV1) const isV1 = useStore((s) => s.isV1)
@ -22,7 +26,8 @@ export default function ActionButton(props: ButtonProps) {
useStore.setState({ focusComponent: { component: <AccountCreateFirst /> } }) useStore.setState({ focusComponent: { component: <AccountCreateFirst /> } })
}, []) }, [])
if (!address) return <WalletConnectButton {...defaultProps} /> if (!address)
return <WalletConnectButton {...defaultProps} textOverride={short ? 'Connect' : undefined} />
if (accountIds && accountIds.length === 0) { if (accountIds && accountIds.length === 0) {
return ( return (

View File

@ -34,6 +34,7 @@ export const Deposit = (props: Props) => {
color='tertiary' color='tertiary'
text='Deposit' text='Deposit'
leftIcon={<Plus />} leftIcon={<Plus />}
short
/> />
</div> </div>
) )

View File

@ -56,6 +56,7 @@ export default function LendButton(props: Props) {
e.stopPropagation() e.stopPropagation()
}} }}
text='Lend' text='Lend'
short
/> />
</ConditionalWrapper> </ConditionalWrapper>
</div> </div>

View File

@ -43,6 +43,7 @@ export default function BorrowButton(props: Props) {
e.stopPropagation() e.stopPropagation()
}} }}
text='Borrow' text='Borrow'
short
/> />
</ConditionalWrapper> </ConditionalWrapper>
</div> </div>

View File

@ -43,6 +43,7 @@ export default function DepositButton(props: Props) {
e.stopPropagation() e.stopPropagation()
}} }}
text='Deposit' text='Deposit'
short
/> />
</ConditionalWrapper> </ConditionalWrapper>
</div> </div>