docs: update migration docs after alchemy transport (#998)

* docs: update migration docs after alchemy transport * docs: apply PR feedback to migration guide Co-authored-by: Rohan Thomare <3498866+rthomare@users.noreply.github.com> --------- Co-authored-by: Rohan Thomare <3498866+rthomare@users.noreply.github.com>
alchemyplatform · Oct 1, 2024 · 4beea3a · 4beea3a
1 parent 4afe428
commit 4beea3a
Show file tree

Hide file tree

Showing 9 changed files with 53 additions and 39 deletions.
diff --git a/account-kit/core/src/hydrate.ts b/account-kit/core/src/hydrate.ts
@@ -41,8 +41,7 @@ export function hydrate(
       : initialState;
 
   if (initialAlchemyState && !config.store.persist.hasHydrated()) {
-    const { accountConfigs, signerStatus, bundlerClient, ...rest } =
-      initialAlchemyState;
+    const { accountConfigs, signerStatus, ...rest } = initialAlchemyState;
     const shouldReconnectAccounts =
       signerStatus.isConnected || signerStatus.isAuthenticating;
 

diff --git a/account-kit/core/src/store/types.ts b/account-kit/core/src/store/types.ts
@@ -58,9 +58,7 @@ export type SignerStatus = {
 };
 
 export type StoredState = {
-  alchemy: Omit<StoreState, "signer" | "accounts" | "bundlerClient"> & {
-    bundlerClient: { connection: Connection };
-  };
+  alchemy: Omit<StoreState, "signer" | "accounts" | "bundlerClient">;
   wagmi?: WagmiState;
 };
 

diff --git a/site/pages/core/multi-chain-apps.mdx b/site/pages/core/multi-chain-apps.mdx
@@ -13,10 +13,11 @@ In order to support multiple chains in your app, the first thing you need to do
 
 ```ts twoslash
 import { createConfig } from "@account-kit/core";
-import { sepolia, mainnet } from "@account-kit/infra";
+import { sepolia, mainnet, alchemy } from "@account-kit/infra";
 
 export const config = createConfig({
-  apiKey: "ALCHEMY_API_KEY",
+  // use this transport for all chains
+  transport: alchemy({ apiKey: "ALCHEMY_API_KEY" }),
   // this is the default chain
   chain: sepolia,
   chains: [
@@ -27,6 +28,8 @@ export const config = createConfig({
     },
     {
       chain: sepolia,
+      // optional: override the default transport for this chain
+      transport: alchemy({ apiKey: "OTHER_API_KEY" }),
       // optional: sponsor gas for this chain
       policyId: "SEPOLIA_GAS_MANAGER_POLICY_ID",
     },
@@ -55,10 +58,10 @@ await setChain(config, mainnet);
 
 ```ts twoslash [config.ts] filename="config.ts"
 import { createConfig } from "@account-kit/core";
-import { sepolia, mainnet } from "@account-kit/infra";
+import { sepolia, mainnet, alchemy } from "@account-kit/infra";
 
 export const config = createConfig({
-  apiKey: "ALCHEMY_API_KEY",
+  transport: alchemy({ apiKey: "ALCHEMY_API_KEY" }),
   // this is the default chain
   chain: sepolia,
   chains: [

diff --git a/site/pages/core/sponsor-gas.mdx b/site/pages/core/sponsor-gas.mdx
@@ -29,10 +29,10 @@ Remember to replace `ALCHEMY_API_KEY` with your Alchemy API key. If you don't ha
 
 ```ts twoslash
 import { createConfig } from "@account-kit/core";
-import { sepolia } from "@account-kit/infra";
+import { sepolia, alchemy } from "@account-kit/infra";
 
 export const config = createConfig({
-  apiKey: "ALCHEMY_API_KEY",
+  transport: alchemy({ apiKey: "ALCHEMY_API_KEY" }),
   chain: sepolia,
   policyId: "GAS_MANAGER_POLICY_ID", // [!code ++]
 });

diff --git a/site/pages/core/ssr.mdx b/site/pages/core/ssr.mdx
@@ -13,10 +13,10 @@ To enable this setting, you can set `ssr: true` when creating a config.
 
 ```ts twoslash
 import { createConfig } from "@account-kit/core";
-import { sepolia } from "@account-kit/infra";
+import { sepolia, alchemy } from "@account-kit/infra";
 
 export const config = createConfig({
-  apiKey: "YOUR_API_KEY",
+  transport: alchemy({ apiKey: "ALCHEMY_API_KEY" }),
   chain: sepolia,
   ssr: true, // [!code ++]
 });
@@ -59,10 +59,10 @@ import {
   createConfig,
   cookieStorage, // [!code ++]
 } from "@account-kit/core";
-import { sepolia } from "@account-kit/infra";
+import { sepolia, alchemy } from "@account-kit/infra";
 
 export const config = createConfig({
-  apiKey: "YOUR_API_KEY",
+  transport: alchemy({ apiKey: "ALCHEMY_API_KEY" }),
   chain: sepolia,
   ssr: true, // [!code ++]
   storage: cookieStorage, // [!code ++]
@@ -90,10 +90,10 @@ if (typeof window !== "undefined") {
 
 ```ts twoslash [config.ts] filename="config.ts"
 import { createConfig, cookieStorage } from "@account-kit/core";
-import { sepolia } from "@account-kit/infra";
+import { sepolia, alchemy } from "@account-kit/infra";
 
 export const config = createConfig({
-  apiKey: "YOUR_API_KEY",
+  transport: alchemy({ apiKey: "ALCHEMY_API_KEY" }),
   chain: sepolia,
   ssr: true,
   storage: cookieStorage,

diff --git a/site/pages/migration-guide.mdx b/site/pages/migration-guide.mdx
@@ -32,6 +32,20 @@ We still support all Signers in the SDK!
 use the guide above to integrate with any signer of your choice.
 :::
 
+### Alchemy Transport
+
+The new `Transport` type: `AlchemyTransport` has been added. This impacts how Alchemy clients, middleware, and configs are created.
+
+For Smart Account Clients, the `create*AlchemyClient` methods have been updated to take a new `transport` property (of type `AlchemyTrasnport`) instead of `rpcUrl` or `apiKey` directly.
+
+The `alchemyFeeEstimator` and `alchemyUserOperationSimulator` middleware methods now no longer take in a `ClientWithAlchemyMethods` (returned by `createAlchemyPublicRpcClient`) and instead take in an `AlchemyTransport` as well.
+
+The `AlchemyTransport` is a type of `viem` transport that makes it easier to configure your communication with Alchemy RPC. It supports splitting traffic between Alchemy's AA infra and other Node providers (if needed). The `AlchemyTransport` has been added to `@account-kit/infra` and is exported as `alchemy`.
+
+Creating a config with `@account-kit/core` or `@account-kit/react` has been updated to accept an `AlchemyTransport` and the parameters of `createConfig` have been simplified as a result. You will now need to replace your `rpcUrl` or `apiKey` params with `transport: alchemy({...})`.
+
+For more detailed examples, see the relevant Quickstart guides, depending on which package you are using. If you don't know where to start, checkout the [React Quickstart](/react/quickstart).
+
 ### Hooks: `useSendTransaction` and `useSendTransactions` removed
 
 These methods have been removed since `useSendUserOperation` can be used to send transactions and user operations. If you were using `useSendTransaction` or `useSendTransactions`, you can replace them with

diff --git a/site/shared/core/config.ts b/site/shared/core/config.ts
@@ -1,8 +1,8 @@
 import { createConfig } from "@account-kit/core";
-import { sepolia } from "@account-kit/infra";
+import { alchemy, sepolia } from "@account-kit/infra";
 
 export const config = createConfig({
-  apiKey: "YOUR_API_KEY",
+  transport: alchemy({ apiKey: "YOUR_API_KEY" }),
   chain: sepolia,
   // optional if you want to sponsor gas
   policyId: "YOUR_POLICY_ID",

diff --git a/site/shared/core/ssr-config.ts b/site/shared/core/ssr-config.ts
@@ -1,8 +1,8 @@
 import { createConfig } from "@account-kit/core";
-import { sepolia } from "@account-kit/infra";
+import { alchemy, sepolia } from "@account-kit/infra";
 
 export const config = createConfig({
-  apiKey: "YOUR_API_KEY",
+  transport: alchemy({ apiKey: "YOUR_API_KEY" }),
   chain: sepolia,
   ssr: true,
 });
diff --git a/site/sidebar/signer.ts b/site/sidebar/signer.ts