From dacfd94af5108008b9ad866962bc236121c2c658 Mon Sep 17 00:00:00 2001
From: MananTank <manantankm@gmail.com>
Date: Mon, 9 Jun 2025 15:24:28 +0000
Subject: [PATCH] Nebula: Improved toasts in move funds page (#7307)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

<!--

## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes"

If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000):

## Notes for the reviewer

Anything important to call out? Be sure to also clarify these in your comments.

## How to test

Unit tests, playground, etc.

-->

<!-- start pr-codex -->

---

## PR-Codex overview
This PR focuses on improving error handling and user feedback in the `SendFunds` function by utilizing `toast.promise` for asynchronous operations, enhancing the user experience during token transfers.

### Detailed summary
- Replaced `toast.loading`, `toast.success`, and `toast.error` with `toast.promise` for batch and single token transfers.
- Improved error handling by catching errors without logging them.
- Simplified success and error messages in the toast notifications.
- Removed duration settings for toast notifications.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **Refactor**
  - Toast notifications for sending funds are now streamlined using unified loading, success, and error messages, providing clearer and more consistent feedback during transactions. Error messages are also improved for better clarity.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../app/nebula-app/move-funds/move-funds.tsx  | 92 ++++++++++---------
 1 file changed, 48 insertions(+), 44 deletions(-)

diff --git a/apps/dashboard/src/app/nebula-app/move-funds/move-funds.tsx b/apps/dashboard/src/app/nebula-app/move-funds/move-funds.tsx
index acacedf8d06..2bcc095a443 100644
--- a/apps/dashboard/src/app/nebula-app/move-funds/move-funds.tsx
+++ b/apps/dashboard/src/app/nebula-app/move-funds/move-funds.tsx
@@ -278,7 +278,6 @@ function SendFunds(props: {
     activeAccount: Account;
   }) {
     const { tokens, chain, receiverAddress } = params;
-    toast.loading(`Sending ${tokens.length} Tokens`);
 
     const transactions = tokens.map(({ token, amount }) => {
       return getTokenTransferTransaction({
@@ -289,18 +288,19 @@ function SendFunds(props: {
       });
     });
 
-    try {
-      await sendBatchTransactions.mutateAsync(transactions);
-      toast.success("Tokens sent successfully", {
-        duration: 10000,
-      });
-    } catch (e) {
-      toast.error("Failed to send tokens", {
-        description: parseError(e),
-        duration: 10000,
-      });
-      console.error(e);
-    }
+    const txPromise = sendBatchTransactions.mutateAsync(transactions);
+    toast.promise(txPromise, {
+      loading: `Sending ${tokens.length} tokens`,
+      success: `${tokens.length} tokens sent successfully`,
+      error: (result) => {
+        return {
+          message: "Failed to send tokens. Please try again",
+          description: parseError(result),
+        };
+      },
+    });
+
+    await txPromise;
   }
 
   async function handleSingleSubmit(params: {
@@ -321,36 +321,36 @@ function SendFunds(props: {
           receiverAddress,
         });
 
-        toast.loading(`Sending Token ${token.name}`);
-        await sendAndConfirmTransaction.mutateAsync(tx);
+        const txPromise = sendAndConfirmTransaction.mutateAsync(tx);
 
-        toast.success(`${token.name} sent successfully`, {
-          duration: 10000,
+        toast.promise(txPromise, {
+          loading: `Sending Token ${token.name}`,
+          success: `${token.name} sent successfully`,
+          error: (result) => {
+            return {
+              message: `Failed to send ${token.name}. Please try again`,
+              description: parseError(result),
+            };
+          },
         });
+
+        await txPromise;
+
         queryClient.invalidateQueries({
           queryKey: ["walletBalance"],
         });
 
         successCount++;
-      } catch (e) {
-        toast.error(`Failed to send ${token.name}`, {
-          description: parseError(e),
-          duration: 10000,
-        });
+      } catch {
+        // no op
       }
     }
 
     if (tokens.length > 1) {
       if (successCount === tokens.length) {
-        toast.success("All tokens sent successfully", {
-          id: "batch-send",
-          duration: 10000,
-        });
+        toast.success("All tokens sent successfully");
       } else {
-        toast.error(`Failed to send ${tokens.length - successCount} tokens`, {
-          id: "batch-send",
-          duration: 10000,
-        });
+        toast.error(`Failed to send ${tokens.length - successCount} tokens`);
       }
     }
   }
@@ -374,20 +374,24 @@ function SendFunds(props: {
     // eslint-disable-next-line no-restricted-syntax
     const chain = defineChain(values.chainId);
 
-    if (activeAccount.sendBatchTransaction) {
-      await handleBatchSubmit({
-        tokens: validTokens,
-        chain,
-        activeAccount,
-        receiverAddress: values.receiverAddress,
-      });
-    } else {
-      await handleSingleSubmit({
-        tokens: validTokens,
-        chain,
-        activeAccount,
-        receiverAddress: values.receiverAddress,
-      });
+    try {
+      if (activeAccount.sendBatchTransaction) {
+        await handleBatchSubmit({
+          tokens: validTokens,
+          chain,
+          activeAccount,
+          receiverAddress: values.receiverAddress,
+        });
+      } else {
+        await handleSingleSubmit({
+          tokens: validTokens,
+          chain,
+          activeAccount,
+          receiverAddress: values.receiverAddress,
+        });
+      }
+    } catch {
+      // no op
     }
 
     queryClient.invalidateQueries({