thirdweb 5.44.2-nightly-7c2f616dfe6880beefa4eb48f8dcbce6bba9461a-20240808000401 → 5.45.0

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

@@ -1,24 +1,29 @@
 import type { ThirdwebClient } from "../../../client/client.js";
+import type { InjectedSupportedWalletIds } from "../../../wallets/__generated__/wallet-ids.js";
 import type { Account } from "../../interfaces/wallet.js";
+import { siweAuthenticate } from "../core/authentication/siwe.js";
 import {
   type AuthArgsType,
   type AuthLoginReturnType,
+  type AuthStoredTokenWithCookieReturnType,
   type GetUser,
   type LogoutReturnType,
+  type MultiStepAuthArgsType,
+  type MultiStepAuthProviderType,
   type OauthOption,
-  type PreAuthArgsType,
-  type SendEmailOtpReturnType,
   UserWalletStatus,
-} from "../core/authentication/type.js";
+} from "../core/authentication/types.js";
 import type { InAppConnector } from "../core/interfaces/connector.js";
+import { sendOtp, verifyOtp } from "../web/lib/auth/otp.js";
+import type { Ecosystem } from "../web/types.js";
 import {
   authEndpoint,
+  authenticate,
   customJwt,
   deleteActiveAccount,
-  sendVerificationEmail,
-  sendVerificationSms,
+  otpLogin,
+  siweLogin,
   socialLogin,
-  validateEmailOTP,
 } from "./auth/native-auth.js";
 import { fetchUserDetails } from "./helpers/api/fetchers.js";
 import { logoutUser } from "./helpers/auth/logout.js";
@@ -70,40 +75,60 @@ export class InAppNativeConnector implements InAppConnector {
     return getExistingUserAccount({ client: this.options.client });
   }
 
