Cannot read properties of null (reading 'methods') in web3

Viewed 69

I am working on a web3 dapp for token sale and staking platform. The connect to wallet, buying of token, fetching of token and displaying it's balance works real fine. However, I get an error staking the token and fetching the staking records, I get this error:

Unhandled Rejection (TypeError): Cannot read properties of null (reading 'methods')

It is deployed on rinkeby network and here's the link: https://doxa-staking.netlify.app/.

I don't know if the problem is from the contract. Here's the staking contract: 0xAD015a006755b389d8e5BC2680cc5081dc1d0abd

1: https://rinkeby.etherscan.io/address/0xAD015a006755b389d8e5BC2680cc5081dc1d0abd#code deployed on rinkeby network.

https://i.stack.imgur.com/gkODT.png

Here in line 73 of my code, I passed in getStakeRecords() in componentDidMount

await this.getStakeRecords();

passed in this.getStakeRecords(); in componentDidUpdate like so

this.getStakeRecords();

This is the line where I am getting the error

const totalStakeRecord = await staking.methods <<< Getting the error

The entire code:

getStakeRecords = async () => {
   const { web3, staking, address } = this.props.wallet;
   const totalStakeRecord = await staking.methods  // Getting the error
     .totalStakeRecords(address)
     .call();
   const stakersPromises = [];
   for (let i = 0; i < totalStakeRecord; i++) {
     stakersPromises.push(staking.methods.Stakers(address, i).call());
   }

   Promise.all(stakersPromises).then(async (res) => {
     await Promise.all(
       res.map(async (data, i) => {
         data.balance = web3.utils.fromWei(data.balance, "ether");
         let earned = await staking.methods.earned(address, i).call();
         data.rewardEarned = web3.utils.fromWei(earned, "ether").split(".")[0];
         data.apr = this.calculateAPR(parseInt(data.lockingPeriod));

         const time = Math.floor(
           Math.floor(data.maxTime - Date.now() / 1000) / 60
         );
         data.timeleft = time < -1 ? -1 : time;
       })
     );
     if (res.length > 0) {
       this.setState({ stakeRecords: res });
     }
   });
 };

The stake method:

 stakeAZO = async () => {
   this.setState({ stakeloading: true });
   let type;
   if (this.state.stakeType) {
     type = 1;
   } else type = 0;

   if (this.state.stakeValue > 0 && this.state.yearsValue > 0) {
     const { web3, staking, token, address } = this.props.wallet;
     const tokenAmount = web3.utils.toWei(
       this.state.stakeValue.toString(),
       "ether"
     );
     var time = Date.now();
     console.log("address", [
       address,
       process.env.REACT_APP_DOXACONTRACT_ADDRESS,
       tokenAmount,
       type,
       this.state.yearsValue,
       time,
     ]);
     const requestOptions = {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
         Accept: "application/json",
       },
       body: JSON.stringify({
         userAddress: address,
         contractAddress: process.env.REACT_APP_DOXACONTRACT_ADDRESS,
         amount: tokenAmount,
         id: type,
         noOfDays: this.state.yearsValue,
         timestamp: time,
       }),
     };
     const response1 = await fetch(
       process.env.REACT_APP_API_URL + "/getsignature",
       requestOptions
     );
     const data1 = await response1.json();
     var signaturelkn = data1.result;
     var sigtuplelkn = [
       address,
       process.env.REACT_APP_DOXACONTRACT_ADDRESS,
       tokenAmount,
       type,
       this.state.yearsValue,
       time,
       signaturelkn,
     ];
     try {
       const stake = await staking.methods
         .stake(tokenAmount, this.state.yearsValue, sigtuplelkn)
         .send({ from: address });
       this.setState({ stakeloading: false });
     } catch (err) {
       console.log(err);
       this.setState({ stakeloading: false });
     }
     // console.log(stake);
     this.getStakeRecords(); **<<<<< Passed the stakerecord here**
     if (this.state.stakeType) {
       this.getTokenBalance();
       this.setState({ stakeloading: false });
     }
   } else {
     this.setState({ stakeloading: false });
     alert("Amount of AZO or days should be more than 0!");
   }
 };

Here is the complete source code of the staking codes:

https://github.com/isofttechn/staking-dapp/blob/main/src/components/Home/index.js

0 Answers
Related