fix the donate input bug

PalisadoesFoundation · Aug 22, 2024 · d8cd88a · d8cd88a
1 parent 968c284
commit d8cd88a
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
@@ -854,7 +854,9 @@
     "yourPreviousDonations": "Your Previous Donations",
     "donate": "Donate",
     "nothingToShow": "Nothing to show here.",
-    "success": "Donation Successful"
+    "success": "Donation Successful",
+    "invalidAmount": "Please enter a numerical value for the donation amount.",
+    "donationAmountDescription": "Please enter the numerical value for the donation amount."
   },
   "userEvents": {
     "title": "Events",

diff --git a/src/screens/UserPortal/Donate/Donate.tsx b/src/screens/UserPortal/Donate/Donate.tsx
@@ -128,6 +128,11 @@ export default function donate(): JSX.Element {
   }, [donationData]);
 
   const donateToOrg = (): void => {
+    // check if the amount is non empty and is a number
+    if (amount === '' || Number.isNaN(Number(amount))) {
+      toast.error(t(`invalidAmount`));
+      return;
+    }
     try {
       donate({
         variables: {
@@ -216,6 +221,9 @@ export default function donate(): JSX.Element {
                 />
               </InputGroup>
             </div>
+            <Form.Text className="text-muted">
+              {t('donationAmountDescription')}
+            </Form.Text>
             <div className={styles.donateActions}>
               <Button
                 size="sm"