thirdweb 5.34.4-nightly-88fa60d4ad7ee6ce0a8305ce35e023d1a858ea85-20240716000333 → 5.35.0-nightly-aadbd33e9d696bd7dd77561fa3f3a0a0fa7747f5-20240716082511

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

@@ -34,7 +34,10 @@ export function ManageWalletScreen(props: {
       }}
     >
       <Container p="lg">
-        <ModalHeader title="Manage Wallet" onBack={props.onBack} />
+        <ModalHeader
+          title={props.locale.manageWallet.title}
+          onBack={props.onBack}
+        />
       </Container>
       <Line />
       <Container
@@ -62,7 +65,9 @@ export function ManageWalletScreen(props: {
             }}
           >
             <WalletConnectIcon size={iconSize.md} />
-            <Text color="primaryText">Connect an App</Text>
+            <Text color="primaryText">
+              {props.locale.manageWallet.connectAnApp}
+            </Text>
           </MenuButton>
 
           {/* Private Key Export (if enabled) */}
@@ -79,7 +84,9 @@ export function ManageWalletScreen(props: {
                 }}
               >
                 <KeyIcon size={iconSize.md} />
-                <Text color="primaryText">Export Private Key</Text>
+                <Text color="primaryText">
+                  {props.locale.manageWallet.exportPrivateKey}
+                </Text>
               </MenuButton>
             )}
         </Container>

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

@@ -10,6 +10,7 @@ import { Text } from "../../components/text.js";
 import { MenuButton } from "../MenuButton.js";
 import { CoinsIcon } from "../icons/CoinsIcon.js";
 import { ImageIcon } from "../icons/ImageIcon.js";
