diff --git a/ts/components/DonationProgressModal.tsx b/ts/components/DonationProgressModal.tsx index 087a40fa16..d7b17315c4 100644 --- a/ts/components/DonationProgressModal.tsx +++ b/ts/components/DonationProgressModal.tsx @@ -36,7 +36,6 @@ export function DonationProgressModal(props: PropsType): JSX.Element { modalName="DonationProgressModal" noEscapeClose noMouseClose - onClose={() => undefined} >
diff --git a/ts/components/PreferencesDonateFlow.tsx b/ts/components/PreferencesDonateFlow.tsx index d2aa238c21..00af45a11b 100644 --- a/ts/components/PreferencesDonateFlow.tsx +++ b/ts/components/PreferencesDonateFlow.tsx @@ -614,22 +614,45 @@ function CardForm({ setCardCvcError(formResult.cardCvc.error ?? null); const cardDetail = cardFormToCardDetail(formResult); - if (cardDetail == null) { + if ( + cardDetail == null || + formResult.cardNumber.error || + formResult.cardExpiration.error || + formResult.cardCvc.error + ) { return; } onSubmit(cardDetail); }, [cardCvc, cardExpiration, cardNumber, onSubmit]); - const isDonateDisabled = - disabled || - !isOnline || - cardNumber === '' || - cardExpiration === '' || - cardCvc === '' || - cardNumberError != null || - cardExpirationError != null || - cardCvcError != null; + const isDonateDisabled = useMemo( + () => + disabled || + !isOnline || + cardNumber === '' || + cardExpiration === '' || + cardCvc === '' || + cardNumberError != null || + cardExpirationError != null || + cardCvcError != null, + [ + cardCvc, + cardCvcError, + cardExpiration, + cardExpirationError, + cardNumber, + cardNumberError, + disabled, + isOnline, + ] + ); + + const handleInputEnterKey = useCallback(() => { + if (!isDonateDisabled) { + handleDonateClicked(); + } + }, [handleDonateClicked, isDonateDisabled]); const donateButton = (