@imtbl/auth 2.10.7-alpha.6 → 2.11.1-alpha.1

package/src/Auth.ts

@@ -7,8 +7,6 @@ import {
   UserManagerSettings,
   WebStorageStateStore,
 } from 'oidc-client-ts';
-import axios from 'axios';
-import jwt_decode from 'jwt-decode';
 import localForage from 'localforage';
 import {
   Detail,
@@ -35,6 +33,7 @@ import {
 import EmbeddedLoginPrompt from './login/embeddedLoginPrompt';
 import TypedEventEmitter from './utils/typedEventEmitter';
 import { withMetricsAsync } from './utils/metrics';
+import { decodeJwtPayload } from './utils/jwt';
 import DeviceCredentialsManager from './storage/device_credentials_manager';
 import { PassportError, PassportErrorType, withPassportError } from './errors';
 import logger from './utils/logger';
@@ -42,12 +41,37 @@ import { isAccessTokenExpiredOrExpiring } from './utils/token';
 import LoginPopupOverlay from './overlay/loginPopupOverlay';
 import { LocalForageAsyncStorage } from './storage/LocalForageAsyncStorage';
 
-const LOGIN_POPUP_CLOSED_POLLING_DURATION = 500;
+const formUrlEncodedHeaders = {
+  'Content-Type': 'application/x-www-form-urlencoded',
+};
+
+const parseJsonSafely = (text: string): unknown => {
+  if (!text) {
+    return undefined;
+  }
+  try {
+    return JSON.parse(text);
+  } catch {
+    return undefined;
+  }
+};
 
-const formUrlEncodedHeader = {
-  headers: {
-    'Content-Type': 'application/x-www-form-urlencoded',
-  },
+const extractTokenErrorMessage = (
+  payload: unknown,
+  fallbackText: string,
+  status: number,
+): string => {
+  if (payload && typeof payload === 'object') {
+    const data = payload as Record<string, unknown>;
+    const description = data.error_description ?? data.message ?? data.error;
+    if (typeof description === 'string' && description.trim().length > 0) {
+      return description;
+    }
+  }
+  if (fallbackText.trim().length > 0) {
+    return fallbackText;
+  }
+  return `Token request failed with status ${status}`;
 };
 
 const logoutEndpoint = '/v2/logout';
@@ -206,8 +230,7 @@ export class Auth {
 
       // Emit LOGGED_IN event and identify user if logged in
       if (user) {
-        this.eventEmitter.emit(AuthEvents.LOGGED_IN, user);
-        identify({ passportId: user.profile.sub });
+        this.handleSuccessfulLogin(user);
       }
 
       return user;
@@ -233,8 +256,7 @@ export class Auth {
     return withMetricsAsync(async () => {
       const user = await this.loginCallbackInternal();
       if (user) {
-        this.eventEmitter.emit(AuthEvents.LOGGED_IN, user);
-        identify({ passportId: user.profile.sub });
+        this.handleSuccessfulLogin(user);
       }
       return user;
     }, 'loginCallback');
@@ -256,7 +278,7 @@ export class Auth {
    * @returns Promise that resolves with the user or null if not authenticated
    */
   async getUser(): Promise<User | null> {
-    return withMetricsAsync(async () => this.getUserInternal(), 'getUserInfo', false);
+    return this.getUserInternal();
   }
 
   /**
@@ -275,7 +297,9 @@ export class Auth {
       return user;
     }
 
-    return this.loginWithPopup();
+    const loggedInUser = await this.loginWithPopup();
+    this.handleSuccessfulLogin(loggedInUser);
+    return loggedInUser;
   }
 
   /**
@@ -354,8 +378,7 @@ export class Auth {
   async loginWithPKCEFlowCallback(authorizationCode: string, state: string): Promise<User> {
     return withMetricsAsync(async () => {
       const user = await this.loginWithPKCEFlowCallbackInternal(authorizationCode, state);
-      this.eventEmitter.emit(AuthEvents.LOGGED_IN, user);
-      identify({ passportId: user.profile.sub });
+      this.handleSuccessfulLogin(user);
       return user;
     }, 'loginWithPKCEFlowCallback');
   }
@@ -368,8 +391,7 @@ export class Auth {
   async storeTokens(tokenResponse: DeviceTokenResponse): Promise<User> {
     return withMetricsAsync(async () => {
       const user = await this.storeTokensInternal(tokenResponse);
-      this.eventEmitter.emit(AuthEvents.LOGGED_IN, user);
-      identify({ passportId: user.profile.sub });
+      this.handleSuccessfulLogin(user);
       return user;
     }, 'storeTokens');
   }
@@ -413,6 +435,11 @@ export class Auth {
     return this.config.oidcConfiguration.clientId;
   }
 
+  private handleSuccessfulLogin(user: User): void {
+    this.eventEmitter.emit(AuthEvents.LOGGED_IN, user);
+    identify({ passportId: user.profile.sub });
+  }
+
   private buildExtraQueryParams(
     directLoginOptions?: DirectLoginOptions,
     imPassportTraceId?: string,
@@ -420,7 +447,6 @@ export class Auth {
     const params: Record<string, string> = {
       ...(this.userManager.settings?.extraQueryParams ?? {}),
       rid: getDetail(Detail.RUNTIME_ID) || '',
-      third_party_a_id: '',
     };
 
     if (directLoginOptions) {
@@ -472,7 +498,7 @@ export class Auth {
       const signinPopup = async () => {
         const extraQueryParams = this.buildExtraQueryParams(directLoginOptionsToUse, imPassportTraceId);
 
-        const userPromise = this.userManager.signinPopup({
+        return this.userManager.signinPopup({
           extraQueryParams,
           popupWindowFeatures: {
             width: 410,
@@ -480,27 +506,6 @@ export class Auth {
           },
           popupWindowTarget,
         });
-
-        const popupRef = window.open('', popupWindowTarget);
-        if (popupRef) {
-          const popupClosedPromise = new Promise<never>((_, reject) => {
-            const timer = setInterval(() => {
-              if (popupRef.closed) {
-                clearInterval(timer);
-                reject(new Error('Popup closed by user'));
-              }
-            }, LOGIN_POPUP_CLOSED_POLLING_DURATION);
-
-            userPromise.finally(() => {
-              clearInterval(timer);
-              popupRef.close();
-            });
-          });
-
-          return Promise.race([userPromise, popupClosedPromise]);
-        }
-
-        return userPromise;
       };
 
       return new Promise((resolve, reject) => {
@@ -542,8 +547,13 @@ export class Auth {
 
   private static mapOidcUserToDomainModel = (oidcUser: OidcUser): User => {
     let passport: PassportMetadata | undefined;
+    let username: string | undefined;
     if (oidcUser.id_token) {
-      passport = jwt_decode<IdTokenPayload>(oidcUser.id_token)?.passport;
+      const idTokenPayload = decodeJwtPayload<IdTokenPayload>(oidcUser.id_token);
+      passport = idTokenPayload?.passport;
+      if (idTokenPayload?.username) {
+        username = idTokenPayload?.username;
+      }
     }
 
     const user: User = {
@@ -555,6 +565,7 @@ export class Auth {
         sub: oidcUser.profile.sub,
         email: oidcUser.profile.email,
         nickname: oidcUser.profile.nickname,
+        username,
       },
     };
     if (passport?.zkevm_eth_address && passport?.zkevm_user_admin_address) {
@@ -567,7 +578,7 @@ export class Auth {
   };
 
   private static mapDeviceTokenResponseToOidcUser = (tokenResponse: DeviceTokenResponse): OidcUser => {
-    const idTokenPayload: IdTokenPayload = jwt_decode(tokenResponse.id_token);
+    const idTokenPayload: IdTokenPayload = decodeJwtPayload(tokenResponse.id_token);
     return new OidcUser({
       id_token: tokenResponse.id_token,
       access_token: tokenResponse.access_token,
@@ -582,29 +593,13 @@ export class Auth {
         email: idTokenPayload.email,
         nickname: idTokenPayload.nickname,
         passport: idTokenPayload.passport,
+        ...(idTokenPayload.username ? { username: idTokenPayload.username } : {}),
       },
     });
   };
 
-  private static shouldUseSigninPopupCallback(): boolean {
-    try {
-      const urlParams = new URLSearchParams(window.location.search);
-      const stateParam = urlParams.get('state');
-      const localStorageKey = `oidc.${stateParam}`;
-      const localStorageValue = localStorage.getItem(localStorageKey);
-      const loginState = JSON.parse(localStorageValue || '{}');
-      return loginState?.request_type === 'si:p';
-    } catch (err) {
-      return false;
-    }
-  }
-
   private async loginCallbackInternal(): Promise<User | undefined> {
     return withPassportError(async () => {
-      if (Auth.shouldUseSigninPopupCallback()) {
-        await this.userManager.signinPopupCallback(undefined, true);
-        return undefined;
-      }
       const oidcUser = await this.userManager.signinCallback();
       if (!oidcUser) {
         return undefined;
@@ -681,18 +676,39 @@ export class Auth {
   }
 
   private async getPKCEToken(authorizationCode: string, codeVerifier: string): Promise<DeviceTokenResponse> {
-    const response = await axios.post<DeviceTokenResponse>(
+    const response = await fetch(
       `${this.config.authenticationDomain}/oauth/token`,
       {
-        client_id: this.config.oidcConfiguration.clientId,
-        grant_type: 'authorization_code',
-        code_verifier: codeVerifier,
-        code: authorizationCode,
-        redirect_uri: this.config.oidcConfiguration.redirectUri,
+        method: 'POST',
+        headers: formUrlEncodedHeaders,
+        body: new URLSearchParams({
+          client_id: this.config.oidcConfiguration.clientId,
+          grant_type: 'authorization_code',
+          code_verifier: codeVerifier,
+          code: authorizationCode,
+          redirect_uri: this.config.oidcConfiguration.redirectUri,
+        }),
       },
-      formUrlEncodedHeader,
     );
-    return response.data;
+
+    const responseText = await response.text();
+    const parsedBody = parseJsonSafely(responseText);
+
+    if (!response.ok) {
+      throw new Error(
+        extractTokenErrorMessage(
+          parsedBody,
+          responseText,
+          response.status,
+        ),
+      );
+    }
+
+    if (!parsedBody || typeof parsedBody !== 'object') {
+      throw new Error('Token endpoint returned an invalid response');
+    }
+
+    return parsedBody as DeviceTokenResponse;
   }
 
   private async storeTokensInternal(tokenResponse: DeviceTokenResponse): Promise<User> {

package/src/errors.test.ts

@@ -0,0 +1,21 @@
+import { isAPIError } from './errors';
+
+describe('isAPIError', () => {
+  it('returns true when code and message fields exist', () => {
+    expect(isAPIError({ code: 'BAD_REQUEST', message: 'Invalid' })).toBe(true);
+  });
+
+  it.each([
+    'Not found',
+    404,
+    null,
+    undefined,
+  ])('returns false for non-object value: %p', (value) => {
+    expect(isAPIError(value)).toBe(false);
+  });
+
+  it('returns false when required fields are missing', () => {
+    expect(isAPIError({ code: 'BAD_REQUEST' })).toBe(false);
+    expect(isAPIError({ message: 'Invalid' })).toBe(false);
+  });
+});

package/src/errors.ts

@@ -1,4 +1,3 @@
-import { isAxiosError } from 'axios';
 import { imx } from '@imtbl/generated-clients';
 
 export enum PassportErrorType {
@@ -23,12 +22,43 @@ export enum PassportErrorType {
   LINK_WALLET_DUPLICATE_NONCE_ERROR = 'LINK_WALLET_DUPLICATE_NONCE_ERROR',
   LINK_WALLET_GENERIC_ERROR = 'LINK_WALLET_GENERIC_ERROR',
   SERVICE_UNAVAILABLE_ERROR = 'SERVICE_UNAVAILABLE_ERROR',
+  TRANSACTION_REJECTED = 'TRANSACTION_REJECTED',
 }
 
 export function isAPIError(error: any): error is imx.APIError {
-  return 'code' in error && 'message' in error;
+  return (
+    typeof error === 'object'
+    && error !== null
+    && 'code' in error
+    && 'message' in error
+  );
 }
 
+type AxiosLikeError = {
+  response?: {
+    data?: unknown;
+  };
+};
+
+const extractApiError = (error: unknown): imx.APIError | undefined => {
+  if (isAPIError(error)) {
+    return error;
+  }
+
+  if (
+    typeof error === 'object'
+    && error !== null
+    && 'response' in error
+  ) {
+    const { response } = error as AxiosLikeError;
+    if (response?.data && isAPIError(response.data)) {
+      return response.data;
+    }
+  }
+
+  return undefined;
+};
+
 export class PassportError extends Error {
   public type: PassportErrorType;
 
@@ -51,8 +81,9 @@ export const withPassportError = async <T>(
       throw new PassportError(error.message, error.type);
     }
 
-    if (isAxiosError(error) && error.response?.data && isAPIError(error.response.data)) {
-      errorMessage = error.response.data.message;
+    const apiError = extractApiError(error);
+    if (apiError) {
+      errorMessage = apiError.message;
     } else {
       errorMessage = (error as Error).message;
     }

package/src/index.ts

@@ -29,4 +29,8 @@ export {
 export { default as TypedEventEmitter } from './utils/typedEventEmitter';
 
 // Export errors
-export { PassportError, PassportErrorType, withPassportError } from './errors';
+export {
+  PassportError, PassportErrorType, withPassportError, isAPIError,
+} from './errors';
+
+export { decodeJwtPayload } from './utils/jwt';

package/src/storage/device_credentials_manager.ts

@@ -1,6 +1,6 @@
 /* eslint-disable class-methods-use-this */
-import jwt_decode from 'jwt-decode';
 import { TokenPayload, PKCEData } from '../types';
+import { decodeJwtPayload } from '../utils/jwt';
 
 const KEY_PKCE_STATE = 'pkce_state';
 const KEY_PKCE_VERIFIER = 'pkce_verifier';
@@ -9,7 +9,7 @@ const validCredentialsMinTtlSec = 3600; // 1 hour
 export default class DeviceCredentialsManager {
   private isTokenValid(jwt: string): boolean {
     try {
-      const tokenPayload: TokenPayload = jwt_decode(jwt);
+      const tokenPayload: TokenPayload = decodeJwtPayload(jwt);
       const expiresAt = tokenPayload.exp ?? 0;
       const now = (Date.now() / 1000) + validCredentialsMinTtlSec;
       return expiresAt > now;

package/src/types.ts

@@ -9,6 +9,7 @@ export type UserProfile = {
   email?: string;
   nickname?: string;
   sub: string;
+  username?: string;
 };
 
 export enum RollupType {
@@ -91,6 +92,7 @@ export type TokenPayload = {
 
 export type IdTokenPayload = {
   passport?: PassportMetadata;
+  username?: string;
   email: string;
   nickname: string;
   aud: string;

package/src/utils/jwt.ts

@@ -0,0 +1,78 @@
+/* eslint-disable no-restricted-globals */
+const getGlobal = (): typeof globalThis => {
+  if (typeof globalThis !== 'undefined') {
+    return globalThis;
+  }
+  if (typeof self !== 'undefined') {
+    return self;
+  }
+  if (typeof window !== 'undefined') {
+    return window;
+  }
+  if (typeof global !== 'undefined') {
+    return global;
+  }
+  return {} as typeof globalThis;
+};
+
+const base64UrlToBase64 = (input: string): string => {
+  const normalized = input.replace(/-/g, '+').replace(/_/g, '/');
+  const padding = normalized.length % 4 === 0 ? '' : '='.repeat(4 - (normalized.length % 4));
+  return normalized + padding;
+};
+
+const decodeWithAtob = (value: string): string | null => {
+  const globalRef = getGlobal();
+  if (typeof globalRef.atob !== 'function') {
+    return null;
+  }
+
+  const binary = globalRef.atob(value);
+  const bytes = new Uint8Array(binary.length);
+  for (let i = 0; i < binary.length; i += 1) {
+    bytes[i] = binary.charCodeAt(i);
+  }
+
+  if (typeof globalRef.TextDecoder === 'function') {
+    return new globalRef.TextDecoder('utf-8').decode(bytes);
+  }
+
+  let result = '';
+  for (let i = 0; i < bytes.length; i += 1) {
+    result += String.fromCharCode(bytes[i]);
+  }
+  return result;
+};
+
+const base64Decode = (value: string): string => {
+  if (typeof Buffer !== 'undefined') {
+    return Buffer.from(value, 'base64').toString('utf-8');
+  }
+
+  const decoded = decodeWithAtob(value);
+  if (decoded === null) {
+    throw new Error('Base64 decoding is not supported in this environment');
+  }
+
+  return decoded;
+};
+
+export const decodeJwtPayload = <T>(token: string): T => {
+  if (typeof token !== 'string') {
+    throw new Error('JWT must be a string');
+  }
+
+  const segments = token.split('.');
+  if (segments.length < 2) {
+    throw new Error('Invalid JWT: payload segment is missing');
+  }
+
+  const payloadSegment = segments[1];
+  const json = base64Decode(base64UrlToBase64(payloadSegment));
+
+  try {
+    return JSON.parse(json) as T;
+  } catch {
+    throw new Error('Invalid JWT payload: unable to parse JSON');
+  }
+};

package/src/utils/token.ts

@@ -1,13 +1,13 @@
-import jwt_decode from 'jwt-decode';
 import {
   User as OidcUser,
 } from 'oidc-client-ts';
 import { IdTokenPayload, TokenPayload } from '../types';
+import { decodeJwtPayload } from './jwt';
 
 function isTokenExpiredOrExpiring(token: string): boolean {
   try {
     // try to decode the token as access token payload or id token payload
-    const decodedToken = jwt_decode<TokenPayload | IdTokenPayload>(token);
+    const decodedToken = decodeJwtPayload<TokenPayload | IdTokenPayload>(token);
     const now = Math.floor(Date.now() / 1000);
 
     // Tokens without expiration claims are invalid (security vulnerability)

package/src/utils/typedEventEmitter.ts

@@ -1,26 +1,51 @@
-import { EventEmitter } from 'events';
+type StringEventKey<T> = Extract<keyof T, string>;
+
+type AnyListener = (...args: any[]) => void;
+type EventArgs<TEvents, TEventName extends keyof TEvents> =
+  TEvents[TEventName] extends readonly [...infer A]
+    ? [...A]
+    : TEvents[TEventName] extends readonly any[]
+      ? [...TEvents[TEventName]]
+      : [TEvents[TEventName]];
 
 export default class TypedEventEmitter<TEvents extends Record<string, any>> {
-  private emitter = new EventEmitter();
+  private listeners = new Map<StringEventKey<TEvents>, Set<AnyListener>>();
 
-  emit<TEventName extends keyof TEvents & string>(
+  emit<TEventName extends StringEventKey<TEvents>>(
     eventName: TEventName,
-    ...eventArg: TEvents[TEventName]
+    ...eventArg: EventArgs<TEvents, TEventName>
   ) {
-    this.emitter.emit(eventName, ...(eventArg as []));
+    const handlers = this.listeners.get(eventName);
+    if (!handlers || handlers.size === 0) {
+      return;
+    }
+
+    // Copy handlers to avoid issues if listeners mutate during emit
+    [...handlers].forEach((handler) => {
+      handler(...eventArg);
+    });
   }
 
-  on<TEventName extends keyof TEvents & string>(
+  on<TEventName extends StringEventKey<TEvents>>(
     eventName: TEventName,
-    handler: (...eventArg: TEvents[TEventName]) => void,
+    handler: (...eventArg: EventArgs<TEvents, TEventName>) => void,
   ) {
-    this.emitter.on(eventName, handler as any);
+    const handlers = this.listeners.get(eventName) ?? new Set<AnyListener>();
+    handlers.add(handler as AnyListener);
+    this.listeners.set(eventName, handlers);
   }
 
-  removeListener<TEventName extends keyof TEvents & string>(
+  removeListener<TEventName extends StringEventKey<TEvents>>(
     eventName: TEventName,
-    handler: (...eventArg: TEvents[TEventName]) => void,
+    handler: (...eventArg: EventArgs<TEvents, TEventName>) => void,
   ) {
-    this.emitter.removeListener(eventName, handler as any);
+    const handlers = this.listeners.get(eventName);
+    if (!handlers) {
+      return;
+    }
+    handlers.delete(handler as AnyListener);
+    if (handlers.size === 0) {
+      this.listeners.delete(eventName);
+    }
   }
 }

package/tsconfig.eslint.json

@@ -0,0 +1,6 @@
+{
+  "extends": "./tsconfig.json",
+  "exclude": [],
+  "include": ["src"]
+}
+

package/tsconfig.json

@@ -10,6 +10,10 @@
   "exclude": [
     "node_modules",
     "dist",
+    "src/**/*.test.ts",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.ts",
+    "src/**/*.spec.tsx"
   ]
 }