feat: add initial smart wallet client actions

Author: moldy530

account-kit/core/package.json

@@ -32,6 +32,11 @@
       "import": "./dist/esm/environments/web/index.js",
       "default": "./dist/esm/environments/web/index.js"
     },
+    "./experimental": {
+      "types": "./dist/types/experimental/index.d.ts",
+      "import": "./dist/esm/experimental/index.js",
+      "default": "./dist/esm/experimental/index.js"
+    },
     "./package.json": "./package.json"
   },
   "scripts": {
@@ -54,6 +59,7 @@
     "@account-kit/react-native-signer": "^4.35.1",
     "@account-kit/signer": "^4.35.1",
     "@account-kit/smart-contracts": "^4.35.1",
+    "@account-kit/wallet-client": "^0.1.0-alpha.4",
     "@solana/web3.js": "^1.98.0",
     "js-cookie": "^3.0.5",
     "zod": "^3.22.4",

account-kit/core/src/actions/createAccount.ts

@@ -2,26 +2,27 @@ import {
   createLightAccount,
   createMultiOwnerLightAccount,
   createMultiOwnerModularAccount,
-  createModularAccountV2,
   type CreateLightAccountParams,
+  type CreateModularAccountV2Params,
   type CreateMultiOwnerLightAccountParams,
   type CreateMultiOwnerModularAccountParams,
   type LightAccountVersion,
-  type CreateModularAccountV2Params,
 } from "@account-kit/smart-contracts";
-import { custom, type Transport } from "viem";
-import { ClientOnlyPropertyError } from "../errors.js";
+import type { SmartWalletClient } from "@account-kit/wallet-client";
+import { custom, toHex, type Transport } from "viem";
+import { ClientOnlyPropertyError, SignerNotConnectedError } from "../errors.js";
+import { getSmartWalletClient } from "../experimental/actions/getSmartWalletClient.js";
 import { CoreLogger } from "../metrics.js";
 import type {
   AlchemyAccountsConfig,
   AlchemySigner,
   SupportedAccountTypes,
   SupportedAccounts,
 } from "../types.js";
+import type { GetAccountParams } from "./getAccount";
 import { getBundlerClient } from "./getBundlerClient.js";
 import { getSigner } from "./getSigner.js";
 import { getSignerStatus } from "./getSignerStatus.js";
-import type { GetAccountParams } from "./getAccount";
 
 type OmitSignerTransportChain<T> = Omit<T, "signer" | "transport" | "chain">;
 
@@ -93,8 +94,9 @@ export async function createAccount<TAccount extends SupportedAccountTypes>(
   const signerStatus = getSignerStatus(config);
 
   if (!signerStatus.isConnected || !signer) {
-    throw new Error("Signer not connected");
+    throw new SignerNotConnectedError();
   }
+  const smartWalletClient = getSmartWalletClient(config);
 
   const cachedAccount = accounts[chain.id]?.[params.type];
   if (cachedAccount.status !== "RECONNECTING" && cachedAccount.account) {
@@ -154,22 +156,23 @@ export async function createAccount<TAccount extends SupportedAccountTypes>(
         return account;
       });
     } else if (isModularV2AccountParams(params)) {
-      return createModularAccountV2({
-        ...accountConfigs[chain.id]?.[params.type],
-        ...params.accountParams,
-        signer,
-        transport: (opts) => transport({ ...opts, retryCount: 0 }),
-        chain,
-      }).then((account) => {
-        CoreLogger.trackEvent({
-          name: "account_initialized",
-          data: {
-            accountType: "ModularAccountV2",
-            accountVersion: "v2.0.0",
-          },
+      // TODO: we can probably do away with some of the if-else logic here and just convert the params to creation hints
+      // and pass them to the client
+      return smartWalletClient
+        .requestAccount({
+          accountAddress: params.accountParams?.accountAddress,
+          creationHint: convertAccountParamsToCreationHint(params),
+        })
+        .then((account) => {
+          CoreLogger.trackEvent({
+            name: "account_initialized",
+            data: {
+              accountType: "ModularAccountV2",
+              accountVersion: "v2.0.0",
+            },
+          });
+          return account as SupportedAccounts;
         });
-        return account;
-      });
     } else {
       throw new Error(`Unsupported account type: ${params.type}`);
     }
@@ -243,6 +246,27 @@ export async function createAccount<TAccount extends SupportedAccountTypes>(
   return accountPromise;
 }
 
+function convertAccountParamsToCreationHint<
+  TAccount extends SupportedAccountTypes,
+>(
+  params: CreateAccountParams<TAccount>,
+): NonNullable<
+  Parameters<SmartWalletClient["requestAccount"]>["0"]
+>["creationHint"] {
+  if (isModularV2AccountParams(params)) {
+    return params.accountParams?.mode === "7702"
+      ? { accountType: "7702" }
+      : {
+          accountType: "sma-b",
+          ...params.accountParams,
+          // @ts-expect-error salt is defined by TS can't figure that out here
+          salt: toHex(params.accountParams?.salt ?? 0n),
+        };
+  }
+
+  throw new Error("account not supported yet");
+}
+
 export const isModularV2AccountParams = (
   params: CreateAccountParams<SupportedAccountTypes>,
 ): params is GetAccountParams<"ModularAccountV2"> => {

account-kit/core/src/actions/getSmartAccountClient.ts

@@ -1,3 +1,4 @@
+import { default7702GasEstimator, default7702UserOpSigner } from "@aa-sdk/core";
 import {
   createAlchemySmartAccountClient,
   type AlchemySmartAccountClient,
@@ -12,28 +13,27 @@ import {
   type AccountLoupeActions,
   type LightAccount,
   type LightAccountClientActions,
+  type ModularAccountV2,
   type MultiOwnerLightAccount,
   type MultiOwnerLightAccountClientActions,
   type MultiOwnerModularAccount,
   type MultiOwnerPluginActions,
   type PluginManagerActions,
-  type ModularAccountV2,
 } from "@account-kit/smart-contracts";
 import type { Address, Chain } from "viem";
 import type {
   AlchemyAccountsConfig,
   AlchemySigner,
+  Connection,
   SupportedAccount,
   SupportedAccounts,
   SupportedAccountTypes,
-  Connection,
 } from "../types";
 import { createAccount, isModularV2AccountParams } from "./createAccount.js";
 import { getAccount, type GetAccountParams } from "./getAccount.js";
 import { getAlchemyTransport } from "./getAlchemyTransport.js";
 import { getConnection } from "./getConnection.js";
 import { getSignerStatus } from "./getSignerStatus.js";
-import { default7702GasEstimator, default7702UserOpSigner } from "@aa-sdk/core";
 
 export type GetSmartAccountClientParams<
   TChain extends Chain | undefined = Chain | undefined,
@@ -77,6 +77,7 @@ export function getSmartAccountClient<
 ): GetSmartAccountClientResult<TChain, SupportedAccount<TAccount>>;
 
 /**
+ * @deprecated Use `getSmartWalletClient` instead.
  * Obtains a smart account client based on the provided parameters and configuration. Supports creating any of the SupportAccountTypes in Account Kit.
  * If the signer is not connected, or an account is already being intializes, this results in a loading state.
  *
@@ -178,6 +179,7 @@ export function getSmartAccountClient(
     return clientState;
   }
 
+  // TODO: this needs to be updated to use the smart wallet client instead
   const newState = (() => {
     switch (account.source) {
       case "LightAccount":

account-kit/core/src/createConfig.ts

@@ -1,6 +1,7 @@
 import { DEFAULT_SESSION_MS } from "@account-kit/signer";
 import { createStorage, createConfig as createWagmiConfig } from "@wagmi/core";
 import { getBundlerClient } from "./actions/getBundlerClient.js";
+import { createSigner as createWebSigner } from "./environments/web/createSigner.js";
 import { CoreLogger } from "./metrics.js";
 import { createAccountKitStore } from "./store/store.js";
 import { DEFAULT_STORAGE_KEY } from "./store/types.js";
@@ -9,7 +10,6 @@ import {
   type Connection,
   type CreateConfigProps,
 } from "./types.js";
-import { createSigner as createWebSigner } from "./environments/web/createSigner.js";
 
 export const DEFAULT_IFRAME_CONTAINER_ID = "alchemy-signer-iframe-container";
 
@@ -115,6 +115,7 @@ export const createConfig = (
 
   const config: AlchemyAccountsConfig = {
     store: store,
+    accountCreationHint: params.accountCreationHint,
     _internal: {
       ssr,
       createSigner: createSigner ?? createWebSigner, // <-- Default to web signer if not provided

account-kit/core/src/errors.ts

@@ -53,3 +53,13 @@ export class ChainNotFoundError extends BaseError {
     });
   }
 }
+
+export class SignerNotConnectedError extends BaseError {
+  name: string = "SignerNotConnectedError";
+
+  constructor() {
+    super(
+      "Signer not connected. Authenticate the user before calling this function",
+    );
+  }
+}

account-kit/core/src/experimental/README.md

@@ -0,0 +1,3 @@
+# Experimental
+
+This experimental namespace is meant to contain actions and other core logic that consumes Wallet APIs. These will replace the usual flow found within this repo

account-kit/core/src/experimental/actions/getSmartWalletClient.ts

@@ -0,0 +1,76 @@
+import {
+  createSmartWalletClient,
+  type SmartWalletClient,
+} from "@account-kit/wallet-client";
+import type { Address, IsUndefined, JsonRpcAccount } from "viem";
+import { getAlchemyTransport } from "../../actions/getAlchemyTransport.js";
+import { getConnection } from "../../actions/getConnection.js";
+import { getSigner } from "../../actions/getSigner.js";
+import { getSignerStatus } from "../../actions/getSignerStatus.js";
+import { SignerNotConnectedError } from "../../errors.js";
+import type { AlchemyAccountsConfig } from "../../types.js";
+
+export type GetSmartWalletClientResult<
+  TAccount extends JsonRpcAccount<Address> | undefined =
+    | JsonRpcAccount<`0x${string}`>
+    | undefined,
+> = SmartWalletClient<TAccount>;
+
+export type GetSmartWalletClientParams<
+  TAccount extends JsonRpcAccount<Address> | undefined =
+    | JsonRpcAccount<Address>
+    | undefined,
+> = { mode?: "local" | "remote" } & (IsUndefined<TAccount> extends true
+  ? { account?: never }
+  : { account: Address });
+
+export function getSmartWalletClient<
+  TAccount extends JsonRpcAccount<Address> | undefined =
+    | JsonRpcAccount<Address>
+    | undefined,
+>(
+  config: AlchemyAccountsConfig,
+  params?: GetSmartWalletClientParams<TAccount>,
+): GetSmartWalletClientResult<TAccount>;
+
+export function getSmartWalletClient(
+  config: AlchemyAccountsConfig,
+  params?: GetSmartWalletClientParams,
+): GetSmartWalletClientResult {
+  const connection = getConnection(config);
+  const signerStatus = getSignerStatus(config);
+  const transport = getAlchemyTransport(config);
+  const signer = getSigner(config);
+
+  if (!signer || !signerStatus.isConnected) {
+    throw new SignerNotConnectedError();
+  }
+
+  const smartWalletClient =
+    config.store.getState().smartWalletClients[connection.chain.id];
+
+  if (smartWalletClient) {
+    return smartWalletClient;
+  }
+
+  // TODO: should we still cache the client like we used to?
+  // honestly that probably caused more problems than it solved
+  // TBD actually, we might store it in the store so we don't run into issues
+  // with react
+  const client = createSmartWalletClient({
+    transport,
+    chain: connection.chain,
+    signer,
+    account: params?.account,
+    mode: params?.mode ?? "local",
+  });
+
+  config.store.setState((state) => ({
+    smartWalletClients: {
+      ...state.smartWalletClients,
+      [connection.chain.id]: client,
+    },
+  }));
+
+  return client;
+}

account-kit/core/src/experimental/actions/watchSmartWalletClient.ts

@@ -0,0 +1,21 @@
+import type { AlchemyAccountsConfig } from "../../types";
+import {
+  getSmartWalletClient,
+  type GetSmartWalletClientResult,
+} from "./getSmartWalletClient.js";
+
+export function watchSmartWalletClient(config: AlchemyAccountsConfig) {
+  return (onChange: (client: GetSmartWalletClientResult) => void) => {
+    return config.store.subscribe(
+      ({ signerStatus, chain }) => ({ signerStatus, chain }),
+      () => {
+        onChange(getSmartWalletClient(config));
+      },
+      {
+        equalityFn(a, b) {
+          return a.signerStatus === b.signerStatus && a.chain === b.chain;
+        },
+      },
+    );
+  };
+}

account-kit/core/src/experimental/index.ts

@@ -0,0 +1,4 @@
+export type * from "./actions/getSmartWalletClient.js";
+export { getSmartWalletClient } from "./actions/getSmartWalletClient.js";
+export type * from "./actions/watchSmartWalletClient.js";
+export { watchSmartWalletClient } from "./actions/watchSmartWalletClient.js";

account-kit/core/src/store/store.ts

@@ -5,6 +5,7 @@ import {
   AlchemyWebSigner,
   type ErrorInfo,
 } from "@account-kit/signer";
+import { Connection as SolanaWeb3Connection } from "@solana/web3.js";
 import type { Chain } from "viem";
 import {
   createJSONStorage,
@@ -25,7 +26,6 @@ import {
   type Store,
   type StoreState,
 } from "./types.js";
-import { Connection as SolanaWeb3Connection } from "@solana/web3.js";
 
 export const STORAGE_VERSION = 14;
 
@@ -137,6 +137,9 @@ export const createAccountKitStore = (
                 smartAccountClients: createEmptySmartAccountClientState(
                   connections.map((c) => c.chain),
                 ),
+                smartWalletClients: createEmptySmartWalletClientState(
+                  connections.map((c) => c.chain),
+                ),
                 connections: connectionsMap,
                 solana: params.solana,
                 bundlerClient: createAlchemyPublicRpcClient({
@@ -188,6 +191,7 @@ const createInitialStoreState = (
       undefined,
     ),
     smartAccountClients: createEmptySmartAccountClientState(chains),
+    smartWalletClients: createEmptySmartWalletClientState(chains),
   };
 
   if ("solana" in params && params.solana) {
@@ -395,6 +399,16 @@ export const createEmptySmartAccountClientState = (chains: Chain[]) => {
   );
 };
 
+export const createEmptySmartWalletClientState = (chains: Chain[]) => {
+  return chains.reduce(
+    (acc, chain) => {
+      acc[chain.id] = undefined;
+
+      return acc;
+    },
+    {} as StoreState["smartWalletClients"],
+  );
+};
 const deepEquals = (obj1: any, obj2: any) => {
   if (typeof obj1 !== typeof obj2) return false;
   if (typeof obj1 !== "object") return obj1 === obj2;

account-kit/core/src/store/types.ts

@@ -6,6 +6,7 @@ import type {
   ErrorInfo,
   User,
 } from "@account-kit/signer";
+import type { SmartWalletClient } from "@account-kit/wallet-client";
 import type { State as WagmiState } from "@wagmi/core";
 import type { Address, Chain } from "viem";
 import type { PartialBy } from "viem/chains";
@@ -94,6 +95,9 @@ export type StoreState = {
       >;
     }>;
   };
+  smartWalletClients: {
+    [chain: number]: SmartWalletClient | undefined;
+  };
   bundlerClient: ClientWithAlchemyMethods;
   // serializable state
   // NOTE: in some cases this can be serialized to cookie storage