thirdweb 5.95.0-nightly-64bd603301b3067b6a69a29f66a28dee7ffa38f5-20250416000349 → 5.95.0-nightly-4cf15a2475fce1c5b55d19f7cf51ab080e80e33f-20250418000341

package/src/react/web/ui/ConnectWallet/screens/ViewNFTs.tsx

@@ -130,53 +130,12 @@ export function ViewNFTsContent(props: {
       });
 
       return result
-        .filter((nft) => !!nft.name && !!nft.image_url)
+        .filter((nft) => !!nft.metadata.name && !!nft.metadata.image)
         .map((nft) => {
-          let parsedNft: NFT;
-          const metadata = {
-            name: nft.name,
-            description: nft.description,
-            image: nft.image_url,
-            animation_url: nft.video_url,
-            external_url: nft.external_url,
-            background_color: nft.background_color,
-            uri: nft.metadata_url ?? "",
-            image_url: nft.image_url,
-            attributes: Array.isArray(nft.extra_metadata?.attributes)
-              ? nft.extra_metadata?.attributes?.reduce(
-                  (acc, attr) => {
-                    acc[attr.trait_type] = attr.value;
-                    return acc;
-                  },
-                  {} as Record<string, unknown>,
-                )
-              : {},
-          };
-
-          if (nft.contract?.type === "erc1155") {
-            parsedNft = {
-              id: BigInt(nft.token_id),
-              type: "ERC1155",
-              owner: activeAccount.address,
-              tokenURI: nft.metadata_url ?? "",
-              supply: BigInt(nft.balance), // TODO: this is wrong
-              metadata,
-            };
-          } else {
-            parsedNft = {
-              id: BigInt(nft.token_id),
-              type: "ERC721",
-              owner: activeAccount.address,
-              tokenURI: nft.metadata_url ?? "",
-              metadata,
-            };
-          }
-
           return {
-            chain: getCachedChain(nft.chain_id),
-            address: nft.token_address as Address,
-            quantityOwned: BigInt(nft.balance),
-            ...parsedNft,
+            chain: getCachedChain(nft.chainId),
+            address: nft.tokenAddress as Address,
+            ...nft,
           };
         });
     },
