From a1b99515a404ca62ac1aae6ca3a17987689f1647 Mon Sep 17 00:00:00 2001 From: Rinat Date: Wed, 16 Oct 2024 16:12:19 +0200 Subject: [PATCH] Update usehooks-ts, remove use-debounce (#957) --- packages/nextjs/hooks/scaffold-eth/index.ts | 1 - .../hooks/scaffold-eth/useBurnerWallet.ts | 146 ------------------ packages/nextjs/package.json | 3 +- yarn.lock | 20 +-- 4 files changed, 6 insertions(+), 164 deletions(-) delete mode 100644 packages/nextjs/hooks/scaffold-eth/useBurnerWallet.ts diff --git a/packages/nextjs/hooks/scaffold-eth/index.ts b/packages/nextjs/hooks/scaffold-eth/index.ts index 6effb7edd..084ccc852 100644 --- a/packages/nextjs/hooks/scaffold-eth/index.ts +++ b/packages/nextjs/hooks/scaffold-eth/index.ts @@ -1,5 +1,4 @@ export * from "./useAnimationConfig"; -export * from "./useBurnerWallet"; export * from "./useContractLogs"; export * from "./useDeployedContractInfo"; export * from "./useFetchBlocks"; diff --git a/packages/nextjs/hooks/scaffold-eth/useBurnerWallet.ts b/packages/nextjs/hooks/scaffold-eth/useBurnerWallet.ts deleted file mode 100644 index 2b8cf8895..000000000 --- a/packages/nextjs/hooks/scaffold-eth/useBurnerWallet.ts +++ /dev/null @@ -1,146 +0,0 @@ -import { useCallback, useEffect, useRef, useState } from "react"; -import { useTargetNetwork } from "./useTargetNetwork"; -import { useLocalStorage } from "usehooks-ts"; -import { Chain, Hex, HttpTransport, PrivateKeyAccount, createWalletClient, http } from "viem"; -import { WalletClient } from "viem"; -import { generatePrivateKey, privateKeyToAccount } from "viem/accounts"; -import { usePublicClient } from "wagmi"; - -const burnerStorageKey = "scaffoldEth2.burnerWallet.sk"; - -/** - * Checks if the private key is valid - */ -const isValidSk = (pk: Hex | string | undefined | null): boolean => { - return pk?.length === 64 || pk?.length === 66; -}; - -/** - * If no burner is found in localstorage, we will generate a random private key - */ -const newDefaultPrivateKey = generatePrivateKey(); - -/** - * Save the current burner private key to local storage - */ -export const saveBurnerSK = (privateKey: Hex): void => { - if (typeof window != "undefined" && window != null) { - window?.localStorage?.setItem(burnerStorageKey, privateKey); - } -}; - -/** - * Gets the current burner private key from local storage - */ -export const loadBurnerSK = (): Hex => { - let currentSk: Hex = "0x"; - if (typeof window != "undefined" && window != null) { - currentSk = (window?.localStorage?.getItem?.(burnerStorageKey)?.replaceAll('"', "") ?? "0x") as Hex; - } - - if (!!currentSk && isValidSk(currentSk)) { - return currentSk; - } else { - saveBurnerSK(newDefaultPrivateKey); - return newDefaultPrivateKey; - } -}; - -type BurnerAccount = { - walletClient: WalletClient | undefined; - account: PrivateKeyAccount | undefined; - // creates a new burner account - generateNewBurner: () => void; - // explicitly save burner to storage - saveBurner: () => void; -}; - -/** - * Creates a burner wallet - */ -export const useBurnerWallet = (): BurnerAccount => { - const [burnerSk, setBurnerSk] = useLocalStorage(burnerStorageKey, newDefaultPrivateKey, { - initializeWithValue: false, - }); - - const { targetNetwork } = useTargetNetwork(); - const publicClient = usePublicClient({ chainId: targetNetwork.id }); - const [walletClient, setWalletClient] = useState>(); - const [generatedPrivateKey, setGeneratedPrivateKey] = useState("0x"); - const [account, setAccount] = useState(); - const isCreatingNewBurnerRef = useRef(false); - - const saveBurner = useCallback(() => { - setBurnerSk(generatedPrivateKey); - }, [setBurnerSk, generatedPrivateKey]); - - const generateNewBurner = useCallback(() => { - if (publicClient && !isCreatingNewBurnerRef.current) { - console.log("🔑 Create new burner wallet..."); - isCreatingNewBurnerRef.current = true; - - const randomPrivateKey = generatePrivateKey(); - const randomAccount = privateKeyToAccount(randomPrivateKey); - - const client = createWalletClient({ - chain: publicClient.chain, - account: randomAccount, - transport: http(), - }); - - setWalletClient(client); - setGeneratedPrivateKey(randomPrivateKey); - setAccount(randomAccount); - - setBurnerSk(() => { - console.log("🔥 Saving new burner wallet"); - isCreatingNewBurnerRef.current = false; - return randomPrivateKey; - }); - return client; - } else { - console.log("⚠ Could not create burner wallet"); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [publicClient?.chain.id]); - - /** - * Load wallet with burnerSk - * connect and set wallet, once we have burnerSk and valid provider - */ - useEffect(() => { - if (burnerSk && publicClient?.chain.id) { - let wallet: WalletClient | undefined = undefined; - if (isValidSk(burnerSk)) { - const randomAccount = privateKeyToAccount(burnerSk); - - wallet = createWalletClient({ - chain: publicClient.chain, - account: randomAccount, - transport: http(), - }); - - setGeneratedPrivateKey(burnerSk); - setAccount(randomAccount); - } else { - wallet = generateNewBurner(); - } - - if (wallet == null) { - throw "Error: Could not create burner wallet"; - } - - setWalletClient(wallet); - saveBurner(); - } - - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [burnerSk, publicClient?.chain.id]); - - return { - walletClient, - account, - generateNewBurner, - saveBurner, - }; -}; diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json index 4e69f805c..0b640bf9b 100644 --- a/packages/nextjs/package.json +++ b/packages/nextjs/package.json @@ -30,8 +30,7 @@ "react-copy-to-clipboard": "^5.1.0", "react-dom": "^18.3.1", "react-hot-toast": "^2.4.0", - "use-debounce": "^8.0.4", - "usehooks-ts": "^2.13.0", + "usehooks-ts": "^3.1.0", "viem": "2.21.7", "wagmi": "2.12.11", "zustand": "^4.1.2" diff --git a/yarn.lock b/yarn.lock index 852eb4be7..ed29f3d26 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2195,8 +2195,7 @@ __metadata: tailwindcss: ^3.4.11 type-fest: ^4.6.0 typescript: 5.5.3 - use-debounce: ^8.0.4 - usehooks-ts: ^2.13.0 + usehooks-ts: ^3.1.0 vercel: ^37.4.2 viem: 2.21.7 wagmi: 2.12.11 @@ -13502,15 +13501,6 @@ __metadata: languageName: node linkType: hard -"use-debounce@npm:^8.0.4": - version: 8.0.4 - resolution: "use-debounce@npm:8.0.4" - peerDependencies: - react: ">=16.8.0" - checksum: 0f8b9e571f68a4694033ec00690bf73d781ac890140ae9ed4b330f71f7adb3f7d7df5cdaa32923c4d03fdc9de8a11be0f84301175ae4f66208af52ad03c55504 - languageName: node - linkType: hard - "use-sidecar@npm:^1.1.2": version: 1.1.2 resolution: "use-sidecar@npm:1.1.2" @@ -13545,14 +13535,14 @@ __metadata: languageName: node linkType: hard -"usehooks-ts@npm:^2.13.0": - version: 2.13.0 - resolution: "usehooks-ts@npm:2.13.0" +"usehooks-ts@npm:^3.1.0": + version: 3.1.0 + resolution: "usehooks-ts@npm:3.1.0" dependencies: lodash.debounce: ^4.0.8 peerDependencies: react: ^16.8.0 || ^17 || ^18 - checksum: ad07930e1b5c70392603eb8b3f199f44349c75406fe31013f79b0fb7fdece59f47f8dba09b6f1fafaa00d68f43240dbb13cdc1afb89b647f1d53504599a51ca0 + checksum: 4f850c0c5ab408afa52fa2ea2c93c488cd7065c82679eb1fb62cba12ca4c57ff62d52375acc6738823421fe6579ce3adcea1e2dc345ce4f549c593d2e51455b3 languageName: node linkType: hard