Skip to content

Commit 02b1c4a

Browse files
gregfromstlclaude
andcommitted
[SDK] Update Routes endpoint for transaction pay modal
Switch useSendTransaction and useSwapSupportedChains to use Bridge.routes endpoint for retrieving supported destinations. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <[email protected]>
1 parent 2c33488 commit 02b1c4a

File tree

3 files changed

+182
-155
lines changed

3 files changed

+182
-155
lines changed

packages/thirdweb/src/pay/utils/definitions.ts

Lines changed: 0 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -42,20 +42,6 @@ export const getPayBuyWithFiatHistoryEndpoint = () =>
4242
export const getPayBuyWithCryptoHistoryEndpoint = () =>
4343
`${getPayBaseUrl()}/buy-with-crypto/history/v1`;
4444

45-
/**
46-
* Endpoint to get a list of supported destination chains and tokens for thirdweb pay.
47-
* @internal
48-
*/
49-
export const getPaySupportedDestinations = () =>
50-
`${getPayBaseUrl()}/destination-tokens/v1`;
51-
52-
/**
53-
* Endpoint to get a list of supported source chains + tokens for thirdweb pay.
54-
* @internal
55-
*/
56-
export const getPaySupportedSources = () =>
57-
`${getPayBaseUrl()}/buy-with-crypto/source-tokens/v1`;
58-
5945
/**
6046
* Endpoint to get buy history for a given wallet address.
6147
* This includes both "Buy with Crypto" and "Buy with Fiat" transactions.

packages/thirdweb/src/react/core/hooks/transaction/useSendTransaction.ts

Lines changed: 72 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { type UseMutationResult, useMutation } from "@tanstack/react-query";
22
import { trackPayEvent } from "../../../../analytics/track/pay.js";
3+
import * as Bridge from "../../../../bridge/index.js";
34
import type { Chain } from "../../../../chains/types.js";
45
import type { BuyWithCryptoStatus } from "../../../../pay/buyWithCrypto/getStatus.js";
56
import type { BuyWithFiatStatus } from "../../../../pay/buyWithFiat/getStatus.js";
@@ -14,7 +15,6 @@ import { resolvePromisedValue } from "../../../../utils/promise/resolve-promised
1415
import type { Wallet } from "../../../../wallets/interfaces/wallet.js";
1516
import { getTokenBalance } from "../../../../wallets/utils/getTokenBalance.js";
1617
import { getWalletBalance } from "../../../../wallets/utils/getWalletBalance.js";
17-
import { fetchBuySupportedDestinations } from "../../../web/ui/ConnectWallet/screens/Buy/swap/useSwapSupportedChains.js";
1818
import type { LocaleId } from "../../../web/ui/types.js";
1919
import type { Theme } from "../../design-system/index.js";
2020
import type { SupportedTokens } from "../../utils/defaultTokens.js";
@@ -42,49 +42,49 @@ import { hasSponsoredTransactionsEnabled } from "../../utils/wallet.js";
4242
*/
4343
export type SendTransactionPayModalConfig =
4444
| {
45-
metadata?: {
46-
name?: string;
47-
image?: string;
45+
metadata?: {
46+
name?: string;
47+
image?: string;
48+
};
49+
locale?: LocaleId;
50+
supportedTokens?: SupportedTokens;
51+
theme?: Theme | "light" | "dark";
52+
buyWithCrypto?:
53+
| false
54+
| {
55+
testMode?: boolean;
56+
};
57+
buyWithFiat?:
58+
| false
59+
| {
60+
prefillSource?: {
61+
currency?: "USD" | "CAD" | "GBP" | "EUR" | "JPY";
4862
};
49-
locale?: LocaleId;
50-
supportedTokens?: SupportedTokens;
51-
theme?: Theme | "light" | "dark";
52-
buyWithCrypto?:
53-
| false
63+
testMode?: boolean;
64+
preferredProvider?: FiatProvider;
65+
};
66+
purchaseData?: object;
67+
/**
68+
* Callback to be called when the user successfully completes the purchase.
69+
*/
70+
onPurchaseSuccess?: (
71+
info:
5472
| {
55-
testMode?: boolean;
56-
};
57-
buyWithFiat?:
58-
| false
73+
type: "crypto";
74+
status: BuyWithCryptoStatus;
75+
}
5976
| {
60-
prefillSource?: {
61-
currency?: "USD" | "CAD" | "GBP" | "EUR" | "JPY";
62-
};
63-
testMode?: boolean;
64-
preferredProvider?: FiatProvider;
65-
};
66-
purchaseData?: object;
67-
/**
68-
* Callback to be called when the user successfully completes the purchase.
69-
*/
70-
onPurchaseSuccess?: (
71-
info:
72-
| {
73-
type: "crypto";
74-
status: BuyWithCryptoStatus;
75-
}
76-
| {
77-
type: "fiat";
78-
status: BuyWithFiatStatus;
79-
}
80-
| {
81-
type: "transaction";
82-
chainId: number;
83-
transactionHash: Hex;
84-
},
85-
) => void;
86-
showThirdwebBranding?: boolean;
87-
}
77+
type: "fiat";
78+
status: BuyWithFiatStatus;
79+
}
80+
| {
81+
type: "transaction";
82+
chainId: number;
83+
transactionHash: Hex;
84+
},
85+
) => void;
86+
showThirdwebBranding?: boolean;
87+
}
8888
| false;
8989

