From 476010ac4b5b1059642e26341568a22bfa9a420d Mon Sep 17 00:00:00 2001 From: "Shiv Bhonde | shivbhonde.eth" Date: Tue, 17 Dec 2024 20:26:36 +0530 Subject: [PATCH] make `useScaffoldWriteContract` & `useDeployedContractInfo` backward compatible (#1015) --- .../scaffold-eth/useDeployedContractInfo.ts | 34 ++++++++++-- .../scaffold-eth/useScaffoldWriteContract.ts | 55 ++++++++++++++++--- 2 files changed, 76 insertions(+), 13 deletions(-) diff --git a/packages/nextjs/hooks/scaffold-eth/useDeployedContractInfo.ts b/packages/nextjs/hooks/scaffold-eth/useDeployedContractInfo.ts index 0973af21d..379785901 100644 --- a/packages/nextjs/hooks/scaffold-eth/useDeployedContractInfo.ts +++ b/packages/nextjs/hooks/scaffold-eth/useDeployedContractInfo.ts @@ -10,16 +10,40 @@ import { contracts, } from "~~/utils/scaffold-eth/contract"; +type DeployedContractData = { + data: Contract | undefined; + isLoading: boolean; +}; + /** * Gets the matching contract info for the provided contract name from the contracts present in deployedContracts.ts * and externalContracts.ts corresponding to targetNetworks configured in scaffold.config.ts */ -export const useDeployedContractInfo = ({ - contractName, - chainId, -}: UseDeployedContractConfig) => { +export function useDeployedContractInfo( + config: UseDeployedContractConfig, +): DeployedContractData; +/** + * @deprecated Use object parameter version instead: useDeployedContractInfo({ contractName: "YourContract" }) + */ +export function useDeployedContractInfo( + contractName: TContractName, +): DeployedContractData; + +export function useDeployedContractInfo( + configOrName: UseDeployedContractConfig | TContractName, +): DeployedContractData { const isMounted = useIsMounted(); + const finalConfig: UseDeployedContractConfig = + typeof configOrName === "string" ? { contractName: configOrName } : (configOrName as any); + + if (typeof configOrName === "string") { + console.warn( + "Using `useDeployedContractInfo` with a string parameter is deprecated. Please use the object parameter version instead.", + ); + } + + const { contractName, chainId } = finalConfig; const selectedNetwork = useSelectedNetwork(chainId); const deployedContract = contracts?.[selectedNetwork.id]?.[contractName as ContractName] as Contract; const [status, setStatus] = useState(ContractCodeStatus.LOADING); @@ -58,4 +82,4 @@ export const useDeployedContractInfo = ({ data: status === ContractCodeStatus.DEPLOYED ? deployedContract : undefined, isLoading: status === ContractCodeStatus.LOADING, }; -}; +} diff --git a/packages/nextjs/hooks/scaffold-eth/useScaffoldWriteContract.ts b/packages/nextjs/hooks/scaffold-eth/useScaffoldWriteContract.ts index f8454394b..c061ce464 100644 --- a/packages/nextjs/hooks/scaffold-eth/useScaffoldWriteContract.ts +++ b/packages/nextjs/hooks/scaffold-eth/useScaffoldWriteContract.ts @@ -1,7 +1,7 @@ import { useState } from "react"; import { MutateOptions } from "@tanstack/react-query"; import { Abi, ExtractAbiFunctionNames } from "abitype"; -import { Config, useAccount, useWriteContract } from "wagmi"; +import { Config, UseWriteContractParameters, useAccount, useWriteContract } from "wagmi"; import { WriteContractErrorType, WriteContractReturnType } from "wagmi/actions"; import { WriteContractVariables } from "wagmi/query"; import { useSelectedNetwork } from "~~/hooks/scaffold-eth"; @@ -15,6 +15,34 @@ import { UseScaffoldWriteConfig, } from "~~/utils/scaffold-eth/contract"; +type ScaffoldWriteContractReturnType = Omit< + ReturnType, + "writeContract" | "writeContractAsync" +> & { + isMining: boolean; + writeContractAsync: < + TFunctionName extends ExtractAbiFunctionNames, "nonpayable" | "payable">, + >( + variables: ScaffoldWriteContractVariables, + options?: ScaffoldWriteContractOptions, + ) => Promise; + writeContract: , "nonpayable" | "payable">>( + variables: ScaffoldWriteContractVariables, + options?: Omit, + ) => void; +}; + +export function useScaffoldWriteContract( + config: UseScaffoldWriteConfig, +): ScaffoldWriteContractReturnType; +/** + * @deprecated Use object parameter version instead: useScaffoldWriteContract({ contractName: "YourContract" }) + */ +export function useScaffoldWriteContract( + contractName: TContractName, + writeContractParams?: UseWriteContractParameters, +): ScaffoldWriteContractReturnType; + /** * Wrapper around wagmi's useWriteContract hook which automatically loads (by name) the contract ABI and address from * the contracts present in deployedContracts.ts & externalContracts.ts corresponding to targetNetworks configured in scaffold.config.ts @@ -22,16 +50,27 @@ import { * @param config.chainId - optional chainId that is configured with the scaffold project to make use for multi-chain interactions. * @param writeContractParams - wagmi's useWriteContract parameters */ -export const useScaffoldWriteContract = ({ - contractName, - chainId, - writeContractParams, -}: UseScaffoldWriteConfig) => { +export function useScaffoldWriteContract( + configOrName: UseScaffoldWriteConfig | TContractName, + writeContractParams?: UseWriteContractParameters, +): ScaffoldWriteContractReturnType { + const finalConfig = + typeof configOrName === "string" + ? { contractName: configOrName, writeContractParams, chainId: undefined } + : (configOrName as UseScaffoldWriteConfig); + const { contractName, chainId, writeContractParams: finalWriteContractParams } = finalConfig; + + if (typeof configOrName === "string") { + console.warn( + "Using `useScaffoldWriteContract` with a string parameter is deprecated. Please use the object parameter version instead.", + ); + } + const { chain: accountChain } = useAccount(); const writeTx = useTransactor(); const [isMining, setIsMining] = useState(false); - const wagmiContractWrite = useWriteContract(writeContractParams); + const wagmiContractWrite = useWriteContract(finalWriteContractParams); const selectedNetwork = useSelectedNetwork(chainId); @@ -136,4 +175,4 @@ export const useScaffoldWriteContract = ({ // Overwrite wagmi's writeContract writeContract: sendContractWriteTx, }; -}; +}