diff --git a/packages/internal/dex/sdk-sample-app/src/components/Example.tsx b/packages/internal/dex/sdk-sample-app/src/components/Example.tsx index 9308417cff..9a3a8e5d0a 100644 --- a/packages/internal/dex/sdk-sample-app/src/components/Example.tsx +++ b/packages/internal/dex/sdk-sample-app/src/components/Example.tsx @@ -6,11 +6,16 @@ import { ConnectAccount } from './ConnectAccount'; import { getTokenSymbol } from '../utils/getTokenSymbol'; import { AmountInput } from './AmountInput'; import { SecondaryFeeInput } from './SecondaryFeeInput'; +import { FeeBreakdown } from './FeeBreakdown'; + +type mapping = { + [address: string]: string; +}; export function Example() { // Instead of hard-coding these tokens, you can optionally retrieve available tokens from the user's wallet const TEST_IMX_TOKEN = '0x0000000000000000000000000000000000001010'; - const ZKCATS_TOKEN = '0x1836E16b2036088490C2CFe4d11970Fc8e5884C4'; + const ZKCATS_TOKEN = '0xaC953a0d7B67Fae17c87abf79f09D0f818AC66A2'; const [ethereumAccount, setEthereumAccount] = useState(null); const [isFetching, setIsFetching] = useState(false); @@ -44,10 +49,6 @@ export function Example() { return ; } - type mapping = { - [address: string]: string; - }; - const getQuote = async () => { setIsFetching(true); setError(null) @@ -176,9 +177,13 @@ export function Example() { ] }`} +

Slippage: {result.quote.slippage}%

{result.approval &&

Approval Gas Estimate: {showGasEstimate(result.approval)}

}

Swap Gas estimate: {showGasEstimate(result.swap)}

+ + + <>