Fixes Web3Auth Code Snippet

docs/snippets/signers/web3auth.ts

@@ -1,31 +1,39 @@
-const clientId =
-	"iyoK-C3TBDiMvlXJFR8lIiC35JGoDMw8VrhE77k-xX6W2mOkZjhvU2J2t3NyuG7tkPsI2MrGv1RyiNlSwaFD5gL"
-
 // [!region main]
 import { CHAIN_NAMESPACES, WEB3AUTH_NETWORK } from "@web3auth/base"
-import { Web3Auth } from "@web3auth/modal"
+import { EthereumPrivateKeyProvider } from "@web3auth/ethereum-provider"
+import { Web3Auth, Web3AuthOptions } from "@web3auth/modal"
 import { EIP1193Provider } from "viem"
 
-// Config options here will be specific to your project.  See the Web3Auth docs for more info.
-const web3auth = new Web3Auth({
-	clientId,
-	chainConfig: {
-		chainNamespace: CHAIN_NAMESPACES.EIP155,
-		chainId: "0xaa36a7",
-		rpcTarget: "https://rpc.ankr.com/eth_sepolia",
-		displayName: "Sepolia Testnet",
-		blockExplorer: "https://sepolia.etherscan.io",
-		ticker: "ETH",
-		tickerName: "Ethereum",
-	},
-	uiConfig: {},
-	web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_DEVNET,
+const chainConfig = {
+    chainNamespace: CHAIN_NAMESPACES.EIP155,
+    chainId: "0xaa36a7",
+    rpcTarget: "https://rpc.ankr.com/eth_sepolia",
+    displayName: "Ethereum Sepolia Testnet",
+    blockExplorerUrl: "https://sepolia.etherscan.io",
+    ticker: "ETH",
+    tickerName: "Ethereum",
+    logo: "https://cryptologos.cc/logos/ethereum-eth-logo.png",
+}
+
+const privateKeyProvider = new EthereumPrivateKeyProvider({
+    config: { chainConfig },
 })
 
+// Config options here will be specific to your project.  See the Web3Auth docs for more info.
+const web3AuthOptions: Web3AuthOptions = {
+    // TODO: Replace with your Web3Auth client ID
+    // Get it from https://dashboard.web3auth.io/
+    clientId: "YOUR_WEB3AUTH_CLIENT_ID",
+    web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_DEVNET,
+    privateKeyProvider,
+}
+
+const web3auth = new Web3Auth(web3AuthOptions)
+
 // Get the Provider and EOA address (this will be the address of the signer) from Web3Auth
 const smartAccountOwner = web3auth.provider as EIP1193Provider
 
 if (!smartAccountOwner) {
-	throw new Error("No provider found")
+    throw new Error("No provider found")
 }
-// [!endregion main]
+// [!endregion main]

package.json

@@ -1,54 +1,55 @@
 {
-	"name": "pimlico-docs",
-	"version": "0.0.0",
-	"type": "module",
-	"scripts": {
-		"dev": "vocs dev",
-		"build": "vocs build",
-		"preview": "vocs preview"
-	},
-	"dependencies": {
-		"@arcana/auth": "^1.0.10",
-		"@dfns/lib-viem": "^0.3.1",
-		"@dfns/sdk": "^0.3.1",
-		"@dfns/sdk-keysigner": "^0.3.1",
-		"@fireblocks/fireblocks-web3-provider": "^1.3.3",
-		"@lit-protocol/auth-helpers": "^3.0.0",
-		"@lit-protocol/lit-node-client": "^3.0.0",
-		"@lit-protocol/pkp-ethers": "^3.0.0",
-		"@lit-protocol/types": "^3.0.0",
-		"@magic-ext/oauth": "^16.1.1",
-		"@particle-network/auth": "^1.3.1",
-		"@particle-network/provider": "^1.3.2",
-		"@permissionless/wagmi": "^0.1.0",
-		"@radix-ui/colors": "^3.0.0",
-		"@radix-ui/react-checkbox": "^1.0.4",
-		"@radix-ui/react-slider": "^1.1.2",
-		"@radix-ui/react-tooltip": "^1.0.7",
-		"@tanstack/react-query": "^5.18.0",
-		"@turnkey/http": "^2.7.1",
-		"@turnkey/viem": "^0.4.10",
-		"@types/node": "^20.11.2",
-		"@usecapsule/viem-v2-integration": "^1.10.1",
-		"@usecapsule/web-sdk": "^1.13.1",
-		"@web3auth/base": "^7.3.2",
-		"@web3auth/modal": "^7.3.2",
-		"caniuse-lite": "^1.0.30001655",
-		"lucide-react": "^0.309.0",
-		"magic-sdk": "^22.1.1",
-		"permissionless": "0.2.6",
-		"react": "latest",
-		"react-dom": "latest",
-		"viem": "^2.20.0",
-		"vitest": "^2.0.5",
-		"vocs": "=1.0.0-alpha.55",
-		"wagmi": "^2.5.5"
-	},
-	"devDependencies": {
-		"@biomejs/biome": "^1.5.2",
-		"@types/react": "^18.2.47",
-		"dotenv": "^16.4.5",
-		"tsx": "^4.7.1"
-	},
-	"packageManager": "[email protected]+sha512.38dc6fba8dba35b39340b9700112c2fe1e12f10b17134715a4aa98ccf7bb035e76fd981cf0bb384dfa98f8d6af5481c2bef2f4266a24bfa20c34eb7147ce0b5e"
+    "name": "pimlico-docs",
+    "version": "0.0.0",
+    "type": "module",
+    "scripts": {
+        "dev": "vocs dev",
+        "build": "vocs build",
+        "preview": "vocs preview"
+    },
+    "dependencies": {
+        "@arcana/auth": "^1.0.10",
+        "@dfns/lib-viem": "^0.3.1",
+        "@dfns/sdk": "^0.3.1",
+        "@dfns/sdk-keysigner": "^0.3.1",
+        "@fireblocks/fireblocks-web3-provider": "^1.3.3",
+        "@lit-protocol/auth-helpers": "^3.0.0",
+        "@lit-protocol/lit-node-client": "^3.0.0",
+        "@lit-protocol/pkp-ethers": "^3.0.0",
+        "@lit-protocol/types": "^3.0.0",
+        "@magic-ext/oauth": "^16.1.1",
+        "@particle-network/auth": "^1.3.1",
+        "@particle-network/provider": "^1.3.2",
+        "@permissionless/wagmi": "^0.1.0",
+        "@radix-ui/colors": "^3.0.0",
+        "@radix-ui/react-checkbox": "^1.0.4",
+        "@radix-ui/react-slider": "^1.1.2",
+        "@radix-ui/react-tooltip": "^1.0.7",
+        "@tanstack/react-query": "^5.18.0",
+        "@turnkey/http": "^2.7.1",
+        "@turnkey/viem": "^0.4.10",
+        "@types/node": "^20.11.2",
+        "@usecapsule/viem-v2-integration": "^1.10.1",
+        "@usecapsule/web-sdk": "^1.13.1",
+        "@web3auth/base": "^9.2.3",
+        "@web3auth/modal": "^9.2.3",
+        "@web3auth/ethereum-provider": "^9.2.3",
+        "caniuse-lite": "^1.0.30001655",
+        "lucide-react": "^0.309.0",
+        "magic-sdk": "^22.1.1",
+        "permissionless": "0.2.6",
+        "react": "latest",
+        "react-dom": "latest",
+        "viem": "^2.20.0",
+        "vitest": "^2.0.5",
+        "vocs": "=1.0.0-alpha.55",
+        "wagmi": "^2.5.5"
+    },
+    "devDependencies": {
+        "@biomejs/biome": "^1.5.2",
+        "@types/react": "^18.2.47",
+        "dotenv": "^16.4.5",
+        "tsx": "^4.7.1"
+    },
+    "packageManager": "[email protected]+sha512.38dc6fba8dba35b39340b9700112c2fe1e12f10b17134715a4aa98ccf7bb035e76fd981cf0bb384dfa98f8d6af5481c2bef2f4266a24bfa20c34eb7147ce0b5e"
 }