feat(passport): ID-3844 - Migrate to Magic TEE

packages/internal/toolkit/src/crypto.ts

@@ -9,7 +9,7 @@ type SignatureOptions = {
 };
 
 // used to sign message with L1 keys. Used for registration
-function serializeEthSignature(sig: SignatureOptions): string {
+export function serializeEthSignature(sig: SignatureOptions): string {
   // This is because golang appends a recovery param
   // https://github.com/ethers-io/ethers.js/issues/823
   return encUtils.addHexPrefix(
@@ -29,7 +29,7 @@ function importRecoveryParam(v: string): number | undefined {
 }
 
 // used chained with serializeEthSignature. serializeEthSignature(deserializeSignature(...))
-function deserializeSignature(sig: string, size = 64): SignatureOptions {
+export function deserializeSignature(sig: string, size = 64): SignatureOptions {
   const removedHexPrefixSig = encUtils.removeHexPrefix(sig);
   return {
     r: new BN(removedHexPrefixSig.substring(0, size), 'hex'),

packages/passport/sdk/src/Passport.int.test.ts

@@ -206,12 +206,16 @@ describe('Passport', () => {
         });
 
         it('registers the user and returns the ether key', async () => {
+          mockGetUser.mockResolvedValueOnce(null);
           mockSigninPopup.mockResolvedValue(mockOidcUser);
           mockSigninSilent.mockResolvedValueOnce(mockOidcUserZkevm);
+          mockGetUser.mockResolvedValue(mockOidcUserZkevm);
           useMswHandlers([
             mswHandlers.rpcProvider.success,
             mswHandlers.counterfactualAddress.success,
             mswHandlers.api.chains.success,
+            mswHandlers.magicTee.personalSign.success,
+            mswHandlers.magicTee.createWallet.success,
           ]);
 
           const zkEvmProvider = await getZkEvmProvider();
@@ -221,18 +225,21 @@ describe('Passport', () => {
           });
 
           expect(accounts).toEqual([mockUserZkEvm.zkEvm.ethAddress]);
-          expect(mockGetUser).toHaveBeenCalledTimes(3);
+          expect(mockGetUser).toHaveBeenCalledTimes(2);
         });
 
         describe('when the registration request fails', () => {
           it('throws an error', async () => {
-            mockSigninPopup.mockResolvedValue(mockOidcUser);
             mockGetUser.mockResolvedValueOnce(null);
+            mockSigninPopup.mockResolvedValue(mockOidcUser);
             mockGetUser.mockResolvedValueOnce(mockOidcUser);
             mockSigninSilent.mockResolvedValue(mockOidcUser);
+            mockGetUser.mockResolvedValue(mockOidcUser);
             useMswHandlers([
               mswHandlers.counterfactualAddress.internalServerError,
               mswHandlers.api.chains.success,
+              mswHandlers.magicTee.personalSign.success,
+              mswHandlers.magicTee.createWallet.success,
             ]);
 
             const zkEvmProvider = await getZkEvmProvider();
@@ -254,6 +261,8 @@ describe('Passport', () => {
           mswHandlers.rpcProvider.success,
           mswHandlers.relayer.success,
           mswHandlers.guardian.evaluateTransaction.success,
+          mswHandlers.magicTee.personalSign.success,
+          mswHandlers.magicTee.createWallet.success,
         ]);
         mockMagicRequest.mockImplementation(({ method }: RequestArguments) => {
           switch (method) {
@@ -289,7 +298,7 @@ describe('Passport', () => {
         });
 
         expect(result).toEqual(transactionHash);
-        expect(mockGetUser).toHaveBeenCalledTimes(6);
+        expect(mockGetUser).toHaveBeenCalledTimes(7);
       });
 
       it('ethSigner is initialised if user logs in after connectEvm', async () => {
@@ -300,6 +309,8 @@ describe('Passport', () => {
           mswHandlers.rpcProvider.success,
           mswHandlers.relayer.success,
           mswHandlers.guardian.evaluateTransaction.success,
+          mswHandlers.magicTee.personalSign.success,
+          mswHandlers.magicTee.createWallet.success,
         ]);
         mockMagicRequest.mockImplementation(({ method }: RequestArguments) => {
           switch (method) {

packages/passport/sdk/src/Passport.ts

@@ -1,6 +1,6 @@
 import { IMXProvider } from '@imtbl/x-provider';
 import {
-  createConfig, ImxApiClients, imxApiConfig, MultiRollupApiClients,
+  createConfig, ImxApiClients, imxApiConfig, MagicTeeApiClients, MultiRollupApiClients,
 } from '@imtbl/generated-clients';
 import { IMXClient } from '@imtbl/x-client';
 import { Environment } from '@imtbl/config';
@@ -12,6 +12,7 @@ import {
 import { isAxiosError } from 'axios';
 import AuthManager from './authManager';
 import MagicAdapter from './magic/magicAdapter';
+import MagicTeeAdapter from './magic/magicTeeAdapter';
 import { PassportImxProviderFactory } from './starkEx';
 import { PassportConfiguration } from './config';
 import {
@@ -59,6 +60,13 @@ export const buildPrivateVars = (passportModuleConfiguration: PassportModuleConf
   const magicProviderProxyFactory = new MagicProviderProxyFactory(authManager, config);
   const magicAdapter = new MagicAdapter(config, magicProviderProxyFactory);
   const confirmationScreen = new ConfirmationScreen(config);
+  const magicTeeApiClients = new MagicTeeApiClients({
+    basePath: config.magicTeeBasePath,
+    timeout: config.magicTeeTimeout,
+    magicPublishableApiKey: config.magicPublishableApiKey,
+    magicProviderId: config.magicProviderId,
+  });
+  const magicTeeAdapter = new MagicTeeAdapter(authManager, magicTeeApiClients);
   const multiRollupApiClients = new MultiRollupApiClients(config.multiRollupConfig);
   const passportEventEmitter = new TypedEventEmitter<PassportEventMap>();
 
@@ -88,6 +96,7 @@ export const buildPrivateVars = (passportModuleConfiguration: PassportModuleConf
     config,
     authManager,
     magicAdapter,
+    magicTeeAdapter,
     confirmationScreen,
     immutableXClient,
     multiRollupApiClients,
@@ -108,6 +117,8 @@ export class Passport {
 
   private readonly magicAdapter: MagicAdapter;
 
+  private readonly magicTeeAdapter: MagicTeeAdapter;
+
   private readonly multiRollupApiClients: MultiRollupApiClients;
 
   private readonly passportImxProviderFactory: PassportImxProviderFactory;
@@ -122,6 +133,7 @@ export class Passport {
     this.config = privateVars.config;
     this.authManager = privateVars.authManager;
     this.magicAdapter = privateVars.magicAdapter;
+    this.magicTeeAdapter = privateVars.magicTeeAdapter;
     this.confirmationScreen = privateVars.confirmationScreen;
     this.immutableXClient = privateVars.immutableXClient;
     this.multiRollupApiClients = privateVars.multiRollupApiClients;
@@ -154,19 +166,27 @@ export class Passport {
    * Connects to EVM and optionally announces the provider.
    * @param {Object} options - Configuration options
    * @param {boolean} options.announceProvider - Whether to announce the provider via EIP-6963 for wallet discovery (defaults to true)
-   * @returns {Provider} The EVM provider instance
+   * @returns {Promise<Provider>} The EVM provider instance
    */
-  public connectEvm(options: {
+  public async connectEvm(options: {
     announceProvider: boolean
   } = { announceProvider: true }): Promise<Provider> {
     return withMetricsAsync(async () => {
+      let user: User | null = null;
+      try {
+        user = await this.authManager.getUser();
+      } catch (error) {
+        // Initialise the zkEvmProvider without a user
+      }
+
       const provider = new ZkEvmProvider({
         passportEventEmitter: this.passportEventEmitter,
         authManager: this.authManager,
-        magicAdapter: this.magicAdapter,
+        magicTeeAdapter: this.magicTeeAdapter,
         config: this.config,
         multiRollupApiClients: this.multiRollupApiClients,
         guardianClient: this.guardianClient,
+        user,
       });
 
       if (options?.announceProvider) {

packages/passport/sdk/src/config/config.ts

@@ -38,6 +38,10 @@ export class PassportConfiguration {
 
   readonly magicProviderId: string;
 
+  readonly magicTeeBasePath: string = 'https://tee.express.magiclabs.com';
+
+  readonly magicTeeTimeout: number = 6000;
+
   readonly oidcConfiguration: OidcConfiguration;
 
   readonly baseConfig: ImmutableConfiguration;