Skip to content

Commit 3d59ede

Browse files
nomadbitcoinnomadbitcoin
committed
basic social login functionality for PolkaVM working as expected
1 parent 286beec commit 3d59ede

File tree

7 files changed

+118
-21
lines changed

7 files changed

+118
-21
lines changed

‎.gitignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -152,3 +152,6 @@ build/
152152
Pods/
153153
.vscode/
154154
.vercel
155+
156+
**/.bmad-core
157+
**/.claude

‎quick-starts/react-quick-start/index.html‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,11 @@
22
<html lang="en">
33
<head>
44
<script type="module">
5-
// IMP START - Bundler Issues
65
import { Buffer } from "buffer";
76
import process from "process";
87
window.Buffer = Buffer;
9-
window.process = process;
10-
// IMP END - Bundler Issues
11-
</script>
8+
window.process = process;
9+
</script>
1210
<meta charset="UTF-8" />
1311
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
1412
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

‎quick-starts/react-quick-start/src/App.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ function App() {
7979
>
8080
Web3Auth{" "}
8181
</a>
82-
& React Modal Quick Start
82+
& React Modal Quick Start by WEB3DEV
8383
</h1>
8484

8585
{isConnected ? loggedInView : unloggedInView}
@@ -89,7 +89,7 @@ function App() {
8989

9090
<footer className="footer">
9191
<a
92-
href="https://github.com/Web3Auth/web3auth-examples/tree/main/quick-starts/react-quick-start"
92+
href="https://github.com/w3b3d3v/web3auth-examples/tree/web3dev-version/quick-starts/react-quick-start"
9393
target="_blank"
9494
rel="noopener noreferrer"
9595
>

‎quick-starts/react-quick-start/src/components/getBalance.tsx‎

Lines changed: 27 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,37 @@
11
import { useAccount, useBalance } from "wagmi";
22
import { formatUnits } from "viem";
3+
import { useChainId } from "wagmi";
34

45
export function Balance() {
5-
const { address } = useAccount()
6+
const { address } = useAccount();
7+
const chainId = useChainId();
68

7-
const { data, isLoading, error } = useBalance({ address })
9+
const { data, isLoading, error } = useBalance({ address });
10+
11+
// Get decimals from the current chain's native currency
12+
const getNetworkDecimals = (chainId: number) => {
13+
switch (chainId) {
14+
case 1: // Ethereum mainnet
15+
return 18;
16+
case 420420422: // PassetHub
17+
return 12;
18+
case 420420418:
19+
return 12;
20+
default:
21+
return 18; // Default fallback
22+
}
23+
};
24+
25+
const networkDecimals = getNetworkDecimals(chainId);
826

927
return (
1028
<div>
1129
<h2>Balance</h2>
12-
<div>{data?.value !== undefined && `${formatUnits(data.value, data.decimals)} ${data.symbol}`} {isLoading && 'Loading...'} {error && 'Error: ' + error.message}</div>
30+
<div>
31+
{data?.value !== undefined &&
32+
`${formatUnits(data.value, networkDecimals)} ${data.symbol}`}{" "}
33+
{isLoading && "Loading..."} {error && "Error: " + error.message}
34+
</div>
1335
</div>
14-
)
15-
}
36+
);
37+
}

‎quick-starts/react-quick-start/src/main.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,9 @@ import ReactDOM from "react-dom/client";
44
import { Web3AuthProvider } from "@web3auth/modal/react";
55
import web3AuthContextConfig from "./web3authContext";
66

7-
import { WagmiProvider } from "@web3auth/modal/react/wagmi";
7+
import { WagmiProvider } from "wagmi";
88
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
9+
import { wagmiConfig } from "./wagmi-config";
910

1011
import App from "./App";
1112

@@ -14,7 +15,7 @@ const queryClient = new QueryClient();
1415
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
1516
<Web3AuthProvider config={web3AuthContextConfig}>
1617
<QueryClientProvider client={queryClient}>
17-
<WagmiProvider>
18+
<WagmiProvider config={wagmiConfig}>
1819
<App />
1920
</WagmiProvider>
2021
</QueryClientProvider>

