I have built NFT staking website and it is working properly except that I forced to show the image update when staking or unstaking. That is because immediate update of image cannot be done with moralis getnftforcontract api and opensea api. The code is following.
const get_balanceUrls = async () => {
await Moralis.Web3API.initialize({ apiKey: WEB3APIKEY });
const options = { chain: CHAINETHID, address: walletAddress, token_address: G_ADDRESS, };
let ownedNFTs = await Moralis.Web3API.account.getNFTsForContract(options);
console.log("owning NFTS", ownedNFTs.result);
let stakedNFTs = Object.values(balanceofstakes);
if(ownedNFTs.result.length == 0 && nft_unstakeBalance.length == 0) {
setBalanceImageUrl([]);
return;
}
let token_ids = "";
ownedNFTs.result.map((value, index) => {
if(stakedNFTs.indexOf(value.token_id) < 0) {
token_ids += 'token_ids=' + value.token_id + "&";
}
})
nft_unstakeBalance.map((value, index) => {
token_ids += 'token_ids=' + value + "&";
});
if(token_ids == "") {
setBalanceImageUrl([]);
return;
}
console.log("token_ids", token_ids)
let assets = await Axios.get(`${OPENSEA_URL}assets?
order_direction=desc&offset=0&limit=20&${token_ids}asset_contract_address=${G_ADDRESS}`)
.then(res => {
console.log("balanceurl", res);
return res.data.assets;
})
.catch(err => {
console.log(err);
return [];
});
setBalanceImageUrl(assets);
}
I think there should be more convenient way to solve this issue. If you know, feel free to answer or discuss with me.