Initializing a contract through the useContract hook almost always results in undefined
.
index.js
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { ThirdwebProvider } from "@thirdweb-dev/react";
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<React.StrictMode>
<ThirdwebProvider
>
<App />
</ThirdwebProvider>
</React.StrictMode>
);
reportWebVitals();
App.js
import Home from "./pages/Home";
function App() {
return (
<Home></Home>
);
}
export default App;
Home.js
import React from 'react';
import { ConnectWallet, ChainId, useContract, useContractWrite } from "@thirdweb-dev/react";
import myABI from "./myABI.json";
function Home() {
const { contract } = useContract("0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48", myABI);
console.log(contract);
console.log(myABI);
return (
<>
<ConnectWallet accentColor="#f213a4" colorMode="dark" />
<h1>Thirdweb</h1>
</>
);
}
export default Home;
myABI.json
[{"constant":false,"inputs":[{"name":"newImplementation","type":"address"}],"name":"upgradeTo","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":false,"inputs":[{"name":"newImplementation","type":"address"},{"name":"data","type":"bytes"}],"name":"upgradeToAndCall","outputs":[],"payable":true,"stateMutability":"payable","type":"function"},{"constant":true,"inputs":[],"name":"implementation","outputs":[{"name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"newAdmin","type":"address"}],"name":"changeAdmin","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"admin","outputs":[{"name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"inputs":[{"name":"_implementation","type":"address"}],"payable":false,"stateMutability":"nonpayable","type":"constructor"},{"payable":true,"stateMutability":"payable","type":"fallback"},{"anonymous":false,"inputs":[{"indexed":false,"name":"previousAdmin","type":"address"},{"indexed":false,"name":"newAdmin","type":"address"}],"name":"AdminChanged","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"name":"implementation","type":"address"}],"name":"Upgraded","type":"event"}]
I am connected using the ConnectWallet button, and the network is the same as the one the contract is on (mainnet, the contract is the address of the USDC token).
Tried it with different ABIs and contract addresses, as well as without any ABI, just the address. Why does this happen? Does the hook work ONLY for contracts deployed using the Thirdweb Dashboard, or what's the case here?