diff --git a/cashtab/src/components/Send/SendXec.tsx b/cashtab/src/components/Send/SendXec.tsx --- a/cashtab/src/components/Send/SendXec.tsx +++ b/cashtab/src/components/Send/SendXec.tsx @@ -69,6 +69,7 @@ TokenType, GenesisInfo, } from 'chronik-client'; +import { SendButtonContainer } from './styled'; const OuterCtn = styled.div` background: ${props => props.theme.primaryBackground}; @@ -241,6 +242,7 @@ protocol: '', data: '', }); + const [isSending, setIsSending] = useState<boolean>(false); interface SendXecFormData { amount: string; @@ -698,6 +700,7 @@ }; async function send() { + setIsSending(true); setFormData({ ...formData, }); @@ -796,12 +799,14 @@ clearInputForms(); setAirdropFlag(false); + setIsSending(false); if (txInfoFromUrl) { // Close window after successful tx window.close(); } } catch (err) { handleSendXecError(err as XecSendError); + setIsSending(false); } } @@ -1587,23 +1592,24 @@ </> )} </AmountPreviewCtn> - <PrimaryButton - style={{ marginTop: '12px' }} - disabled={ - (!isBip21TokenSend(parsedAddressInput) && - disableSendButton) || - (isBip21TokenSend(parsedAddressInput) && - tokenError !== false) || - tokenIdQueryError - } - onClick={ - isBip21TokenSend(parsedAddressInput) - ? checkForConfirmationBeforeBip21TokenSend - : checkForConfirmationBeforeSendXec - } - > - Send - </PrimaryButton> + <SendButtonContainer> + <PrimaryButton + disabled={ + (!isBip21TokenSend(parsedAddressInput) && + disableSendButton) || + (isBip21TokenSend(parsedAddressInput) && + tokenError !== false) || + tokenIdQueryError + } + onClick={ + isBip21TokenSend(parsedAddressInput) + ? checkForConfirmationBeforeBip21TokenSend + : checkForConfirmationBeforeSendXec + } + > + {isSending ? <InlineLoader /> : 'Send'} + </PrimaryButton> + </SendButtonContainer> {apiError && <ApiError />} </OuterCtn> ); diff --git a/cashtab/src/components/Send/styled.ts b/cashtab/src/components/Send/styled.ts new file mode 100644 --- /dev/null +++ b/cashtab/src/components/Send/styled.ts @@ -0,0 +1,24 @@ +// Copyright (c) 2025 The Bitcoin developers +// Distributed under the MIT software license, see the accompanying +// file COPYING or http://www.opensource.org/licenses/mit-license.php. + +import styled from 'styled-components'; + +export const SendButtonContainer = styled.div` + position: fixed; + bottom: 0; + left: 230px; + right: 40px; + padding: 12px 0; + display: flex; + justify-content: center; + @media (max-width: 768px) { + left: 0; + right: 0; + bottom: 80px; + padding: 12px; + button { + margin: 0; + } + } +`;