feat: add createAlchemyConfig and AlchemyProvider#2125
feat: add createAlchemyConfig and AlchemyProvider#2125blakecduncan wants to merge 7 commits intomoldy/v5-basefrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub. 1 Skipped Deployment
|
🌿 Documentation Preview
|
| ...(apiKey ? [alchemyAuth({ apiKey })] : []), | ||
| ]; | ||
|
|
||
| const wagmiConfig = createConfig({ |
There was a problem hiding this comment.
I ended up not implementing the wagmiOverrides option in this PR. I wanted to get some opinions on it. I struggled getting the types to work for some reason, I kept getting a type error when doing a shallow copy into the params.
It got me thinking, I wonder if we should just try to expose options that we see fit (rather than a full wagmiOverrides option. And if anyone needs a bunch of wagmi overrides, we just recommend they build the wagmi config themselves.
| @@ -77,6 +77,64 @@ | |||
| resolved "https://registry.yarnpkg.com/@adraffy/ens-normalize/-/ens-normalize-1.11.0.tgz#42cc67c5baa407ac25059fcd7d405cc5ecdb0c33" | |||
| integrity sha512-/3DDPKHqqIqxUULp8yP4zODUY1i+2xvVWsv8A79xGWdCAG+8sb0hRh0Rk2QyOJUnnbyPUAZYcpBuRe3nS2OIUg== | |||
|
|
|||
| "@alchemy/aa-accounts@3.14.1": | |||
There was a problem hiding this comment.
do you need this many lockfile changes?
There was a problem hiding this comment.
I added @alchemy/connectors-web as a dependency in the @alchemy/react package and yarn updated all these dependencies.
I typically trust the lock updates when I add a package, is there a different way I should be adding packages? right now I just did
yarn add @alchemy/connectors-web
There was a problem hiding this comment.
gotcha, should be fine then! was just a little surprised that would change so much.
There was a problem hiding this comment.
yeah strange, i ran it locally too and verified this causes a bunch of changes
| apiKey: process.env.NEXT_PUBLIC_ALCHEMY_API_KEY, | ||
| }), | ||
| ], | ||
| export const config = createAlchemyConfig({ |
| export function AlchemyProvider({ config, children }: AlchemyProviderProps) { | ||
| return ( | ||
| <WagmiProvider config={config.wagmi}> | ||
| {children as any} |
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
| return perChain; | ||
| })(); | ||
|
|
||
| // Note: Currently using alchemyAuth; swap to alchemySmartWallet when ready. |
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
|
|
||
| const wagmiConfig = createConfig({ | ||
| chains, | ||
| transports: transports!, |
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
thebrianchen
left a comment
There was a problem hiding this comment.
this is beautiful. loving the devEx here
| @@ -77,6 +77,64 @@ | |||
| resolved "https://registry.yarnpkg.com/@adraffy/ens-normalize/-/ens-normalize-1.11.0.tgz#42cc67c5baa407ac25059fcd7d405cc5ecdb0c33" | |||
| integrity sha512-/3DDPKHqqIqxUULp8yP4zODUY1i+2xvVWsv8A79xGWdCAG+8sb0hRh0Rk2QyOJUnnbyPUAZYcpBuRe3nS2OIUg== | |||
|
|
|||
| "@alchemy/aa-accounts@3.14.1": | |||
There was a problem hiding this comment.
yeah strange, i ran it locally too and verified this causes a bunch of changes
There was a problem hiding this comment.
Pull Request Overview
This PR introduces new React components and configuration utilities for the Alchemy SDK, providing a simplified way to set up Alchemy in React applications. The main goal is to reduce boilerplate code by automatically configuring wagmi with Alchemy-specific defaults.
- Adds
createAlchemyConfigfunction to simplify wagmi configuration with Alchemy services - Introduces
AlchemyProvidercomponent as a wrapper around wagmi providers - Updates example application to demonstrate the new simplified configuration approach
Reviewed Changes
Copilot reviewed 8 out of 9 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/react/src/index.ts | Exports new configuration and provider components |
| packages/react/src/createAlchemyConfig.ts | New configuration function that sets up wagmi with Alchemy defaults |
| packages/react/src/AlchemyProvider.tsx | New provider component wrapping wagmi with future extensibility |
| packages/react/package.json | Adds dependency on @alchemy/connectors-web |
| examples/react-v5-example/src/app/providers.tsx | Updates to use AlchemyProvider instead of WagmiProvider |
| examples/react-v5-example/src/app/config.ts | Simplifies configuration using createAlchemyConfig |
| docs/pages/reference/alchemy/react/functions/createAlchemyConfig.mdx | Documentation for new configuration function |
| docs/pages/reference/alchemy/react/components/AlchemyProvider.mdx | Documentation for new provider component |
| ssr = false, | ||
| } = options; | ||
|
|
||
| if (!chains?.length) { |
There was a problem hiding this comment.
The optional chaining ?. is unnecessary here since chains is a required parameter with type [Chain, ...Chain[]]. This will always be defined and have at least one element due to the type constraint.
| if (!chains?.length) { | |
| if (!chains.length) { |
| --- | ||
| # This file is autogenerated | ||
| title: createAlchemyConfig | ||
| description: Overview of the createAlchemyConfig method |
There was a problem hiding this comment.
The description refers to createAlchemyConfig as a 'method' but it's actually a function. Should be 'Overview of the createAlchemyConfig function' to be technically accurate.
| --- | ||
| # This file is autogenerated | ||
| title: AlchemyProvider | ||
| description: Overview of the AlchemyProvider method |
There was a problem hiding this comment.
The description refers to AlchemyProvider as a 'method' but it's actually a React component. Should be 'Overview of the AlchemyProvider component' to be technically accurate.
Pull Request Checklist
yarn test)sitefolder, and guidelines for updating/adding docs can be found in the contribution guide)feat!: breaking change)yarn lint:check) and fix any issues? (yarn lint:write)PR-Codex overview
This PR introduces the
AlchemyProviderand a simplified configuration methodcreateAlchemyConfigfor React applications, replacing the previousWagmiProviderintegration. It aims to streamline the setup for using Alchemy services in React.Detailed summary
@alchemy/connectors-webas a dependency.createAlchemyConfigfor easier configuration.AlchemyProvidercomponent to replaceWagmiProvider.AlchemyProvider.createAlchemyConfigandAlchemyProvider.