@@ -197,29 +156,45 @@ export function ViewNFTsContent(props: {
 
   return (
     <>
-      <Container
-        style={{
-          display: "grid",
-          gridTemplateColumns: "1fr 1fr",
-          gap: "12px",
-        }}
-      >
-        {nftQuery.error ? (
-          <Text>Error loading NFTs</Text>
-        ) : nftQuery.isLoading || !filteredNFTs ? (
-          <Skeleton height="150px" width="150px" />
-        ) : (
-          filteredNFTs.map((nft) => (
-            <NftCard
-              key={`${nft.chain.id}:${nft.address}:${nft.id}`}
-              {...nft}
-              client={props.client}
-              chain={nft.chain}
-              theme={props.theme}
-            />
-          ))
-        )}
-      </Container>
+      {nftQuery.error ? (
+        <Container center="both" py="lg">
+          <Text size="sm" color="secondaryText" center>
+            Error loading NFTs
+          </Text>
+        </Container>
+      ) : nftQuery.data?.length === 0 && !nftQuery.isLoading ? (
+        <Container center="both" py="lg">
+          <Text size="sm" color="secondaryText" center>
+            No NFTs found on this chain
+          </Text>
+        </Container>
+      ) : (
+        <Container
+          style={{
+            display: "grid",
+            gridTemplateColumns: "1fr 1fr",
+            gap: "12px",
+          }}
+        >
+          {nftQuery.isLoading || !filteredNFTs ? (
+            <>
+              <Skeleton height="150px" width="150px" />
+              <Skeleton height="150px" width="150px" />
+              <Skeleton height="150px" width="150px" />
+            </>
+          ) : (
+            filteredNFTs.map((nft) => (
+              <NftCard
+                key={`${nft.chain.id}:${nft.address}:${nft.id}`}
+                {...nft}
+                client={props.client}
+                chain={nft.chain}
+                theme={props.theme}
+              />
+            ))
+          )}
+        </Container>
+      )}
       <Spacer y="lg" />
     </>
   );

package/src/react/web/ui/ConnectWallet/screens/ViewTokens.tsx

@@ -2,7 +2,6 @@ import { useQuery } from "@tanstack/react-query";
 import type { Chain } from "../../../../../chains/types.js";
 import type { ThirdwebClient } from "../../../../../client/client.js";
 import { getOwnedTokens } from "../../../../../insight/get-tokens.js";
-import { toTokens } from "../../../../../utils/units.js";
 import { fontSize } from "../../../../core/design-system/index.js";
 import { useWalletBalance } from "../../../../core/hooks/others/useWalletBalance.js";
 import { useActiveAccount } from "../../../../core/hooks/wallets/useActiveAccount.js";
@@ -94,8 +93,7 @@ export function ViewTokensContent(props: {
       return result.filter(
         (token) =>
           !defaultTokens[activeChain.id]?.some(
-            (t) =>
-              t.address.toLowerCase() === token.token_address.toLowerCase(),
+            (t) => t.address.toLowerCase() === token.tokenAddress.toLowerCase(),
           ),
       );
     },
@@ -139,22 +137,14 @@ export function ViewTokensContent(props: {
         return (
           <TokenInfo
             token={{
-              address: token.token_address,
+              address: token.tokenAddress,
               name: token.name ?? "",
               symbol: token.symbol ?? "",
             }}
-            key={token.token_address}
+            key={token.tokenAddress}
             chain={activeChain}
             client={props.client}
-            balanceData={{
-              symbol: token.symbol ?? "",
-              name: token.name ?? "",
-              decimals: token.decimals ?? 18,
-              displayValue: toTokens(
-                BigInt(token.balance),
-                token.decimals ?? 18,
-              ),
-            }}
+            balanceData={token}
           />
         );
       })}

package/src/react/web/ui/components/TokenIcon.tsx

@@ -6,12 +6,13 @@ import { NATIVE_TOKEN_ADDRESS } from "../../../../constants/addresses.js";
 import { iconSize } from "../../../core/design-system/index.js";
 import { useChainIconUrl } from "../../../core/hooks/others/useChainQuery.js";
 import { genericTokenIcon } from "../../../core/utils/walletIcon.js";
+import { CoinsIcon } from "../ConnectWallet/icons/CoinsIcon.js";
 import {
   type NativeToken,
   isNativeToken,
 } from "../ConnectWallet/screens/nativeToken.js";
 import { Img } from "./Img.js";
-
+import { Container } from "./basic.js";
 /**
  * @internal
  */
@@ -38,13 +39,21 @@ export function TokenIcon(props: {
     return props.token.icon;
   }, [props.token, chainIconQuery.url]);
 
-  return (
+  return tokenImage ? (
     <Img
-      src={tokenImage || ""}
+      src={tokenImage}
       width={iconSize[props.size]}
       height={iconSize[props.size]}
       fallbackImage={genericTokenIcon}
       client={props.client}
     />
+  ) : (
+    <Container
+      center="both"
+      style={{ width: iconSize[props.size], height: iconSize[props.size] }}
+      color="secondaryText"
+    >
+      <CoinsIcon size={iconSize[props.size]} />
+    </Container>
   );
 }

package/src/react/web/ui/prebuilt/NFT/utils.test.ts

@@ -12,40 +12,7 @@ describe.runIf(process.env.TW_SECRET_KEY)("getNFTInfo", () => {
       contract: DOODLES_CONTRACT,
       tokenId: 0n,
     });
-    expect(nft).toStrictEqual({
-      id: 0n,
-      metadata: {
-        attributes: [
-          {
-            trait_type: "face",
-            value: "mustache",
-          },
-          {
-            trait_type: "hair",
-            value: "purple long",
-          },
-          {
-            trait_type: "body",
-            value: "blue and yellow jacket",
-          },
-          {
-            trait_type: "background",
-            value: "green",
-          },
-          {
-            trait_type: "head",
-            value: "tan",
-          },
-        ],
-        description:
-          "A community-driven collectibles project featuring art by Burnt Toast. Doodles come in a joyful range of colors, traits and sizes with a collection size of 10,000. Each Doodle allows its owner to vote for experiences and activations paid for by the Doodles Community Treasury. Burnt Toast is the working alias for Scott Martin, a Canadian–based illustrator, designer, animator and muralist.",
-        image: "ipfs://QmUEfFfwAh4wyB5UfHCVPUxis4j4Q4kJXtm5x5p3g1fVUn",
-        name: "Doodle #0",
-      },
-      owner: null,
-      tokenURI: "ipfs://QmPMc4tcBsMqLRuCQtPmPe84bpSjrC3Ky7t3JWuHXYB4aS/0",
-      type: "ERC721",
-    });
+    expect(nft.metadata.name).toBe("Doodle #0");
   });
 
   it("should work with ERC1155", async () => {
@@ -53,36 +20,7 @@ describe.runIf(process.env.TW_SECRET_KEY)("getNFTInfo", () => {
       contract: DROP1155_CONTRACT,
       tokenId: 0n,
     });
-    expect(nft).toStrictEqual({
-      id: 0n,
-      metadata: {
-        animation_url:
-          "ipfs://QmeGCqV1mSHTZrvuFzW1XZdCRRGXB6AmSotTqHoxA2xfDo/1.mp4",
-        attributes: [
-          {
-            trait_type: "Revenue Share",
-            value: "40%",
-          },
-          {
-            trait_type: "Max Supply",
-            value: "50",
-          },
-          {
-            trait_type: "Max Per Wallet",
-            value: "1",
-          },
-        ],
-        background_color: "",
-        description: "",
-        external_url: "https://auraexchange.org",
-        image: "ipfs://QmeGCqV1mSHTZrvuFzW1XZdCRRGXB6AmSotTqHoxA2xfDo/0.png",
-        name: "Aura OG",
-      },
-      owner: null,
-      supply: 33n,
-      tokenURI: "ipfs://QmNgevzVNwJWJdErFY2B7KsuKdJz3gVuBraNKaSxPktLh5/0",
-      type: "ERC1155",
-    });
+    expect(nft.metadata.name).toBe("Aura OG");
   });
 
   it("should throw error if failed to load nft info", async () => {

package/src/react/web/ui/prebuilt/NFT/utils.ts

@@ -11,8 +11,13 @@ export async function getNFTInfo(options: NFTProviderProps): Promise<NFT> {
   return withCache(
     async () => {
       const nft = await Promise.allSettled([
-        getNFT721(options),
-        getNFT1155(options),
+        getNFT721({
+          ...options,
+          useIndexer: false, // TODO (insight): switch this call to only call insight once
+        }),
+        getNFT1155({
+          ...options,
+        }),
       ]).then(([possibleNFT721, possibleNFT1155]) => {
         // getNFT extension always return an NFT object
         // so we need to check if the tokenURI exists

package/src/rpc/fetch-rpc.ts

@@ -78,16 +78,7 @@ export async function fetchRpc(
     );
   }
 
-  if (response.headers.get("Content-Type")?.startsWith("application/json")) {
-    return await response.json();
-  }
-  const text = await response.text();
-  try {
-    return JSON.parse(text);
-  } catch (err) {
-    console.error("Error parsing response", err, text);
-    throw err;
-  }
+  return await response.json();
 }
 
 type FetchSingleRpcOptions = {
@@ -121,14 +112,5 @@ export async function fetchSingleRpc(
       `RPC request failed with status ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
     );
   }
-  if (response.headers.get("Content-Type")?.startsWith("application/json")) {
-    return await response.json();
-  }
-  const text = await response.text();
-  try {
-    return JSON.parse(text);
-  } catch (err) {
-    console.error("Error parsing response", err, text);
-    throw err;
-  }
+  return await response.json();
 }

package/src/rpc/rpc.ts

@@ -144,7 +144,11 @@ export function getRpcClient(
 
             // No response.
             if (!response) {
-              inflight.reject(new Error("No response"));
+              inflight.reject(
+                new Error(
+                  `No response for index ${index} - all responses: ${stringify(responses)}`,
+                ),
+              );
             }
             // Response is an error or error string.
             else if (response instanceof Error) {

package/src/social/profiles.ts

@@ -32,15 +32,11 @@ export async function getSocialProfiles(args: {
     `${getThirdwebBaseUrl("social")}/v1/profiles/${address}`,
   );
 
-  if (response.status !== 200) {
-    try {
-      const errorBody = await response.json();
-      throw new Error(`Failed to fetch profile: ${errorBody.message}`);
-    } catch {
-      throw new Error(
-        `Failed to fetch profile: ${response.status}\n${await response.text()}`,
-      );
-    }
+  if (!response.ok) {
+    const errorBody = await response.text().catch(() => "Unknown error");
+    throw new Error(
+      `Failed to fetch profile: ${response.status} ${response.statusText} - ${errorBody}`,
+    );
   }
 
   return (await response.json()).data as SocialProfile[];

package/src/storage/download.ts

@@ -99,8 +99,10 @@ export async function download(options: DownloadOptions) {
   });
 
   if (!res.ok) {
-    res.body?.cancel();
-    throw new Error(`Failed to download file: ${res.statusText}`);
+    const error = await res.text();
+    throw new Error(
+      `Failed to download file: ${res.status} ${res.statusText} ${error || ""}`,
+    );
   }
   return res;
 }

package/src/storage/unpin.ts

@@ -41,12 +41,14 @@ export async function unpin(options: UnpinOptions) {
   );
 
   if (!res.ok) {
-    res.body?.cancel();
     if (res.status === 401) {
       throw new Error(
         "Unauthorized - You don't have permission to use this service.",
       );
     }
-    throw new Error(`Failed to unpin file - ${res.status} - ${res.statusText}`);
+    const error = await res.text();
+    throw new Error(
+      `Failed to unpin file - ${res.status} - ${res.statusText} ${error || ""}`,
+    );
   }
 }

package/src/storage/upload/web-node.ts

@@ -29,7 +29,6 @@ export async function uploadBatch<const TFiles extends UploadableFile[]>(
   );
 
   if (!res.ok) {
-    res.body?.cancel();
     if (res.status === 401) {
       throw new Error(
         "Unauthorized - You don't have permission to use this service.",

package/src/utils/nft/parseNft.test.ts

@@ -21,6 +21,8 @@ describe("parseNft", () => {
       tokenId: 0n,
       tokenUri: "ipfs://",
       type: "ERC721",
+      tokenAddress: "0x1234567890123456789012345678901234567890",
+      chainId: 1,
     };
     const result = parseNFT(base, option);
     const expectedResult: NFT = {
@@ -29,6 +31,8 @@ describe("parseNft", () => {
       id: option.tokenId,
       tokenURI: option.tokenUri,
       type: option.type,
+      tokenAddress: option.tokenAddress,
+      chainId: option.chainId,
     };
     expect(result).toMatchObject(expectedResult);
   });
@@ -39,6 +43,8 @@ describe("parseNft", () => {
       tokenUri: "ipfs://",
       type: "ERC1155",
       supply: 10n,
+      tokenAddress: "0x1234567890123456789012345678901234567890",
+      chainId: 1,
     };
     const expectedResult: NFT = {
       metadata: base,
@@ -47,6 +53,8 @@ describe("parseNft", () => {
       tokenURI: option.tokenUri,
       type: option.type,
       supply: option.supply,
+      tokenAddress: option.tokenAddress,
+      chainId: option.chainId,
     };
     const result = parseNFT(base, option);
     expect(result).toMatchObject(expectedResult);

package/src/utils/nft/parseNft.ts

@@ -41,6 +41,8 @@ export type NFT =
       id: bigint;
       tokenURI: string;
       type: "ERC721";
+      tokenAddress: string;
+      chainId: number;
     }
   | {
       metadata: NFTMetadata;
@@ -49,6 +51,8 @@ export type NFT =
       tokenURI: string;
       type: "ERC1155";
       supply: bigint;
+      tokenAddress: string;
+      chainId: number;
     };
 
 /**
@@ -60,6 +64,8 @@ export type ParseNFTOptions =
       tokenUri: string;
       type: "ERC721";
       owner?: string | null;
+      tokenAddress: string;
+      chainId: number;
     }
   | {
       tokenId: bigint;
@@ -67,6 +73,8 @@ export type ParseNFTOptions =
       type: "ERC1155";
       owner?: string | null;
       supply: bigint;
+      tokenAddress: string;
+      chainId: number;
     };
 
 /**
@@ -85,6 +93,8 @@ export function parseNFT(base: NFTMetadata, options: ParseNFTOptions): NFT {
         id: options.tokenId,
         tokenURI: options.tokenUri,
         type: options.type,
+        tokenAddress: options.tokenAddress,
+        chainId: options.chainId,
       };
     case "ERC1155":
       return {
@@ -94,6 +104,8 @@ export function parseNFT(base: NFTMetadata, options: ParseNFTOptions): NFT {
         tokenURI: options.tokenUri,
         type: options.type,
         supply: options.supply,
+        tokenAddress: options.tokenAddress,
+        chainId: options.chainId,
       };
     default:
       throw new Error("Invalid NFT type");

package/src/utils/signatures/resolve-signature.ts

@@ -17,7 +17,6 @@ async function resolveFunctionSignature(
     `${SIGNATURE_API}/signatures/?format=json&hex_signature=${hexSig}`,
   );
   if (!res.ok) {
-    res.body?.cancel();
     return null;
   }
   const data = await res.json();
@@ -39,7 +38,6 @@ async function resolveEventSignature(
     `${SIGNATURE_API}/event-signatures/?format=json&hex_signature=${hexSig}`,
   );
   if (!res.ok) {
-    res.body?.cancel();
     return null;
   }
   const data = await res.json();

package/src/version.ts

@@ -1 +1 @@
-export const version = "5.95.0-nightly-64bd603301b3067b6a69a29f66a28dee7ffa38f5-20250416000349";
+export const version = "5.95.0-nightly-4cf15a2475fce1c5b55d19f7cf51ab080e80e33f-20250418000341";

package/src/wallets/in-app/core/users/getUser.test.ts

@@ -190,6 +190,9 @@ describe("getUser", () => {
   it("should handle fetch errors", async () => {
     mockFetch.mockResolvedValueOnce({
       ok: false,
+      status: 404,
+      statusText: "Not Found",
+      text: async () => "some message",
     });
 
     await expect(
@@ -197,7 +200,7 @@ describe("getUser", () => {
         client: mockClient,
         walletAddress: "0x123",
       }),
-    ).rejects.toThrow("Failed to get profiles");
+    ).rejects.toThrow("Failed to get profiles. 404 Not Found: some message");
   });
 
   it("should return null if no user is found", async () => {

package/src/wallets/in-app/core/users/getUser.ts

@@ -95,7 +95,10 @@ export async function getUser({
   const res = await clientFetch(url.toString());
 
   if (!res.ok) {
-    throw new Error("Failed to get profiles");
+    const error = await res.text().catch(() => "Unknown error");
+    throw new Error(
+      `Failed to get profiles. ${res.status} ${res.statusText}: ${error}`,
+    );
   }
 
   const data = (await res.json()) as {

package/src/wallets/smart/lib/calls.ts

@@ -114,8 +114,8 @@ export async function predictAddress(args: {
             throw error;
           }
 
-          // Exponential backoff: 2^(retries + 1) * 100ms (200ms, 400ms, 800ms)
-          const delay = 2 ** (retries + 1) * 100;
+          // Exponential backoff: 2^(retries + 1) * 200ms (400ms, 800ms, 1600ms)
+          const delay = 2 ** (retries + 1) * 200;
           await new Promise((resolve) => setTimeout(resolve, delay));
           retries++;
         }

package/src/wallets/utils/getWalletBalance.ts

@@ -5,7 +5,9 @@ import {
   getChainSymbol,
 } from "../../chains/utils.js";
 import type { ThirdwebClient } from "../../client/client.js";
+import { NATIVE_TOKEN_ADDRESS } from "../../constants/addresses.js";
 import { getContract } from "../../contract/contract.js";
+import type { GetBalanceResult } from "../../extensions/erc20/read/getBalance.js";
 import { eth_getBalance } from "../../rpc/actions/eth_getBalance.js";
 import { getRpcClient } from "../../rpc/rpc.js";
 import { toTokens } from "../../utils/units.js";
@@ -20,13 +22,7 @@ export type GetWalletBalanceOptions = {
   tokenAddress?: string;
 };
 
-export type GetWalletBalanceResult = {
-  value: bigint;
-  decimals: number;
-  displayValue: string;
-  symbol: string;
-  name: string;
-};
+export type GetWalletBalanceResult = GetBalanceResult;
 
 /**
  * Retrieves the balance of a token or native currency for a given wallet.
@@ -75,5 +71,7 @@ export async function getWalletBalance(
     displayValue: toTokens(nativeBalance, nativeDecimals),
     symbol: nativeSymbol,
     name: nativeName,
+    tokenAddress: tokenAddress ?? NATIVE_TOKEN_ADDRESS,
+    chainId: chain.id,
   };
 }