- {tokenBalance && (
-
- )}
- {/* TODO: add back in when TokenSelector is complete */}
- {/*
-
- */}
-
+
{
+ if (account && fromToken && toToken && fromAmount) {
+ try {
+ const response = await buildSwapTransaction({
+ amount: fromAmount,
+ fromAddress: account.address,
+ from: fromToken,
+ to: toToken,
+ });
+ if (isSwapError(response)) {
+ onError?.(response);
+ } else {
+ onSubmit?.(response);
+ }
+ } catch (error) {
+ onError?.(error as SwapError);
+ }
+ }
+ }, [account, fromAmount, fromToken, toToken]);
+
+ return (
+
+
+
+ );
+}
diff --git a/src/swap/context.ts b/src/swap/context.ts
new file mode 100644
index 0000000000..2046d85f6b
--- /dev/null
+++ b/src/swap/context.ts
@@ -0,0 +1,4 @@
+import { createContext } from 'react';
+import { SwapContextType } from './types';
+
+export const SwapContext = createContext
({} as SwapContextType);
diff --git a/src/swap/index.ts b/src/swap/index.ts
index e2d3f2f744..d56f333e70 100644
--- a/src/swap/index.ts
+++ b/src/swap/index.ts
@@ -1,6 +1,5 @@
// 🌲☀️🌲
export { getSwapQuote } from './core/getSwapQuote';
-export { buildSwapTransaction } from './core/buildSwapTransaction';
export type {
BuildSwapTransactionParams,
BuildSwapTransactionResponse,
diff --git a/src/swap/types.ts b/src/swap/types.ts
index 732dc54f5d..b60ab3f295 100644
--- a/src/swap/types.ts
+++ b/src/swap/types.ts
@@ -1,5 +1,6 @@
-import type { Address, Hex } from 'viem';
+import type { Account, Address, Hex } from 'viem';
import type { Token } from '../token/types';
+import { ReactNode } from 'react';
export type AddressOrETH = Address | 'ETH';
@@ -85,6 +86,15 @@ export type RawTransactionData = {
value: string; // The value of the transaction
};
+/**
+ * Note: exported as public Type
+ */
+export type SwapAmountInputReact = {
+ label: string; // Descriptive label for the input field
+ token: Token; // Selected token
+ type: 'to' | 'from';
+};
+
export type SwapAPIParams = GetQuoteAPIParams | GetSwapAPIParams;
export type SwapAPIResponse = {
@@ -95,18 +105,34 @@ export type SwapAPIResponse = {
tx: RawTransactionData; // The trade transaction
};
-/**
- * Note: exported as public Type
- */
-export type SwapAmountInputReact = {
- amount?: string; // Token amount
- disabled?: boolean; // Whether the input is disabled
- label: string; // Descriptive label for the input field
- setAmount: (amount: string) => void; // Callback function when the amount changes
- setToken: () => void; // Callback function when the token selector is clicked
- swappableTokens: Token[]; // Tokens available for swap
- token?: Token; // Selected token
- tokenBalance?: string; // Amount of selected token user owns
+export type SwapButtonReact = {
+ onError?: (error: SwapError) => void;
+ onSubmit?: (swapTransaction: BuildSwapTransaction) => void;
+};
+
+export type SwapContextType = {
+ account: Account;
+ fromAmount: string;
+ fromToken?: Token;
+ setFromAmount: (a: string) => void;
+ setFromToken: (t: Token) => void;
+ setToAmount: (a: string) => void;
+ setToToken: (t: Token) => void;
+ toAmount: string;
+ toToken?: Token;
+};
+
+export type SwapParams = {
+ amount: string;
+ fromAddress: Address;
+ from: Token;
+ to: Token;
+};
+
+export type SwapReact = {
+ account: Account;
+ children: ReactNode;
+ onError?: (error: SwapError) => void;
};
/**
diff --git a/src/swap/utils.test.ts b/src/swap/utils.test.ts
index 5982a45094..bf81027428 100644
--- a/src/swap/utils.test.ts
+++ b/src/swap/utils.test.ts
@@ -1,4 +1,4 @@
-import { isValidAmount } from './utils'; // Adjust the import path as needed
+import { isValidAmount, isSwapError } from './utils'; // Adjust the import path as needed
describe('isValidAmount', () => {
it('should return true for an empty string', () => {
@@ -37,3 +37,35 @@ describe('isValidAmount', () => {
expect(isValidAmount('123 45')).toBe(false);
});
});
+
+describe('isSwapError function', () => {
+ it('returns true for a valid SwapError object', () => {
+ const response = {
+ error: 'Swap failed',
+ details: 'Insufficient balance',
+ };
+
+ expect(isSwapError(response)).toBe(true);
+ });
+
+ it('returns false for null or non-object inputs', () => {
+ expect(isSwapError(null)).toBe(false);
+ expect(isSwapError(undefined)).toBe(false);
+ expect(isSwapError('error')).toBe(false);
+ expect(isSwapError(123)).toBe(false);
+ });
+
+ it('returns false for objects without the "error" property', () => {
+ const response = {
+ message: 'An error occurred',
+ };
+
+ expect(isSwapError(response)).toBe(false);
+ });
+
+ it('returns false for empty objects', () => {
+ const response = {};
+
+ expect(isSwapError(response)).toBe(false);
+ });
+});
diff --git a/src/swap/utils.ts b/src/swap/utils.ts
index 6275805179..9781492140 100644
--- a/src/swap/utils.ts
+++ b/src/swap/utils.ts
@@ -1,3 +1,5 @@
+import type { SwapError } from './types';
+
// checks that input is a number
export function isValidAmount(value: string) {
if (value.length > 11) {
@@ -9,3 +11,7 @@ export function isValidAmount(value: string) {
const regex = /^[0-9]*\.?[0-9]*$/;
return regex.test(value);
}
+
+export function isSwapError(response: unknown): response is SwapError {
+ return response !== null && typeof response === 'object' && 'error' in response;
+}