refactor: addressOrName to address (#1203)

.changeset/chatty-horses-admire.md

@@ -0,0 +1,22 @@
+---
+'@wagmi/core': minor
+---
+
+**Breaking**: `addressOrName` renamed to `address` for `fetchBalance` and `fetchEnsAvatar`.
+
+```diff
+const result = await fetchBalance({
+- addressOrName: '0x…',
++ address: '0x…',
+})
+```
+
+If you were using an ENS name instead of an address, you can resolve the name to an address before passing it to the action.
+
+```diff
++ const { data: address } = await fetchEnsAddress({ name: 'example.eth' })
+const result = await fetchBalance({
+- addressOrName: 'example.eth',
++ address,
+})
+```

.changeset/spotty-timers-prove.md

@@ -0,0 +1,22 @@
+---
+'wagmi': minor
+---
+
+**Breaking**: `addressOrName` renamed to `address` for `useBalance` and `useEnsAvatar`.
+
+```diff
+const result = useBalance({
+- addressOrName: '0x…',
++ address: '0x…',
+})
+```
+
+If you were using an ENS name instead of an address, you can resolve the name to an address before passing it to the action.
+
+```diff
++ const { data: address } = useEnsAddress({ name: 'example.eth' })
+const result = useBalance({
+- addressOrName: 'example.eth',
++ address,
+})
+```

docs/components/web3/Account.tsx

@@ -13,7 +13,7 @@ export function Account() {
     chainId: 1,
   })
   const { data: ensAvatarData } = useEnsAvatar({
-    addressOrName: address,
+    address,
     chainId: 1,
   })
   const { disconnect } = useDisconnect()

docs/pages/docs/hooks/useBalance.en-US.mdx

@@ -18,7 +18,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const { data, isError, isLoading } = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
   })
 
   if (isLoading) return <div>Fetching balance…</div>
@@ -65,16 +65,16 @@ function App() {
 
 ## Configuration
 
-### addressOrName (optional)
+### address (optional)
 
-Address or ENS name to fetch balance for. If `addressOrName` is not defined, hook will not run.
+Address to fetch balance for. If `address` is not defined, hook will not run.
 
 ```tsx {5}
 import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
   })
 }
 ```
@@ -88,7 +88,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     chainId: 1,
   })
 }
@@ -103,22 +103,22 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     formatUnits: 'gwei',
   })
 }
 ```
 
 ### token (optional)
 
-Address for ERC-20 token. If `token` is provided, hook fetches token balance instead of Ethereum balance. For example, we can fetch `awkweb.eth`'s current [$UNI](https://etherscan.io/address/0x1f9840a85d5af5bf1d1762f925bdaddc4201f984) balance.
+Address for ERC-20 token. If `token` is provided, hook fetches token balance instead of Ethereum balance. For example, we can fetch `0xA0Cf798816D4b9b9866b5330EEa46a18382f251e`'s current [$UNI](https://etherscan.io/address/0x1f9840a85d5af5bf1d1762f925bdaddc4201f984) balance.
 
 ```tsx {6}
 import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     token: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
   })
 }
@@ -133,7 +133,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     watch: true,
   })
 }
@@ -148,7 +148,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     cacheTime: 2_000,
   })
 }
@@ -163,7 +163,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     enabled: false,
   })
 }
@@ -178,7 +178,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     staleTime: 2_000,
   })
 }
@@ -193,7 +193,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     suspense: true,
   })
 }
@@ -208,7 +208,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     onError(error) {
       console.log('Error', error)
     },
@@ -225,7 +225,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     onSettled(data, error) {
       console.log('Settled', { data, error })
     },
@@ -242,7 +242,7 @@ import { useBalance } from 'wagmi'
 
 function App() {
   const balance = useBalance({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     onSuccess(data) {
       console.log('Success', data)
     },

docs/pages/docs/hooks/useEnsAvatar.en-US.mdx

@@ -18,7 +18,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const { data, isError, isLoading } = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
   })
 
   if (isLoading) return <div>Fetching avatar…</div>
@@ -51,16 +51,16 @@ function App() {
 
 ## Configuration
 
-### addressOrName (optional)
+### address (optional)
 
-Address or ENS name to fetch avatar for. If `addressOrName` is not defined, hook will not run.
+Address or ENS name to fetch avatar for. If `address` is not defined, hook will not run.
 
 ```tsx {5}
 import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'moxey.eth',
+    address: '0xa5cc3c03994db5b0d9a5eedd10cabab0813678ac',
   })
 }
 ```
@@ -74,7 +74,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     chainId: 1,
   })
 }
