thirdweb 5.36.0 → 5.37.0-nightly-6a94696c7e7db3d4e0920e039bdc187ab42e3c50-20240720000333

package/src/react/web/wallets/shared/ConnectWalletSocialOptions.tsx

@@ -8,9 +8,10 @@ import { webLocalStorage } from "../../../../utils/storage/webStorage.js";
 import { getEcosystemWalletAuthOptions } from "../../../../wallets/ecosystem/get-ecosystem-wallet-auth-options.js";
 import { isEcosystemWallet } from "../../../../wallets/ecosystem/is-ecosystem-wallet.js";
 import type { Account, Wallet } from "../../../../wallets/interfaces/wallet.js";
-import type {
-  AuthOption,
-  SocialAuthOption,
+import {
+  type AuthOption,
+  type SocialAuthOption,
+  socialAuthOptions,
 } from "../../../../wallets/types.js";
 import type { EcosystemWalletId } from "../../../../wallets/wallet-types.js";
 import { useCustomTheme } from "../../../core/design-system/CustomThemeProvider.js";
@@ -88,6 +89,7 @@ export const ConnectWalletSocialOptions = (
     google: locale.signInWithGoogle,
     facebook: locale.signInWithFacebook,
     apple: locale.signInWithApple,
+    discord: locale.signInWithDiscord,
   };
 
   const { data: ecosystemAuthOptions, isLoading } = useQuery({
@@ -148,16 +150,27 @@ export const ConnectWalletSocialOptions = (
     type = "tel";
   }
 
-  const socialLogins = authOptions.filter(
-    (x) => x === "google" || x === "apple" || x === "facebook",
+  const socialLogins = authOptions.filter((o) =>
+    socialAuthOptions.includes(o as SocialAuthOption),
   );
 
   const hasSocialLogins = socialLogins.length > 0;
+  const ecosystemInfo = isEcosystemWallet(wallet)
+    ? {
+        id: wallet.id,
+        partnerId: wallet.getConfig()?.partnerId,
+      }
+    : undefined;
 
   // Need to trigger login on button click to avoid popup from being blocked
   const handleSocialLogin = async (strategy: SocialAuthOption) => {
     try {
-      const socialLoginWindow = openOauthSignInWindow(strategy, themeObj);
+      const socialLoginWindow = openOauthSignInWindow({
+        authOption: strategy,
+        themeObj,
+        client: props.client,
+        ecosystem: ecosystemInfo,
+      });
       if (!socialLoginWindow) {
         throw new Error("Failed to open login window");
       }
@@ -236,16 +249,17 @@ export const ConnectWalletSocialOptions = (
                 variant={"outline"}
                 fullWidth={!showOnlyIcons}
                 onClick={() => {
-                  handleSocialLogin(loginMethod);
+                  handleSocialLogin(loginMethod as SocialAuthOption);
                 }}
               >
                 <Img
-                  src={socialIcons[loginMethod]}
+                  src={socialIcons[loginMethod as SocialAuthOption]}
                   width={imgIconSize}
                   height={imgIconSize}
                   client={props.client}
                 />
-                {!showOnlyIcons && loginMethodsLabel[loginMethod]}
+                {!showOnlyIcons &&
+                  loginMethodsLabel[loginMethod as SocialAuthOption]}
               </SocialButton>
             );
           })}

package/src/react/web/wallets/shared/SocialLogin.tsx

@@ -3,6 +3,7 @@ import { useEffect, useRef, useState } from "react";
 import type { Chain } from "../../../../chains/types.js";
 import type { ThirdwebClient } from "../../../../client/client.js";
 import { webLocalStorage } from "../../../../utils/storage/webStorage.js";
+import { isEcosystemWallet } from "../../../../wallets/ecosystem/is-ecosystem-wallet.js";
 import type { InAppWalletSocialAuth } from "../../../../wallets/in-app/core/wallet/types.js";
 import type { Wallet } from "../../../../wallets/interfaces/wallet.js";
 import { useCustomTheme } from "../../../core/design-system/CustomThemeProvider.js";
@@ -42,7 +43,17 @@ export function SocialLogin(props: {
 
   const handleSocialLogin = async () => {
     try {
-      const socialWindow = openOauthSignInWindow(props.socialAuth, themeObj);
+      const socialWindow = openOauthSignInWindow({
+        authOption: props.socialAuth,
+        themeObj,
+        client: props.client,
+        ecosystem: isEcosystemWallet(wallet)
+          ? {
+              id: wallet.id,
+              partnerId: wallet.getConfig()?.partnerId,
+            }
+          : undefined,
+      });
 
       if (!socialWindow) {
         throw new Error(`Failed to open ${props.socialAuth} login window`);

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

@@ -4,6 +4,7 @@ export default {
   signInWithGoogle: "Google",
   signInWithFacebook: "Facebook",
   signInWithApple: "Apple",
+  signInWithDiscord: "Discord",
   emailPlaceholder: "Email address",
   submitEmail: "Continue",
   signIn: "Sign in",

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

@@ -4,6 +4,7 @@ export default {
   signInWithGoogle: "Iniciar sesión con Google",
   signInWithFacebook: "Iniciar sesión con Facebook",
   signInWithApple: "Iniciar sesión con Apple",
+  signInWithDiscord: "Iniciar sesión con Discord",
   emailPlaceholder: "Ingresa tu dirección de correo electrónico",
   submitEmail: "Continuar",
   signIn: "Iniciar sesión",

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

@@ -4,6 +4,7 @@ export default {
   signInWithGoogle: "Googleでサインイン",
   signInWithFacebook: "Facebookでサインイン",
   signInWithApple: "Appleでサインイン",
+  signInWithDiscord: "Discordでサインイン",
   emailPlaceholder: "メールアドレスを入力してください",
   submitEmail: "続ける",
   emailRequired: "メールアドレスが必要です",

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

@@ -4,6 +4,7 @@ export default {
   signInWithGoogle: "Mag-sign in gamit ang Google",
   signInWithFacebook: "Mag-sign in gamit ang Facebook",
   signInWithApple: "Mag-sign in gamit ang Apple",
+  signInWithDiscord: "Mag-sign in gamit ang Discord",
   emailPlaceholder: "Ilagay ang iyong email address",
   submitEmail: "Magpatuloy",
   signIn: "Mag-sign in",

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

@@ -37,6 +37,7 @@ export type InAppWalletLocale = {
   or: string;
   invalidEmail: string;
   signIn: string;
+  signInWithDiscord: string;
   signInWithApple: string;
   signInWithFacebook: string;
   signInWithGoogle: string;

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

@@ -4,6 +4,7 @@ export default {
   signInWithGoogle: "Google",
   signInWithFacebook: "Facebook",
   signInWithApple: "Apple",
+  signInWithDiscord: "Discord",
   emailPlaceholder: "Địa chỉ email",
   submitEmail: "Tiếp tục",
   signIn: "Đăng nhập",

package/src/react/web/wallets/shared/openOauthSignInWindow.ts

@@ -1,4 +1,7 @@
+import type { ThirdwebClient } from "../../../../client/client.js";
+import { getDiscordLoginPath } from "../../../../wallets/in-app/core/authentication/getLoginPath.js";
 import type { InAppWalletSocialAuth } from "../../../../wallets/in-app/core/wallet/types.js";
+import type { Ecosystem } from "../../../../wallets/in-app/web/types.js";
 import type { Theme } from "../../../core/design-system/index.js";
 
 function getBodyTitle(authOption: InAppWalletSocialAuth) {
@@ -21,21 +24,41 @@ function getWidthAndHeight(authOption: InAppWalletSocialAuth) {
   }
 }
 
+function getOauthLoginPath(
+  authOption: InAppWalletSocialAuth,
+  client: ThirdwebClient,
+  ecosystem?: Ecosystem,
+) {
+  switch (authOption) {
+    case "discord":
+      return getDiscordLoginPath(client, ecosystem);
+    default:
+      return "";
+  }
+}
+
 /**
  *
  * @internal
  */
-export function openOauthSignInWindow(
-  authOption: InAppWalletSocialAuth,
-  themeObj: Theme,
-) {
+export function openOauthSignInWindow({
+  authOption,
+  themeObj,
+  client,
+  ecosystem,
+}: {
+  authOption: InAppWalletSocialAuth;
+  themeObj: Theme;
+  client: ThirdwebClient;
+  ecosystem?: Ecosystem;
+}) {
   // open the popup in the center of the screen
   const { height, width } = getWidthAndHeight(authOption);
   const top = (window.innerHeight - height) / 2;
   const left = (window.innerWidth - width) / 2;
 
   const win = window.open(
-    "",
+    getOauthLoginPath(authOption, client, ecosystem),
     undefined,
     `width=${width}, height=${height}, top=${top}, left=${left}`,
   );

package/src/transaction/actions/encode.test.ts

@@ -1,14 +1,26 @@
 import { describe, expect, it } from "vitest";
-import { TEST_WALLET_A } from "~test/addresses.js";
+import { TEST_WALLET_A, TEST_WALLET_B } from "~test/addresses.js";
+import { FORKED_ETHEREUM_CHAIN } from "~test/chains.js";
+import { TEST_CLIENT } from "~test/test-clients.js";
 import { USDT_CONTRACT, USDT_CONTRACT_WITH_ABI } from "~test/test-contracts.js";
-import { encode } from "./encode.js";
-
+import { concatHex } from "../../utils/encoding/helpers/concat-hex.js";
+import { toHex } from "../../utils/encoding/hex.js";
+import { toWei } from "../../utils/units.js";
 import { prepareContractCall } from "../prepare-contract-call.js";
+import { prepareTransaction } from "../prepare-transaction.js";
 import { resolveMethod } from "../resolve-method.js";
+import { encode, getDataFromTx, getExtraCallDataFromTx } from "./encode.js";
 
 const USDC_TRANSFER_ENCODE_RESULT =
   "0xa9059cbb00000000000000000000000000000000000000000000000000000000000000010000000000000000000000000000000000000000000000000000000000000064";
 
+const extraCallDataMsg = "Hello, World";
+const extraCallData = toHex(extraCallDataMsg);
+const expectedFinalData = concatHex([
+  USDC_TRANSFER_ENCODE_RESULT,
+  extraCallData,
+]);
+
 describe("transaction: encode", () => {
   it("should encode correctly (human-readable)", async () => {
     const tx = prepareContractCall({
@@ -58,4 +70,141 @@ describe("transaction: encode", () => {
     const encoded = await encode(tx);
     expect(encoded).toEqual(USDC_TRANSFER_ENCODE_RESULT);
   });
+
+  // Repeat the same test cases above but now with extraCallData
+
+  it("extraCallData | should encode correctly (human-readable)", async () => {
+    const tx = prepareContractCall({
+      contract: USDT_CONTRACT,
+      method: "function transfer(address, uint256) returns (bool)",
+      params: [TEST_WALLET_A, 100n],
+      extraCallData,
+    });
+    const encoded = await encode(tx);
+    expect(encoded).toEqual(expectedFinalData);
+  });
+
+  it("extraCallData | should encode correctly (transaction abi)", async () => {
+    const tx = prepareContractCall({
+      contract: USDT_CONTRACT,
+      method: {
+        inputs: [
+          { internalType: "address", name: "to", type: "address" },
+          { internalType: "uint256", name: "value", type: "uint256" },
+        ],
+        name: "transfer",
+        outputs: [{ internalType: "bool", name: "", type: "bool" }],
+        stateMutability: "nonpayable",
+        type: "function",
+      },
+      params: [TEST_WALLET_A, 100n],
+      extraCallData,
+    });
+    const encoded = await encode(tx);
+    expect(encoded).toEqual(expectedFinalData);
+  });
+
+  it("extraCallData | should encode correctly (contract abi)", async () => {
+    const tx = prepareContractCall({
+      contract: USDT_CONTRACT_WITH_ABI,
+      method: "transfer",
+      params: [TEST_WALLET_A, 100n],
+      extraCallData,
+    });
+    const encoded = await encode(tx);
+    expect(encoded).toEqual(expectedFinalData);
+  });
+  it("extraCallData | should encode correctly (auto-abi)", async () => {
+    const tx = prepareContractCall({
+      contract: USDT_CONTRACT,
+      method: resolveMethod("transfer"),
+      params: [TEST_WALLET_A, 100n],
+      extraCallData,
+    });
+    const encoded = await encode(tx);
+    expect(encoded).toEqual(expectedFinalData);
+  });
+
+  it("extraCallData - should work with prepareTransaction", async () => {
+    const tx = prepareTransaction({
+      chain: FORKED_ETHEREUM_CHAIN,
+      client: TEST_CLIENT,
+      to: TEST_WALLET_B,
+      value: toWei("0.1"),
+    });
+    const encoded = await encode(tx);
+
+    const txWithExtraData = prepareTransaction({
+      chain: FORKED_ETHEREUM_CHAIN,
+      client: TEST_CLIENT,
+      to: TEST_WALLET_B,
+      value: toWei("0.1"),
+      extraCallData,
+    });
+
+    const encoded2 = await encode(txWithExtraData);
+    expect(encoded2).toBe(concatHex([encoded, extraCallData]));
+  });
+
+  it("internal func: getDataFromTx | should return `0x` if no data is attached", async () => {
+    const tx = prepareTransaction({
+      chain: FORKED_ETHEREUM_CHAIN,
+      client: TEST_CLIENT,
+      to: TEST_WALLET_B,
+      value: toWei("0.1"),
+    });
+    const _hex = await getDataFromTx(tx);
+    expect(_hex).toBe("0x");
+  });
+
+  it("internal func: getDataFromTx | should return correctly encoded data", async () => {
+    const tx = prepareTransaction({
+      chain: FORKED_ETHEREUM_CHAIN,
+      client: TEST_CLIENT,
+      to: TEST_WALLET_B,
+      value: toWei("0.1"),
+      data: extraCallData,
+    });
+    const _hex = await getDataFromTx(tx);
+    expect(_hex).toBe(extraCallData);
+  });
+
+  it("internal func: getExtraCallDataFromTx | should return `undefined` if no data is attached", async () => {
+    const tx = prepareTransaction({
+      chain: FORKED_ETHEREUM_CHAIN,
+      client: TEST_CLIENT,
+      to: TEST_WALLET_B,
+      value: toWei("0.1"),
+    });
+    const result = await getExtraCallDataFromTx(tx);
+    expect(result).toBe(undefined);
+  });
+
+  it("internal func: getExtraCallDataFromTx | should return correct extraCallData", async () => {
+    const tx = prepareTransaction({
+      chain: FORKED_ETHEREUM_CHAIN,
+      client: TEST_CLIENT,
+      to: TEST_WALLET_B,
+      value: toWei("0.1"),
+      data: toHex("getExtraCallDataFromTx-should-not-return-this"),
+      extraCallData,
+    });
+    const result = await getExtraCallDataFromTx(tx);
+    expect(result).toBe(extraCallData);
+  });
+
+  it("internal func: getExtraCallDataFromTx | should throw error if extraCallData is not hex-encoded", async () => {
+    const tx = prepareTransaction({
+      chain: FORKED_ETHEREUM_CHAIN,
+      client: TEST_CLIENT,
+      to: TEST_WALLET_B,
+      value: toWei("0.1"),
+      data: toHex("getExtraCallDataFromTx-should-not-return-this"),
+      // @ts-ignore Intentionally for the test purpose
+      extraCallData: "I'm a cat",
+    });
+    await expect(() => getExtraCallDataFromTx(tx)).rejects.toThrowError(
+      "Invalid extra calldata - must be a hex string",
+    );
+  });
 });

package/src/transaction/actions/encode.ts

@@ -26,18 +26,67 @@ export async function encode<abi extends Abi, abiFn extends AbiFunction>(
     return encodeWeakMap.get(transaction)!;
   }
   const promise = (async () => {
-    if (transaction.data === undefined) {
-      return "0x";
-    }
-    if (typeof transaction.data === "function") {
-      const data = await transaction.data();
-      if (!data) {
-        return "0x";
-      }
-      return data;
+    const [data, extraData, { concatHex }] = await Promise.all([
+      getDataFromTx(transaction),
+      getExtraCallDataFromTx(transaction),
+      import("../../utils/encoding/helpers/concat-hex.js"),
+    ]);
+    if (extraData) {
+      return concatHex([data, extraData]);
     }
-    return transaction.data;
+    return data;
   })();
   encodeWeakMap.set(transaction, promise);
   return promise;
 }
+
+/**
+ * Get the transaction.data (from a PreparedTransaction)
+ * If the transaction does not have `data`, we default to "0x"
+ * @internal
+ */
+export async function getDataFromTx<abi extends Abi, abiFn extends AbiFunction>(
+  transaction: PreparedTransaction<abi, abiFn>,
+): Promise<Hex> {
+  if (transaction.data === undefined) {
+    return "0x";
+  }
+  if (typeof transaction.data === "function") {
+    const data = await transaction.data();
+    if (!data) {
+      return "0x";
+    }
+    return data;
+  }
+  return transaction.data;
+}
+
+/**
+ * Get the extraCallData from a PreparedTransaction
+ * @internal
+ * If extraCallData is "0x", we will return `undefined`
+ * to simplify the code, since concatenating "0x" doesn't do anything
+ */
+export async function getExtraCallDataFromTx<
+  abi extends Abi,
+  abiFn extends AbiFunction,
+>(transaction: PreparedTransaction<abi, abiFn>): Promise<Hex | undefined> {
+  if (!transaction.extraCallData) {
+    return undefined;
+  }
+  if (typeof transaction.extraCallData === "function") {
+    const extraData = await transaction.extraCallData();
+    if (!extraData) return undefined;
+    if (!extraData.startsWith("0x")) {
+      throw Error("Invalid extra calldata - must be a hex string");
+    }
+    if (extraData === "0x") {
+      return undefined;
+    }
+    return extraData;
+  }
+  if (!transaction.extraCallData.startsWith("0x")) {
+    throw Error("Invalid extra calldata - must be a hex string");
+  }
+  return transaction.extraCallData;
+}

package/src/transaction/actions/estimate-gas.ts

@@ -69,7 +69,7 @@ export async function estimateGas(
   const promise = (async () => {
     const predefinedGas = await resolvePromisedValue(options.transaction.gas);
     // if we have a predefined gas value in the TX -> always use that
-    if (predefinedGas) {
+    if (predefinedGas !== undefined) {
       return predefinedGas;
     }
 

package/src/transaction/actions/to-serializable-transaction.test.ts

@@ -254,6 +254,22 @@ describe("toSerializableTransaction", () => {
         }),
       ).not.toThrow();
     });
+
+    test("should respect a 0 gas value", async () => {
+      const serializableTransaction = await toSerializableTransaction({
+        transaction: {
+          ...transaction,
+          gas: async () => Promise.resolve(0n),
+        },
+      });
+
+      expect(() =>
+        serializeTransaction({
+          transaction: serializableTransaction,
+        }),
+      ).not.toThrow();
+      expect(serializableTransaction.gas).toBe(0n);
+    });
   });
 
   describe("extraGas override", () => {

package/src/transaction/prepare-contract-call.test.ts

@@ -1,13 +1,11 @@
-import { describe, expect, test } from "vitest";
-
+import { describe, expect, it } from "vitest";
 import { TEST_WALLET_B } from "../../test/src/addresses.js";
-
 import { USDT_CONTRACT_WITH_ABI } from "../../test/src/test-contracts.js";
 import { toWei } from "../utils/units.js";
 import { prepareContractCall } from "./prepare-contract-call.js";
 
-describe("prepareContractCall", () => {
-  test("should prepare a contract call with ABI", () => {
+describe.runIf(process.env.TW_SECRET_KEY)("prepareContractCall", () => {
+  it("should prepare a contract call with ABI", () => {
     const preparedTx = prepareContractCall({
       contract: USDT_CONTRACT_WITH_ABI,
       method: "transfer",

package/src/transaction/prepare-contract-call.ts

@@ -121,6 +121,23 @@ export type PrepareContractCallOptions<
  *  params: [to, value],
  * });
  * ```
+ *
+ * @example
+ * Passing extra call data to the transaction
+ * ```ts
+ * import { getContract, prepareContractCall } from "thirdweb";
+ * const contract = getContract({
+ *   ..., // chain, address, client
+ * });
+ *
+ * const transaction = prepareContractCall({
+ *   contract,
+ *   method: "function transfer(address to, uint256 value)",
+ *   params: [...],
+ *   // The extra call data MUST be encoded to hex before passing
+ *   extraCallData: "0x......."
+ * });
+ * ```
  */
 export function prepareContractCall<
   const TAbi extends Abi,

package/src/transaction/prepare-transaction.ts

@@ -23,6 +23,12 @@ export type StaticPrepareTransactionOptions = {
   // tw specific
   chain: Chain;
   client: ThirdwebClient;
+  // extras
+  extraCallData?: Hex;
+  erc20Value?: {
+    amountWei: bigint;
+    tokenAddress: Address;
+  };
 };
 
 export type EIP712TransactionOptions = {

package/src/utils/extensions/drops/get-claim-params.ts

@@ -127,6 +127,17 @@ export async function getClaimParams(options: GetClaimParamsOptions) {
       ? allowlistProof.pricePerToken
       : cc.pricePerToken;
 
+  const totalPrice =
+    (pricePerToken * options.quantity) / BigInt(10 ** tokenDecimals);
+  const value = isNativeTokenAddress(currency) ? totalPrice : 0n;
+  const erc20Value =
+    !isNativeTokenAddress(currency) && pricePerToken > 0n
+      ? {
+          amountWei: totalPrice,
+          tokenAddress: currency,
+        }
+      : undefined;
+
   return {
     receiver: options.to,
     tokenId: options.type === "erc1155" ? options.tokenId : undefined,
@@ -136,9 +147,8 @@ export async function getClaimParams(options: GetClaimParamsOptions) {
     allowlistProof,
     data: "0x" as Hex,
     overrides: {
-      value: isNativeTokenAddress(currency)
-        ? (pricePerToken * options.quantity) / BigInt(10 ** tokenDecimals)
-        : 0n,
+      value,
+      erc20Value,
     },
   };
 }

package/src/utils/promise/wait.test.ts

@@ -8,6 +8,6 @@ describe("wait", () => {
     await wait(ms);
     const end = Date.now();
     const elapsed = end - start;
-    expect(elapsed).toBeGreaterThanOrEqual(ms);
+    expect(Math.abs(elapsed - ms)).toBeLessThan(10);
   });
 });

package/src/version.ts

@@ -1 +1 @@
-export const version = "5.36.0";
+export const version = "5.37.0-nightly-6a94696c7e7db3d4e0920e039bdc187ab42e3c50-20240720000333";

package/src/wallets/in-app/core/authentication/getLoginPath.ts

@@ -0,0 +1,18 @@
+import type { ThirdwebClient } from "../../../../client/client.js";
+import { getThirdwebBaseUrl } from "../../../../utils/domains.js";
+import type { Ecosystem } from "../../web/types.js";
+
+// TODO: make this generic for all auth providers
+export const getDiscordLoginPath = (
+  client: ThirdwebClient,
+  ecosystem?: Ecosystem,
+) => {
+  const baseUrl = `${getThirdwebBaseUrl("inAppWallet")}/api/2024-05-05/login/discord?clientId=${client.clientId}`;
+  if (ecosystem?.partnerId) {
+    return `${baseUrl}&ecosystemId=${ecosystem.id}&ecosystemPartnerId=${ecosystem.partnerId}`;
+  }
+  if (ecosystem) {
+    return `${baseUrl}&ecosystemId=${ecosystem.id}`;
+  }
+  return baseUrl;
+};

package/src/wallets/in-app/core/authentication/type.ts

@@ -61,6 +61,7 @@ export enum AuthProvider {
   FACEBOOK = "Facebook",
   APPLE = "Apple",
   PASSKEY = "Passkey",
+  DISCORD = "Discord",
 }
 
 export type OauthOption = {
@@ -208,10 +209,11 @@ export type GetAuthenticatedUserParams = {
 };
 
 export const oauthStrategyToAuthProvider: Record<
-  "google" | "facebook" | "apple",
+  SocialAuthOption,
   AuthProvider
 > = {
   google: AuthProvider.GOOGLE,
   facebook: AuthProvider.FACEBOOK,
   apple: AuthProvider.APPLE,
+  discord: AuthProvider.DISCORD,
 };