zksync-sso 0.3.3 → 0.4.0-beta.0

package/src/client/recovery/actions/oidc.ts

@@ -0,0 +1,103 @@
+import {
+  type Account,
+  type Address,
+  type Chain,
+  type Client,
+  encodeFunctionData,
+  type Hash,
+  type Hex,
+  type Prettify,
+  type TransactionReceipt,
+  type Transport,
+} from "viem";
+import { waitForTransactionReceipt } from "viem/actions";
+import {
+  getGeneralPaymasterInput,
+  sendTransaction,
+} from "viem/zksync";
+
+import { OidcRecoveryValidatorAbi } from "../../../abi/index.js";
+import { noThrow } from "../../../utils/helpers.js";
+
+export type AddOidcAccountArgs = {
+  contracts: {
+    recoveryOidc: Address; // oidc recovery module
+  };
+  paymaster?: {
+    address: Address;
+    paymasterInput?: Hex;
+  };
+  oidcDigest: Hex;
+  iss: string;
+  onTransactionSent?: (hash: Hash) => void;
+};
+export type AddOidcAccountReturnType = {
+  transactionReceipt: TransactionReceipt;
+};
+export const addOidcAccount = async <
+  transport extends Transport,
+  chain extends Chain,
+  account extends Account,
+>(client: Client<transport, chain, account>, args: Prettify<AddOidcAccountArgs>): Promise<Prettify<AddOidcAccountReturnType>> => {
+  const callData = encodeFunctionData({
+    abi: OidcRecoveryValidatorAbi,
+    functionName: "addOidcAccount",
+    args: [args.oidcDigest, args.iss],
+  });
+
+  const sendTransactionArgs = {
+    account: client.account,
+    to: args.contracts.recoveryOidc,
+    paymaster: args.paymaster?.address,
+    paymasterInput: args.paymaster?.address ? (args.paymaster?.paymasterInput || getGeneralPaymasterInput({ innerInput: "0x" })) : undefined,
+    data: callData,
+    gas: 10_000_000n, // TODO: Remove when gas estimation is fixed
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  } as any;
+
+  const transactionHash = await sendTransaction(client, sendTransactionArgs);
+  if (args.onTransactionSent) {
+    noThrow(() => args.onTransactionSent?.(transactionHash));
+  }
+
+  const transactionReceipt = await waitForTransactionReceipt(client, { hash: transactionHash });
+  if (transactionReceipt.status !== "success") throw new Error("addOidcAccount transaction reverted");
+
+  return {
+    transactionReceipt,
+  };
+};
+
+export type RemoveOidcAccountArgs = {
+  contracts: {
+    recoveryOidc: Address; // oidc recovery module
+  };
+};
+
+export const removeOidcAccount = async <
+  transport extends Transport,
+  chain extends Chain,
+  account extends Account,
+>(client: Client<transport, chain, account>, args: Prettify<RemoveOidcAccountArgs>): Promise<TransactionReceipt> => {
+  const callData = encodeFunctionData({
+    abi: OidcRecoveryValidatorAbi,
+    functionName: "deleteOidcAccount",
+    args: [],
+  });
+
+  const sendTransactionArgs = {
+    account: client.account,
+    to: args.contracts.recoveryOidc,
+    data: callData,
+    gas: 10_000_000n, // TODO: Remove when gas estimation is fixed
+    type: "eip712",
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  } as any;
+
+  const transactionHash = await sendTransaction(client, sendTransactionArgs);
+
+  const transactionReceipt = await waitForTransactionReceipt(client, { hash: transactionHash });
+  if (transactionReceipt.status !== "success") throw new Error("removeOidcAccount transaction reverted");
+
+  return transactionReceipt;
+};

package/src/client-auth-server/Signer.ts

@@ -5,7 +5,7 @@ import { createZksyncSessionClient, type ZksyncSsoSessionClient } from "../clien
 import type { Communicator } from "../communicator/index.js";
 import { type CustomPaymasterHandler, getTransactionWithPaymasterData } from "../paymaster/index.js";
 import type { SessionStateEvent } from "../utils/session.js";