9090
/**
@@ -179,52 +179,46 @@ export function useSendTransactionCore(args: {
179179

180180
(async () => {
181181
try {
182-
const [_nativeValue, _erc20Value, supportedDestinations] =
183-
await Promise.all([
184-
resolvePromisedValue(tx.value),
185-
resolvePromisedValue(tx.erc20Value),
186-
fetchBuySupportedDestinations(tx.client).catch((err) => {
187-
trackPayEvent({
188-
client: tx.client,
189-
walletAddress: account.address,
190-
walletType: wallet?.id,
191-
toChainId: tx.chain.id,
192-
event: "pay_transaction_modal_pay_api_error",
193-
error: err?.message,
194-
});
195-
return null;
196-
}),
197-
]);
182+
const [_nativeValue, _erc20Value] = await Promise.all([
183+
resolvePromisedValue(tx.value),
184+
resolvePromisedValue(tx.erc20Value),
185+
]);
186+
187+
const supportedDestinations = await Bridge.routes({
188+
client: tx.client,
189+
destinationChainId: tx.chain.id,
190+
destinationTokenAddress: _erc20Value?.tokenAddress,
191+
}).catch((err) => {
192+
trackPayEvent({
193+
client: tx.client,
194+
walletAddress: account.address,
195+
walletType: wallet?.id,
196+
toChainId: tx.chain.id,
197+
event: "pay_transaction_modal_pay_api_error",
198+
error: err?.message,
199+
});
200+
return null;
201+
});
198202

199203
if (!supportedDestinations) {
200204
// could not fetch supported destinations, just send the tx
201205
sendTx();
202206
return;
203207
}
204208

205-
if (
206-
!supportedDestinations
207-
.map((x) => x.chain.id)
208-
.includes(tx.chain.id) ||
209-
(_erc20Value &&
210-
!supportedDestinations.some(
211-
(x) =>
212-
x.chain.id === tx.chain.id &&
213-
x.tokens.find(
214-
(t) =>
215-
t.address.toLowerCase() ===
216-
_erc20Value.tokenAddress.toLowerCase(),
217-
),
218-
))
219-
) {
209+
if (supportedDestinations.length === 0) {
220210
trackPayEvent({
221211
client: tx.client,
222212
walletAddress: account.address,
223213
walletType: wallet?.id,
224214
toChainId: tx.chain.id,
225215
toToken: _erc20Value?.tokenAddress || undefined,
226216
event: "pay_transaction_modal_chain_token_not_supported",
227-
error: `chain ${tx.chain.id} ${_erc20Value ? `/ token ${_erc20Value?.tokenAddress}` : ""} not supported`,
217+
error: JSON.stringify({
218+
chain: tx.chain.id,
219+
token: _erc20Value?.tokenAddress,
220+
message: "chain/token not supported",
221+
}),
228222
});
229223
// chain/token not supported, just send the tx
230224
sendTx();
@@ -242,11 +236,11 @@ export function useSendTransactionCore(args: {
242236
}),
243237
_erc20Value?.tokenAddress
244238
? getTokenBalance({
245-
client: tx.client,
246-
account,
247-
chain: tx.chain,
248-
tokenAddress: _erc20Value.tokenAddress,
249-
})
239+
client: tx.client,
240+
account,
241+
chain: tx.chain,
242+
tokenAddress: _erc20Value.tokenAddress,
243+
})
250244
: undefined,
251245
getTransactionGasCost(tx, account.address),
252246
]);

0 commit comments

Comments
 (0)