@@ -89,7 +89,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     cacheTime: 2_000,
   })
 }
@@ -104,7 +104,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     enabled: false,
   })
 }
@@ -119,7 +119,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     staleTime: 2_000,
   })
 }
@@ -134,7 +134,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     suspense: true,
   })
 }
@@ -149,7 +149,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     onSuccess(data) {
       console.log('Success', data)
     },
@@ -166,7 +166,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     onError(error) {
       console.log('Error', error)
     },
@@ -183,7 +183,7 @@ import { useEnsAvatar } from 'wagmi'
 
 function App() {
   const ensAvatar = useEnsAvatar({
-    addressOrName: 'awkweb.eth',
+    address: '0xA0Cf798816D4b9b9866b5330EEa46a18382f251e',
     onSettled(data, error) {
       console.log('Settled', { data, error })
     },

docs/pages/docs/migration-guide.en-US.mdx

@@ -20,6 +20,52 @@ If you are coming from an earlier version of `wagmi`, you will need to make sure
 
 wagmi no longer supports CommonJS and only supports [ES Modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules). If you are using modern tooling, like [Next.js](https://nextjs.org), [Vite](https://vitejs.dev), or [Vitest](https://vitest.dev), you likely don't need to do anything! [Remix](https://remix.run/docs/en/v1/pages/gotchas#importing-esm-packages) and [Jest](https://jestjs.io/docs/ecmascript-modules) require some additional configuration. Check out [this guide](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c) for more info on ESM support and Frequently Asked Questions across various tools and setups.
 
+### `useBalance`
+
+#### Configuration changes
+
+`addressOrName` renamed to `address`.
+
+```diff
+const result = useBalance({
+- addressOrName: '0x…',
++ address: '0x…',
+})
+```
+
+If you were using an ENS name instead of an address, you can resolve the name to an address before passing it to the action.
+
+```diff
++ const { data: address } = useEnsAddress({ name: 'example.eth' })
+const result = useBalance({
+- addressOrName: 'example.eth',
++ address,
+})
+```
+
+### `useEnsAvatar`
+
+#### Configuration changes
+
+`addressOrName` renamed to `address`.
+
+```diff
+const result = useEnsAvatar({
+- addressOrName: '0x…',
++ address: '0x…',
+})
+```
+
+If you were using an ENS name instead of an address, you can resolve the name to an address before passing it to the action.
+
+```diff
++ const { data: address } = useEnsAddress({ name: 'example.eth' })
+const result = useEnsAvatar({
+- addressOrName: 'example.eth',
++ address,
+})
+```
+
 ## 0.7.x Breaking changes
 
 <Callout>
@@ -70,7 +116,7 @@ If you were using an ENS name instead of an address, you can resolve the name to
 ```diff
 - import { useContractRead } from 'wagmi'
 + import { useContractRead, useEnsAddress } from 'wagmi'
-+ const { data: address} = useEnsAddress({ name: 'example.eth'})
++ const { data: address } = useEnsAddress({ name: 'example.eth' })
 const result = useContractRead({
 - addressOrName: 'example.eth',
 + address,

docs/pages/examples/connect-wallet.en-US.mdx

@@ -15,7 +15,9 @@ The example below uses [`useConnect`](/docs/hooks/useConnect), [`useAccount`](/d
 <ConnectWallet />
 
 <Callout emoji="🚀">
-  Check out [ConnectKit](https://docs.family.co/connectkit?utm_source=wagmi-dev) to get started with pre-built interface on top of wagmi for managing wallet connections.
+  Check out [ConnectKit](https://docs.family.co/connectkit?utm_source=wagmi-dev)
+  to get started with pre-built interface on top of wagmi for managing wallet
+  connections.
 </Callout>
 
 ## Step 1: Configuring Connectors
@@ -132,7 +134,7 @@ import {
 
 export function Profile() {
   const { address, connector, isConnected } = useAccount()
-  const { data: ensAvatar } = useEnsAvatar({ addressOrName: address })
+  const { data: ensAvatar } = useEnsAvatar({ address })
   const { data: ensName } = useEnsName({ address })
   const { connect, connectors, error, isLoading, pendingConnector } =
     useConnect()

examples/_dev/src/components/Account.tsx

@@ -21,7 +21,7 @@ export const Account = () => {
     onDisconnect: () => console.log('disconnected'),
   })
   const ensAvatar = useEnsAvatar({
-    addressOrName: account?.address,
+    address: account?.address,
     chainId: 1,
   })
   const ensName = useEnsName({ address: account?.address, chainId: 1 })