thirdweb 5.121.2 → 5.121.3

package/src/extensions/modules/ClaimableERC1155/claimableERC1155.test.ts

@@ -20,234 +20,236 @@ import { getInstalledModules } from "../__generated__/IModularCore/read/getInsta
 import * as BatchMetadataERC1155 from "../BatchMetadataERC1155/index.js";
 import * as ClaimableERC1155 from "./index.js";
 
-describe.runIf(process.env.TW_SECRET_KEY)("ModularClaimableERC1155", () => {
-  let contract: ThirdwebContract;
-  beforeAll(async () => {
-    const address = await deployModularContract({
-      account: TEST_ACCOUNT_A,
-      chain: ANVIL_CHAIN,
-      client: TEST_CLIENT,
-      core: "ERC1155",
-      modules: [
-        ClaimableERC1155.module({
-          primarySaleRecipient: TEST_ACCOUNT_A.address,
+describe
+  .runIf(process.env.TW_SECRET_KEY)
+  .skip("ModularClaimableERC1155", () => {
+    let contract: ThirdwebContract;
+    beforeAll(async () => {
+      const address = await deployModularContract({
+        account: TEST_ACCOUNT_A,
+        chain: ANVIL_CHAIN,
+        client: TEST_CLIENT,
+        core: "ERC1155",
+        modules: [
+          ClaimableERC1155.module({
+            primarySaleRecipient: TEST_ACCOUNT_A.address,
+          }),
+          BatchMetadataERC1155.module(),
+        ],
+        params: {
+          contractURI: TEST_CONTRACT_URI,
+          name: "TestDropERC1155",
+        },
+      });
+      contract = getContract({
+        address,
+        chain: ANVIL_CHAIN,
+        client: TEST_CLIENT,
+      });
+    }, 120000);
+
+    it("should have erc1155 module", async () => {
+      const modules = await getInstalledModules({ contract });
+      expect(modules.length).toBe(2);
+    });
+
+    it("should upload metadata", async () => {
+      const transaction = BatchMetadataERC1155.uploadMetadata({
+        contract,
+        metadatas: Array.from(
+          { length: 10 },
+          (_, index) =>
+            `ipfs://QmP4JFzBhTGvb27GnJ9eL9vZGYpNBGjHnPudWndruiNERm/${index}`,
+        ),
+      });
+
+      await sendAndConfirmTransaction({
+        account: TEST_ACCOUNT_A,
+        transaction,
+      });
+    });
+
+    it("should not claim without claim conditions", async () => {
+      // should throw
+      await expect(
+        sendAndConfirmTransaction({
+          account: TEST_ACCOUNT_A,
+          transaction: ClaimableERC1155.mint({
+            contract,
+            quantity: 1,
+            to: TEST_ACCOUNT_A.address,
+            tokenId: 123123123213n,
+          }),
         }),
-        BatchMetadataERC1155.module(),
-      ],
-      params: {
-        contractURI: TEST_CONTRACT_URI,
-        name: "TestDropERC1155",
-      },
-    });
-    contract = getContract({
-      address,
-      chain: ANVIL_CHAIN,
-      client: TEST_CLIENT,
-    });
-  }, 120000);
-
-  it("should have erc1155 module", async () => {
-    const modules = await getInstalledModules({ contract });
-    expect(modules.length).toBe(2);
-  });
-
-  it("should upload metadata", async () => {
-    const transaction = BatchMetadataERC1155.uploadMetadata({
-      contract,
-      metadatas: Array.from(
-        { length: 10 },
-        (_, index) =>
-          `ipfs://QmP4JFzBhTGvb27GnJ9eL9vZGYpNBGjHnPudWndruiNERm/${index}`,
-      ),
-    });
-
-    await sendAndConfirmTransaction({
-      account: TEST_ACCOUNT_A,
-      transaction,
+      ).rejects.toThrowError(/ClaimableOutOfTimeWindow/);
     });
-  });
 
-  it("should not claim without claim conditions", async () => {
-    // should throw
-    await expect(
-      sendAndConfirmTransaction({
+    it("should claim tokens with claim conditions", async () => {
+      await sendAndConfirmTransaction({
         account: TEST_ACCOUNT_A,
-        transaction: ClaimableERC1155.mint({
+        transaction: ClaimableERC1155.setClaimCondition({
           contract,
-          quantity: 1,
-          to: TEST_ACCOUNT_A.address,
-          tokenId: 123123123213n,
+          maxClaimableSupply: "1",
+          pricePerToken: "0.1",
+          tokenId: 0n,
         }),
-      }),
-    ).rejects.toThrowError(/ClaimableOutOfTimeWindow/);
-  });
+      });
+
+      // should throw if claiming more than supply
+      await expect(
+        sendAndConfirmTransaction({
+          account: TEST_ACCOUNT_A,
+          transaction: ClaimableERC1155.mint({
+            contract,
+            quantity: 1000,
+            to: TEST_ACCOUNT_A.address,
+            tokenId: 0n,
+          }),
+        }),
+      ).rejects.toThrowError(/ClaimableOutOfSupply/);
 
-  it("should claim tokens with claim conditions", async () => {
-    await sendAndConfirmTransaction({
-      account: TEST_ACCOUNT_A,
-      transaction: ClaimableERC1155.setClaimCondition({
+      let balance = await balanceOf({
         contract,
-        maxClaimableSupply: "1",
-        pricePerToken: "0.1",
+        owner: TEST_ACCOUNT_A.address,
         tokenId: 0n,
-      }),
-    });
+      });
 
-    // should throw if claiming more than supply
-    await expect(
-      sendAndConfirmTransaction({
+      expect(balance).toBe(0n);
+
+      await sendAndConfirmTransaction({
         account: TEST_ACCOUNT_A,
         transaction: ClaimableERC1155.mint({
           contract,
-          quantity: 1000,
+          quantity: 1,
           to: TEST_ACCOUNT_A.address,
           tokenId: 0n,
         }),
-      }),
-    ).rejects.toThrowError(/ClaimableOutOfSupply/);
+      });
 
-    let balance = await balanceOf({
-      contract,
-      owner: TEST_ACCOUNT_A.address,
-      tokenId: 0n,
-    });
-
-    expect(balance).toBe(0n);
-
-    await sendAndConfirmTransaction({
-      account: TEST_ACCOUNT_A,
-      transaction: ClaimableERC1155.mint({
+      balance = await balanceOf({
         contract,
-        quantity: 1,
-        to: TEST_ACCOUNT_A.address,
+        owner: TEST_ACCOUNT_A.address,
         tokenId: 0n,
-      }),
-    });
+      });
+      expect(balance).toBe(1n);
 
-    balance = await balanceOf({
-      contract,
-      owner: TEST_ACCOUNT_A.address,
-      tokenId: 0n,
-    });
-    expect(balance).toBe(1n);
-
-    const all = await getNFTs({
-      contract,
-    });
-    expect(all.length).toBe(10);
-
-    const owned = await getOwnedNFTs({
-      address: TEST_ACCOUNT_A.address,
-      contract,
-    });
-    expect(owned.length).toBe(1);
-    expect(owned?.[0]?.metadata.name).toBe("Test 0");
-    expect(owned?.[0]?.quantityOwned).toBe(1n);
-  });
+      const all = await getNFTs({
+        contract,
+      });
+      expect(all.length).toBe(10);
 
-  it("should claim tokens with allowlist", async () => {
-    await sendAndConfirmTransaction({
-      account: TEST_ACCOUNT_A,
-      transaction: ClaimableERC1155.setClaimCondition({
-        allowList: [TEST_ACCOUNT_A.address, TEST_ACCOUNT_B.address],
+      const owned = await getOwnedNFTs({
+        address: TEST_ACCOUNT_A.address,
         contract,
-        maxClaimableSupply: "2",
-        pricePerToken: "0.1",
-        tokenId: 0n,
-      }),
+      });
+      expect(owned.length).toBe(1);
+      expect(owned?.[0]?.metadata.name).toBe("Test 0");
+      expect(owned?.[0]?.quantityOwned).toBe(1n);
     });
 
-    // should throw if not in allowlist
-    await expect(
-      sendAndConfirmTransaction({
-        account: TEST_ACCOUNT_C,
-        transaction: ClaimableERC1155.mint({
+    it("should claim tokens with allowlist", async () => {
+      await sendAndConfirmTransaction({
+        account: TEST_ACCOUNT_A,
+        transaction: ClaimableERC1155.setClaimCondition({
+          allowList: [TEST_ACCOUNT_A.address, TEST_ACCOUNT_B.address],
           contract,
-          quantity: 1,
-          to: TEST_ACCOUNT_C.address,
+          maxClaimableSupply: "2",
+          pricePerToken: "0.1",
           tokenId: 0n,
         }),
-      }),
-    ).rejects.toThrowError(/ClaimableNotInAllowlist/);
+      });
+
+      // should throw if not in allowlist
+      await expect(
+        sendAndConfirmTransaction({
+          account: TEST_ACCOUNT_C,
+          transaction: ClaimableERC1155.mint({
+            contract,
+            quantity: 1,
+            to: TEST_ACCOUNT_C.address,
+            tokenId: 0n,
+          }),
+        }),
+      ).rejects.toThrowError(/ClaimableNotInAllowlist/);
+
+      // should throw if in allowlist but over supply
+      await expect(
+        sendAndConfirmTransaction({
+          account: TEST_ACCOUNT_C,
+          transaction: ClaimableERC1155.mint({
+            contract,
+            quantity: 3,
+            to: TEST_ACCOUNT_C.address,
+            tokenId: 0n,
+          }),
+        }),
+      ).rejects.toThrowError(/ClaimableOutOfSupply/);
 
-    // should throw if in allowlist but over supply
-    await expect(
-      sendAndConfirmTransaction({
+      // can claim to address in allowlist (regardless of sender)
+      await sendAndConfirmTransaction({
         account: TEST_ACCOUNT_C,
         transaction: ClaimableERC1155.mint({
           contract,
-          quantity: 3,
-          to: TEST_ACCOUNT_C.address,
+          quantity: 2,
+          to: TEST_ACCOUNT_B.address,
           tokenId: 0n,
         }),
-      }),
-    ).rejects.toThrowError(/ClaimableOutOfSupply/);
+      });
 
-    // can claim to address in allowlist (regardless of sender)
-    await sendAndConfirmTransaction({
-      account: TEST_ACCOUNT_C,
-      transaction: ClaimableERC1155.mint({
+      const balance = await balanceOf({
         contract,
-        quantity: 2,
-        to: TEST_ACCOUNT_B.address,
+        owner: TEST_ACCOUNT_B.address,
         tokenId: 0n,
-      }),
+      });
+      expect(balance).toBe(2n);
     });
 
-    const balance = await balanceOf({
-      contract,
-      owner: TEST_ACCOUNT_B.address,
-      tokenId: 0n,
-    });
-    expect(balance).toBe(2n);
-  });
+    it("should claim tokens with max per wallet", async () => {
+      await sendAndConfirmTransaction({
+        account: TEST_ACCOUNT_A,
+        transaction: ClaimableERC1155.setClaimCondition({
+          contract,
+          maxClaimablePerWallet: 1,
+          maxClaimableSupply: 10,
+          tokenId: 0n,
+        }),
+      });
 
-  it("should claim tokens with max per wallet", async () => {
-    await sendAndConfirmTransaction({
-      account: TEST_ACCOUNT_A,
-      transaction: ClaimableERC1155.setClaimCondition({
+      let balance = await balanceOf({
         contract,
-        maxClaimablePerWallet: 1,
-        maxClaimableSupply: 10,
+        owner: TEST_ACCOUNT_C.address,
         tokenId: 0n,
-      }),
-    });
-
-    let balance = await balanceOf({
-      contract,
-      owner: TEST_ACCOUNT_C.address,
-      tokenId: 0n,
-    });
-    expect(balance).toBe(0n);
+      });
+      expect(balance).toBe(0n);
+
+      // should throw if max per wallet is reached
+      await expect(
+        sendAndConfirmTransaction({
+          account: TEST_ACCOUNT_C,
+          transaction: ClaimableERC1155.mint({
+            contract,
+            quantity: 4,
+            to: TEST_ACCOUNT_C.address,
+            tokenId: 0n,
+          }),
+        }),
+      ).rejects.toThrowError(/ClaimableMaxMintPerWalletExceeded/);
 
-    // should throw if max per wallet is reached
-    await expect(
-      sendAndConfirmTransaction({
+      await sendAndConfirmTransaction({
         account: TEST_ACCOUNT_C,
         transaction: ClaimableERC1155.mint({
           contract,
-          quantity: 4,
+          quantity: 1,
           to: TEST_ACCOUNT_C.address,
           tokenId: 0n,
         }),
-      }),
-    ).rejects.toThrowError(/ClaimableMaxMintPerWalletExceeded/);
+      });
 
-    await sendAndConfirmTransaction({
-      account: TEST_ACCOUNT_C,
-      transaction: ClaimableERC1155.mint({
+      balance = await balanceOf({
         contract,
-        quantity: 1,
-        to: TEST_ACCOUNT_C.address,
+        owner: TEST_ACCOUNT_C.address,
         tokenId: 0n,
-      }),
-    });
-
-    balance = await balanceOf({
-      contract,
-      owner: TEST_ACCOUNT_C.address,
-      tokenId: 0n,
+      });
+      expect(balance).toBe(1n);
     });
-    expect(balance).toBe(1n);
   });
-});

package/src/extensions/modules/ClaimableERC20/claimableERC20.test.ts

@@ -17,7 +17,7 @@ import { deployModularContract } from "../../prebuilts/deploy-modular.js";
 import { getInstalledModules } from "../__generated__/IModularCore/read/getInstalledModules.js";
 import * as ClaimableERC20 from "./index.js";
 
-describe.runIf(process.env.TW_SECRET_KEY)("ModularDropERC20", () => {
+describe.runIf(process.env.TW_SECRET_KEY).skip("ModularDropERC20", () => {
   let contract: ThirdwebContract;
   beforeAll(async () => {
     const address = await deployModularContract({

package/src/extensions/modules/ClaimableERC721/claimableERC721.test.ts

@@ -18,7 +18,7 @@ import { getInstalledModules } from "../__generated__/IModularCore/read/getInsta
 import * as BatchMetadataERC721 from "../BatchMetadataERC721/index.js";
 import * as ClaimableERC721 from "./index.js";
 
-describe.runIf(process.env.TW_SECRET_KEY)("ModularClaimableERC721", () => {
+describe.runIf(process.env.TW_SECRET_KEY).skip("ModularClaimableERC721", () => {
   let contract: ThirdwebContract;
   beforeAll(async () => {
     const address = await deployModularContract({

package/src/extensions/prebuilts/process-ref-deployments.test.ts

@@ -8,7 +8,7 @@ import { readContract } from "../../transaction/read-contract.js";
 import { getInstalledModules } from "../modules/__generated__/IModularCore/read/getInstalledModules.js";
 import { deployPublishedContract } from "./deploy-published.js";
 
-describe.runIf(process.env.TW_SECRET_KEY)(
+describe.runIf(process.env.TW_SECRET_KEY).skip(
   "deployref",
   {
     timeout: 120000,

package/src/react/core/hooks/x402/useFetchWithPaymentCore.ts

@@ -4,7 +4,10 @@ import { useMutation } from "@tanstack/react-query";
 import type { ThirdwebClient } from "../../../../client/client.js";
 import type { AsyncStorage } from "../../../../utils/storage/AsyncStorage.js";
 import type { Wallet } from "../../../../wallets/interfaces/wallet.js";
-import { wrapFetchWithPayment } from "../../../../x402/fetchWithPayment.js";
+import {
+  getRequestUrl,
+  wrapFetchWithPayment,
+} from "../../../../x402/fetchWithPayment.js";
 import type { RequestedPaymentRequirements } from "../../../../x402/schemas.js";
 import type { PaymentRequiredResult } from "../../../../x402/types.js";
 import { useActiveWallet } from "../wallets/useActiveWallet.js";
@@ -24,6 +27,7 @@ export type UseFetchWithPaymentOptions = {
 
 type ShowErrorModalCallback = (data: {
   errorData: PaymentRequiredResult["responseBody"];
+  requestUrl?: string;
   onRetry: () => void;
   onCancel: () => void;
 }) => void;
@@ -107,6 +111,7 @@ export function useFetchWithPaymentCore(
               return new Promise<unknown>((resolve, reject) => {
                 showErrorModal({
                   errorData: errorBody,
+                  requestUrl: getRequestUrl(input),
                   onRetry: async () => {
                     // Retry the entire fetch+error handling logic recursively
                     // Pass currentWallet to avoid re-showing connect modal with stale wallet state

package/src/react/native/hooks/x402/useFetchWithPayment.ts

@@ -27,7 +27,7 @@ export type { UseFetchWithPaymentOptions };
  *
  * @param client - The thirdweb client used to access RPC infrastructure
  * @param options - Optional configuration for payment handling
- * @param options.maxValue - The maximum allowed payment amount in base units
+ * @param options.maxValue - The maximum allowed payment amount in base units. `0n` only allows zero-amount payments
  * @param options.paymentRequirementsSelector - Custom function to select payment requirements from available options
  * @param options.parseAs - How to parse the response: "json" (default), "text", or "raw"
  * @param options.storage - Storage for caching permit signatures (for "upto" scheme). Provide your own AsyncStorage implementation for React Native.

package/src/react/web/hooks/x402/useFetchWithPayment.tsx

@@ -78,7 +78,7 @@ type UseFetchWithPaymentConfig = UseFetchWithPaymentOptions & {
  *
  * @param client - The thirdweb client used to access RPC infrastructure
  * @param options - Optional configuration for payment handling
- * @param options.maxValue - The maximum allowed payment amount in base units
+ * @param options.maxValue - The maximum allowed payment amount in base units. `0n` only allows zero-amount payments
  * @param options.paymentRequirementsSelector - Custom function to select payment requirements from available options
  * @param options.parseAs - How to parse the response: "json" (default), "text", or "raw"
  * @param options.uiEnabled - Whether to show the UI for connection, funding or payment retries (defaults to true). Set to false to handle errors yourself
@@ -196,6 +196,7 @@ export function useFetchWithPayment(
   const showErrorModal = showModal
     ? (data: {
         errorData: Parameters<typeof PaymentErrorModal>[0]["errorData"];
+        requestUrl?: string;
         onRetry: () => void;
         onCancel: () => void;
       }) => {
@@ -203,6 +204,7 @@ export function useFetchWithPayment(
           <PaymentErrorModal
             client={client}
             errorData={data.errorData}
+            requestUrl={data.requestUrl}
             onCancel={() => {
               setRootEl(null);
               data.onCancel();

package/src/react/web/ui/x402/PaymentErrorModal.tsx

@@ -5,6 +5,7 @@ import type { ThirdwebClient } from "../../../../client/client.js";
 import {
   extractEvmChainId,
   networkToCaip2ChainId,
+  parsePaymentRequirementsForDisplay,
   type RequestedPaymentRequirements,
 } from "../../../../x402/schemas.js";
 import type { PaymentRequiredResult } from "../../../../x402/types.js";
@@ -25,6 +26,7 @@ import { Text } from "../components/text.js";
 type PaymentErrorModalProps = {
   client: ThirdwebClient;
   errorData: PaymentRequiredResult["responseBody"];
+  requestUrl?: string;
   onRetry: () => void;
   onCancel: () => void;
   theme: Theme | "light" | "dark";
@@ -54,6 +56,7 @@ export function PaymentErrorModal(props: PaymentErrorModalProps) {
   const {
     client,
     errorData,
+    requestUrl,
     onRetry,
     onCancel,
     theme,
@@ -66,13 +69,15 @@ export function PaymentErrorModal(props: PaymentErrorModalProps) {
 
   // Extract chain and token info from errorData for BuyWidget
   const getBuyWidgetConfig = () => {
-    if (!errorData.accepts || errorData.accepts.length === 0) {
+    // Get payment requirements from errorData
+    const parsedPaymentRequirements = parsePaymentRequirementsForDisplay(
+      errorData,
+      requestUrl,
+    );
+    if (parsedPaymentRequirements.length === 0) {
       return null;
     }
 
-    // Get payment requirements from errorData
-    const parsedPaymentRequirements = errorData.accepts;
-
     // Get the current chain from wallet
     const currentChain = wallet?.getChain();
     const currentChainId = currentChain?.id;

package/src/version.ts

@@ -1 +1 @@
-export const version = "5.121.2";
+export const version = "5.121.3";

package/src/x402/encode.ts

@@ -1,4 +1,6 @@
 import type { ExactEvmPayload } from "x402/types";
+import { cachedTextDecoder } from "../utils/text-decoder.js";
+import { cachedTextEncoder } from "../utils/text-encoder.js";
 import type {
   RequestedPaymentPayload,
   RequestedPaymentRequirements,
@@ -27,7 +29,7 @@ export function encodePayment(payment: RequestedPaymentPayload): string {
       ) as ExactEvmPayload["authorization"],
     },
   };
-  return safeBase64Encode(JSON.stringify(safe));
+  return base64EncodeUtf8(JSON.stringify(safe));
 }
 
 /**
@@ -37,7 +39,7 @@ export function encodePayment(payment: RequestedPaymentPayload): string {
  * @returns The decoded and validated PaymentPayload object
  */
 export function decodePayment(payment: string): RequestedPaymentPayload {
-  const decoded = safeBase64Decode(payment);
+  const decoded = base64DecodeUtf8(payment);
   const parsed = JSON.parse(decoded);
 
   const obj: RequestedPaymentPayload = {
@@ -93,3 +95,45 @@ export function safeBase64Decode(data: string): string {
   }
   return Buffer.from(data, "base64").toString("utf-8");
 }
+
+/**
+ * Encodes a string as UTF-8 and then to base64
+ *
+ * @param data - The string to encode
+ * @returns The base64 encoded UTF-8 bytes
+ */
+function base64EncodeUtf8(data: string): string {
+  if (
+    typeof globalThis !== "undefined" &&
+    typeof globalThis.btoa === "function"
+  ) {
+    const bytes = cachedTextEncoder().encode(data);
+    let binary = "";
+    for (const byte of bytes) {
+      binary += String.fromCharCode(byte);
+    }
+    return globalThis.btoa(binary);
+  }
+  return Buffer.from(data, "utf-8").toString("base64");
+}
+
+/**
+ * Decodes a base64 string and interprets the bytes as UTF-8
+ *
+ * @param data - The base64 encoded string
+ * @returns The decoded string
+ */
+export function base64DecodeUtf8(data: string): string {
+  if (
+    typeof globalThis !== "undefined" &&
+    typeof globalThis.atob === "function"
+  ) {
+    const binary = globalThis.atob(data);
+    const bytes = new Uint8Array(binary.length);
+    for (let i = 0; i < binary.length; i++) {
+      bytes[i] = binary.charCodeAt(i);
+    }
+    return cachedTextDecoder().decode(bytes);
+  }
+  return Buffer.from(data, "base64").toString("utf-8");
+}