+import type { ConnectLocale } from "../locale/types.js";
 import type { WalletDetailsModalScreen } from "./types.js";
 
 /**
@@ -21,7 +22,9 @@ export function ViewFunds(props: {
   onBack: () => void;
   setScreen: (screen: WalletDetailsModalScreen) => void;
   client: ThirdwebClient;
+  connectLocale: ConnectLocale;
 }) {
+  const { connectLocale } = props;
   return (
     <Container
       style={{
@@ -29,7 +32,10 @@ export function ViewFunds(props: {
       }}
     >
       <Container p="lg">
-        <ModalHeader title="View Funds" onBack={props.onBack} />
+        <ModalHeader
+          title={connectLocale.viewFunds.title}
+          onBack={props.onBack}
+        />
       </Container>
       <Line />
       <Container
@@ -50,7 +56,7 @@ export function ViewFunds(props: {
           }}
         >
           <CoinsIcon size={iconSize.md} />
-          <Text color="primaryText">View Tokens</Text>
+          <Text color="primaryText">{connectLocale.viewFunds.viewTokens}</Text>
         </MenuButton>
         <MenuButton
           onClick={() => {
@@ -61,7 +67,7 @@ export function ViewFunds(props: {
           }}
         >
           <ImageIcon size={iconSize.md} />
-          <Text color="primaryText">View NFTs</Text>
+          <Text color="primaryText">{connectLocale.viewFunds.viewNFTs}</Text>
         </MenuButton>
         <Spacer y="lg" />
       </Container>

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

@@ -16,6 +16,7 @@ import { MediaRenderer } from "../../MediaRenderer/MediaRenderer.js";
 import { Skeleton } from "../../components/Skeleton.js";
 import { Spacer } from "../../components/Spacer.js";
 import { Container, Line, ModalHeader } from "../../components/basic.js";
+import type { ConnectLocale } from "../locale/types.js";
 
 const fetchNFTs = async (
   client: ThirdwebClient,
@@ -69,6 +70,7 @@ export function ViewNFTs(props: {
   theme: Theme | "light" | "dark";
   onBack: () => void;
   client: ThirdwebClient;
+  connectLocale: ConnectLocale;
 }) {
   const activeAccount = useActiveAccount();
   const activeChain = useActiveWalletChain();
@@ -77,6 +79,8 @@ export function ViewNFTs(props: {
     return null;
   }
 
+  const { connectLocale } = props;
+
   const nftList = useMemo(() => {
     const nfts = [];
     if (!props.supportedNFTs) return [];
@@ -108,7 +112,10 @@ export function ViewNFTs(props: {
       }}
     >
       <Container p="lg">
-        <ModalHeader title="View NFTs" onBack={props.onBack} />
+        <ModalHeader
+          title={connectLocale.viewFunds.viewNFTs}
+          onBack={props.onBack}
+        />
       </Container>
       <Line />
       <Container

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

@@ -13,6 +13,7 @@ import { Spacer } from "../../components/Spacer.js";
 import { TokenIcon } from "../../components/TokenIcon.js";
 import { Container, Line, ModalHeader } from "../../components/basic.js";
 import { Text } from "../../components/text.js";
+import type { ConnectLocale } from "../locale/types.js";
 import { formatTokenBalance } from "./formatTokenBalance.js";
 import {
   type ERC20OrNativeToken,
@@ -27,6 +28,7 @@ export function ViewTokens(props: {
   supportedTokens?: SupportedTokens;
   onBack: () => void;
   client: ThirdwebClient;
+  connectLocale: ConnectLocale;
 }) {
   const activeChain = useActiveWalletChain();
   const supportedTokens = props.supportedTokens || defaultTokens;
@@ -37,6 +39,7 @@ export function ViewTokens(props: {
 
   const tokenList =
     (activeChain?.id ? supportedTokens[activeChain.id] : undefined) || [];
+  const { connectLocale } = props;
 
   return (
     <Container
@@ -45,7 +48,10 @@ export function ViewTokens(props: {
       }}
     >
       <Container p="lg">
-        <ModalHeader title="View Funds" onBack={props.onBack} />
+        <ModalHeader
+          title={connectLocale.viewFunds.title}
+          onBack={props.onBack}
+        />
       </Container>
       <Line />
       <Container

package/src/react/web/ui/types.ts

@@ -1,2 +1,2 @@
 // valid combinations of ISO language code and ISO country code
-export type LocaleId = "en_US" | "es_ES" | "ja_JP" | "tl_PH";
+export type LocaleId = "en_US" | "es_ES" | "ja_JP" | "tl_PH" | "vi_VN";

package/src/react/web/wallets/injected/locale/getInjectedWalletLocale.ts

@@ -14,6 +14,8 @@ export async function getInjectedWalletLocale(
       return (await import("./ja.js")).default;
     case "tl_PH":
       return (await import("./tl.js")).default;
+    case "vi_VN":
+      return (await import("./vi.js")).default;
     default:
       return (await import("./en.js")).default;
   }

package/src/react/web/wallets/injected/locale/vi.ts

@@ -0,0 +1,27 @@
+import type { InjectedWalletLocale } from "./types.js";
+
+/**
+ * @internal
+ */
+const injectedWalletLocaleVi = (wallet: string): InjectedWalletLocale => ({
+  connectionScreen: {
+    inProgress: "Đang đợi xác nhận",
+    failed: "Kết nối thất bại",
+    instruction: `Kết nối bằng ứng dụng ${wallet}`,
+    retry: "Thử lại",
+  },
+  getStartedScreen: {
+    instruction: `Quét mã QR để tải ứng dụng ${wallet}`,
+  },
+  scanScreen: {
+    instruction: `Quét mã QR bằng ứng dụng ${wallet} để kết nối`,
+  },
+  getStartedLink: `Tôi không có ứng dụng ${wallet}`,
+  download: {
+    chrome: "Tải cho trình duyệt Chrome",
+    android: "Tải trên Google Play",
+    iOS: "Tải trên App Store",
+  },
+});
+
+export default injectedWalletLocaleVi;

package/src/react/web/wallets/local/locale/getLocalWalletLocale.ts

@@ -14,6 +14,8 @@ export async function getLocalWalletLocale(
       return (await import("./ja.js")).default;
     case "tl_PH":
       return (await import("./tl.js")).default;
+    case "vi_VN":
+      return (await import("./vi.js")).default;
     default:
       return (await import("./en.js")).default;
   }

package/src/react/web/wallets/local/locale/vi.ts

