From dda154b4d0128d7bdee6c44cdc8b2d7dd47ff319 Mon Sep 17 00:00:00 2001
From: YanVictorSN <yanvictorsn@gmail.com>
Date: Mon, 3 Feb 2025 12:58:51 -0300
Subject: [PATCH] Update the 'Thank you' modal after donation

---
 .../app/src/components/DonateComponent.tsx    |  1 +
 .../app/src/components/modals/BaseModal.tsx   | 20 ++++++++++++++++---
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/packages/app/src/components/DonateComponent.tsx b/packages/app/src/components/DonateComponent.tsx
index 329bf2a..841ddbb 100644
--- a/packages/app/src/components/DonateComponent.tsx
+++ b/packages/app/src/components/DonateComponent.tsx
@@ -498,6 +498,7 @@ const DonateComponent = ({ collective }: DonateComponentProps) => {
             : undefined,
         ]}
         confirmButtonText="GO TO PROFILE"
+        message="Please be patient! It may take some time for your donation to appear in your profile."
         image={ThankYouImg}
       />
       <BaseModal
diff --git a/packages/app/src/components/modals/BaseModal.tsx b/packages/app/src/components/modals/BaseModal.tsx
index 78943ff..7caff90 100644
--- a/packages/app/src/components/modals/BaseModal.tsx
+++ b/packages/app/src/components/modals/BaseModal.tsx
@@ -35,6 +35,7 @@ const defaultModalProps = {
     dParagraphs: (errorMessage: string) => ['Please try again later.', 'Reason: ' + (errorMessage ?? 'unknown')],
     dConfirmButtonText: 'OK',
     dImage: ThankYouImg,
+    dMessage: 'Something went wrong',
   },
 };
 
@@ -49,6 +50,7 @@ type BaseModalProps = {
   image?: any;
   errorMessage?: string;
   withClose?: boolean;
+  message?: string;
 };
 
 export const BaseModal = ({
@@ -62,12 +64,19 @@ export const BaseModal = ({
   image,
   errorMessage = '',
   withClose = true,
+  message,
 }: BaseModalProps) => {
   const _onClose = () => onClose();
-  const { dTitle, dParagraphs, dConfirmButtonText, dImage } =
+  const { dTitle, dParagraphs, dConfirmButtonText, dImage, dMessage } =
     type === 'error'
       ? defaultModalProps[type as keyof typeof defaultModalProps]
-      : { dTitle: title, dParagraphs: paragraphs, dConfirmButtonText: confirmButtonText, dImage: image };
+      : {
+          dTitle: title,
+          dParagraphs: paragraphs,
+          dConfirmButtonText: confirmButtonText,
+          dImage: image,
+          dMessage: message,
+        };
 
   const paragraph =
     type === 'error' && typeof dParagraphs === 'function'
@@ -116,7 +125,12 @@ export const BaseModal = ({
                   )
                 : null}
             </VStack>
-            <Image source={dImage} alt="woman" width={'100%'} height={224} margin="auto" resizeMode="contain" />
+            <Image source={dImage} alt="woman" width={'100%'} height={210} margin="auto" resizeMode="contain" />
+            {dMessage && (
+              <Text variant="bold" fontSize="sm" textAlign="center">
+                {message}
+              </Text>
+            )}
             {dConfirmButtonText ? (
               <ActionButton
                 text={dConfirmButtonText}