diff --git a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/AcceptSettlementButton.tsx b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/AcceptSettlementButton.tsx
index 859aeea..d601215 100644
--- a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/AcceptSettlementButton.tsx
+++ b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/AcceptSettlementButton.tsx
@@ -4,7 +4,6 @@ import { usePublicClient } from "wagmi";
import { isUndefined } from "utils/index";
import { wrapWithToast } from "utils/wrapWithToast";
import { useTransactionDetailsContext } from "context/TransactionDetailsContext";
-import { useNewTransactionContext } from "context/NewTransactionContext";
import {
useSimulateEscrowUniversalAcceptSettlement,
useWriteEscrowUniversalAcceptSettlement,
@@ -16,7 +15,6 @@ const AcceptButton: React.FC = () => {
const publicClient = usePublicClient();
const { id } = useTransactionDetailsContext();
const refetchQuery = useQueryRefetch();
- const { hasSufficientNativeBalance } = useNewTransactionContext();
const { data: acceptSettlementConfig } = useSimulateEscrowUniversalAcceptSettlement({
args: [BigInt(id)],
@@ -44,7 +42,7 @@ const AcceptButton: React.FC = () => {
return (
diff --git a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/ExecuteTransactionButton.tsx b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/ExecuteTransactionButton.tsx
index 8c46055..f19e4cf 100644
--- a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/ExecuteTransactionButton.tsx
+++ b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/ExecuteTransactionButton.tsx
@@ -4,7 +4,6 @@ import { usePublicClient } from "wagmi";
import { useTransactionDetailsContext } from "context/TransactionDetailsContext";
import { isUndefined } from "utils/index";
import { wrapWithToast } from "utils/wrapWithToast";
-import { useNewTransactionContext } from "context/NewTransactionContext";
import {
useSimulateEscrowUniversalExecuteTransaction,
useWriteEscrowUniversalExecuteTransaction,
@@ -16,7 +15,6 @@ const ExecuteTransactionButton: React.FC = () => {
const publicClient = usePublicClient();
const { id } = useTransactionDetailsContext();
const refetchQuery = useQueryRefetch();
- const { hasSufficientNativeBalance } = useNewTransactionContext();
const { data: executeTransactionConfig } = useSimulateEscrowUniversalExecuteTransaction({
args: [BigInt(id)],
@@ -45,7 +43,7 @@ const ExecuteTransactionButton: React.FC = () => {
return (
diff --git a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/ProposeSettlementButton.tsx b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/ProposeSettlementButton.tsx
index d05b638..54bf230 100644
--- a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/ProposeSettlementButton.tsx
+++ b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/ProposeSettlementButton.tsx
@@ -5,7 +5,6 @@ import { parseEther } from "viem";
import { isUndefined } from "utils/index";
import { wrapWithToast } from "utils/wrapWithToast";
import { useTransactionDetailsContext } from "context/TransactionDetailsContext";
-import { useNewTransactionContext } from "context/NewTransactionContext";
import {
useSimulateEscrowUniversalProposeSettlement,
useWriteEscrowUniversalProposeSettlement,
@@ -29,7 +28,6 @@ const ProposeSettlementButton: React.FC = ({
const publicClient = usePublicClient();
const { id } = useTransactionDetailsContext();
const refetchQuery = useQueryRefetch();
- const { hasSufficientNativeBalance } = useNewTransactionContext();
const { data: proposeSettlementConfig } = useSimulateEscrowUniversalProposeSettlement({
args: [BigInt(id), parseEther(amountProposed)],
@@ -59,7 +57,7 @@ const ProposeSettlementButton: React.FC = ({
return (
diff --git a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/RaiseDisputeButton.tsx b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/RaiseDisputeButton.tsx
index ea92541..f4b822a 100644
--- a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/RaiseDisputeButton.tsx
+++ b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/RaiseDisputeButton.tsx
@@ -1,7 +1,6 @@
import React, { useMemo, useState } from "react";
import { Button } from "@kleros/ui-components-library";
import { useAccount, usePublicClient } from "wagmi";
-import { useNewTransactionContext } from "context/NewTransactionContext";
import {
useWriteEscrowUniversalPayArbitrationFeeByBuyer,
useWriteEscrowUniversalPayArbitrationFeeBySeller,
@@ -26,23 +25,29 @@ const RaiseDisputeButton: React.FC = ({ toggleModal, button
const { buyer, id } = useTransactionDetailsContext();
const isBuyer = useMemo(() => address?.toLowerCase() === buyer?.toLowerCase(), [address, buyer]);
const refetchQuery = useQueryRefetch();
- const { hasSufficientNativeBalance } = useNewTransactionContext();
- const { data: payArbitrationFeeByBuyerConfig } = useSimulateEscrowUniversalPayArbitrationFeeByBuyer({
- args: [BigInt(id)],
- value: arbitrationCost,
- });
+ const { data: payArbitrationFeeByBuyerConfig, isLoading: isPreparingBuyerConfig } =
+ useSimulateEscrowUniversalPayArbitrationFeeByBuyer({
+ query: {
+ enabled: isBuyer,
+ },
+ args: [BigInt(id)],
+ value: arbitrationCost,
+ });
- const { data: payArbitrationFeeBySellerConfig } = useSimulateEscrowUniversalPayArbitrationFeeBySeller({
- args: [BigInt(id)],
- value: arbitrationCost,
- });
+ const { data: payArbitrationFeeBySellerConfig, isLoading: isPreparingSellerConfig } =
+ useSimulateEscrowUniversalPayArbitrationFeeBySeller({
+ query: {
+ enabled: !isBuyer,
+ },
+ args: [BigInt(id)],
+ value: arbitrationCost,
+ });
const { writeContractAsync: payArbitrationFeeByBuyer } =
useWriteEscrowUniversalPayArbitrationFeeByBuyer(payArbitrationFeeByBuyerConfig);
- const { writeContractAsync: payArbitrationFeeBySeller } = useWriteEscrowUniversalPayArbitrationFeeBySeller(
- payArbitrationFeeBySellerConfig
- );
+ const { writeContractAsync: payArbitrationFeeBySeller } =
+ useWriteEscrowUniversalPayArbitrationFeeBySeller(payArbitrationFeeBySellerConfig);
const handleRaiseDispute = () => {
if (isBuyer && !isUndefined(payArbitrationFeeByBuyer)) {
@@ -80,8 +85,8 @@ const RaiseDisputeButton: React.FC = ({ toggleModal, button
return (
diff --git a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/TimeOutButton.tsx b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/TimeOutButton.tsx
index 4b4e402..d96355a 100644
--- a/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/TimeOutButton.tsx
+++ b/web/src/pages/MyTransactions/TransactionDetails/PreviewCardButtons/TimeOutButton.tsx
@@ -1,7 +1,6 @@
import React, { useMemo, useState } from "react";
import { Button } from "@kleros/ui-components-library";
import { useAccount, usePublicClient } from "wagmi";
-import { useNewTransactionContext } from "context/NewTransactionContext";
import {
useWriteEscrowUniversalTimeOutByBuyer,
useWriteEscrowUniversalTimeOutBySeller,
@@ -20,7 +19,6 @@ const TimeOutButton: React.FC = () => {
const { buyer, id } = useTransactionDetailsContext();
const isBuyer = useMemo(() => address?.toLowerCase() === buyer?.toLowerCase(), [address, buyer]);
const refetchQuery = useQueryRefetch();
- const { hasSufficientNativeBalance } = useNewTransactionContext();
const { data: timeOutByBuyerConfig } = useSimulateEscrowUniversalTimeOutByBuyer({
args: [BigInt(id)],
@@ -66,7 +64,7 @@ const TimeOutButton: React.FC = () => {
return (
diff --git a/web/src/pages/MyTransactions/TransactionDetails/WasItFulfilled/Buttons/ClaimFullPaymentButton.tsx b/web/src/pages/MyTransactions/TransactionDetails/WasItFulfilled/Buttons/ClaimFullPaymentButton.tsx
index 10cb070..daeaefe 100644
--- a/web/src/pages/MyTransactions/TransactionDetails/WasItFulfilled/Buttons/ClaimFullPaymentButton.tsx
+++ b/web/src/pages/MyTransactions/TransactionDetails/WasItFulfilled/Buttons/ClaimFullPaymentButton.tsx
@@ -2,7 +2,6 @@ import React, { useState } from "react";
import { Button } from "@kleros/ui-components-library";
import { useToggle } from "react-use";
import PaymentReleased from "pages/MyTransactions/Modal/PaymentReleased";
-import { useNewTransactionContext } from "context/NewTransactionContext";
import {
useWriteEscrowUniversalExecuteTransaction,
useSimulateEscrowUniversalExecuteTransaction,
@@ -17,7 +16,6 @@ const ClaimFullPaymentButton: React.FC = () => {
const [isSending, setIsSending] = useState(false);
const publicClient = usePublicClient();
const { id } = useTransactionDetailsContext();
- const { hasSufficientNativeBalance } = useNewTransactionContext();
const { data: executeTransactionConfig } = useSimulateEscrowUniversalExecuteTransaction({
args: [id],
@@ -49,7 +47,7 @@ const ClaimFullPaymentButton: React.FC = () => {
<>
diff --git a/web/src/pages/MyTransactions/TransactionDetails/WasItFulfilled/Buttons/ReleasePaymentButton.tsx b/web/src/pages/MyTransactions/TransactionDetails/WasItFulfilled/Buttons/ReleasePaymentButton.tsx
index 35df141..b5204f0 100644
--- a/web/src/pages/MyTransactions/TransactionDetails/WasItFulfilled/Buttons/ReleasePaymentButton.tsx
+++ b/web/src/pages/MyTransactions/TransactionDetails/WasItFulfilled/Buttons/ReleasePaymentButton.tsx
@@ -2,7 +2,6 @@ import React, { useState } from "react";
import { Button } from "@kleros/ui-components-library";
import { useToggle } from "react-use";
import PaymentReleased from "pages/MyTransactions/Modal/PaymentReleased";
-import { useNewTransactionContext } from "context/NewTransactionContext";
import { useWriteEscrowUniversalPay, useSimulateEscrowUniversalPay } from "hooks/contracts/generated";
import { isUndefined } from "utils/index";
import { wrapWithToast } from "utils/wrapWithToast";
@@ -16,7 +15,6 @@ const ReleasePaymentButton: React.FC = () => {
const publicClient = usePublicClient();
const { id, amount } = useTransactionDetailsContext();
const refetchQuery = useQueryRefetch();
- const { hasSufficientNativeBalance } = useNewTransactionContext();
const { data: releaseFullPaymentConfig } = useSimulateEscrowUniversalPay({
args: [id, amount],
@@ -47,7 +45,7 @@ const ReleasePaymentButton: React.FC = () => {
<>
diff --git a/web/src/pages/NewTransaction/NavigationButtons/DepositPaymentButton.tsx b/web/src/pages/NewTransaction/NavigationButtons/DepositPaymentButton.tsx
index 52272ad..99c2ab3 100644
--- a/web/src/pages/NewTransaction/NavigationButtons/DepositPaymentButton.tsx
+++ b/web/src/pages/NewTransaction/NavigationButtons/DepositPaymentButton.tsx
@@ -1,7 +1,6 @@
import React, { useEffect, useState, useMemo } from "react";
import styled from "styled-components";
import { Button } from "@kleros/ui-components-library";
-import { useNewTransactionContext } from "context/NewTransactionContext";
import {
useWriteEscrowUniversalCreateNativeTransaction,
useSimulateEscrowUniversalCreateNativeTransaction,
@@ -18,6 +17,7 @@ import {
useReadContract,
useWriteContract,
useSimulateContract,
+ useBalance,
} from "wagmi";
import { parseEther, parseUnits } from "viem";
import { isUndefined } from "utils/index";
@@ -39,6 +39,7 @@ const DepositPaymentButton: React.FC = () => {
deadline,
sendingToken,
resetContext,
+ setHasSufficientNativeBalance,
} = useNewTransactionContext();
const [finalRecipientAddress, setFinalRecipientAddress] = useState(sellerAddress);
@@ -55,12 +56,34 @@ const DepositPaymentButton: React.FC = () => {
() => (isNativeTransaction ? parseEther(sendingQuantity) : parseUnits(sendingQuantity, 18)),
[isNativeTransaction, sendingQuantity]
);
- const { hasSufficientNativeBalance } = useNewTransactionContext();
+
+ const { data: balanceData } = useBalance({
+ address: address as `0x${string}` | undefined,
+ token: isNativeTransaction ? undefined : sendingToken?.address as `0x${string}` | undefined,
+ });
+
+ const [error, setError] = useState(null);
useEffect(() => {
setFinalRecipientAddress(ensResult.data || sellerAddress);
}, [sellerAddress, ensResult.data]);
+ useEffect(() => {
+ const balance = parseFloat(balanceData?.formatted || "0");
+ const quantity = parseFloat(sendingQuantity);
+
+ if (quantity > balance) {
+ setError("Insufficient balance");
+ setHasSufficientNativeBalance(false);
+ } else if (quantity === 0) {
+ setError("Amount cannot be zero");
+ setHasSufficientNativeBalance(false);
+ } else {
+ setError(null);
+ setHasSufficientNativeBalance(true);
+ }
+ }, [balanceData, sendingQuantity, setHasSufficientNativeBalance]);
+
const { data: allowance, refetch: refetchAllowance } = useReadContract({
query: { enabled: !isNativeTransaction && chain?.id },
address: sendingToken?.address,
@@ -151,12 +174,15 @@ const DepositPaymentButton: React.FC = () => {
};
return (
-
+ <>
+
+ {error}
+ >
);
};