feat(api): Adds support for Promises to onReportABug, onJoinMailingLi…

…st, and onShareFeedback. (#51) (#58)

* feat(api): Adds support for Promises to onReportABug, onJoinMailingList, and onShareFeedback.

* fix(bug): Fixed minor bug where email was being updated to empty and constantly updated.

* added check for empty string

packages/module/src/Feedback/FeedbackModal.tsx

@@ -7,22 +7,23 @@ export interface FeedbackModalProps {
     /** Email address for the user, if none is passed in a user can still enter one in the modal. */
     email?: string;
     /**  If a URL is given the  share feedback link will redirect to another site share feedback. 
-     * If a function is provided we will display a share feedback screen with a submit button. The callback function should return a boolean if the callback is successful or unsuccessful.*/
-    onShareFeedback: string | ((email:string, feedback: string) => boolean);
+     * If a function is provided we will display a share feedback screen with a submit button. The callback function should return a boolean or a Promise if the callback is successful or unsuccessful.*/
+    onShareFeedback: string | ((email: string, feedback: string) => boolean | Promise<boolean>);
     /** Indicates if the modal is visible or not. */
     isOpen: boolean;
     /** Optional call back that will be called when the user closes user feedback modal. */
     onClose: () => void;
     /** Optional prop to change the default english strings to a string of the user choice. */
     feedbackLocale?: FeedbackLocale;
     /**  If a URL is given the join mailing list link will redirect to another site to join the mailing list. 
-     * If a function is provided we will display a join mailing list screen with a submit button. The callback function should return a boolean if the callback is successful or unsuccessful.
+     * If a function is provided we will display a join mailing list screen with a submit button. The callback function should return a boolean or a Promise if the callback is successful or unsuccessful.
      * If it's undefined then report a bug will be removed from share feedback modal*/
-    onJoinMailingList?: string | ((email: string) => boolean);
+    onJoinMailingList?: string | ((email: string) => boolean | Promise<boolean>);
     /**  If a URL is given the report a bug link will redirect to another site to report the bug. 
-     * If a function is provided we will display a feedback screen with a submit button. The callback function should return a boolean if the callback is successful or unsuccessful.
+     * If a function is provided we will display a feedback screen with a submit button. The callback function should return a boolean or a Promise 
+     * if the callback is successful or unsuccessful.
      * If it's undefined then join mailing list will be removed from the share feedback modal*/
-    onReportABug?: string | ((email:string, bug: string) => boolean);
+    onReportABug?: string | ((email: string, bug: string) => boolean | Promise<boolean>);
     /** Feedback image that shows up in the modal */
     feedbackImg?: string;
     /** URL to open a support case */

packages/module/src/Feedback/FeedbackModalInternal.tsx

@@ -46,12 +46,13 @@ export const FeedbackModalInternal = memo(({ email, isOpen, onShareFeedback, onJ
     setModalPage("feedbackHome");
   };
 
-  const onSubmit = (feedbackPage: FeedbackPages, results: boolean) => {
-    if (results === false) {
-      setModalPage("feedbackError");
-    } else {
-      setModalPage(feedbackPage);
-    }
+  const updateEmail = (email: string) => {if (emailRef.current !== email && email !== '') {emailRef.current = email}}
+  const onSubmit = (feedbackPage: FeedbackPages, results: boolean | Promise<boolean>) => {
+    if (results instanceof Promise) {
+      results.then((results) => {
+        results === false ? setModalPage("feedbackError") : setModalPage(feedbackPage);
+      });
+    } else { results === false ? setModalPage("feedbackError") : setModalPage(feedbackPage); }
   }
 
   const ModalDescription = ({ modalPage }: { modalPage: FeedbackPages }) => {
@@ -108,10 +109,10 @@ export const FeedbackModalInternal = memo(({ email, isOpen, onShareFeedback, onJ
             email={emailRef.current}
             onCloseModal={handleCloseModal}
             onSubmit={(email: string, textAreaValue: string) => {
-              let results = true;
+              let results: boolean | Promise<boolean> = true;
               if (onShareFeedback && typeof onShareFeedback === 'function') {
                 results = onShareFeedback(email, textAreaValue);
-                emailRef.current = email;
+               updateEmail(email);
               }
               onSubmit('feedbackSuccess', results)
             }
@@ -131,10 +132,10 @@ export const FeedbackModalInternal = memo(({ email, isOpen, onShareFeedback, onJ
             email={emailRef.current}
             onCloseModal={handleCloseModal}
             onSubmit={(email: string, textAreaValue: string) => {
-              let results = true;
+              let results: boolean | Promise<boolean>  = true;
               if (onReportABug && typeof onReportABug === 'function') {
                 results = onReportABug(email, textAreaValue);
-                emailRef.current = email;
+                updateEmail(email);
               }
               onSubmit('bugReportSuccess', results)
             }}
@@ -160,10 +161,10 @@ export const FeedbackModalInternal = memo(({ email, isOpen, onShareFeedback, onJ
             email={emailRef.current}
             onCloseModal={handleCloseModal}
             onSubmit={(email: string, _textAreaValue: string) => {
-              let results = true;
+              let results : boolean | Promise<boolean> = true;
               if (onJoinMailingList && typeof onJoinMailingList === 'function') {
                 results = onJoinMailingList(email);
-                emailRef.current = email;
+                updateEmail(email);
               }
               onSubmit('informDirectionSuccess', results)
             }