Global Contract Configuration

[justingreenberg]

Motivation

Generally speaking, contract deployments and respective ABIs are static and known at build time and dynamic runtime values are mapped by chain. The current constraints seem to reliably create some frustrating DX:

• wagmi hooks are consumed at the component-level
• hooks that interact with contracts require both an address and abi
• in order to benefit from e2e type safety, ABIs must be inlined or cast to const
• developers are forced to create chain-aware getters for addresses, import ABIs into components or abstract hooks, etc.

Proposal

Allow contracts to be defined on the WagmiProvider.

Possible solution:

type ContractDeploymentsConfig = {
  [contractName: string]: {
    abi: Abi
    deployments: {
      // must map to `configureChains`
      [chainId: number]: Address
    }
  }
}

const contracts: ContractDeploymentsConfig = {
  dai: {
    abi: erc20ABI,
    deployments: {
      [chain.mainnet.id]: '0x6b175474e89094c44da98b954eedeac495271d0f',
      [chain.polygon.id]: '0x8f3cf7ad23cd3cadbd9735aff958023239c6a063',
    },
  },
  myDaiVault: {
    abi: [...] as const,
    deployments: {
      [chain.mainnet.id]: '0x6b175474e89094c44da98b954eedeac495271d0f',
      [chain.polygon.id]: '0x8f3cf7ad23cd3cadbd9735aff958023239c6a063',
    },
  },
}

Hook usage

We would want to add one additional hook to access chain-aware deployments useDeployment which returns the correct address in order to facilitate composition with other hooks

function Vault() {
  const { address: userAddress } = useAccount()

  // get chain-aware deployment address for app contract
  const { address: vaultAddress } = useDeployment({
    name: 'myDaiVault', // mapped contract key
  })

  const { data: daiVaultAllowance } = useContractRead({
    name: 'dai', // mapped contract key
    functionName: 'allowance', // erc20ABI
    args: [userAddress, vaultAddress],
  })

  return ...
}

While this is mainly to improve the DX for react developers, the benefits could be extended to core library by accepting configuration when instantiating client

const { chain, provider, webSocketProvider } = configureChains(
  [chain.mainnet, chain.polygon],
  [publicProvider()]
)

const client = createClient({
  autoConnect: true,
  provider,
  webSocketProvider,
  contracts, // <~~ contract configuration
})

function App() {
  return (
    <WagmiConfig client={client}>
      <Vault />
    </WagmiConfig>
  )
}

Similar to other configurations, global configuration would always be overridden by config passed to hooks

[tmm]

Thanks for the feedback! We have an in-progress feature that achieves something similar. Expect more on it soon.

[justingreenberg]

awesome 😎

happy to assist with implementation if you wanna loop me in i’m greenbergz on telegram

[zapnap]

came here looking for exactly this