feat: Update donation amount input value handling

everydotorg · Aug 5, 2024 · aefdea9 · aefdea9
1 parent 29f4994
commit aefdea9
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/...donate-button-v4/src/components/widget/components/PaymentProcess/DonationAmount/index.tsx b/...donate-button-v4/src/components/widget/components/PaymentProcess/DonationAmount/index.tsx
@@ -104,7 +104,7 @@ export const DonationAmount = () => {
 				inputMode="numeric"
 				min={0}
 				step={1}
-				value={donationAmount ? donationAmount : undefined}
+				value={donationAmount ? donationAmount : ''}
 				prefix={DEFAULT_CURRENCY.symbol}
 				inputClassName={donationAmountInputCss}
 				prefixClassName={donationAmountInputPrefixCss}

diff --git a/packages/donate-button-v4/src/components/widget/context/WidgetContext.tsx b/packages/donate-button-v4/src/components/widget/context/WidgetContext.tsx
@@ -61,6 +61,11 @@ export const WidgetContextProvider: FunctionalComponent<{hide: () => void}> = ({
 	const [donationAmount, setDonationAmount] = useState(
 		config.amount ?? config.defaultDonationAmount
 	);
+
+	useEffect(() => {
+		setDonationAmount(config.amount);
+	}, [config.amount]);
+
 	const [submitError, setSubmitError] = useState<string | null>(null);
 	const [selectedPaymentMethod, setSelectedPaymentMethod] = useState(
 		config.methods[0]