From 27f50a863cbd004eab51cdca0a613c47c4feec24 Mon Sep 17 00:00:00 2001
From: MananTank <manantankm@gmail.com>
Date: Mon, 25 Aug 2025 20:09:45 +0000
Subject: [PATCH] [BLD-143] Dashboard: Fix distribute funds in split contract
 (#7907)
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 the `useSplitDistributeFunds` hook and the `DistributeButton` component by refining the distribution logic and enhancing error handling.

### Detailed summary
- Replaced direct comparison of `currency.name` with a check using `getAddress(currency.tokenAddress)` against `getAddress(NATIVE_TOKEN_ADDRESS)`.
- Added `await` for the promise in the `useSplitDistributeFunds` function.
- Renamed the mutation variable in `DistributeButton` from `mutation` to `distributeFundsMutation`.
- Updated the `distributeFunds` function to use `distributeFundsMutation.mutateAsync()`.
- Adjusted the `isPending` prop in `TransactionButton` to reference `distributeFundsMutation.isPending`.

> ✨ 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

- Bug Fixes
  - Correctly detects and handles the native token during fund distribution, ensuring accurate routing and transaction counts.
  - Ensures each distribution transaction completes before the next begins, reducing partial or overlapping operations.

- Refactor
  - Streamlined distribution flow and loading state handling for a more consistent experience.
  - Removed toast-based error pop-ups during distribution; status is reflected via the ongoing operation state.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 apps/dashboard/src/@/hooks/useSplit.ts        |  7 ++++++-
 .../split/components/distribute-button.tsx    | 21 +++++--------------
 2 files changed, 11 insertions(+), 17 deletions(-)

diff --git a/apps/dashboard/src/@/hooks/useSplit.ts b/apps/dashboard/src/@/hooks/useSplit.ts
index c10dc9516f4..d26d64c72e1 100644
--- a/apps/dashboard/src/@/hooks/useSplit.ts
+++ b/apps/dashboard/src/@/hooks/useSplit.ts
@@ -7,6 +7,7 @@ import {
 import { toast } from "sonner";
 import {
   type Chain,
+  getAddress,
   NATIVE_TOKEN_ADDRESS,
   sendAndConfirmTransaction,
   type ThirdwebClient,
@@ -98,7 +99,8 @@ export function useSplitDistributeFunds(contract: ThirdwebContract) {
         .filter((token) => token.value !== 0n)
         .map(async (currency) => {
           const transaction =
-            currency.name === "Native Token"
+            getAddress(currency.tokenAddress) ===
+            getAddress(NATIVE_TOKEN_ADDRESS)
               ? distribute({ contract })
               : distributeByToken({
                   contract,
@@ -108,6 +110,7 @@ export function useSplitDistributeFunds(contract: ThirdwebContract) {
             account,
             transaction,
           });
+
           toast.promise(promise, {
             error: (err) => ({
               message: `Error distributing ${currency.name}`,
@@ -116,6 +119,8 @@ export function useSplitDistributeFunds(contract: ThirdwebContract) {
             loading: `Distributing ${currency.name}`,
             success: `Successfully distributed ${currency.name}`,
           });
+
+          await promise;
         });
 
       return await Promise.all(distributions);
diff --git a/apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/split/components/distribute-button.tsx b/apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/split/components/distribute-button.tsx
index 3d42f57d083..6b39e62a944 100644
--- a/apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/split/components/distribute-button.tsx
+++ b/apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/split/components/distribute-button.tsx
@@ -2,14 +2,12 @@
 
 import { SplitIcon } from "lucide-react";
 import { useMemo } from "react";
-import { toast } from "sonner";
 import type { ThirdwebContract } from "thirdweb";
 import type { GetBalanceResult } from "thirdweb/extensions/erc20";
 import { TransactionButton } from "@/components/tx-button";
 import { Button } from "@/components/ui/button";
 import { ToolTipLabel } from "@/components/ui/tooltip";
 import { useSplitDistributeFunds } from "@/hooks/useSplit";
-import { parseError } from "@/utils/errorParser";
 
 export const DistributeButton = ({
   contract,
@@ -25,6 +23,7 @@ export const DistributeButton = ({
   isLoggedIn: boolean;
 }) => {
   const validBalances = balances.filter((item) => item.value !== 0n);
+
   const numTransactions = useMemo(() => {
     if (
       validBalances.length === 1 &&
@@ -38,20 +37,10 @@ export const DistributeButton = ({
     return validBalances?.filter((b) => b.value !== 0n).length;
   }, [validBalances, balancesIsPending]);
 
-  const mutation = useSplitDistributeFunds(contract);
+  const distributeFundsMutation = useSplitDistributeFunds(contract);
 
   const distributeFunds = () => {
-    mutation.mutate(undefined, {
-      onError: (error) => {
-        toast.error("Failed to process transaction", {
-          description: parseError(error),
-        });
-        console.error(error);
-      },
-      onSuccess: () => {
-        toast.success("Funds splitted successfully");
-      },
-    });
+    distributeFundsMutation.mutateAsync();
   };
 
   if (balancesIsError) {
@@ -59,7 +48,7 @@ export const DistributeButton = ({
       <TransactionButton
         client={contract.client}
         isLoggedIn={isLoggedIn}
-        isPending={mutation.isPending}
+        isPending={distributeFundsMutation.isPending}
         onClick={distributeFunds}
         size="sm"
         transactionCount={undefined}
@@ -86,7 +75,7 @@ export const DistributeButton = ({
     <TransactionButton
       client={contract.client}
       isLoggedIn={isLoggedIn}
-      isPending={mutation.isPending}
+      isPending={distributeFundsMutation.isPending}
       onClick={distributeFunds}
       transactionCount={numTransactions === 1 ? undefined : numTransactions}
       txChainID={contract.chain.id}