feat/PRO-2416/upgrade-prime-modular-accounts

CHANGELOG.md

@@ -5,11 +5,10 @@
 ### Added Changes
 - `getSDK` include a param to choose to instantiate the Prime SDK instead of the Modular SDK
 - Added Etherspot Modular SDK `installModule` and `uninstallModule` to hook `useEtherspotModules`
-- `EtherspotContextProvider` updated with choice of instantiatiating the Prime SDK or Modular SDK
 - Added `isModular` to context `EtherspotContextProvider`
 
 ### Breaking Changes
-- Etherspot Modular SDK implemented to Transaction Kit as the default SDK
+- Etherspot Modular SDK implemented to Transaction Kit as the default `accountTemplate`
 - The account template in the `EtherspotTransactionKit` component, can only be 'etherspot' if `moddular` is true.
 
 ## [0.12.1] - 2024-05-22

__mocks__/@etherspot/modular-sdk.js

@@ -1,9 +1,9 @@
 import * as EtherspotModular from '@etherspot/modular-sdk';
 import { ethers } from 'ethers';
 
-export const defaultAccountAddress = '0x7F30B1960D5556929B03a0339814fE903c55a347';
-export const otherFactoryDefaultAccountAddress = '0xe383724e3bDC4753746dEC781809f8CD82010914';
-export const otherAccountAddress = '0xAb4C67d8D7B248B2fA6B638C645466065fE8F1F1';
+export const defaultAccountAddressModular = '0x7F30B1960D5556929B03a0339814fE903c55a347';
+export const otherFactoryDefaultAccountAddressModular = '0xe383724e3bDC4753746dEC781809f8CD82010914';
+export const otherAccountAddressModular = '0xAb4C67d8D7B248B2fA6B638C645466065fE8F1F1';
 
 export class ModularSdk {
   sdkChainId;
@@ -17,10 +17,10 @@ export class ModularSdk {
   }
 
   getCounterFactualAddress() {
-    if (this.factoryWallet === Factory.ETHERSPOT) {
-      return defaultAccountAddress;
+    if (this.factoryWallet === 'etherspotModular') {
+      return defaultAccountAddressModular;
     }
-    return otherFactoryDefaultAccountAddress;
+    return otherFactoryDefaultAccountAddressModular;
   }
 
   async clearUserOpsFromBatch() {
@@ -64,7 +64,7 @@ export class ModularSdk {
     });
 
     return {
-      sender: defaultAccountAddress,
+      sender: defaultAccountAddressModular,
       nonce: this.nonce,
       initCode: '0x001',
       callData: '0x002',
@@ -102,32 +102,32 @@ export class ModularSdk {
   }
 
   async installModule(moduleType, module, initData, accountAddress) {
-    if (!accountAddress && !defaultAccountAddress) {
-      return 'No account address provided!'
+    if (!accountAddress && !defaultAccountAddressModular) {
+      throw new Error('No account address provided!')
     }
 
     if (!moduleType || !module) {
-      return 'installModule props missing'
+      throw new Error('installModule props missing')
     }
 
     if (module === '0x222') {
-      return 'module is already installed'
+      throw new Error('module is already installed')
     }
 
     return '0x123';
   }
 
   async uninstallModule(moduleType, module, deinitData, accountAddress) {
     if (module === '0x222') {
-      return 'module is not installed'
+      throw new Error('module is not installed')
      }
 
-    if (!accountAddress && !defaultAccountAddress) {
-      return 'No account address provided!'
+    if (!accountAddress && !defaultAccountAddressModular) {
+      throw new Error('No account address provided!')
     }
 
     if (!moduleType || !module || !deinitData) {
-     return 'uninstallModule props missing'
+      throw new Error('uninstallModule props missing')
     }
 
     return '0x456';

__tests__/hooks/useEtherspotModules.test.js

@@ -35,11 +35,20 @@ describe('useEtherspotModules()', () => {
     // wait for balances to be fetched for chain ID 1
     await waitFor(() => expect(result.current).not.toBeNull());
 
-    const installOneModuleProps = await result.current.installModule(MODULE_TYPE.VALIDATOR);
-    expect(installOneModuleProps).toBe('installModule props missing')
+    const installModuleMissingProps = await result.current.installModule(MODULE_TYPE.VALIDATOR)
+    .catch((e) => {
+      console.error(e);
+      return `${e}`
+    })
+    expect(installModuleMissingProps).toBe('Error: Failed to install module: Error: installModule props missing');
 
-    const installOneModuleAlreadyInstalled = await result.current.installModule(MODULE_TYPE.VALIDATOR, '0x222');
-    expect(installOneModuleAlreadyInstalled).toBe('module is already installed')
+    const installModuleAlreadyInstalled = await result.current.installModule(MODULE_TYPE.VALIDATOR, '0x222')
+    .catch((e) => {
+      console.error(e);
+      return `${e}`
+    })
+
+    expect(installModuleAlreadyInstalled).toBe('Error: Failed to install module: Error: module is already installed');
 
     const installOneModule = await result.current.installModule(MODULE_TYPE.VALIDATOR, moduleAddress, initData);
     expect(installOneModule).toBe('0x123')
@@ -60,15 +69,25 @@ describe('useEtherspotModules()', () => {
     // wait for balances to be fetched for chain ID 1
     await waitFor(() => expect(result.current).not.toBeNull());
 
-    const uninstallOneModuleNotInstalled = await result.current.uninstallModule(MODULE_TYPE.VALIDATOR, '0x222', deInitData);
-    expect(uninstallOneModuleNotInstalled).toBe('module is not installed');
+    const uninstallModuleNotInstalled = await result.current.uninstallModule(MODULE_TYPE.VALIDATOR, '0x222', deInitData)
+    .catch((e) => {
+      console.error(e);
+      return `${e}`
+    })
+
+    expect(uninstallModuleNotInstalled).toBe('Error: Failed to uninstall module: Error: module is not installed');
 
     const installOneModule = await result.current.installModule(MODULE_TYPE.VALIDATOR, moduleAddress, initData);
     expect(installOneModule).toBe('0x123');
 
-    const uninstallOneModuleProps = await result.current.uninstallModule(moduleAddress);
-    expect(uninstallOneModuleProps).toBe('uninstallModule props missing');
-
+    const uninstallModulePropsMissing = await result.current.uninstallModule(moduleAddress)
+    .catch((e) => {
+      console.error(e);
+      return `${e}`
+    })
+    expect(uninstallModulePropsMissing).toBe('Error: Failed to uninstall module: Error: uninstallModule props missing');
+
+
     const uninstallOneModule = await result.current.uninstallModule(MODULE_TYPE.VALIDATOR, moduleAddress, deInitData);
     expect(uninstallOneModule).toBe('0x456');
 

__tests__/hooks/useWalletAddress.test.js

@@ -5,7 +5,7 @@ import { Factory } from '@etherspot/prime-sdk';
 // hooks
 import { EtherspotTransactionKit, useWalletAddress } from '../../src';
 import {
-  defaultAccountAddress as modularDefaultAccountAddress,
+  defaultAccountAddressModular,
 } from '../../__mocks__/@etherspot/modular-sdk';
 import {
   defaultAccountAddress,
@@ -20,7 +20,7 @@ const providerWalletAddress = provider.address;
 describe('useWalletAddress()', () => {
   it('returns default type wallet address if no provided type', async () => {
     const wrapper = ({ children }) => (
-      <EtherspotTransactionKit provider={provider} modular={false}>
+      <EtherspotTransactionKit provider={provider} accountTemplate='etherspot'>
         {children}
       </EtherspotTransactionKit>
     );
@@ -44,10 +44,10 @@ describe('useWalletAddress()', () => {
     });
 
     await waitFor(() => expect(result.current).not.toBe(undefined));
-    expect(result.current).toEqual(modularDefaultAccountAddress);
+    expect(result.current).toEqual(defaultAccountAddressModular);
 
     rerender({ providerType: 'provider' });
-    await waitFor(() => expect(result.current).not.toBe(modularDefaultAccountAddress));
+    await waitFor(() => expect(result.current).not.toBe(defaultAccountAddressModular));
     expect(result.current).toEqual(providerWalletAddress);
   });
 
@@ -64,27 +64,27 @@ describe('useWalletAddress()', () => {
     });
 
     await waitFor(() => expect(result.current).not.toBe(undefined));
-    expect(result.current).toEqual(modularDefaultAccountAddress);
+    expect(result.current).toEqual(defaultAccountAddressModular);
 
     rerender({ providerType: 'whatever' });
     await waitFor(() => expect(result.current).toBe(undefined));
   });
 
   it('returns different wallet address when account template provided', async () => {
     const createWrapper = ({ accountTemplate } = {}) => ({ children }) => (
-      <EtherspotTransactionKit provider={provider} accountTemplate={accountTemplate} modular={false}>
+      <EtherspotTransactionKit provider={provider} accountTemplate={accountTemplate}>
         {children}
       </EtherspotTransactionKit>
     );
 
-    const { result: resultNoAccountTemplate } = renderHook(() => useWalletAddress(undefined, undefined, false), {
+    const { result: resultNoAccountTemplate } = renderHook(() => useWalletAddress(), {
       wrapper: createWrapper(),
     });
 
     await waitFor(() => expect(resultNoAccountTemplate.current).not.toBe(undefined));
-    expect(resultNoAccountTemplate.current).toEqual(defaultAccountAddress);
+    expect(resultNoAccountTemplate.current).toEqual(defaultAccountAddressModular);
 
-    const { result: resultWithAccountTemplate } = renderHook(() => useWalletAddress(undefined, undefined, false), {
+    const { result: resultWithAccountTemplate } = renderHook(() => useWalletAddress(), {
       wrapper: createWrapper({ accountTemplate: Factory.SIMPLE_ACCOUNT }),
     });
 

example/src/App.tsx

@@ -29,6 +29,8 @@ const tabs = {
   MULTIPLE_TRANSACTIONS: 'MULTIPLE_TRANSACTIONS',
 };
 
+const testModuleSepoliaTestnet = '0x6a00da4DEEf677Ad854B7c14F17Ed9312c2B5fDf';
+
 const CodePreview = ({ code }: { code: string }) => (
   <Paper>
     <pre style={{ margin: '40px 0 40px', padding: '0 15px' }}>
@@ -163,11 +165,11 @@ const App = () => {
   );
 
   const onInstallModuleClick = async () => {
-    await installModule(MODULE_TYPE.VALIDATOR, '0x6a00da4DEEf677Ad854B7c14F17Ed9312c2B5fDf');
+    await installModule(MODULE_TYPE.VALIDATOR, testModuleSepoliaTestnet);
   }
 
   const onUninstallModuleClick = async () => {
-    await uninstallModule(MODULE_TYPE.VALIDATOR, '0x6a00da4DEEf677Ad854B7c14F17Ed9312c2B5fDf', deInitData)
+    await uninstallModule(MODULE_TYPE.VALIDATOR, testModuleSepoliaTestnet, deInitData)
   }
 
   useEffect(() => {

src/components/EtherspotTransactionKit.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import { WalletProviderLike, Factory } from '@etherspot/prime-sdk';
-import { WalletProviderLike as WalletProviderLikeModular, Factory as ModularFactory } from '@etherspot/modular-sdk';
+import { WalletProviderLike } from '@etherspot/prime-sdk';
+import { WalletProviderLike as WalletProviderLikeModular} from '@etherspot/modular-sdk';
 
 // types
 import { AccountTemplate } from '../types/EtherspotTransactionKit';
@@ -9,14 +9,12 @@ import { AccountTemplate } from '../types/EtherspotTransactionKit';
 import EtherspotTransactionKitContextProvider from '../providers/EtherspotTransactionKitContextProvider';
 import ProviderWalletContextProvider from '../providers/ProviderWalletContextProvider';
 import EtherspotContextProvider from '../providers/EtherspotContextProvider';
-
 interface EtherspotTransactionKitProps extends React.PropsWithChildren {
   provider: WalletProviderLike | WalletProviderLikeModular;
   chainId?: number;
   accountTemplate?: AccountTemplate;
   dataApiKey?: string;
   bundlerApiKey?: string;
-  modular?: boolean;
 }
 
 const EtherspotTransactionKit = ({
@@ -26,44 +24,35 @@ const EtherspotTransactionKit = ({
   accountTemplate,
   dataApiKey,
   bundlerApiKey,
-  modular = true,
 }: EtherspotTransactionKitProps) => {
-  let accountTemp;
+  let accountTemp: AccountTemplate;
 
-  if (accountTemplate) {
-    switch (accountTemplate) {
-      case 'zeroDev':
-        if (!modular) {
-          accountTemp = Factory.ZERO_DEV;
-        } else {
-          console.warn('You cannot use a ZeroDev Account template with the modular functionality.');
-        }
-        break;
-      case 'simpleAccount':
-        if (!modular) {
-          accountTemp = Factory.SIMPLE_ACCOUNT;
-        } else {
-          console.warn('You cannot use a Simple Account template with the modular functionality.');
-        }
-        break;
-      case 'etherspot':
-        accountTemp = modular ? ModularFactory.ETHERSPOT : Factory.ETHERSPOT;
-        break;
-      default:
-        console.warn('This account template cannot be used:', accountTemplate);
-    }
-  } else {
-    accountTemp = modular ? ModularFactory.ETHERSPOT : Factory.ETHERSPOT;
+  switch (accountTemplate) {
+    case 'etherspotModular':
+      accountTemp = 'etherspotModular';
+      break;
+    case 'etherspot':
+      accountTemp = 'etherspot';
+      break;
+    case 'simpleAccount':
+      accountTemp = 'simpleAccount';
+      break;
+    case 'zeroDev':
+      accountTemp = 'zeroDev';
+      break;
+    default:
+      accountTemp = 'etherspotModular';
+      break;
   }
-  
+
   return (
   <EtherspotContextProvider
     provider={provider}
     chainId={+chainId} // cast to make it less failproof when passed as string, i.e. from env file
     accountTemplate={accountTemp}
     dataApiKey={dataApiKey}
     bundlerApiKey={bundlerApiKey}
-    isModular={modular}
+    isModular={accountTemp === 'etherspotModular' && true}
   >
     <EtherspotTransactionKitContextProvider>
       <ProviderWalletContextProvider>

src/contexts/EtherspotContext.tsx

@@ -4,7 +4,7 @@ import { ModularSdk, WalletProviderLike as WalletProviderLikeModular } from '@et
 
 export interface EtherspotContextData {
   data: {
-    getSdk: (modular?: boolean, chainId?: number, forceNewInstance?: boolean) => Promise<ModularSdk | PrimeSdk>;
+    getSdk: (chainId?: number, forceNewInstance?: boolean) => Promise<ModularSdk | PrimeSdk>;
     getDataService: () => DataUtils;
     provider: WalletProviderLike | WalletProviderLikeModular | null | undefined;
     chainId: number;

src/hooks/useEtherspotBalances.ts

@@ -13,7 +13,7 @@ interface IEtherspotBalancesHook {
  * @param chainId {number | undefined} - Chain ID
  * @returns {IEtherspotBalancesHook} - hook method to fetch Etherspot account balances
  */
-const useEtherspotBalances = (chainId?: number, modular: boolean = true): IEtherspotBalancesHook => {
+const useEtherspotBalances = (chainId?: number): IEtherspotBalancesHook => {
   const { getDataService, getSdk, chainId: etherspotChainId } = useEtherspot();
 
   const defaultChainId = useMemo(() => {
@@ -25,7 +25,7 @@ const useEtherspotBalances = (chainId?: number, modular: boolean = true): IEther
     accountAddress?: string,
     balancesChainId: number = defaultChainId,
   ) => {
-    const sdkForChainId = await getSdk(modular, balancesChainId);
+    const sdkForChainId = await getSdk(balancesChainId);
 
     const balancesForAccount = accountAddress ?? await sdkForChainId.getCounterFactualAddress();
     if (!balancesForAccount) {

src/hooks/useEtherspotHistory.ts

@@ -23,7 +23,7 @@ interface IEtherspotHistoryHook {
  * @param chainId {number | undefined} - Chain ID
  * @returns {IEtherspotHistoryHook} - hook methods to fetch Etherspot transactions history
  */
-const useEtherspotHistory = (chainId?: number, modular: boolean = true): IEtherspotHistoryHook => {
+const useEtherspotHistory = (chainId?: number): IEtherspotHistoryHook => {
   const { getDataService, getSdk, chainId: etherspotChainId } = useEtherspot();
 
   const defaultChainId = useMemo(() => {
@@ -35,7 +35,7 @@ const useEtherspotHistory = (chainId?: number, modular: boolean = true): IEthers
     accountAddress?: string,
     historyChainId: number = defaultChainId
   ): Promise<UserOpTransaction[]> => {
-    const sdkForChainId = await getSdk(modular, historyChainId);
+    const sdkForChainId = await getSdk(historyChainId);
 
     let transactions: UserOpTransaction[] = [];