-import { StorageItem } from "../utils/storage.js";
+import { StorageItem, type StorageLike } from "../utils/storage.js";
 import type { AppMetadata, RequestArguments } from "./interface.js";
 import type { AuthServerRpcSchema, ExtractParams, ExtractReturnType, Method, RPCRequestMessage, RPCResponseMessage, RpcSchema } from "./rpc.js";
 import type { SessionPreferences } from "./session/index.js";
@@ -44,6 +44,7 @@ type SignerConstructorParams = {
   paymasterHandler?: CustomPaymasterHandler;
   onSessionStateChange?: (event: { address: Address; chainId: number; state: SessionStateEvent }) => void;
   skipPreTransactionStateValidation?: boolean; // Useful if you want to send session transactions really fast
+  storage?: StorageLike;
 };
 
 type ChainsInfo = ExtractReturnType<"eth_requestAccounts", AuthServerRpcSchema>["chainsInfo"];
@@ -60,10 +61,10 @@ export class Signer implements SignerInterface {
   private readonly skipPreTransactionStateValidation?: boolean;
 
   private _account: StorageItem<Account | null>;
-  private _chainsInfo = new StorageItem<ChainsInfo>(StorageItem.scopedStorageKey("chainsInfo"), []);
+  private _chainsInfo: StorageItem<ChainsInfo>;
   private client: { instance: ZksyncSsoSessionClient; type: "session" } | { instance: WalletClient; type: "auth-server" } | undefined;
 
-  constructor({ metadata, communicator, updateListener, session, chains, transports, paymasterHandler, onSessionStateChange, skipPreTransactionStateValidation }: SignerConstructorParams) {
+  constructor({ metadata, communicator, updateListener, session, chains, transports, paymasterHandler, onSessionStateChange, skipPreTransactionStateValidation, storage }: SignerConstructorParams) {
     if (!chains.length) throw new Error("At least one chain must be included in the config");
 
     this.getMetadata = metadata;
@@ -76,6 +77,7 @@ export class Signer implements SignerInterface {
     this.onSessionStateChange = onSessionStateChange;
     this.skipPreTransactionStateValidation = skipPreTransactionStateValidation;
 
+    this._chainsInfo = new StorageItem<ChainsInfo>(StorageItem.scopedStorageKey("chainsInfo"), [], { storage });
     this._account = new StorageItem<Account | null>(StorageItem.scopedStorageKey("account"), null, {
       onChange: (newValue) => {
         if (newValue) {
@@ -86,6 +88,7 @@ export class Signer implements SignerInterface {
           this.updateListener.onAccountsUpdate([]);
         }
       },
+      storage,
     });
     try {
       if (this.account) this.createWalletClient();

package/src/client-auth-server/WalletProvider.ts

@@ -2,11 +2,13 @@ import { EventEmitter } from "eventemitter3";
 import type { Address, Chain, Transport } from "viem";
 import { toHex } from "viem";
 
+import type { Communicator } from "../communicator/index.js";
 import { PopupCommunicator } from "../communicator/PopupCommunicator.js";
 import { serializeError, standardErrors } from "../errors/index.js";
 import type { CustomPaymasterHandler } from "../paymaster/index.js";
 import { getFavicon, getWebsiteName } from "../utils/helpers.js";
 import type { SessionStateEvent } from "../utils/session.js";
+import type { StorageLike } from "../utils/storage.js";
 import type {
   AppMetadata,
   ProviderInterface,
@@ -27,15 +29,17 @@ export type WalletProviderConstructorOptions = {
   paymasterHandler?: CustomPaymasterHandler;
   onSessionStateChange?: (state: { address: Address; chainId: number; state: SessionStateEvent }) => void;
   skipPreTransactionStateValidation?: boolean; // Useful if you want to send session transactions really fast
+  customCommunicator?: Communicator;
+  storage?: StorageLike;
 };
 
 export class WalletProvider extends EventEmitter implements ProviderInterface {
   readonly isZksyncSso = true;
   private signer: Signer;
 
-  constructor({ metadata, chains, transports, session, authServerUrl, paymasterHandler, onSessionStateChange, skipPreTransactionStateValidation }: WalletProviderConstructorOptions) {
+  constructor({ metadata, chains, transports, session, authServerUrl, paymasterHandler, onSessionStateChange, skipPreTransactionStateValidation, customCommunicator, storage }: WalletProviderConstructorOptions) {
     super();
-    const communicator = new PopupCommunicator(authServerUrl || DEFAULT_AUTH_SERVER_URL);
+    const communicator = customCommunicator ?? new PopupCommunicator(authServerUrl || DEFAULT_AUTH_SERVER_URL);
     this.signer = new Signer({
       metadata: () => ({
         name: metadata?.name || getWebsiteName() || "Unknown DApp",
@@ -50,6 +54,7 @@ export class WalletProvider extends EventEmitter implements ProviderInterface {
       paymasterHandler,
       onSessionStateChange,
       skipPreTransactionStateValidation,
+      storage,
     });
   }
 

package/src/communicator/PopupCommunicator.ts

@@ -4,14 +4,29 @@ import type { Communicator, Message } from "./index.js";
 export interface PopupConfigMessage extends Message {
   event: "PopupLoaded" | "PopupUnload";
 }
+type PositionCalculator = (width: number, height: number) => { left: number; top: number };
 
 export class PopupCommunicator implements Communicator {
   private readonly url: URL;
   private popup: Window | null = null;
   private listeners = new Map<(_: MessageEvent) => void, { reject: (_: Error) => void }>();
 
-  constructor(url: string) {
+  private readonly width: number;
+  private readonly height: number;
+  private readonly calculatePosition?: PositionCalculator;
+
+  constructor(
+    url: string,
+    options?: {
+      width?: number;
+      height?: number;
+      calculatePosition?: PositionCalculator;
+    },
+  ) {
     this.url = new URL(url);
+    this.width = options?.width ?? 420;
+    this.height = options?.height ?? 600;
+    this.calculatePosition = options?.calculatePosition;
   }
 
   postMessage = async (message: Message) => {
@@ -64,14 +79,18 @@ export class PopupCommunicator implements Communicator {
   };
 
   openPopup = () => {
-    const width = 420;
-    const height = 600;
+    const width = this.width;
+    const height = this.height;
 
     const url = new URL(this.url.toString());
     url.searchParams.set("origin", window.location.origin);
 
-    const left = (window.innerWidth - width) / 2 + window.screenX;
-    const top = (window.innerHeight - height) / 2 + window.screenY;
+    const { left, top } = this.calculatePosition
+      ? this.calculatePosition(width, height)
+      : {
+          left: (window.innerWidth - width) / 2 + window.screenX,
+          top: (window.innerHeight - height) / 2 + window.screenY,
+        };
 
     const popup = window.open(
       url,

package/src/connector/index.ts

@@ -17,6 +17,7 @@ import {
 } from "viem";
 
 import type { ZksyncSsoSessionClient } from "../client/index.js";
+import type { Communicator } from "../communicator/interface.js";
 import { EthereumProviderError } from "../errors/errors.js";
 import { type AppMetadata, type ProviderInterface, type SessionPreferences, WalletProvider } from "../index.js";
 import type { CustomPaymasterHandler } from "../paymaster/index.js";
@@ -27,6 +28,7 @@ export type ZksyncSsoConnectorOptions = {
   session?: SessionPreferences | (() => SessionPreferences | Promise<SessionPreferences>);
   authServerUrl?: string;
   paymasterHandler?: CustomPaymasterHandler;
+  communicator?: Communicator;
 };
 
 export const zksyncSsoConnector = (parameters: ZksyncSsoConnectorOptions) => {
@@ -144,6 +146,7 @@ export const zksyncSsoConnector = (parameters: ZksyncSsoConnectorOptions) => {
           transports: config.transports,
           chains: config.chains,
           paymasterHandler: parameters.paymasterHandler,
+          customCommunicator: parameters.communicator,
         });
       }
       return walletProvider;

package/src/utils/storage.ts

@@ -1,4 +1,4 @@
-interface StorageLike {
+export interface StorageLike {
   getItem(key: string): string | null;
   setItem(key: string, value: string): void;
   removeItem(key: string): void;