thirdweb 5.29.3-nightly-ffaff744f72d2cb22896e7501677b48f76ea857a-20240614184424 → 5.29.3-nightly-f8e0c5f84bb3a07a2911b5fce51da3983bb2e9e9-20240614190203

package/src/wallets/in-app/{core/authentication → native/auth}/index.ts

@@ -1,59 +1,26 @@
 import type { ThirdwebClient } from "../../../../client/client.js";
-import { isBrowser, isReactNative } from "../../../../utils/platform.js";
-import type { InAppConnector } from "../interfaces/connector.js";
 import {
   type AuthArgsType,
   type AuthLoginReturnType,
-  AuthProvider,
+  type GetAuthenticatedUserParams,
   type PreAuthArgsType,
   UserWalletStatus,
-} from "./type.js";
+} from "../../core/authentication/type.js";
+import { getOrCreateInAppWalletConnector } from "../../core/wallet/in-app-core.js";
 
-export type GetAuthenticatedUserParams = {
-  client: ThirdwebClient;
-};
-
-const ewsSDKCache = new WeakMap<ThirdwebClient, InAppConnector>();
+// ---- KEEP IN SYNC WITH /wallets/in-app/web/lib/auth/index.ts ---- //
+// duplication needed for separate exports between web and native
 
 /**
  * @internal
  */
 async function getInAppWalletConnector(client: ThirdwebClient) {
-  if (ewsSDKCache.has(client)) {
-    return ewsSDKCache.get(client) as InAppConnector;
-  }
-
-  let ewSDK: InAppConnector;
-  if (isBrowser()) {
-    const { InAppWebConnector } = await import(
-      "../../web/lib/web-connector.js"
-    );
-    ewSDK = new InAppWebConnector({
+  return getOrCreateInAppWalletConnector(client, async (client) => {
+    const { InAppNativeConnector } = await import("../native-connector.js");
+    return new InAppNativeConnector({
       client: client,
     });
-  } else if (isReactNative()) {
-    const {
-      InAppNativeConnector,
-    } = require("../../native/native-connector.js");
-    ewSDK = new InAppNativeConnector({
-      client,
-    });
-  } else {
-    throw new Error("Unsupported platform");
-  }
-
-  ewsSDKCache.set(client, ewSDK);
-  return ewSDK;
-}
-
-/**
- * @internal
- */
-export async function logoutAuthenticatedUser(
-  options: GetAuthenticatedUserParams,
-) {
-  const ewSDK = await getInAppWalletConnector(options.client);
-  return ewSDK.logout();
+  });
 }
 
 /**
@@ -75,8 +42,8 @@ export async function getAuthenticatedUser(
   options: GetAuthenticatedUserParams,
 ) {
   const { client } = options;
-  const ewSDK = await getInAppWalletConnector(client);
-  const user = await ewSDK.getUser();
+  const connector = await getInAppWalletConnector(client);
+  const user = await connector.getUser();
   switch (user.status) {
     case UserWalletStatus.LOGGED_IN_WALLET_INITIALIZED: {
       return user;
@@ -145,8 +112,8 @@ export async function getUserPhoneNumber(options: GetAuthenticatedUserParams) {
  * @wallet
  */
 export async function preAuthenticate(args: PreAuthArgsType) {
-  const ewSDK = await getInAppWalletConnector(args.client);
-  return ewSDK.preAuthenticate(args);
+  const connector = await getInAppWalletConnector(args.client);
+  return connector.preAuthenticate(args);
 }
 
 /**
@@ -169,15 +136,6 @@ export async function preAuthenticate(args: PreAuthArgsType) {
 export async function authenticate(
   args: AuthArgsType,
 ): Promise<AuthLoginReturnType> {
-  const ewSDK = await getInAppWalletConnector(args.client);
-  return ewSDK.authenticate(args);
+  const connector = await getInAppWalletConnector(args.client);
+  return connector.authenticate(args);
 }
-
-export const oauthStrategyToAuthProvider: Record<
-  "google" | "facebook" | "apple",
-  AuthProvider
-> = {
-  google: AuthProvider.GOOGLE,
-  facebook: AuthProvider.FACEBOOK,
-  apple: AuthProvider.APPLE,
-};

package/src/wallets/in-app/native/{auth.ts → auth/native-auth.ts}

@@ -2,42 +2,42 @@ import type { CognitoUser } from "amazon-cognito-identity-js";
 
 import { Auth } from "aws-amplify";
 import * as WebBrowser from "expo-web-browser";
-import type { ThirdwebClient } from "../../../client/client.js";
+import type { ThirdwebClient } from "../../../../client/client.js";
 import {
   AuthProvider,
   type AuthStoredTokenWithCookieReturnType,
   type OauthOption,
   RecoveryShareManagement,
   type SendEmailOtpReturnType,
-} from "../core/authentication/type.js";
+} from "../../core/authentication/type.js";
 import {
   deleteAccount,
   fetchUserDetails,
   generateAuthTokenFromCognitoEmailOtp,
   getSessionHeaders,
   verifyClientId,
-} from "./helpers/api/fetchers.js";
+} from "../helpers/api/fetchers.js";
 import {
   cognitoEmailSignIn,
   cognitoEmailSignUp,
   cognitoPhoneSignIn,
   cognitoPhoneSignUp,
-} from "./helpers/auth/cognitoAuth.js";
+} from "../helpers/auth/cognitoAuth.js";
 import {
   postAuth,
   postAuthUserManaged,
   preAuth,
-} from "./helpers/auth/middleware.js";
+} from "../helpers/auth/middleware.js";
 import {
   DOMAIN_URL_2023,
   ROUTE_AUTH_ENDPOINT_CALLBACK,
   ROUTE_AUTH_JWT_CALLBACK,
   ROUTE_HEADLESS_OAUTH_LOGIN,
-} from "./helpers/constants.js";
-import { createErrorMessage } from "./helpers/errors.js";
-import { isDeviceSharePresentForUser } from "./helpers/storage/local.js";
-import { getCognitoUser, setCognitoUser } from "./helpers/storage/state.js";
-import type { VerifiedTokenResponse } from "./helpers/types.js";
+} from "../helpers/constants.js";
+import { createErrorMessage } from "../helpers/errors.js";
+import { isDeviceSharePresentForUser } from "../helpers/storage/local.js";
+import { getCognitoUser, setCognitoUser } from "../helpers/storage/state.js";
+import type { VerifiedTokenResponse } from "../helpers/types.js";
 
 export async function sendVerificationEmail(options: {
   email: string;

package/src/wallets/in-app/native/in-app.ts

@@ -0,0 +1,70 @@
+import type { ThirdwebClient } from "../../../client/client.js";
+import type { Wallet } from "../../interfaces/wallet.js";
+import type { CreateWalletArgs } from "../../wallet-types.js";
+import { createInAppWallet } from "../core/wallet/in-app-core.js";
+
+/**
+ * Creates an in-app wallet.
+ * @param createOptions - configuration options
+ * @returns The created in-app wallet.
+ * @example
+ * ```ts
+ * import { inAppWallet } from "thirdweb/wallets";
+ *
+ * const wallet = inAppWallet();
+ *
+ * const account = await wallet.connect({
+ *   client,
+ *   chain,
+ *   strategy: "google",
+ * });
+ * ```
+ *
+ * Enable smart accounts and sponsor gas for your users:
+ * ```ts
+ * import { inAppWallet } from "thirdweb/wallets";
+ * const wallet = inAppWallet({
+ *  smartAccount: {
+ *   chain: sepolia,
+ *   sponsorGas: true,
+ * },
+ * });
+ * ```
+ *
+ * Specify a logo for your login page
+ * ```ts
+ * import { inAppWallet } from "thirdweb/wallets";
+ * const wallet = inAppWallet({
+ *  metadata: {
+ *   image: {
+ *    src: "https://example.com/logo.png",
+ *    alt: "My logo",
+ *    width: 100,
+ *    height: 100,
+ *   },
+ *  },
+ * });
+ * ```
+ *
+ * Hide the ability to export the private key within the Connect Modal
+ * ```ts
+ * import { inAppWallet } from "thirdweb/wallets";
+ * const wallet = inAppWallet({
+ *  hidePrivateKeyExport: true
+ * });
+ * ```
+ * @wallet
+ */
+export function inAppWallet(
+  createOptions?: CreateWalletArgs<"inApp">[1],
+): Wallet<"inApp"> {
+  return createInAppWallet({
+    createOptions,
+    connectorFactory: async (client: ThirdwebClient) => {
+      const { InAppNativeConnector } = await import("./native-connector.js");
+      return new InAppNativeConnector({
+        client,
+      });
+    },
+  });
+}

package/src/wallets/in-app/native/native-connector.ts

@@ -1,6 +1,5 @@
 import type { ThirdwebClient } from "../../../client/client.js";
 import type { Account } from "../../interfaces/wallet.js";
-import { oauthStrategyToAuthProvider } from "../core/authentication/index.js";
 import {
   type AuthArgsType,
   type AuthLoginReturnType,
@@ -10,6 +9,7 @@ import {
   type PreAuthArgsType,
   type SendEmailOtpReturnType,
   UserWalletStatus,
+  oauthStrategyToAuthProvider,
 } from "../core/authentication/type.js";
 import type { InAppConnector } from "../core/interfaces/connector.js";
 import {
@@ -20,7 +20,7 @@ import {
   sendVerificationSms,
   socialLogin,
   validateEmailOTP,
-} from "./auth.js";
+} from "./auth/native-auth.js";
 import { fetchUserDetails } from "./helpers/api/fetchers.js";
 import { logoutUser } from "./helpers/auth/logout.js";
 import { getWalletUserDetails } from "./helpers/storage/local.js";

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

@@ -0,0 +1,70 @@
+import type { ThirdwebClient } from "../../../client/client.js";
+import type { Wallet } from "../../interfaces/wallet.js";
+import type { CreateWalletArgs } from "../../wallet-types.js";
+import { createInAppWallet } from "../core/wallet/in-app-core.js";
+
+/**
+ * Creates an in-app wallet.
+ * @param createOptions - configuration options
+ * @returns The created in-app wallet.
+ * @example
+ * ```ts
+ * import { inAppWallet } from "thirdweb/wallets";
+ *
+ * const wallet = inAppWallet();
+ *
+ * const account = await wallet.connect({
+ *   client,
+ *   chain,
+ *   strategy: "google",
+ * });
+ * ```
+ *
+ * Enable smart accounts and sponsor gas for your users:
+ * ```ts
+ * import { inAppWallet } from "thirdweb/wallets";
+ * const wallet = inAppWallet({
+ *  smartAccount: {
+ *   chain: sepolia,
+ *   sponsorGas: true,
+ * },
+ * });
+ * ```
+ *
+ * Specify a logo for your login page
+ * ```ts
+ * import { inAppWallet } from "thirdweb/wallets";
+ * const wallet = inAppWallet({
+ *  metadata: {
+ *   image: {
+ *    src: "https://example.com/logo.png",
+ *    alt: "My logo",
+ *    width: 100,
+ *    height: 100,
+ *   },
+ *  },
+ * });
+ * ```
+ *
+ * Hide the ability to export the private key within the Connect Modal
+ * ```ts
+ * import { inAppWallet } from "thirdweb/wallets";
+ * const wallet = inAppWallet({
+ *  hidePrivateKeyExport: true
+ * });
+ * ```
+ * @wallet
+ */
+export function inAppWallet(
+  createOptions?: CreateWalletArgs<"inApp">[1],
+): Wallet<"inApp"> {
+  return createInAppWallet({
+    createOptions,
+    connectorFactory: async (client: ThirdwebClient) => {
+      const { InAppWebConnector } = await import("./lib/web-connector.js");
+      return new InAppWebConnector({
+        client,
+      });
+    },
+  });
+}

package/src/wallets/in-app/web/lib/auth/iframe-auth.ts

@@ -0,0 +1,266 @@
+import type { ThirdwebClient } from "../../../../../client/client.js";
+import type {
+  AuthAndWalletRpcReturnType,
+  AuthLoginReturnType,
+  AuthStoredTokenWithCookieReturnType,
+  LogoutReturnType,
+  SendEmailOtpReturnType,
+} from "../../../core/authentication/type.js";
+import type { ClientIdWithQuerierType } from "../../types.js";
+import { LocalStorage } from "../../utils/Storage/LocalStorage.js";
+import type { InAppWalletIframeCommunicator } from "../../utils/iFrameCommunication/InAppWalletIframeCommunicator.js";
+import { BaseLogin } from "./base-login.js";
+
+export type AuthQuerierTypes = {
+  logout: undefined;
+  initIframe: {
+    clientId: string;
+    authCookie: string;
+    walletUserId: string;
+    deviceShareStored: string;
+  };
+  loginWithStoredTokenDetails: {
+    storedToken: AuthStoredTokenWithCookieReturnType["storedToken"];
+    recoveryCode?: string;
+  };
+};
+
+/**
+ *
+ */
+export class Auth {
+  protected client: ThirdwebClient;
+  protected AuthQuerier: InAppWalletIframeCommunicator<AuthQuerierTypes>;
+  protected localStorage: LocalStorage;
+  protected onAuthSuccess: (
+    authResults: AuthAndWalletRpcReturnType,
+  ) => Promise<AuthLoginReturnType>;
+  private BaseLogin: BaseLogin;
+
+  /**
+   * Used to manage the user's auth states. This should not be instantiated directly.
+   * Call {@link InAppWalletSdk.auth} instead.
+   * @internal
+   */
+  constructor({
+    client,
+    querier,
+    onAuthSuccess,
+    baseUrl,
+  }: ClientIdWithQuerierType & {
+    baseUrl: string;
+    onAuthSuccess: (
+      authDetails: AuthAndWalletRpcReturnType,
+    ) => Promise<AuthLoginReturnType>;
+  }) {
+    this.client = client;
+
+    this.AuthQuerier = querier;
+    this.localStorage = new LocalStorage({ clientId: client.clientId });
+    this.onAuthSuccess = onAuthSuccess;
+    this.BaseLogin = new BaseLogin({
+      postLogin: async (result) => {
+        return this.postLogin(result);
+      },
+      preLogin: async () => {
+        await this.preLogin();
+      },
+      querier: querier,
+      client,
+      baseUrl,
+    });
+  }
+
+  private async preLogin() {
+    await this.logout();
+  }
+
+  private async postLogin({
+    storedToken,
+    walletDetails,
+  }: AuthAndWalletRpcReturnType): Promise<AuthLoginReturnType> {
+    if (storedToken.shouldStoreCookieString) {
+      await this.localStorage.saveAuthCookie(storedToken.cookieString);
+    }
+    const initializedUser = await this.onAuthSuccess({
+      storedToken,
+      walletDetails,
+    });
+    return initializedUser;
+  }
+
+  async loginWithAuthToken(
+    authToken: AuthStoredTokenWithCookieReturnType,
+    recoveryCode?: string,
+  ): Promise<AuthLoginReturnType> {
+    await this.preLogin();
+    const result = await this.AuthQuerier.call<AuthAndWalletRpcReturnType>({
+      procedureName: "loginWithStoredTokenDetails",
+      params: {
+        storedToken: authToken.storedToken,
+        recoveryCode,
+      },
+    });
+    return this.postLogin(result);
+  }
+
+  /**
+   * Used to log the user into their thirdweb wallet on your platform via a myriad of auth providers
+   * @example
+   * ```typescript
+   * const thirdwebInAppWallet = new InAppWalletSdk({clientId: "YOUR_CLIENT_ID", chain: "Polygon"})
+   * try {
+   *   const user = await thirdwebInAppWallet.auth.loginWithModal();
+   *   // user is now logged in
+   * } catch (e) {
+   *   // User closed modal or something else went wrong during the authentication process
+   *   console.error(e)
+   * }
+   * ```
+   * @returns `{{user: InitializedUser}}` An InitializedUser object.
+   */
+  async loginWithModal(): Promise<AuthLoginReturnType> {
+    return this.BaseLogin.loginWithModal();
+  }
+
+  /**
+   * Used to log the user into their thirdweb wallet using email OTP
+   * @example
+   * ```typescript
+   *  // Basic Flow
+   *  const thirdwebInAppWallet = new InAppWalletSdk({clientId: "", chain: "Polygon"});
+   *  try {
+   *    // prompts user to enter the code they received
+   *    const user = await thirdwebInAppWallet.auth.loginWithThirdwebEmailOtp({ email : "you@example.com" });
+   *    // user is now logged in
+   *  } catch (e) {
+   *    // User closed the OTP modal or something else went wrong during the authentication process
+   *    console.error(e)
+   *  }
+   * ```
+   * @param args - args.email: We will send the email an OTP that needs to be entered in order for them to be logged in.
+   * @returns `{{user: InitializedUser}}` An InitializedUser object. See {@link InAppWalletSdk.getUser} for more
+   */
+  async loginWithEmailOtp(
+    args: Parameters<BaseLogin["loginWithEmailOtp"]>[0],
+  ): Promise<AuthLoginReturnType> {
+    return this.BaseLogin.loginWithEmailOtp(args);
+  }
+
+  /**
+   * @internal
+   */
+  async loginWithCustomJwt(
+    args: Parameters<BaseLogin["loginWithCustomJwt"]>[0],
+  ): Promise<AuthLoginReturnType> {
+    return this.BaseLogin.loginWithCustomJwt(args);
+  }
+
+  /**
+   * @internal
+   */
+  async loginWithCustomAuthEndpoint(
+    args: Parameters<BaseLogin["loginWithCustomAuthEndpoint"]>[0],
+  ): Promise<AuthLoginReturnType> {
+    return this.BaseLogin.loginWithCustomAuthEndpoint(args);
+  }
+
+  /**
+   * @internal
+   */
+  async loginWithOauth(
+    args: Parameters<BaseLogin["loginWithOauth"]>[0],
+  ): Promise<AuthLoginReturnType> {
+    return this.BaseLogin.loginWithOauth(args);
+  }
+
+  /**
+   * A headless way to send the users at the passed email an OTP code.
+   * You need to then call {@link Auth.verifyEmailLoginOtp} in order to complete the login process
+   * @example
+   * @param param0.email
+   * ```typescript
+   *  const thirdwebInAppWallet = new InAppWalletSdk({clientId: "", chain: "Polygon"});
+   *  // sends user an OTP code
+   * try {
+   *    await thirdwebInAppWallet.auth.sendEmailLoginOtp({ email : "you@example.com" });
+   * } catch(e) {
+   *    // Error Sending user's email an OTP code
+   *    console.error(e);
+   * }
+   *
+   * // Then when your user is ready to verify their OTP
+   * try {
+   *    const user = await thirdwebInAppWallet.auth.verifyEmailLoginOtp({ email: "you@example.com", otp: "6-DIGIT_CODE_HERE" });
+   * } catch(e) {
+   *    // Error verifying the OTP code
+   *    console.error(e)
+   * }
+   * ```
+   * @param param0 - param0.email We will send the email an OTP that needs to be entered in order for them to be logged in.
+   * @returns `{{ isNewUser: boolean }}` IsNewUser indicates if the user is a new user to your platform
+   * @internal
+   */
+  async sendEmailLoginOtp({
+    email,
+  }: Parameters<
+    BaseLogin["sendEmailLoginOtp"]
+  >[0]): Promise<SendEmailOtpReturnType> {
+    return this.BaseLogin.sendEmailLoginOtp({
+      email,
+    });
+  }
+
+  /**
+   * @internal
+   */
+  async sendSmsLoginOtp({
+    phoneNumber,
+  }: Parameters<
+    BaseLogin["sendSmsLoginOtp"]
+  >[0]): Promise<SendEmailOtpReturnType> {
+    return this.BaseLogin.sendSmsLoginOtp({
+      phoneNumber,
+    });
+  }
+
+  /**
+   * Used to verify the otp that the user receives from thirdweb
+   *
+   * See {@link Auth.sendEmailLoginOtp} for how the headless call flow looks like. Simply swap out the calls to `loginWithThirdwebEmailOtp` with `verifyThirdwebEmailLoginOtp`
+   * @param args - props.email We will send the email an OTP that needs to be entered in order for them to be logged in.
+   * props.otp The code that the user received in their email
+   * @returns `{{user: InitializedUser}}` An InitializedUser object containing the user's status, wallet, authDetails, and more
+   * @internal
+   */
+  async verifyEmailLoginOtp(
+    args: Parameters<BaseLogin["verifyEmailLoginOtp"]>[0],
+  ) {
+    return this.BaseLogin.verifyEmailLoginOtp(args);
+  }
+
+  /**
+   * @internal
+   */
+  async verifySmsLoginOtp(args: Parameters<BaseLogin["verifySmsLoginOtp"]>[0]) {
+    return this.BaseLogin.verifySmsLoginOtp(args);
+  }
+
+  /**
+   * Logs any existing user out of their wallet.
+   * @returns `{{success: boolean}}` true if a user is successfully logged out. false if there's no user currently logged in.
+   * @internal
+   */
+  async logout(): Promise<LogoutReturnType> {
+    const { success } = await this.AuthQuerier.call<LogoutReturnType>({
+      procedureName: "logout",
+      params: undefined,
+    });
+    const isRemoveAuthCookie = await this.localStorage.removeAuthCookie();
+    const isRemoveUserId = await this.localStorage.removeWalletUserId();
+
+    return {
+      success: success || isRemoveAuthCookie || isRemoveUserId,
+    };
+  }
+}