@@ -0,0 +1,48 @@
+import type { LocalWalletLocale } from "./types.js";
+
+const localWalletLocaleVi: LocalWalletLocale = {
+  passwordLabel: "Mật khẩu",
+  confirmPasswordLabel: "Xác nhận mật khẩu",
+  enterYourPassword: "Nhập mật khẩu của bạn",
+  warningScreen: {
+    title: "Cảnh báo",
+    warning:
+      "Ví hiện tại sẽ bị xoá nếu bạn tạo một ví mới. Hãy cân nhắc sao lưu ví về thiết bị",
+    backupWallet: "Sao lưu ví",
+    skip: "Bỏ qua",
+  },
+  reconnectScreen: {
+    title: "Kết nối bằng ví đã lưu",
+    savedWallet: "Ví đã lưu",
+    continue: "Tiếp tục",
+    createNewWallet: "Tạo ví mới",
+  },
+  createScreen: {
+    instruction:
+      "Chọn một mật khẩu cho ví của bạn. Bạn có thể dùng mật khẩu đã đặt để truy cập và sao lưu ví sau này",
+    importWallet: "Thêm ví",
+    createNewWallet: "Tạo ví mới",
+    connecting: "Đang kết nối",
+  },
+  exportScreen: {
+    downloadMessage: "Một tệp chứa private key sẽ được tải về thiết bị của bạn",
+    decryptMessage: "Nhập mật khẩu để giải mã private key",
+    walletAddress: "Địa chỉ ví",
+    download: "Tải về",
+    title: "Sao lưu ví",
+  },
+  importScreen: {
+    title: "Thêm ví mới",
+    description1:
+      "Ứng dụng này có thể tự do giao dịch mà không cần sự cho phép của bạn",
+    description2: "Bạn chỉ nên kết nối ví với những ứng dụng đáng tin cậy",
+    passwordDescription:
+      "Chọn một mật khẩu để mã hoá private key. Private key đã mã hoá sẽ được lưu trên trình duyệt",
+    import: "Thêm",
+    uploadJSON: "Tải lên tệp JSON",
+    uploadedSuccessfully: "Tải lên thành công",
+    invalidPrivateKey: "Private Key không hợp lệ",
+  },
+};
+
+export default localWalletLocaleVi;

package/src/react/web/wallets/shared/locale/getConnectLocale.ts

@@ -14,6 +14,8 @@ export async function getInAppWalletLocale(
       return (await import("./ja.js")).default;
     case "tl_PH":
       return (await import("./tl.js")).default;
+    case "vi_VN":
+      return (await import("./vi.js")).default;
     default:
       return (await import("./en.js")).default;
   }

package/src/react/web/wallets/shared/locale/vi.ts

@@ -0,0 +1,56 @@
+import type { InAppWalletLocale } from "./types.js";
+
+export default {
+  signInWithGoogle: "Google",
+  signInWithFacebook: "Facebook",
+  signInWithApple: "Apple",
+  emailPlaceholder: "Địa chỉ email",
+  submitEmail: "Tiếp tục",
+  signIn: "Đăng nhập",
+  or: "Hoặc",
+  emailRequired: "Vui lòng nhập địa chỉ email",
+  invalidEmail: "Địa chỉ email không hợp lệ",
+  maxAccountsExceeded:
+    "Số tài khoản vượt quá mức quy định. Vui lòng liên hệ với lập trình viên của ứng dụng này",
+  socialLoginScreen: {
+    title: "Đăng nhập",
+    instruction: "Đăng nhập ở cửa sổ hiện lên",
+    failed: "Đăng nhập thất bại",
+    retry: "Thử lại",
+  },
+  emailLoginScreen: {
+    title: "Đăng nhập",
+    enterCodeSendTo: "Nhập mã xác nhận được gửi tới",
+    newDeviceDetected: "Bạn đang đăng nhập trên một thiết bị mới",
+    enterRecoveryCode:
+      "Nhập mã khôi phục mà bạn nhận được khi đăng nhập lần đầu",
+    invalidCode: "Mã xác nhận không hợp lệ",
+    invalidCodeOrRecoveryCode: "Mã xác nhận hoặc mã khôi phục bị sai",
+    verify: "Xác nhận",
+    failedToSendCode: "Gửi mã xác nhận thất bại",
+    sendingCode: "Đang gửi mã xác nhận",
+    resendCode: "Gửi lại mã xác nhận",
+  },
+  createPassword: {
+    title: "Tạo mật khẩu",
+    instruction:
+      "Đặt mật khẩu cho tài khoản của bạn. Bạn cần mật khẩu này mỗi khi đăng nhập trên một thiết bị mới",
+    saveInstruction: "Vui lòng sao lưu mật khẩu",
+    inputPlaceholder: "Nhập mật khẩu của bạn",
+    confirmation: "Tôi đã sao lưu mật khẩu",
+    submitButton: "Đặt mật khẩu",
+    failedToSetPassword: "Đặt mật khẩu thất bại",
+  },
+  enterPassword: {
+    title: "Nhập mật khẩu",
+    instruction: "Nhập mật khẩu cho tài khoản của bạn",
+    inputPlaceholder: "Nhập mật khẩu của bạn",
+    submitButton: "Xác nhân",
+    wrongPassword: "Sai mật khẩu",
+  },
+  signInWithEmail: "Đăng nhập bằng email",
+  invalidPhone: "Số điện thoại không hợp lệ",
+  phonePlaceholder: "Số điện thoại",
+  signInWithPhone: "Đăng nhập bằng số điện thoại",
+  phoneRequired: "Vui lòng nhập số điện thoại",
+} satisfies InAppWalletLocale;

