-
Notifications
You must be signed in to change notification settings - Fork 204
feat: add createAlchemyConfig and AlchemyProvider #2125
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: moldy/v5-base
Are you sure you want to change the base?
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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/[email protected]": | |||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
do you need this many lockfile changes?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
gotcha, should be fine then! was just a little surprised that would change so much.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
beautiful
| 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.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
oof
| 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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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/[email protected]": | |||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yeah strange, i ran it locally too and verified this causes a bunch of changes
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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) { |
Copilot
AI
Sep 30, 2025
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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 |
Copilot
AI
Sep 30, 2025
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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 |
Copilot
AI
Sep 30, 2025
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.