thirdweb 5.105.8 → 5.105.10

package/src/bridge/Chains.ts

@@ -1,6 +1,7 @@
 import type { ThirdwebClient } from "../client/client.js";
 import { getThirdwebBaseUrl } from "../utils/domains.js";
 import { getClientFetch } from "../utils/fetch.js";
+import { withCache } from "../utils/promise/withCache.js";
 import type { Chain } from "./types/Chain.js";
 import { ApiError } from "./types/Errors.js";
 
@@ -54,22 +55,30 @@ import { ApiError } from "./types/Errors.js";
 export async function chains(options: chains.Options): Promise<chains.Result> {
   const { client } = options;
 
-  const clientFetch = getClientFetch(client);
-  const url = new URL(`${getThirdwebBaseUrl("bridge")}/v1/chains`);
+  return withCache(
+    async () => {
+      const clientFetch = getClientFetch(client);
+      const url = new URL(`${getThirdwebBaseUrl("bridge")}/v1/chains`);
 
-  const response = await clientFetch(url.toString());
-  if (!response.ok) {
-    const errorJson = await response.json();
-    throw new ApiError({
-      code: errorJson.code || "UNKNOWN_ERROR",
-      correlationId: errorJson.correlationId || undefined,
-      message: errorJson.message || response.statusText,
-      statusCode: response.status,
-    });
-  }
+      const response = await clientFetch(url.toString());
+      if (!response.ok) {
+        const errorJson = await response.json();
+        throw new ApiError({
+          code: errorJson.code || "UNKNOWN_ERROR",
+          correlationId: errorJson.correlationId || undefined,
+          message: errorJson.message || response.statusText,
+          statusCode: response.status,
+        });
+      }
 
-  const { data }: { data: Chain[] } = await response.json();
-  return data;
+      const { data }: { data: Chain[] } = await response.json();
+      return data;
+    },
+    {
+      cacheKey: "bridge-chains",
+      cacheTime: 1000 * 60 * 60 * 1, // 1 hours
+    },
+  );
 }
 
 export declare namespace chains {

package/src/chains/chain-definitions/t-rex-testnet.ts

@@ -0,0 +1,17 @@
+import { defineChain } from "../utils.js";
+
+/**
+ * @chain
+ */
+export const tRexTestnet = /*@__PURE__*/ defineChain({
+  blockExplorers: [
+    {
+      name: "T-Rex Testnet Block Explorer",
+      url: "https://testnet.trex.xyz/",
+    },
+  ],
+  id: 1962,
+  name: "T-Rex Testnet",
+  nativeCurrency: { decimals: 18, name: "Ether", symbol: "ETH" },
+  testnet: true,
+});

package/src/chains/types.ts

@@ -88,14 +88,6 @@ export type ChainMetadata = {
   stackType: string;
 };
 
-/**
- * @chain
- */
-export type ChainService = {
-  service: string;
-  enabled: boolean;
-};
-
 /**
  * @chain
  */

package/src/chains/utils.ts

@@ -7,7 +7,6 @@ import type {
   Chain,
   ChainMetadata,
   ChainOptions,
-  ChainService,
   LegacyChain,
 } from "./types.js";
 
@@ -323,62 +322,22 @@ export function getChainMetadata(chain: Chain): Promise<ChainMetadata> {
   );
 }
 