package/src/react/web/wallets/smartWallet/locale/getSmartWalletLocale.ts

@@ -14,6 +14,8 @@ export async function getSmartWalletLocale(
       return (await import("./ja.js")).default;
     case "tl_PH":
       return (await import("./tl.js")).default;
+    case "vi_VN":
+      return (await import("./vi.js")).default;
     default:
       return (await import("./en.js")).default;
   }

package/src/react/web/wallets/smartWallet/locale/vi.ts

@@ -0,0 +1,13 @@
+import type { SmartWalletLocale } from "./types.js";
+
+const smartWalletLocalVi: SmartWalletLocale = {
+  connecting: "Đang kết nối Tài Khoản Thông Minh",
+  failedToConnect: "Kết nối Tài Khoản Thông Minh thất bại",
+  wrongNetworkScreen: {
+    title: "Sai mạng lưới",
+    subtitle: "Vui lòng chuyển sang mạng lưới được yêu cầu",
+    failedToSwitch: "Chuyển mạng lưới thất bại",
+  },
+};
+
+export default smartWalletLocalVi;

package/src/react/web/wallets/walletConnect/locale.ts

@@ -25,4 +25,8 @@ export const walletConnectLocales: Record<LocaleId, WalletConnectLocale> = {
     scanInstruction: "Escanea esto con tu aplicación de cartera para conectar",
     openWCModal: "Abre el Modal Oficial de WalletConnect",
   },
+  vi_VN: {
+    scanInstruction: "Quét mã QR bằng ứng dụng ví để kết nối",
+    openWCModal: "Mở giao diện WalletConnect",
+  },
 };

package/src/transaction/extract-error.ts