-  preAuthenticate(params: PreAuthArgsType): Promise<SendEmailOtpReturnType> {
+  preAuthenticate(args: MultiStepAuthProviderType): Promise<void> {
+    return sendOtp({
+      ...args,
+      client: this.options.client,
+    });
+  }
+
+  async authenticate(
+    params: AuthArgsType,
+  ): Promise<AuthStoredTokenWithCookieReturnType> {
     const strategy = params.strategy;
     switch (strategy) {
-      case "email": {
-        return sendVerificationEmail({
-          email: params.email,
-          client: this.options.client,
-        });
+      case "email":
+      case "phone": {
+        return verifyOtp(params);
       }
-      case "phone":
-        return sendVerificationSms({
-          phoneNumber: params.phoneNumber,
+      case "siwe": {
+        return siweAuthenticate({
           client: this.options.client,
+          walletId: params.walletId,
+          chainId: params.chainId,
         });
+      }
+      case "google":
+      case "facebook":
+      case "discord":
+      case "apple": {
+        const ExpoLinking = require("expo-linking");
+        const redirectUrl =
+          params.redirectUrl || (ExpoLinking.createURL("") as string);
+        return authenticate({ strategy, redirectUrl }, this.options.client);
+      }
       default:
-        assertUnreachable(strategy);
+        throw new Error(`Unsupported authentication type: ${strategy}`);
     }
   }
 
-  async authenticate(params: AuthArgsType): Promise<AuthLoginReturnType> {
+  async connect(params: AuthArgsType): Promise<AuthLoginReturnType> {
     const strategy = params.strategy;
     switch (strategy) {
       case "email": {
-        return await this.validateEmailOTP({
+        return await this.validateOtp({
           email: params.email,
-          otp: params.verificationCode,
-          recoveryCode: params.verificationCode,
+          verificationCode: params.verificationCode,
+          strategy: "email",
+          client: this.options.client,
         });
       }
       case "phone": {
-        return await this.validateEmailOTP({
-          email: params.phoneNumber,
-          otp: params.verificationCode,
-          recoveryCode: params.verificationCode,
+        return await this.validateOtp({
+          phoneNumber: params.phoneNumber,
+          verificationCode: params.verificationCode,
+          strategy: "phone",
+          client: this.options.client,
         });
       }
       case "google":
@@ -120,6 +145,12 @@ export class InAppNativeConnector implements InAppConnector {
           redirectUrl,
         });
       }
+      case "siwe": {
+        return this.siweLogin({
+          walletId: params.walletId,
+          chainId: params.chainId,
+        });
+      }
       case "jwt": {
         return this.customJwt({
           jwt: params.jwt,
@@ -146,18 +177,14 @@ export class InAppNativeConnector implements InAppConnector {
     }
   }
 
-  private async validateEmailOTP(options: {
-    email: string;
-    otp: string;
-    recoveryCode?: string;
-  }): Promise<AuthLoginReturnType> {
+  private async validateOtp(
+    options: MultiStepAuthArgsType & {
+      client: ThirdwebClient;
+      ecosystem?: Ecosystem;
+    },
+  ): Promise<AuthLoginReturnType> {
     try {
-      const { storedToken } = await validateEmailOTP({
-        email: options.email,
-        client: this.options.client,
-        otp: options.otp,
-        recoveryCode: options.recoveryCode,
-      });
+      const { storedToken } = await otpLogin(options);
       const account = await this.getAccount();
       return {
         user: {
@@ -202,6 +229,40 @@ export class InAppNativeConnector implements InAppConnector {
     }
   }
 
+  private async siweLogin(options: {
+    walletId: InjectedSupportedWalletIds;
+    chainId: number;
+  }): Promise<AuthLoginReturnType> {
+    try {
+      const { storedToken } = await siweLogin(
+        this.options.client,
+        options.walletId,
+        options.chainId,
+      );
+      const account = await this.getAccount();
+      return {
+        user: {
+          status: UserWalletStatus.LOGGED_IN_WALLET_INITIALIZED,
+          account,
+          authDetails: storedToken.authDetails,
+          walletAddress: account.address,
+        },
+      };
+    } catch (error) {
+      console.error(
+        `Error while signing in with: ${options.walletId}. ${error}`,
+      );
+      if (error instanceof Error) {
+        throw new Error(
+          `Error signing in with ${options.walletId}: ${error.message}`,
+        );
+      }
+      throw new Error(
+        `An unknown error occurred signing in with ${options.walletId}`,
+      );
+    }
+  }
+
   private async customJwt(authOptions: {
     jwt: string;
     password: string;

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

@@ -4,7 +4,7 @@ import type {
   AuthLoginReturnType,
   AuthProvider,
   SendEmailOtpReturnType,
-} from "../../../core/authentication/type.js";
+} from "../../../core/authentication/types.js";
 import type { ClientIdWithQuerierType, Ecosystem } from "../../types.js";
 import type { InAppWalletIframeCommunicator } from "../../utils/iFrameCommunication/InAppWalletIframeCommunicator.js";
 
@@ -28,11 +28,6 @@ export type LoginQuerierTypes = {
   getHeadlessOauthLoginLink: { authProvider: AuthProvider };
 };
 
-type OauthLoginType = {
-  openedWindow?: Window | null;
-  closeOpenedWindow?: (openedWindow: Window) => void;
-};
-
 /**
  * @internal
  */
@@ -90,10 +85,7 @@ export abstract class AbstractLogin<
     encryptionKey: string;
   }): Promise<AuthLoginReturnType>;
   abstract loginWithModal(args?: MODAL): Promise<AuthLoginReturnType>;
-  abstract loginWithEmailOtp(args: EMAIL_MODAL): Promise<AuthLoginReturnType>;
-  abstract loginWithOauth(
-    args: OauthLoginType & { oauthProvider: AuthProvider },
-  ): Promise<AuthLoginReturnType>;
+  abstract loginWithIframe(args: EMAIL_MODAL): Promise<AuthLoginReturnType>;
 
   /**
    * @internal
@@ -101,7 +93,6 @@ export abstract class AbstractLogin<
   async sendEmailLoginOtp({
     email,
   }: LoginQuerierTypes["sendThirdwebEmailLoginOtp"]): Promise<SendEmailOtpReturnType> {
-    await this.preLogin();
     const result = await this.LoginQuerier.call<SendEmailOtpReturnType>({
       procedureName: "sendThirdwebEmailLoginOtp",
       params: { email },
@@ -116,7 +107,6 @@ export abstract class AbstractLogin<
   async sendSmsLoginOtp({
     phoneNumber,
   }: LoginQuerierTypes["sendThirdwebSmsLoginOtp"]): Promise<SendEmailOtpReturnType> {
-    await this.preLogin();
     const result = await this.LoginQuerier.call<SendEmailOtpReturnType>({
       procedureName: "sendThirdwebSmsLoginOtp",
       params: { phoneNumber },
@@ -124,11 +114,11 @@ export abstract class AbstractLogin<
     return result;
   }
 
-  abstract verifyEmailLoginOtp(
+  abstract loginWithEmailOtp(
     args: EMAIL_VERIFICATION,
   ): Promise<AuthLoginReturnType>;
 
-  abstract verifySmsLoginOtp(args: {
+  abstract loginWithSmsOtp(args: {
     phoneNumber: string;
     otp: string;
     recoveryCode?: string;

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

@@ -1,9 +1,7 @@
-import {
-  type AuthAndWalletRpcReturnType,
-  type AuthLoginReturnType,
-  AuthProvider,
-  type GetHeadlessLoginLinkReturnType,
-} from "../../../core/authentication/type.js";
+import type {
+  AuthAndWalletRpcReturnType,
+  AuthLoginReturnType,
+} from "../../../core/authentication/types.js";
 import { AbstractLogin, type LoginQuerierTypes } from "./abstract-login.js";
 
 /**
@@ -14,20 +12,12 @@ export class BaseLogin extends AbstractLogin<
   { email: string },
   { email: string; otp: string; recoveryCode?: string }
 > {
-  private async getOauthLoginUrl(
-    authProvider: AuthProvider,
-  ): Promise<GetHeadlessLoginLinkReturnType> {
-    try {
-      const result =
-        await this.LoginQuerier.call<GetHeadlessLoginLinkReturnType>({
-          procedureName: "getHeadlessOauthLoginLink",
-          params: { authProvider },
-        });
-      return result;
-    } catch (e) {
-      console.error(e);
-      throw e;
-    }
+  async authenticateWithModal(): Promise<AuthAndWalletRpcReturnType> {
+    return this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
+      procedureName: "loginWithThirdwebModal",
+      params: undefined,
+      showIframe: true,
+    });
   }
 
   /**
@@ -35,165 +25,42 @@ export class BaseLogin extends AbstractLogin<
    */
   override async loginWithModal(): Promise<AuthLoginReturnType> {
     await this.preLogin();
-    const result = await this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
-      procedureName: "loginWithThirdwebModal",
-      params: undefined,
-      showIframe: true,
-    });
+    const result = await this.authenticateWithModal();
     return this.postLogin(result);
   }
 
-  /**
-   * @internal
-   */
-  override async loginWithEmailOtp({
+  async authenticateWithIframe({
     email,
   }: {
     email: string;
-  }): Promise<AuthLoginReturnType> {
-    await this.preLogin();
-    const result = await this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
+  }): Promise<AuthAndWalletRpcReturnType> {
+    return this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
       procedureName: "loginWithThirdwebModal",
       params: { email },
       showIframe: true,
     });
-    return this.postLogin(result);
-  }
-
-  private closeWindow = ({
-    isWindowOpenedByFn,
-    win,
-    closeOpenedWindow,
-  }: {
-    win?: Window | null;
-    isWindowOpenedByFn: boolean;
-    closeOpenedWindow?: (openedWindow: Window) => void;
-  }) => {
-    if (isWindowOpenedByFn) {
-      win?.close();
-    } else {
-      if (win && closeOpenedWindow) {
-        closeOpenedWindow(win);
-      } else if (win) {
-        win.close();
-      }
-    }
-  };
-
-  private getOauthPopUpSizing(authProvider: AuthProvider) {
-    switch (authProvider) {
-      case AuthProvider.FACEBOOK:
-        return "width=715, height=555";
-      default:
-        return "width=350, height=500";
-    }
   }
 
   /**
    * @internal
    */
-  override async loginWithOauth(args: {
-    oauthProvider: AuthProvider;
-    openedWindow?: Window | null | undefined;
-    closeOpenedWindow?: ((openedWindow: Window) => void) | undefined;
+  override async loginWithIframe({
+    email,
+  }: {
+    email: string;
   }): Promise<AuthLoginReturnType> {
-    let win = args?.openedWindow;
-    let isWindowOpenedByFn = false;
-    if (!win) {
-      win = window.open(
-        "",
-        "Login",
-        this.getOauthPopUpSizing(args.oauthProvider),
-      );
-      isWindowOpenedByFn = true;
-    }
-    if (!win) {
-      throw new Error("Something went wrong opening pop-up");
-    }
-    // logout the user
-    // fetch the url to open the login window from iframe
-    const [{ loginLink }] = await Promise.all([
-      this.getOauthLoginUrl(args.oauthProvider),
-      this.preLogin(),
-    ]);
-    win.location.href = loginLink;
-    // listen to result from the login window
-    const result = await new Promise<AuthAndWalletRpcReturnType>(
-      (resolve, reject) => {
-        // detect when the user closes the login window
-        const pollTimer = window.setInterval(async () => {
-          if (!win) {
-            return;
-          }
-          if (win.closed) {
-            clearInterval(pollTimer);
-            window.removeEventListener("message", messageListener);
-            reject(new Error("User closed login window"));
-          }
-        }, 1000);
-
-        const messageListener = async (
-          event: MessageEvent<{
-            eventType: string;
-            authResult?: AuthAndWalletRpcReturnType;
-            error?: string;
-          }>,
-        ) => {
-          if (event.origin !== this.baseUrl) {
-            return;
-          }
-          if (typeof event.data !== "object") {
-            reject(new Error("Invalid event data"));
-            return;
-          }
-
-          switch (event.data.eventType) {
-            case "userLoginSuccess": {
-              window.removeEventListener("message", messageListener);
-              clearInterval(pollTimer);
-              this.closeWindow({
-                isWindowOpenedByFn,
-                win,
-                closeOpenedWindow: args?.closeOpenedWindow,
-              });
-              if (event.data.authResult) {
-                resolve(event.data.authResult);
-              }
-              break;
-            }
-            case "userLoginFailed": {
-              window.removeEventListener("message", messageListener);
-              clearInterval(pollTimer);
-              this.closeWindow({
-                isWindowOpenedByFn,
-                win,
-                closeOpenedWindow: args?.closeOpenedWindow,
-              });
-              reject(new Error(event.data.error));
-              break;
-            }
-            case "injectDeveloperClientId": {
-              win?.postMessage(
-                {
-                  eventType: "injectDeveloperClientIdResult",
-                  developerClientId: this.client.clientId,
-                  authOption: args.oauthProvider,
-                  partnerId: this.ecosystem?.partnerId,
-                  ecosystemId: this.ecosystem?.id,
-                },
-                this.baseUrl,
-              );
-              break;
-            }
-          }
-        };
-        window.addEventListener("message", messageListener);
-      },
-    );
+    await this.preLogin();
+    const result = await this.authenticateWithIframe({ email });
+    return this.postLogin(result);
+  }
 
-    return this.postLogin({
-      storedToken: { ...result.storedToken, shouldStoreCookieString: true },
-      walletDetails: { ...result.walletDetails, isIframeStorageEnabled: false },
+  async authenticateWithCustomJwt({
+    encryptionKey,
+    jwt,
+  }: LoginQuerierTypes["loginWithCustomJwt"]): Promise<AuthAndWalletRpcReturnType> {
+    return this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
+      procedureName: "loginWithCustomJwt",
+      params: { encryptionKey, jwt },
     });
   }
 
@@ -205,13 +72,20 @@ export class BaseLogin extends AbstractLogin<
     jwt,
   }: LoginQuerierTypes["loginWithCustomJwt"]): Promise<AuthLoginReturnType> {
     await this.preLogin();
-    const result = await this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
-      procedureName: "loginWithCustomJwt",
-      params: { encryptionKey, jwt },
-    });
+    const result = await this.authenticateWithCustomJwt({ encryptionKey, jwt });
     return this.postLogin(result);
   }
 
+  async authenticateWithCustomAuthEndpoint({
+    encryptionKey,
+    payload,
+  }: LoginQuerierTypes["loginWithCustomAuthEndpoint"]): Promise<AuthAndWalletRpcReturnType> {
+    return this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
+      procedureName: "loginWithCustomAuthEndpoint",
+      params: { encryptionKey, payload },
+    });
+  }
+
   /**
    * @internal
    */
@@ -220,39 +94,63 @@ export class BaseLogin extends AbstractLogin<
     payload,
   }: LoginQuerierTypes["loginWithCustomAuthEndpoint"]): Promise<AuthLoginReturnType> {
     await this.preLogin();
-    const result = await this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
-      procedureName: "loginWithCustomAuthEndpoint",
-      params: { encryptionKey, payload },
+    const result = await this.authenticateWithCustomAuthEndpoint({
+      encryptionKey,
+      payload,
     });
     return this.postLogin(result);
   }
 
+  async authenticateWithEmailOtp({
+    email,
+    otp,
+    recoveryCode,
+  }: LoginQuerierTypes["verifyThirdwebEmailLoginOtp"]): Promise<AuthAndWalletRpcReturnType> {
+    return this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
+      procedureName: "verifyThirdwebEmailLoginOtp",
+      params: { email, otp, recoveryCode },
+    });
+  }
+
   /**
    * @internal
    */
-  override async verifyEmailLoginOtp({
+  override async loginWithEmailOtp({
     email,
     otp,
     recoveryCode,
   }: LoginQuerierTypes["verifyThirdwebEmailLoginOtp"]): Promise<AuthLoginReturnType> {
-    const result = await this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
-      procedureName: "verifyThirdwebEmailLoginOtp",
-      params: { email, otp, recoveryCode },
+    const result = await this.authenticateWithEmailOtp({
+      email,
+      otp,
+      recoveryCode,
     });
     return this.postLogin(result);
   }
 
+  async authenticateWithSmsOtp({
+    phoneNumber,
+    otp,
+    recoveryCode,
+  }: LoginQuerierTypes["verifyThirdwebSmsLoginOtp"]): Promise<AuthAndWalletRpcReturnType> {
+    return this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
+      procedureName: "verifyThirdwebSmsLoginOtp",
+      params: { phoneNumber, otp, recoveryCode },
+    });
+  }
+
   /**
    * @internal
    */
-  override async verifySmsLoginOtp({
+  override async loginWithSmsOtp({
     phoneNumber,
     otp,
     recoveryCode,
   }: LoginQuerierTypes["verifyThirdwebSmsLoginOtp"]): Promise<AuthLoginReturnType> {
-    const result = await this.LoginQuerier.call<AuthAndWalletRpcReturnType>({
-      procedureName: "verifyThirdwebSmsLoginOtp",
-      params: { phoneNumber, otp, recoveryCode },
+    const result = await this.authenticateWithSmsOtp({
+      phoneNumber,
+      otp,
+      recoveryCode,
     });
     return this.postLogin(result);
   }

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

@@ -5,7 +5,7 @@ import type {
   AuthStoredTokenWithCookieReturnType,
   LogoutReturnType,
   SendEmailOtpReturnType,
-} from "../../../core/authentication/type.js";
+} from "../../../core/authentication/types.js";
 import type { ClientIdWithQuerierType, Ecosystem } from "../../types.js";
 import { LocalStorage } from "../../utils/Storage/LocalStorage.js";
 import type { InAppWalletIframeCommunicator } from "../../utils/iFrameCommunication/InAppWalletIframeCommunicator.js";
@@ -129,6 +129,9 @@ export class Auth {
   async loginWithModal(): Promise<AuthLoginReturnType> {
     return this.BaseLogin.loginWithModal();
   }
+  async authenticateWithModal(): Promise<AuthAndWalletRpcReturnType> {
+    return this.BaseLogin.authenticateWithModal();
+  }
 
   /**
    * Used to log the user into their thirdweb wallet using email OTP
@@ -148,10 +151,15 @@ export class Auth {
    * @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],
+  async loginWithIframe(
+    args: Parameters<BaseLogin["loginWithIframe"]>[0],
   ): Promise<AuthLoginReturnType> {
-    return this.BaseLogin.loginWithEmailOtp(args);
+    return this.BaseLogin.loginWithIframe(args);
+  }
+  async authenticateWithIframe(
+    args: Parameters<BaseLogin["authenticateWithIframe"]>[0],
+  ): Promise<AuthAndWalletRpcReturnType> {
+    return this.BaseLogin.authenticateWithIframe(args);
   }
 
   /**
@@ -162,6 +170,11 @@ export class Auth {
   ): Promise<AuthLoginReturnType> {
     return this.BaseLogin.loginWithCustomJwt(args);
   }
+  async authenticateWithCustomJwt(
+    args: Parameters<BaseLogin["authenticateWithCustomJwt"]>[0],
+  ): Promise<AuthAndWalletRpcReturnType> {
+    return this.BaseLogin.authenticateWithCustomJwt(args);
+  }
 
   /**
    * @internal
@@ -171,19 +184,15 @@ export class Auth {
   ): Promise<AuthLoginReturnType> {
     return this.BaseLogin.loginWithCustomAuthEndpoint(args);
   }
-
-  /**
-   * @internal
-   */
-  async loginWithOauth(
-    args: Parameters<BaseLogin["loginWithOauth"]>[0],
-  ): Promise<AuthLoginReturnType> {
-    return this.BaseLogin.loginWithOauth(args);
+  async authenticateWithCustomAuthEndpoint(
+    args: Parameters<BaseLogin["authenticateWithCustomAuthEndpoint"]>[0],
+  ): Promise<AuthAndWalletRpcReturnType> {
+    return this.BaseLogin.authenticateWithCustomAuthEndpoint(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
+   * You need to then call {@link Auth.loginWithEmailOtp} in order to complete the login process
    * @example
    * @param param0.email
    * ```typescript
@@ -240,17 +249,27 @@ export class Auth {
    * @returns `{{user: InitializedUser}}` An InitializedUser object containing the user's status, wallet, authDetails, and more
    * @internal
    */
-  async verifyEmailLoginOtp(
-    args: Parameters<BaseLogin["verifyEmailLoginOtp"]>[0],
+  async loginWithEmailOtp(args: Parameters<BaseLogin["loginWithEmailOtp"]>[0]) {
+    await this.preLogin();
+    return this.BaseLogin.loginWithEmailOtp(args);
+  }
+  async authenticateWithEmailOtp(
+    args: Parameters<BaseLogin["authenticateWithEmailOtp"]>[0],
   ) {
-    return this.BaseLogin.verifyEmailLoginOtp(args);
+    return this.BaseLogin.authenticateWithEmailOtp(args);
   }
 
   /**
    * @internal
    */
-  async verifySmsLoginOtp(args: Parameters<BaseLogin["verifySmsLoginOtp"]>[0]) {
-    return this.BaseLogin.verifySmsLoginOtp(args);
+  async loginWithSmsOtp(args: Parameters<BaseLogin["loginWithSmsOtp"]>[0]) {
+    await this.preLogin();
+    return this.BaseLogin.loginWithSmsOtp(args);
+  }
+  async authenticateWithSmsOtp(
+    args: Parameters<BaseLogin["authenticateWithSmsOtp"]>[0],
+  ) {
+    return this.BaseLogin.authenticateWithSmsOtp(args);
   }
 
   /**