Skip to content

Commit

Permalink
feat: Upgrade wagmi & view to v2 (#163)
Browse files Browse the repository at this point in the history
* feat: Upgrade wagmi

* refactor: Optimize code

* feat: Update examples

* feat: Add customized life cycle for `injected`

* feat: Update docs

* docs: Add changelog

* chore: update versions (alpha) (#162)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
  • Loading branch information
3 people authored Jul 16, 2024
1 parent 27d412c commit 83c5001
Show file tree
Hide file tree
Showing 129 changed files with 10,785 additions and 7,328 deletions.
5 changes: 5 additions & 0 deletions .changeset/dirty-panthers-enjoy.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@node-real/walletkit': patch
---

feat: Upgrade wagmi & viem to 2.x
13 changes: 13 additions & 0 deletions .changeset/pre.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"mode": "pre",
"tag": "alpha",
"initialVersions": {
"example-nextjs": "0.0.1",
"example-vite": "0.0.1",
"@node-real/walletkit": "2.0.0",
"website": "0.0.1"
},
"changesets": [
"dirty-panthers-enjoy"
]
}
40 changes: 0 additions & 40 deletions examples/nextjs/README.md

This file was deleted.

17 changes: 9 additions & 8 deletions examples/nextjs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -12,15 +12,16 @@
"dependencies": {
"@node-real/walletkit": "workspace:*",
"next": "^14",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"viem": "^1.19.9",
"wagmi": "^1.4.7"
"react": "^18",
"react-dom": "^18",
"viem": "^2",
"wagmi": "^2",
"@tanstack/react-query": "^5.51.1"
},
"devDependencies": {
"@types/node": "^20.10.0",
"@types/react": "^18.2.39",
"@types/react-dom": "^18.2.17",
"typescript": "^5.3.2"
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"typescript": "^5.5.3"
}
}
65 changes: 42 additions & 23 deletions examples/nextjs/pages/_app.tsx
Original file line number Diff line number Diff line change
@@ -1,43 +1,62 @@
import '@node-real/walletkit/styles.css';
import '@/styles/globals.css';
import type { AppProps } from 'next/app';
import { chains } from './chains';
import { WagmiConfig, createConfig } from 'wagmi';
import { bsc, mainnet, opBNB } from 'wagmi/chains';

import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import {
defaultWagmiConfig,
SwitchNetworkModal,
WalletKitButton,
WalletKitOptions,
WalletKitProvider,
getDefaultConfig,
ProfileModal,
ConnectModal,
} from '@node-real/walletkit';
import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets';
import { WagmiProvider } from 'wagmi';
import { AppProps } from 'next/app';

const config = createConfig(
getDefaultConfig({
autoConnect: true,
appName: 'WalletKit',
const queryClient = new QueryClient();

// WalletConnect 2.0 requires a projectId which you can create quickly
// and easily for free over at WalletConnect Cloud https://cloud.walletconnect.com/sign-in
walletConnectProjectId: 'e68a1816d39726c2afabf05661a32767',
const config = defaultWagmiConfig({
appName: 'WalletKit',
chains: [bsc, mainnet, opBNB],
connectors: [trustWallet(), metaMask(), walletConnect()],

chains,
connectors: [trustWallet(), metaMask(), walletConnect()],
}),
);
// WalletConnect 2.0 requires a projectId which you can create quickly
// and easily for free over at WalletConnect Cloud https://cloud.walletconnect.com/sign-in
walletConnectProjectId: 'e68a1816d39726c2afabf05661a32767',
});

const options: WalletKitOptions = {
initialChainId: 1,
};

