Fix wagmi/cli react plugin incompatible Address type for usePrepare a…

…nd useFunctionWrite (#1916) * remove hardcoding of 0x{String} instead use Address type for react plugin - wagmi/cli * add changeset * chore: update changeset --------- Co-authored-by: Tom Meagher <[email protected]>
wevm · Feb 28, 2023 · 950490f · 950490f · vercel · Feb 28, 2023
1 parent b566c9b
commit 950490f
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/.changeset/strange-cooks-rush.md b/.changeset/strange-cooks-rush.md
@@ -0,0 +1,5 @@
+---
+'@wagmi/cli': patch
+---
+
+Updated React plugin to use `Address` type instead of hardcoding `` `0x{string}` ``.
diff --git a/packages/cli/src/plugins/react.ts b/packages/cli/src/plugins/react.ts
@@ -287,7 +287,10 @@ export function react(config: ReactConfig = {}): ReactResult {
                 ? `TChainId extends number = keyof typeof ${contract.meta.addressName}`
                 : ''
               let typeParams_ = ''
-              if (TChainId) typeParams_ = 'address?: never; chainId?: TChainId;'
+              if (TChainId) {
+                imports.add('Address')
+                typeParams_ = 'address?: never; chainId?: TChainId;'
+              }
 
               imports.add('UseContractWriteConfig')
               if (!hasWriteContractMode) actionsImports.add('WriteContractMode')
@@ -305,7 +308,7 @@ export function react(config: ReactConfig = {}): ReactResult {
                       TMode,
                       PrepareWriteContractResult<typeof ${contract.meta.abiName}, string>['abi'],
                       TFunctionName
-                    >${TChainId ? ` & { address?: \`0x\${string}\`; chainId?: TChainId; }` : ''}
+                    >${TChainId ? ` & { address?: Address; chainId?: TChainId; }` : ''}
                   : UseContractWriteConfig<TMode, typeof ${contract.meta.abiName}, TFunctionName> & {
                       abi?: never
                       ${typeParams_}
@@ -360,7 +363,8 @@ export function react(config: ReactConfig = {}): ReactResult {
                   let preparedTypeParams = `functionName?: '${item.name}'`
                   let unpreparedTypeParams = `functionName?: '${item.name}'`
                   if (TChainId) {
-                    preparedTypeParams = `address?: \`0x\${string}\`; chainId?: TChainId; functionName?: '${item.name}'`
+                    imports.add('Address')
+                    preparedTypeParams = `address?: Address; chainId?: TChainId; functionName?: '${item.name}'`
                     unpreparedTypeParams = `address?: never; chainId?: TChainId; functionName?: '${item.name}'`
                   }