feat(ZapPayRequestForm): zap invoice design enhanced

This commit is contained in:
P. Reis 2024-06-05 18:12:17 -03:00
parent e7ef163a4e
commit c8313e2652
1 changed files with 10 additions and 6 deletions

View File

@ -4,7 +4,7 @@ import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
import { closeModal } from 'soapbox/actions/modals'; import { closeModal } from 'soapbox/actions/modals';
import CopyableInput from 'soapbox/components/copyable-input'; import CopyableInput from 'soapbox/components/copyable-input';
import { Modal, Button } from 'soapbox/components/ui'; import { Modal, Button, Stack } from 'soapbox/components/ui';
import { useAppDispatch } from 'soapbox/hooks'; import { useAppDispatch } from 'soapbox/hooks';
import type { Account as AccountEntity } from 'soapbox/types/entities'; import type { Account as AccountEntity } from 'soapbox/types/entities';
@ -34,11 +34,15 @@ const ZapInvoiceModal: React.FC<IZapInvoice> = ({ account, invoice, onClose }) =
return ( return (
<Modal title={renderTitle()} onClose={onClickClose}> <Modal title={renderTitle()} onClose={onClickClose}>
<QRCodeCanvas value={invoice} /> <Stack space={3} className='m-auto items-center'>
<CopyableInput value={invoice} /> <QRCodeCanvas value={invoice} />
<a href={'lightning:' + invoice}> <div className='w-full'>
<Button type='submit' theme='primary' icon={require('@tabler/icons/outline/folder-open.svg')} text={intl.formatMessage(messages.zap_open_wallet)} /> <CopyableInput value={invoice} />
</a> </div>
<a href={'lightning:' + invoice}>
<Button type='submit' theme='primary' icon={require('@tabler/icons/outline/folder-open.svg')} text={intl.formatMessage(messages.zap_open_wallet)} />
</a>
</Stack>
</Modal> </Modal>
); );
}; };