-type FetchChainServiceResponse =
-  | {
-      data: {
-        services: ChainService[];
-      };
-      error?: never;
-    }
-  | {
-      data?: never;
-      error: unknown;
-    };
-
-/**
- * Retrieves a list of services available on a given chain
- * @param chain - The chain object containing the chain ID.
- * @returns A Promise that resolves to chain services.
- * @throws If there is an error fetching the chain services.
- * @example
- * ```ts
- * const chain = defineChain({ id: 1 });
- * const chainServices = await getChainServices(chain);
- * console.log(chainServices);
- * ```
- * @chain
- */
-export function getChainServices(chain: Chain): Promise<ChainService[]> {
-  const chainId = chain.id;
+export async function getInsightEnabledChainIds(): Promise<number[]> {
   return withCache(
     async () => {
-      try {
-        const res = await fetch(
-          `https://api.thirdweb.com/v1/chains/${chainId}/services`,
+      const res = await fetch(
+        `https://api.thirdweb.com/v1/chains/services?service=insight`,
+      );
+      if (!res.ok) {
+        throw new Error(
+          `Failed to fetch services. ${res.status} ${res.statusText}`,
         );
-        if (!res.ok) {
-          throw new Error(
-            `Failed to fetch services for chainId ${chainId}. ${res.status} ${res.statusText}`,
-          );
-        }
-
-        const response = (await res.json()) as FetchChainServiceResponse;
-        if (response.error) {
-          throw new Error(`Failed to fetch services for chainId ${chainId}`);
-        }
-        if (!response.data) {
-          throw new Error(`Failed to fetch services for chainId ${chainId}`);
-        }
-
-        const services = response.data.services;
-
-        return services;
-      } catch {
-        throw new Error(`Failed to fetch services for chainId ${chainId}`);
       }
+      const response = (await res.json()) as { data: Record<number, boolean> };
+      return Object.keys(response.data).map((chainId) => Number(chainId));
     },
     {
-      cacheKey: `chain:${chainId}:services`,
+      cacheKey: `chain:insight-enabled`,
       cacheTime: 24 * 60 * 60 * 1000, // 1 day
     },
   );

package/src/exports/chains.ts

@@ -72,6 +72,7 @@ export { scrollSepoliaTestnet } from "../chains/chain-definitions/scroll-sepolia
 export { sepolia } from "../chains/chain-definitions/sepolia.js";
 export { somniaTestnet } from "../chains/chain-definitions/somniaTestnet.js";
 export { soneiumMinato } from "../chains/chain-definitions/soneium-minato.js";
+export { tRexTestnet } from "../chains/chain-definitions/t-rex-testnet.js";
 export { treasure } from "../chains/chain-definitions/treasure.js";
 export { treasureTopaz } from "../chains/chain-definitions/treasureTopaz.js";
 export { xai } from "../chains/chain-definitions/xai.js";

package/src/insight/common.ts

@@ -1,29 +1,16 @@
 import type { Chain } from "../chains/types.js";
-import { getChainServices } from "../chains/utils.js";
+import { getInsightEnabledChainIds } from "../chains/utils.js";
 
 export async function assertInsightEnabled(chains: Chain[]) {
-  const chainData = await Promise.all(
-    chains.map((chain) =>
-      isInsightEnabled(chain).then((enabled) => ({
-        chain,
-        enabled,
-      })),
-    ),
-  );
-
-  const insightEnabled = chainData.every((c) => c.enabled);
+  const chainIds = await getInsightEnabledChainIds();
+  const insightEnabled = chains.every((c) => chainIds.includes(c.id));
 
   if (!insightEnabled) {
     throw new Error(
-      `Insight is not available for chains ${chainData
-        .filter((c) => !c.enabled)
-        .map((c) => c.chain.id)
+      `Insight is not available for chains ${chains
+        .filter((c) => !chainIds.includes(c.id))
+        .map((c) => c.id)
         .join(", ")}`,
     );
   }
 }
-
-export async function isInsightEnabled(chain: Chain) {
-  const chainData = await getChainServices(chain);
-  return chainData.some((c) => c.service === "insight" && c.enabled);
-}

package/src/pay/buyWithCrypto/getStatus.ts

@@ -84,11 +84,6 @@ export type BuyWithCryptoStatus =
       purchaseData?: PurchaseData;
     };
 
-export type ValidBuyWithCryptoStatus = Exclude<
-  BuyWithCryptoStatus,
-  { status: "NOT_FOUND" }
->;
-
 /**
  * Gets the status of a buy with crypto transaction
  * @param buyWithCryptoTransaction - Object of type [`BuyWithCryptoTransaction`](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransaction)

package/src/pay/buyWithFiat/isSwapRequiredPostOnramp.ts

@@ -1,5 +1,4 @@
 import { getAddress } from "../../utils/address.js";
-import type { PayTokenInfo } from "../utils/commonTypes.js";
 import type { BuyWithFiatQuote } from "./getQuote.js";
 
 /**
@@ -28,58 +27,3 @@ export function isSwapRequiredPostOnramp(
 
   return !(sameChain && sameToken);
 }
-
-export function getOnRampSteps(
-  buyWithFiatQuote: BuyWithFiatQuote,
-): OnRampStep[] {
-  const isSwapRequired = isSwapRequiredPostOnramp(buyWithFiatQuote);
-
-  if (!isSwapRequired) {
-    return [
-      {
-        action: "buy",
-        amount: buyWithFiatQuote.estimatedToAmountMin,
-        token: buyWithFiatQuote.toToken,
-      },
-    ];
-  }
-
-  if (buyWithFiatQuote.routingToken) {
-    return [
-      {
-        action: "buy",
-        amount: buyWithFiatQuote.onRampToken.amount,
-        token: buyWithFiatQuote.onRampToken.token,
-      },
-      {
-        action: "swap",
-        amount: buyWithFiatQuote.routingToken.amount,
-        token: buyWithFiatQuote.routingToken.token,
-      },
-      {
-        action: "bridge",
-        amount: buyWithFiatQuote.estimatedToAmountMin,
-        token: buyWithFiatQuote.toToken,
-      },
-    ];
-  }
-
-  return [
-    {
-      action: "buy",
-      amount: buyWithFiatQuote.onRampToken.amount,
-      token: buyWithFiatQuote.onRampToken.token,
-    },
-    {
-      action: "swap",
-      amount: buyWithFiatQuote.estimatedToAmountMin,
-      token: buyWithFiatQuote.toToken,
-    },
-  ];
-}
-
-export type OnRampStep = {
-  action: "buy" | "swap" | "bridge";
-  token: PayTokenInfo;
-  amount: string;
-};

package/src/pay/utils/commonTypes.ts

@@ -19,4 +19,4 @@ export type PayOnChainTransactionDetails = {
 
 export type FiatProvider = (typeof FiatProviders)[number];
 
-export const FiatProviders = ["coinbase", "stripe", "transak"] as const;
+const FiatProviders = ["coinbase", "stripe", "transak"] as const;

package/src/react/core/hooks/useBridgeQuote.ts

@@ -12,12 +12,14 @@ interface UseBridgeQuoteParams {
   destinationAmount: bigint;
   client: ThirdwebClient;
   enabled?: boolean;
+  feePayer?: "sender" | "receiver";
 }
 
 export function useBridgeQuote({
   originToken,
   destinationToken,
   destinationAmount,
+  feePayer,
   client,
   enabled = true,
 }: UseBridgeQuoteParams) {
@@ -35,6 +37,7 @@ export function useBridgeQuote({
           amount: destinationAmount,
           chainId: originToken.chainId,
           client,
+          feePayer,
           receiver: destinationToken.address,
           sender: originToken.address,
           tokenAddress: originToken.address,
@@ -59,6 +62,7 @@ export function useBridgeQuote({
       destinationToken.chainId,
       destinationToken.address,
       destinationAmount.toString(),
+      feePayer,
     ],
     refetchInterval: 60000, // 30 seconds
     retry: 3, // 1 minute

package/src/react/core/hooks/usePaymentMethods.ts

@@ -1,9 +1,12 @@
 import { useQuery } from "@tanstack/react-query";
+import { chains } from "../../../bridge/Chains.js";
 import { routes } from "../../../bridge/Routes.js";
 import type { Token } from "../../../bridge/types/Token.js";
-import { getCachedChain } from "../../../chains/utils.js";
+import {
+  getCachedChain,
+  getInsightEnabledChainIds,
+} from "../../../chains/utils.js";
 import type { ThirdwebClient } from "../../../client/client.js";
-import { isInsightEnabled } from "../../../insight/common.js";
 import { getOwnedTokens } from "../../../insight/get-tokens.js";
 import { toTokens } from "../../../utils/units.js";
 import type { Wallet } from "../../../wallets/interfaces/wallet.js";
@@ -56,42 +59,29 @@ export function usePaymentMethods(options: {
       if (!wallet) {
         throw new Error("No wallet connected");
       }
-      const allRoutes = await routes({
-        client,
-        destinationChainId: destinationToken.chainId,
-        destinationTokenAddress: destinationToken.address,
-        includePrices: true,
-        limit: 100,
-        maxSteps: 3,
-        sortBy: "popularity", // Get top 100 most popular routes
-      });
-
-      const allOriginTokens = includeDestinationToken
-        ? [destinationToken, ...allRoutes.map((route) => route.originToken)]
-        : allRoutes.map((route) => route.originToken);
 
-      // 1. Resolve all unique chains in the supported token map
-      const uniqueChains = Array.from(
-        new Set(allOriginTokens.map((t) => t.chainId)),
-      );
+      // 1. Get all supported chains
+      const [allChains, insightEnabledChainIds] = await Promise.all([
+        chains({ client }),
+        getInsightEnabledChainIds(),
+      ]);
 
-      // 2. Check insight availability once per chain
-      const insightSupport = await Promise.all(
-        uniqueChains.map(async (c) => ({
-          chain: getCachedChain(c),
-          enabled: await isInsightEnabled(getCachedChain(c)),
-        })),
+      // 2. Check insight availability for all chains
+      const insightEnabledChains = allChains.filter((c) =>
+        insightEnabledChainIds.includes(c.chainId),
       );
-      const insightEnabledChains = insightSupport.filter((c) => c.enabled);
 
-      // 3. ERC-20 balances for insight-enabled chains (batched 5 chains / call)
-      let owned: OwnedTokenWithQuote[] = [];
+      // 3. Get all owned tokens for insight-enabled chains
+      let allOwnedTokens: Array<{
+        balance: bigint;
+        originToken: Token;
+      }> = [];
       let page = 0;
-      const limit = 100;
+      const limit = 500;
 
       while (true) {
         const batch = await getOwnedTokens({
-          chains: insightEnabledChains.map((c) => c.chain),
+          chains: insightEnabledChains.map((c) => getCachedChain(c.chainId)),
           client,
           ownerAddress: wallet.getAccount()?.address || "",
           queryOptions: {
@@ -105,25 +95,92 @@ export function usePaymentMethods(options: {
           break;
         }
 
-        // find matching origin token in allRoutes
+        // Convert to our format and filter out zero balances
         const tokensWithBalance = batch
+          .filter((b) => b.value > 0n)
           .map((b) => ({
             balance: b.value,
-            originAmount: 0n,
-            originToken: allOriginTokens.find(
-              (t) =>
-                t.address.toLowerCase() === b.tokenAddress.toLowerCase() &&
-                t.chainId === b.chainId,
-            ),
-          }))
-          .filter((t) => !!t.originToken) as OwnedTokenWithQuote[];
-
-        owned = [...owned, ...tokensWithBalance];
+            originToken: {
+              address: b.tokenAddress,
+              chainId: b.chainId,
+              decimals: b.decimals,
+              iconUri: "",
+              name: b.name,
+              priceUsd: 0,
+              symbol: b.symbol,
+            } as Token,
+          }));
+
+        allOwnedTokens = [...allOwnedTokens, ...tokensWithBalance];
         page += 1;
       }
 
-      // sort by dollar balance descending
-      owned.sort((a, b) => {
+      // 4. For each chain where we have owned tokens, fetch possible routes
+      const chainsWithOwnedTokens = Array.from(
+        new Set(allOwnedTokens.map((t) => t.originToken.chainId)),
+      );
+
+      const allValidOriginTokens = new Map<string, Token>();
+
+      // Add destination token if included
+      if (includeDestinationToken) {
+        const tokenKey = `${destinationToken.chainId}-${destinationToken.address.toLowerCase()}`;
+        allValidOriginTokens.set(tokenKey, destinationToken);
+      }
+
+      // Fetch routes for each chain with owned tokens
+      await Promise.all(
+        chainsWithOwnedTokens.map(async (chainId) => {
+          try {
+            // TODO (bridge): this is quite inefficient, need to fix the popularity sorting to really capture all users tokens
+            const routesForChain = await routes({
+              client,
+              destinationChainId: destinationToken.chainId,
+              destinationTokenAddress: destinationToken.address,
+              includePrices: true,
+              limit: 100,
+              maxSteps: 3,
+              originChainId: chainId,
+            });
+
+            // Add all origin tokens from this chain's routes
+            for (const route of routesForChain) {
+              // Skip if the origin token is the same as the destination token, will be added later only if includeDestinationToken is true
+              if (
+                route.originToken.chainId === destinationToken.chainId &&
+                route.originToken.address.toLowerCase() ===
+                  destinationToken.address.toLowerCase()
+              ) {
+                continue;
+              }
+              const tokenKey = `${route.originToken.chainId}-${route.originToken.address.toLowerCase()}`;
+              allValidOriginTokens.set(tokenKey, route.originToken);
+            }
+          } catch (error) {
+            // Log error but don't fail the entire operation
+            console.warn(`Failed to fetch routes for chain ${chainId}:`, error);
+          }
+        }),
+      );
+
+      // 5. Filter owned tokens to only include valid origin tokens
+      const validOwnedTokens: OwnedTokenWithQuote[] = [];
+
+      for (const ownedToken of allOwnedTokens) {
+        const tokenKey = `${ownedToken.originToken.chainId}-${ownedToken.originToken.address.toLowerCase()}`;
+        const validOriginToken = allValidOriginTokens.get(tokenKey);
+
+        if (validOriginToken) {
+          validOwnedTokens.push({
+            balance: ownedToken.balance,
+            originAmount: 0n,
+            originToken: validOriginToken, // Use the token with pricing info from routes
+          });
+        }
+      }
+
+      // Sort by dollar balance descending
+      validOwnedTokens.sort((a, b) => {
         const aDollarBalance =
           Number.parseFloat(toTokens(a.balance, a.originToken.decimals)) *
           a.originToken.priceUsd;
@@ -135,29 +192,19 @@ export function usePaymentMethods(options: {
 
       const suitableOriginTokens: OwnedTokenWithQuote[] = [];
 
-      for (const b of owned) {
-        if (b.originToken && b.balance > 0n) {
-          if (
-            includeDestinationToken &&
-            b.originToken.address.toLowerCase() ===
-              destinationToken.address.toLowerCase() &&
-            b.originToken.chainId === destinationToken.chainId
-          ) {
-            // add same token to the front of the list
-            suitableOriginTokens.unshift({
-              balance: b.balance,
-              originAmount: 0n,
-              originToken: b.originToken,
-            });
-            continue;
-          }
-
-          suitableOriginTokens.push({
-            balance: b.balance,
-            originAmount: 0n,
-            originToken: b.originToken,
-          });
+      for (const token of validOwnedTokens) {
+        if (
+          includeDestinationToken &&
+          token.originToken.address.toLowerCase() ===
+            destinationToken.address.toLowerCase() &&
+          token.originToken.chainId === destinationToken.chainId
+        ) {
+          // Add same token to the front of the list
+          suitableOriginTokens.unshift(token);
+          continue;
         }
+
+        suitableOriginTokens.push(token);
       }
 
       const transformedRoutes = [

package/src/react/core/utils/storage.ts

@@ -2,7 +2,6 @@ import type { AsyncStorage } from "../../../utils/storage/AsyncStorage.js";
 import type { AuthArgsType } from "../../../wallets/in-app/core/authentication/types.js";
 
 export const LAST_AUTH_PROVIDER_STORAGE_KEY = "lastAuthProvider";
-export const PREFERRED_FIAT_PROVIDER_STORAGE_KEY = "preferredFiatProvider";
 
 export async function setLastAuthProvider(
   authProvider: AuthArgsType["strategy"],

package/src/react/web/ui/Bridge/BridgeOrchestrator.tsx

@@ -227,7 +227,10 @@ export function BridgeOrchestrator({
         <ErrorBanner
           client={client}
           error={state.context.currentError}
-          onCancel={onCancel}
+          onCancel={() => {
+            send({ type: "RESET" });
+            onCancel?.();
+          }}
           onRetry={handleRetry}
         />
       )}
@@ -272,6 +275,11 @@ export function BridgeOrchestrator({
             connectOptions={connectOptions}
             destinationAmount={state.context.destinationAmount}
             destinationToken={state.context.destinationToken}
+            feePayer={
+              uiOptions.mode === "direct_payment"
+                ? uiOptions.paymentInfo.feePayer
+                : undefined
+            }
             includeDestinationToken={uiOptions.mode !== "fund_wallet"}
             onBack={() => {
               send({ type: "BACK" });

package/src/react/web/ui/Bridge/payment-selection/PaymentSelection.tsx

@@ -77,6 +77,11 @@ export interface PaymentSelectionProps {
    * @default ["crypto", "card"]
    */
   paymentMethods?: ("crypto" | "card")[];
+
+  /**
+   * Fee payer
+   */
+  feePayer?: "sender" | "receiver";
 }
 
 type Step =
@@ -97,6 +102,7 @@ export function PaymentSelection({
   connectLocale,
   includeDestinationToken,
   paymentMethods = ["crypto", "card"],
+  feePayer,
 }: PaymentSelectionProps) {
   const connectedWallets = useConnectedWallets();
   const activeWallet = useActiveWallet();
@@ -113,6 +119,7 @@ export function PaymentSelection({
         toChainId: destinationToken.chainId,
         toToken: destinationToken.address,
       });
+      return true;
     },
     queryKey: ["payment_selection"],
   });
@@ -267,6 +274,7 @@ export function PaymentSelection({
               destinationToken.decimals,
             )}
             destinationToken={destinationToken}
+            feePayer={feePayer}
             onBack={handleBackToWalletSelection}
             onPaymentMethodSelected={handlePaymentMethodSelected}
             paymentMethods={suitableTokenPaymentMethods}

package/src/react/web/ui/Bridge/payment-selection/TokenSelection.tsx

@@ -21,6 +21,7 @@ interface TokenSelectionProps {
   onBack: () => void;
   destinationToken: Token;
   destinationAmount: bigint;
+  feePayer?: "sender" | "receiver";
 }
 
 // Individual payment method token row component
@@ -30,6 +31,7 @@ interface PaymentMethodTokenRowProps {
   destinationAmount: bigint;
   client: ThirdwebClient;
   onPaymentMethodSelected: (paymentMethod: PaymentMethod) => void;
+  feePayer?: "sender" | "receiver";
 }
 
 function PaymentMethodTokenRow({
@@ -38,6 +40,7 @@ function PaymentMethodTokenRow({
   destinationAmount,
   client,
   onPaymentMethodSelected,
+  feePayer,
 }: PaymentMethodTokenRowProps) {
   const theme = useCustomTheme();
 
@@ -50,6 +53,7 @@ function PaymentMethodTokenRow({
     client,
     destinationAmount,
     destinationToken,
+    feePayer,
     originToken: paymentMethod.originToken,
   });
 
@@ -158,6 +162,7 @@ export function TokenSelection({
   onBack,
   destinationToken,
   destinationAmount,
+  feePayer,
 }: TokenSelectionProps) {
   const theme = useCustomTheme();
 
@@ -271,6 +276,7 @@ export function TokenSelection({
               client={client}
               destinationAmount={destinationAmount}
               destinationToken={destinationToken}
+              feePayer={feePayer}
               key={`${method.originToken.address}-${method.originToken.chainId}`}
               onPaymentMethodSelected={onPaymentMethodSelected}
               paymentMethod={method}