‎quick-starts/react-quick-start/src/wagmi-config.ts‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
import { http, createConfig } from "@wagmi/core";
2+
import { type Chain } from "viem";
3+
import { mainnet } from "wagmi/chains";
4+
5+
const passetHub = {
6+
id: 420420422,
7+
name: "Passet Hub",
8+
nativeCurrency: {
9+
name: "PAS",
10+
symbol: "PAS",
11+
decimals: 10,
12+
},
13+
rpcUrls: {
14+
default: {
15+
http: ["https://testnet-passet-hub-eth-rpc.polkadot.io"],
16+
},
17+
},
18+
blockExplorers: {
19+
default: {
20+
name: "Blockscout",
21+
url: "https://blockscout-passet-hub.parity-testnet.parity.io",
22+
},
23+
},
24+
} as const satisfies Chain;
25+
26+
const kusamaAssetHub = {
27+
id: 420420418,
28+
name: "Kusama Asset Hub",
29+
nativeCurrency: {
30+
name: "Kusama",
31+
symbol: "KSM",
32+
decimals: 12,
33+
},
34+
rpcUrls: {
35+
default: {
36+
http: ["https://kusama-asset-hub-eth-rpc.polkadot.io/"],
37+
},
38+
},
39+
blockExplorers: {
40+
default: {
41+
name: "Blockscout",
42+
url: "https://blockscout-kusama-asset-hub.parity-chains-scw.parity.io/",
43+
},
44+
},
45+
} as const satisfies Chain;
46+
47+
const westend = {
48+
id: 420420421,
49+
name: "Westend Network",
50+
nativeCurrency: {
51+
name: "Westend",
52+
symbol: "WND",
53+
decimals: 12,
54+
},
55+
rpcUrls: {
56+
default: {
57+
http: ["https://westend-asset-hub-eth-rpc.polkadot.io"],
58+
},
59+
},
60+
blockExplorers: {
61+
default: {
62+
name: "Blockscout",
63+
url: "https://blockscout-asset-hub.parity-chains-scw.parity.io",
64+
},
65+
},
66+
} as const satisfies Chain;
67+
68+
export const wagmiConfig = createConfig({
69+
chains: [mainnet, passetHub, kusamaAssetHub, westend],
70+
transports: {
71+
[passetHub.id]: http(),
72+
[mainnet.id]: http(),
73+
[kusamaAssetHub.id]: http(),
74+
[westend.id]: http(),
75+
},
76+
});

‎quick-starts/react-quick-start/src/web3authContext.tsx‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,16 @@
1-
// IMP START - Quick Start
21
import { WEB3AUTH_NETWORK } from "@web3auth/modal";
32
import { type Web3AuthContextConfig } from "@web3auth/modal/react";
4-
// IMP END - Quick Start
53

6-
// IMP START - Dashboard Registration
7-
const clientId = "BHgArYmWwSeq21czpcarYh0EVq2WWOzflX-NTK-tY1-1pauPzHKRRLgpABkmYiIV_og9jAvoIxQ8L3Smrwe04Lw"; // get from https://dashboard.web3auth.io
8-
// IMP END - Dashboard Registration
4+
const clientId =
5+
// This is a test-only key Provided by KitDot, get one from https://dashboard.web3auth.io
6+
import.meta.env.VITE_WEB3AUTH_CLIENT_ID ||
7+
"BHgArYmWwSeq21czpcarYh0EVq2WWOzflX-NTK-tY1-1pauPzHKRRLgpABkmYiIV_og9jAvoIxQ8L3Smrwe04Lw";
98

10-
// IMP START - Config
119
const web3AuthContextConfig: Web3AuthContextConfig = {
1210
web3AuthOptions: {
1311
clientId,
1412
web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_DEVNET,
15-
}
13+
},
1614
};
17-
// IMP END - Config
1815

1916
export default web3AuthContextConfig;

0 commit comments

Comments
 (0)