Skip to content
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.

Sign up for GitHub

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

feat(sdk): upgrade @metamask/providers to ^18.3.1 #1199

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open

feat(sdk): upgrade @metamask/providers to ^18.3.1 #1199

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
b97ddcb
feat: turborepo setup
abretonc7s Jan 15, 2025
2d70abd
feat: new nextjs playground
abretonc7s Jan 15, 2025
d6ffb1e
feat: cleanup
abretonc7s Jan 15, 2025
c805f42
feat: upgrade metamask/providers
abretonc7s Jan 15, 2025
bb20d00
Merge remote-tracking branch 'origin/main' into ab/providerupdate
abretonc7s Jan 15, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 60 additions & 22 deletions packages/playground-next/src/app/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,54 +2,92 @@

import { useSDK } from '@metamask/sdk-react';
import styles from './page.module.css';
import { useState } from 'react';
import { useCallback, useEffect, useState } from 'react';

interface AccountInfo {
account: string;
balance: string;
}

export default function Home() {
const { sdk } = useSDK();
const [account, setAccount] = useState<AccountInfo | null>(null);
const { sdk, connected, connecting, provider, account } = useSDK();
const [accountInfo, setAccountInfo] = useState<AccountInfo | null>(null);
const [isLoading, setIsLoading] = useState<boolean>(false);

const getBalance = useCallback(async (address: string): Promise<string> => {
const balance = await provider?.request({
method: 'eth_getBalance',
params: [address, 'latest']
});
return balance ? parseInt(balance as string, 16).toString() : '0';
}, [provider]);

const connectWallet = async (): Promise<void> => {
try {
const accounts = await sdk?.connect();

if (accounts?.[0]) {
const provider = sdk?.getProvider();
const balance = await provider?.request({
method: 'eth_getBalance',
params: [accounts[0], 'latest']
});

setAccount({
account: accounts[0],
balance: balance ? (parseInt(balance as string, 16)).toString() : '0'
});
}
setIsLoading(true);
await sdk?.connect();
} catch (err) {
console.error('Failed to connect wallet:', err);
} finally {
setIsLoading(false);
}
};

const terminateConnection = async (): Promise<void> => {
try {
setIsLoading(true);
await sdk?.terminate();
setAccountInfo(null);
} catch (err) {
console.error('Failed to terminate connection:', err);
} finally {
setIsLoading(false);
}
};

useEffect(() => {
const updateAccountInfo = async () => {
if (connected && account) {
const balance = await getBalance(account);
setAccountInfo({
account,
balance
});
} else {
setAccountInfo(null);
}
};

updateAccountInfo();
}, [connected, account, provider, getBalance]);

return (
<div className={styles.container}>
<h1>Simple Web3 Dapp</h1>

{!account ? (
<button className={styles.button} onClick={connectWallet}>
Connect MetaMask
{!connected ? (
<button
className={styles.button}
onClick={connectWallet}
disabled={isLoading || connecting}
>
{isLoading || connecting ? 'Connecting...' : 'Connect MetaMask'}
</button>
) : (
<>
<div className={styles.address}>
Address: {account.account}
Address: {accountInfo?.account}
</div>
<div className={styles.address}>
Balance: {account.balance} Wei
Balance: {accountInfo?.balance} Wei
</div>
<button
className={styles.button}
onClick={terminateConnection}
disabled={isLoading}
>
{isLoading ? 'Terminating...' : 'Terminate Connection'}
</button>
</>
)}
</div>
Expand Down
2 changes: 1 addition & 1 deletion packages/sdk/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@
"dependencies": {
"@babel/runtime": "^7.26.0",
"@metamask/onboarding": "^1.0.1",
"@metamask/providers": "16.1.0",
"@metamask/providers": "^18.3.1",
"@metamask/sdk-communication-layer": "workspace:*",
"@metamask/sdk-install-modal-web": "workspace:*",
"@paulmillr/qr": "^0.2.1",
Expand Down
2 changes: 2 additions & 0 deletions packages/sdk/rollup.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ const dependencies = Object.keys(packageJson.dependencies || {});
// Dependencies that should be bundled
const bundledDeps = [
// '@metamask/sdk-communication-layer',
'readable-stream',
// Add other dependencies that should be bundled
];

Expand Down Expand Up @@ -58,6 +59,7 @@ const baseExternalDeps = [
...sharedDeps, // Exclude shared deps from bundle
'@react-native-async-storage/async-storage',
'extension-port-stream',
'@metamask/providers',
];

// Platform-specific externals
Expand Down
91 changes: 90 additions & 1 deletion yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10979,6 +10979,17 @@ __metadata:
languageName: node
linkType: hard

"@metamask/json-rpc-engine@npm:^10.0.2":
version: 10.0.2
resolution: "@metamask/json-rpc-engine@npm:10.0.2"
dependencies:
"@metamask/rpc-errors": ^7.0.2
"@metamask/safe-event-emitter": ^3.0.0
"@metamask/utils": ^11.0.1
checksum: db561d6ffe4de041dc2fe79c6d1eb098bd9eb444864568c4781f3227e6c7e33563ac2858caadb14f6b58facbf189fe0f50725adbc29f3b2641b787e550e548e6
languageName: node
linkType: hard

"@metamask/json-rpc-engine@npm:^7.0.0":
version: 7.3.3
resolution: "@metamask/json-rpc-engine@npm:7.3.3"
Expand Down Expand Up @@ -11024,6 +11035,18 @@ __metadata:
languageName: node
linkType: hard

"@metamask/json-rpc-middleware-stream@npm:^8.0.6":
version: 8.0.6
resolution: "@metamask/json-rpc-middleware-stream@npm:8.0.6"
dependencies:
"@metamask/json-rpc-engine": ^10.0.2
"@metamask/safe-event-emitter": ^3.0.0
"@metamask/utils": ^11.0.1
readable-stream: ^3.6.2
checksum: e004de7a8090afc0441b9bf661106ac07a550862f6e824bfebcb14b46eea7551beeaeab4c39ac810beee0f53ad1032344a99eef1c0f5f118fe8d388e7e0c5014
languageName: node
linkType: hard

"@metamask/network-controller@npm:^16.0.0":
version: 16.0.0
resolution: "@metamask/network-controller@npm:16.0.0"
Expand Down Expand Up @@ -11126,6 +11149,27 @@ __metadata:
languageName: node
linkType: hard

"@metamask/providers@npm:^18.3.1":
version: 18.3.1
resolution: "@metamask/providers@npm:18.3.1"
dependencies:
"@metamask/json-rpc-engine": ^10.0.2
"@metamask/json-rpc-middleware-stream": ^8.0.6
"@metamask/object-multiplex": ^2.0.0
"@metamask/rpc-errors": ^7.0.2
"@metamask/safe-event-emitter": ^3.1.1
"@metamask/utils": ^11.0.1
detect-browser: ^5.2.0
extension-port-stream: ^4.1.0
fast-deep-equal: ^3.1.3
is-stream: ^2.0.0
readable-stream: ^3.6.2
peerDependencies:
webextension-polyfill: ^0.10.0 || ^0.11.0 || ^0.12.0
checksum: 626112e3bdaa3b63c041ac0d280777419109a1ed2a6cdd50c1b3c7700c53d2e342f93748244a58a74d2e94357fe9eed1137317acff4df9ee0586798e02cfe00d
languageName: node
linkType: hard

"@metamask/rpc-errors@npm:^6.0.0, @metamask/rpc-errors@npm:^6.1.0":
version: 6.1.0
resolution: "@metamask/rpc-errors@npm:6.1.0"
Expand All @@ -11146,6 +11190,16 @@ __metadata:
languageName: node
linkType: hard

"@metamask/rpc-errors@npm:^7.0.2":
version: 7.0.2
resolution: "@metamask/rpc-errors@npm:7.0.2"
dependencies:
"@metamask/utils": ^11.0.1
fast-safe-stringify: ^2.0.6
checksum: 262a1ab57121e277eb979325d8e4335b9f4194c5acd0138ee0032db35b4e20ea0423badb5dad4bdf6abb85d22b476377f17911a54f82b3b1a2bdffc36654d028
languageName: node
linkType: hard

"@metamask/safe-event-emitter@npm:2.0.0, @metamask/safe-event-emitter@npm:^2.0.0":
version: 2.0.0
resolution: "@metamask/safe-event-emitter@npm:2.0.0"
Expand Down Expand Up @@ -11842,7 +11896,7 @@ __metadata:
"@metamask/eslint-config-nodejs": ^6.0.0
"@metamask/eslint-config-typescript": ^6.0.0
"@metamask/onboarding": ^1.0.1
"@metamask/providers": 16.1.0
"@metamask/providers": ^18.3.1
"@metamask/sdk-communication-layer": "workspace:*"
"@metamask/sdk-install-modal-web": "workspace:*"
"@paulmillr/qr": ^0.2.1
Expand Down Expand Up @@ -11911,13 +11965,37 @@ __metadata:
languageName: unknown
linkType: soft

"@metamask/superstruct@npm:^3.1.0":
version: 3.1.0
resolution: "@metamask/superstruct@npm:3.1.0"
checksum: 00e4d0c0aae8b25ccc1885c1db0bb4ed1590010570140c255e4deee3bf8a10c859c8fce5e475b4ae09c8a56316207af87585b91f7f5a5c028d668ccd111f19e3
languageName: node
linkType: hard

"@metamask/swappable-obj-proxy@npm:^2.1.0":
version: 2.1.0
resolution: "@metamask/swappable-obj-proxy@npm:2.1.0"
checksum: b15cebee7fb189d1143d3a755a38a7d88f56f91e1277425a51f63c50c432dfb4e6e22650ef67474ae4ef2a97344231af00be6780f126c47d401a23c8a8fb3c9c
languageName: node
linkType: hard

"@metamask/utils@npm:^11.0.1":
version: 11.0.1
resolution: "@metamask/utils@npm:11.0.1"
dependencies:
"@ethereumjs/tx": ^4.2.0
"@metamask/superstruct": ^3.1.0
"@noble/hashes": ^1.3.1
"@scure/base": ^1.1.3
"@types/debug": ^4.1.7
debug: ^4.3.4
pony-cause: ^2.1.10
semver: ^7.5.4
uuid: ^9.0.1
checksum: a5072f87157f6763328767bf1ddc01deb94e13f32af58d0993e0450e7e211fb29882280a1013cbdc7752b152a662be3d9beef8129a9097dba7d465389c398b3c
languageName: node
linkType: hard

"@metamask/utils@npm:^3.0.1":
version: 3.6.0
resolution: "@metamask/utils@npm:3.6.0"
Expand Down Expand Up @@ -31798,6 +31876,17 @@ __metadata:
languageName: node
linkType: hard

"extension-port-stream@npm:^4.1.0":
version: 4.2.0
resolution: "extension-port-stream@npm:4.2.0"
dependencies:
readable-stream: ^3.6.2 || ^4.4.2
peerDependencies:
webextension-polyfill: ^0.10.0 || ^0.11.0 || ^0.12.0
checksum: 85559c82e3f3aa21462e234b30b7d53872708893664cd03f2f848af556cf0730cf2243b089efc9d40bbe9a4f73bd8fd19684db5a985329b0c4402b4f2fe26358
languageName: node
linkType: hard

"extract-zip@npm:2.0.1, extract-zip@npm:^2.0.1":
version: 2.0.1
resolution: "extract-zip@npm:2.0.1"
Expand Down
Loading