@@ -48,20 +48,20 @@ class TransactionError<abi extends Abi> extends Error {
   public chainId: number | undefined;
 
   constructor(reason: string, contract?: ThirdwebContract<abi>) {
-    super();
-    this.name = "TransactionError";
-    this.contractAddress = contract?.address;
-    this.chainId = contract?.chain?.id;
+    let message = reason;
     if (__DEV__ && contract) {
       // show more infor in dev
-      this.message = [
+      message = [
         reason,
         "",
-        `contract: ${this.contractAddress}`,
-        `chainId: ${this.chainId}`,
+        `contract: ${contract.address}`,
+        `chainId: ${contract.chain?.id}`,
       ].join("\n");
-    } else {
-      this.message = reason;
     }
+    super(message);
+    this.name = "TransactionError";
+    this.contractAddress = contract?.address;
+    this.chainId = contract?.chain?.id;
+    this.message = message;
   }
 }

package/src/utils/extensions/airdrop/fetch-proofs-erc1155.ts

@@ -10,6 +10,40 @@ import type {
   ShardedMerkleTreeInfo,
 } from "./types.js";
 
+/*
+ * Retrieves the claim merkle proof for the provided address.
+ * @param {Object} options
+ * @param {@link ThirdwebContract} contract - The ERC1155 airdrop contract
+ * @param {string} recipient - The address of the drop recipient
+ * @param {string} merkleRoot - The merkle root, found on the active claim condition
+ *
+ * @returns {Promise<ClaimProofERC20 | null>} A promise that resolves to the proof or null if the recipient is not in the allowlist
+ *
+ * @example
+ * ```ts
+ * import { fetchProofsERCC1155 } from "thirdweb/extensions/airdrop";
+ * import { getContract, defineChain } from "thirdweb";
+ *
+ * const TOKEN = getContracct({
+ *  client,
+ *  chain: defineChain(1),
+ *  address: "0x..."
+ * });
+ *
+ * const merkleRoot = await tokenMerkleRoot({
+ *  contract: TOKEN,
+ *  tokenAddress: TOKEN.address
+ * });
+ *
+ * const proof = await fetchProofsERC1155({
+ *  contract: TOKEN,
+ *  recipient: "0x...",
+ *  merkleRoot
+ * });
+ * ```
+ *
+ * @extension AIRDROP
+ */
 export async function fetchProofsERC1155(options: {
   contract: ThirdwebContract;
   recipient: string;

package/src/utils/extensions/airdrop/fetch-proofs-erc20.ts

@@ -11,7 +11,41 @@ import type {
   ShardedMerkleTreeInfo,
 } from "./types.js";
 
-export async function fetchProofsrERC20(options: {
+/*
+ * Retrieves the claim merkle proof for the provided address.
+ * @param {Object} options
+ * @param {@link ThirdwebContract} contract - The ERC20 airdrop contract
+ * @param {string} recipient - The address of the drop recipient
+ * @param {string} merkleRoot - The merkle root, found on the active claim condition
+ *
+ * @returns {Promise<ClaimProofERC20 | null>} A promise that resolves to the proof or null if the recipient is not in the allowlist
+ *
+ * @example
+ * ```ts
+ * import { fetchProofsERCC20 } from "thirdweb/extensions/airdrop";
+ * import { getContract, defineChain } from "thirdweb";
+ *
+ * const TOKEN = getContracct({
+ *  client,
+ *  chain: defineChain(1),
+ *  address: "0x..."
+ * });
+ *
+ * const merkleRoot = await tokenMerkleRoot({
+ *  contract: TOKEN,
+ *  tokenAddress: TOKEN.address
+ * });
+ *
+ * const proof = await fetchProofsERC20({
+ *  contract: TOKEN,
+ *  recipient: "0x...",
+ *  merkleRoot
+ * });
+ * ```
+ *
+ * @extension AIRDROP
+ */
+export async function fetchProofsERC20(options: {
   contract: ThirdwebContract;
   recipient: string;
   merkleRoot: string;

package/src/utils/extensions/airdrop/fetch-proofs-erc721.ts

@@ -10,6 +10,40 @@ import type {
   ShardedMerkleTreeInfo,
 } from "./types.js";
 
+/*
+ * Retrieves the claim merkle proof for the provided address.
+ * @param {Object} options
+ * @param {@link ThirdwebContract} contract - The ERC721 airdrop contract
+ * @param {string} recipient - The address of the drop recipient
+ * @param {string} merkleRoot - The merkle root, found on the active claim condition
+ *
+ * @returns {Promise<ClaimProofERC721 | null>} A promise that resolves to the proof or null if the recipient is not in the allowlist
+ *
+ * @example
+ * ```ts
+ * import { fetchProofsERC721 } from "thirdweb/extensions/airdrop";
+ * import { getContract, defineChain } from "thirdweb";
+ *
+ * const NFT = getContracct({
+ *  client,
+ *  chain: defineChain(1),
+ *  address: "0x..."
+ * });
+ *
+ * const merkleRoot = await tokenMerkleRoot({
+ *  contract: NFT,
+ *  tokenAddress: NFT.address
+ * });
+ *
+ * const proof = await fetchProofsERC721({
+ *  contract: NFT,
+ *  recipient: "0x...",
+ *  merkleRoot
+ * });
+ * ```
+ *
+ * @extension AIRDROP
+ */
 export async function fetchProofsERC721(options: {
   contract: ThirdwebContract;
   recipient: string;

package/src/version.ts

@@ -1 +1 @@
-export const version = "5.34.4-nightly-88fa60d4ad7ee6ce0a8305ce35e023d1a858ea85-20240716000333";
+export const version = "5.35.0-nightly-aadbd33e9d696bd7dd77561fa3f3a0a0fa7747f5-20240716082511";

package/src/wallets/in-app/web/lib/in-app-account.ts

@@ -307,23 +307,27 @@ export class IFrameWallet {
           parsedTypedData.types.EIP712Domain = undefined;
         }
         const domain = parsedTypedData.domain as TypedDataDefinition["domain"];
-        const chainId = domain?.chainId || 1;
+        const chainId = domain?.chainId;
+        const domainData = {
+          verifyingContract: domain?.verifyingContract,
+          name: domain?.name,
+          version: domain?.version,
+        };
+        // chain id can't be included if it wasn't explicitly specified
+        if (chainId) {
+          (domainData as Record<string, unknown>).chainId = chainId;
+        }
 
         const { signedTypedData } =
           await querier.call<SignedTypedDataReturnType>({
             procedureName: "signTypedDataV4",
             params: {
-              domain: {
-                chainId: chainId,
-                verifyingContract: domain?.verifyingContract,
-                name: domain?.name,
-                version: domain?.version,
-              },
+              domain: domainData,
               types:
                 parsedTypedData.types as SignerProcedureTypes["signTypedDataV4"]["types"],
               message:
                 parsedTypedData.message as SignerProcedureTypes["signTypedDataV4"]["message"],
-              chainId,
+              chainId: chainId || 1,
               partnerId,
               rpcEndpoint: `https://${chainId}.rpc.thirdweb.com`, // TODO (ew) shouldnt be needed
             },