export default function App({ Component, pageProps }: AppProps) {
return (
<WagmiConfig config={config}>
<WalletKitProvider options={options} mode="light">
<WalletKitButton />
<Component {...pageProps} />
<SwitchNetworkModal />
</WalletKitProvider>
</WagmiConfig>
<WagmiProvider config={config} reconnectOnMount={true}>
<QueryClientProvider client={queryClient}>
<WalletKitProvider options={options} mode="light">
<Component {...pageProps} />

<WalletKitButton />

<ConnectModal />

{/*
Profile modal shows some basic information about the current account,
If you don't need this modal, you can remove it.
*/}
<ProfileModal />

{/*
👇 Here's the SwitchNetworkModal
If the user switches to a network that is not supported by our dApp,
this modal will be displayed to remind the user to switch to our supported networks.
*/}
<SwitchNetworkModal />
</WalletKitProvider>
</QueryClientProvider>
</WagmiProvider>
);
}
1 change: 0 additions & 1 deletion examples/nextjs/pages/_document.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ export default function Document() {
return (
<Html lang="en">
<Head>
<title>WalletKit Next.js Example</title>
<EthereumScript />
</Head>
<body>
Expand Down
50 changes: 0 additions & 50 deletions examples/nextjs/pages/chains.ts

This file was deleted.

15 changes: 8 additions & 7 deletions examples/vite/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,17 @@
},
"dependencies": {
"@node-real/walletkit": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"viem": "^1.19.9",
"wagmi": "^1.4.7"
"react": "^18",
"react-dom": "^18",
"viem": "^2",
"wagmi": "^2",
"@tanstack/react-query": "^5.51.1"
},
"devDependencies": {
"@types/react": "^18.2.39",
"@types/react-dom": "^18.2.17",
"@types/react": "^18",
"@types/react-dom": "^18",
"@vitejs/plugin-react": "^4.2.0",
"typescript": "^5.3.2",
"typescript": "^5.5.3",
"vconsole": "^3.15.1",
"vite": "^4.5.0"
}
Expand Down
58 changes: 30 additions & 28 deletions examples/vite/src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,45 +1,47 @@
import '@node-real/walletkit/styles.css';
import { WagmiConfig, createConfig } from 'wagmi';
import { chains } from './chains';
import './global.css';
import { bsc, mainnet, opBNB } from 'wagmi/chains';

import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import {
ConnectModal,
defaultWagmiConfig,
ProfileModal,
SwitchNetworkModal,
WalletKitButton,
WalletKitProvider,
getDefaultConfig,
WalletKitOptions,
SwitchNetworkModal,
WalletKitProvider,
} from '@node-real/walletkit';
import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets';
import { WagmiProvider } from 'wagmi';

const config = createConfig(
getDefaultConfig({
autoConnect: true,
appName: 'WalletKit',
const queryClient = new QueryClient();

// WalletConnect 2.0 requires a projectId which you can create quickly
// and easily for free over at WalletConnect Cloud https://cloud.walletconnect.com/sign-in
walletConnectProjectId: 'e68a1816d39726c2afabf05661a32767',
const config = defaultWagmiConfig({
appName: 'WalletKit',
chains: [mainnet, bsc, opBNB],
connectors: [trustWallet(), metaMask(), walletConnect()],

chains,
connectors: [trustWallet(), metaMask(), walletConnect()],
}),
);
// WalletConnect 2.0 requires a projectId which you can create quickly
// and easily for free over at WalletConnect Cloud https://cloud.walletconnect.com/sign-in
walletConnectProjectId: 'e68a1816d39726c2afabf05661a32767',
});

const options: WalletKitOptions = {
initialChainId: 1,
};

export default function App() {
return (
<WagmiConfig config={config}>
<WalletKitProvider options={options} mode="light">
<WalletKitButton />
{/*
👇 Here's the SwitchNetworkModal
If the user switches to a network that is not supported by our dApp,
this modal will be displayed to remind the user to switch to our supported networks.
*/}
<SwitchNetworkModal />
</WalletKitProvider>
</WagmiConfig>
<WagmiProvider config={config} reconnectOnMount={false}>
<QueryClientProvider client={queryClient}>
<WalletKitProvider options={options} mode="light">
<WalletKitButton />
<ConnectModal />
<ProfileModal />
<SwitchNetworkModal />
</WalletKitProvider>
</QueryClientProvider>
</WagmiProvider>
);
}
50 changes: 0 additions & 50 deletions examples/vite/src/chains.ts

This file was deleted.

Loading

0 comments on commit 83c5001

Please sign in to comment.