Signal/Desktop
1
0
Fork 0
mirror of https://github.com/signalapp/Signal-Desktop.git synced 2026-04-28 04:13:18 +01:00
Code Issues Packages Projects Releases Wiki Activity

Donations: Show progress, error and verify dialogs

Browse Source
This commit is contained in:
Scott Nonnenberg
2025-07-22 07:21:41 +10:00
committed by GitHub
parent 387fb8bfc1
commit 9fc0cedebb
21 changed files with 400 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
ts/components/PreferencesDonateFlow.tsx
View File

@@ -14,7 +14,10 @@ import classNames from 'classnames';
import type { LocalizerType } from '../types/Util';
import { useConfirmDiscard } from '../hooks/useConfirmDiscard';
import { Button, ButtonVariant } from './Button';
import type { HumanDonationAmount } from '../types/Donations';
import type {
DonationErrorType,
HumanDonationAmount,
} from '../types/Donations';
import {
ONE_TIME_DONATION_CONFIG_ID,
type DonationWorkflow,
@@ -63,6 +66,7 @@ const SUPPORT_URL = 'https://support.signal.org/hc/requests/new?desktop';
export type PropsDataType = {
i18n: LocalizerType;
donationAmountsConfig: OneTimeDonationHumanAmounts | undefined;
lastError: DonationErrorType | undefined;
validCurrencies: ReadonlyArray<string>;
workflow: DonationWorkflow | undefined;
renderDonationHero: () => JSX.Element;
@@ -84,6 +88,7 @@ export function PreferencesDonateFlow({
contentsRef,
i18n,
donationAmountsConfig,
lastError,
validCurrencies,
workflow,
clearWorkflow,
@@ -105,6 +110,7 @@ export function PreferencesDonateFlow({
const [cardExpiration, setCardExpiration] = useState('');
const [cardNumber, setCardNumber] = useState('');
const [cardCvc, setCardCvc] = useState('');
const [isDonateDisabled, setIsDonateDisabled] = useState(false);
const [cardNumberError, setCardNumberError] =
useState<CardNumberError | null>(null);
@@ -183,22 +189,45 @@ export function PreferencesDonateFlow({
return;
}
setIsDonateDisabled(true);
submitDonation({
currencyType: currency,
paymentAmount,
paymentDetail: cardDetail,
});
}, [amount, cardCvc, cardExpiration, cardNumber, currency, submitDonation]);
}, [
amount,
cardCvc,
cardExpiration,
cardNumber,
currency,
setIsDonateDisabled,
submitDonation,
]);
const isDonateDisabled = workflow !== undefined;
useEffect(() => {
if (!workflow || lastError) {
setIsDonateDisabled(false);
}
}, [lastError, setIsDonateDisabled, workflow]);
const onTryClose = useCallback(() => {
const onDiscard = () => {
// TODO: DESKTOP-8950
clearWorkflow();
};
const isDirty = Boolean(
(cardExpiration || cardNumber || cardCvc) && !isDonateDisabled
);
confirmDiscardIf(step === 'paymentDetails', onDiscard);
}, [confirmDiscardIf, step]);
confirmDiscardIf(isDirty, onDiscard);
}, [
cardCvc,
cardExpiration,
cardNumber,
clearWorkflow,
confirmDiscardIf,
isDonateDisabled,
]);
tryClose.current = onTryClose;
let innerContent: JSX.Element;