NFT's Not Showing Up in the "NFT Balances" Tab in the Boilerplate

Technical Issue Reporting
#1

Hello,

I am using the boiler plate code and just deployed a NFT contract on the Fuji Avalanche testnet. I minted 5 NFT’s (4 for one user and 1 for a different user), and can see the completed transactions on Snowtrace. I can also see the 4 minted NFT records in the Moralis dashboard in the class: AvaxNFTOwners. Below is a screen shot:

Screen Shot 2022-01-23 at 3.53.36 PM
Screen Shot 2022-01-23 at 3.53.36 PM1544×561 124 KB

And below is the link to the NFT contract on Snowtrace:

However, when I look at the “NFT Balances” tab in the boilerplate it does not show any of NFT with the token address: 0xff60ec1891f1238f68371d5573a658842aa97877. i.e. I see 10 out of the 14 NFT’s listed in the AvaxNFTOwners class.

Your help with this will be greatly appreciated. Thanks!

#2

Hey @DeveloperMarwan

It would be nice if you share the console log

#3

Hi @Yomoo , thank you for your reply. The console log is below. Also, I am including a screen shot for what I see in the AvaxNFTOwners class for one address: 0xd1766a94cef16d6a893fa2c5dc210ee13cc79b24 - I only see the NFT with address: 0x53261bf56dca9a665ce71f8da37b53bbaa4d11b8.

Please let me know if any additional information is needed. Thanks for your help with this.

Screen Shot 2022-01-23 at 9.15.53 PM
Screen Shot 2022-01-23 at 9.15.53 PM1516×250 57 KB

Screen Shot 2022-01-23 at 9.21.02 PM
Screen Shot 2022-01-23 at 9.21.02 PM1645×703 37.4 KB

NFTBalance.jsx:67 NFTBalances null
NFTBalance.jsx:67 NFTBalances null
NFTBalance.jsx:67 NFTBalances {total: 1, page: 0, page_size: 500, result: Array(1), status: 'SYNCED'}
NFTBalance.jsx:67 NFTBalances {total: 1, page: 0, page_size: 500, result: Array(1), status: 'SYNCED'}page: 0page_size: 500result: Array(1)0: amount: "1"block_number: "4612554"block_number_minted: "4612554"contract_type: "ERC721"frozen: 0is_valid: 0metadata: nullname: "Salient Yachts"owner_of: "0xd1766a94cef16d6a893fa2c5dc210ee13cc79b24"symbol: "SYONE"synced_at: "2022-01-09T02:51:03.628Z"syncing: 2token_address: "0x53261bf56dca9a665ce71f8da37b53bbaa4d11b8"token_id: "3"token_uri: "https://nft.salientyachts.com3"[[Prototype]]: Objectlength: 1[[Prototype]]: Array(0)status: "SYNCED"total: 1[[Prototype]]: Object
useVerifyMetadata.js:40 GET https://nft.salientyachts.com3/ net::ERR_NAME_NOT_RESOLVED
getMetadata @ useVerifyMetadata.js:40
verifyMetadata @ useVerifyMetadata.js:22
(anonymous) @ NFTBalance.jsx:76
NFTBalance @ NFTBalance.jsx:72
renderWithHooks @ react-dom.development.js:14985
updateFunctionComponent @ react-dom.development.js:17356
beginWork @ react-dom.development.js:19063
beginWork$1 @ react-dom.development.js:23940
performUnitOfWork @ react-dom.development.js:22776
workLoopSync @ react-dom.development.js:22707
renderRootSync @ react-dom.development.js:22670
performSyncWorkOnRoot @ react-dom.development.js:22293
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
scheduleUpdateOnFiber @ react-dom.development.js:21893
dispatchAction @ react-dom.development.js:16139
(anonymous) @ use-immer.module.js:1
(anonymous) @ _useResolveAsyncCall.ts:74
step @ tslib.es6.js:102
(anonymous) @ tslib.es6.js:83
fulfilled @ tslib.es6.js:73
Promise.then (async)
step @ tslib.es6.js:75
(anonymous) @ tslib.es6.js:76
__awaiter @ tslib.es6.js:72
(anonymous) @ _useResolveAsyncCall.ts:54
(anonymous) @ _useResolveAsyncCall.ts:110
invokePassiveEffectCreate @ react-dom.development.js:23487
callCallback @ react-dom.development.js:3945
invokeGuardedCallbackDev @ react-dom.development.js:3994
invokeGuardedCallback @ react-dom.development.js:4056
flushPassiveEffectsImpl @ react-dom.development.js:23574
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushPassiveEffects @ react-dom.development.js:23447
performSyncWorkOnRoot @ react-dom.development.js:22269
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
discreteUpdates$1 @ react-dom.development.js:22420
discreteUpdates @ react-dom.development.js:3756
dispatchDiscreteEvent @ react-dom.development.js:5889
index.js:1 useVerifyMetadata.getMetadata() Error Caught: {err: TypeError: Failed to fetch
    at getMetadata (http://localhost:3000/static/js/main.chunk.js:7433:5…, NFT: {…}, URI: 'https://nft.salientyachts.com3'}
console.<computed> @ index.js:1
(anonymous) @ useVerifyMetadata.js:62
Promise.catch (async)
getMetadata @ useVerifyMetadata.js:60
verifyMetadata @ useVerifyMetadata.js:22
(anonymous) @ NFTBalance.jsx:76
NFTBalance @ NFTBalance.jsx:72
renderWithHooks @ react-dom.development.js:14985
updateFunctionComponent @ react-dom.development.js:17356
beginWork @ react-dom.development.js:19063
beginWork$1 @ react-dom.development.js:23940
performUnitOfWork @ react-dom.development.js:22776
workLoopSync @ react-dom.development.js:22707
renderRootSync @ react-dom.development.js:22670
performSyncWorkOnRoot @ react-dom.development.js:22293
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
scheduleUpdateOnFiber @ react-dom.development.js:21893
dispatchAction @ react-dom.development.js:16139
(anonymous) @ use-immer.module.js:1
(anonymous) @ _useResolveAsyncCall.ts:74
step @ tslib.es6.js:102
(anonymous) @ tslib.es6.js:83
fulfilled @ tslib.es6.js:73
Promise.then (async)
step @ tslib.es6.js:75
(anonymous) @ tslib.es6.js:76
__awaiter @ tslib.es6.js:72
(anonymous) @ _useResolveAsyncCall.ts:54
(anonymous) @ _useResolveAsyncCall.ts:110
invokePassiveEffectCreate @ react-dom.development.js:23487
callCallback @ react-dom.development.js:3945
invokeGuardedCallbackDev @ react-dom.development.js:3994
invokeGuardedCallback @ react-dom.development.js:4056
flushPassiveEffectsImpl @ react-dom.development.js:23574
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushPassiveEffects @ react-dom.development.js:23447
performSyncWorkOnRoot @ react-dom.development.js:22269
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
discreteUpdates$1 @ react-dom.development.js:22420
discreteUpdates @ react-dom.development.js:3756
dispatchDiscreteEvent @ react-dom.development.js:5889
useVerifyMetadata.js:40 GET https://nft.salientyachts.com3/ net::ERR_NAME_NOT_RESOLVED
getMetadata @ useVerifyMetadata.js:40
verifyMetadata @ useVerifyMetadata.js:22
(anonymous) @ NFTBalance.jsx:76
NFTBalance @ NFTBalance.jsx:72
renderWithHooks @ react-dom.development.js:14985
updateFunctionComponent @ react-dom.development.js:17356
beginWork @ react-dom.development.js:19063
beginWork$1 @ react-dom.development.js:23940
performUnitOfWork @ react-dom.development.js:22776
workLoopSync @ react-dom.development.js:22707
renderRootSync @ react-dom.development.js:22670
performSyncWorkOnRoot @ react-dom.development.js:22293
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
scheduleUpdateOnFiber @ react-dom.development.js:21893
dispatchAction @ react-dom.development.js:16139
(anonymous) @ _useResolveAsyncCall.ts:88
step @ tslib.es6.js:102
(anonymous) @ tslib.es6.js:83
fulfilled @ tslib.es6.js:73
Promise.then (async)
step @ tslib.es6.js:75
(anonymous) @ tslib.es6.js:76
__awaiter @ tslib.es6.js:72
(anonymous) @ _useResolveAsyncCall.ts:54
(anonymous) @ _useResolveAsyncCall.ts:110
invokePassiveEffectCreate @ react-dom.development.js:23487
callCallback @ react-dom.development.js:3945
invokeGuardedCallbackDev @ react-dom.development.js:3994
invokeGuardedCallback @ react-dom.development.js:4056
flushPassiveEffectsImpl @ react-dom.development.js:23574
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushPassiveEffects @ react-dom.development.js:23447
performSyncWorkOnRoot @ react-dom.development.js:22269
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
discreteUpdates$1 @ react-dom.development.js:22420
discreteUpdates @ react-dom.development.js:3756
dispatchDiscreteEvent @ react-dom.development.js:5889
index.js:1 useVerifyMetadata.getMetadata() Error Caught: {err: TypeError: Failed to fetch
    at getMetadata (http://localhost:3000/static/js/main.chunk.js:7433:5…, NFT: {…}, URI: 'https://nft.salientyachts.com3'}
console.<computed> @ index.js:1
(anonymous) @ useVerifyMetadata.js:62
Promise.catch (async)
getMetadata @ useVerifyMetadata.js:60
verifyMetadata @ useVerifyMetadata.js:22
(anonymous) @ NFTBalance.jsx:76
NFTBalance @ NFTBalance.jsx:72
renderWithHooks @ react-dom.development.js:14985
updateFunctionComponent @ react-dom.development.js:17356
beginWork @ react-dom.development.js:19063
beginWork$1 @ react-dom.development.js:23940
performUnitOfWork @ react-dom.development.js:22776
workLoopSync @ react-dom.development.js:22707
renderRootSync @ react-dom.development.js:22670
performSyncWorkOnRoot @ react-dom.development.js:22293
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
scheduleUpdateOnFiber @ react-dom.development.js:21893
dispatchAction @ react-dom.development.js:16139
(anonymous) @ _useResolveAsyncCall.ts:88
step @ tslib.es6.js:102
(anonymous) @ tslib.es6.js:83
fulfilled @ tslib.es6.js:73
Promise.then (async)
step @ tslib.es6.js:75
(anonymous) @ tslib.es6.js:76
__awaiter @ tslib.es6.js:72
(anonymous) @ _useResolveAsyncCall.ts:54
(anonymous) @ _useResolveAsyncCall.ts:110
invokePassiveEffectCreate @ react-dom.development.js:23487
callCallback @ react-dom.development.js:3945
invokeGuardedCallbackDev @ react-dom.development.js:3994
invokeGuardedCallback @ react-dom.development.js:4056
flushPassiveEffectsImpl @ react-dom.development.js:23574
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushPassiveEffects @ react-dom.development.js:23447
performSyncWorkOnRoot @ react-dom.development.js:22269
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
discreteUpdates$1 @ react-dom.development.js:22420
discreteUpdates @ react-dom.development.js:3756
dispatchDiscreteEvent @ react-dom.development.js:5889
#4

Hey I tried to resync it and seems to be working, try to check whether you get the NFT or not? I get 2 right now from my side after calling nft/{address}/sync :raised_hands:

#5

Hi @YosephKS,

Yes, I do see 2 of the NFT’s now. That is the good news.

The bad news is that there should be three more from NFT address: 0xae3a7c5c41e824b37c6548cfc1f44603e13db6dc please see the screen shot below for the data in the AvaxNFTOwners class filtered for owner_of = 0xd1766a94cef16d6a893fa2c5dc210ee13cc79b24

Screen Shot 2022-01-24 at 7.24.42 AM
Screen Shot 2022-01-24 at 7.24.42 AM1524×251 57.6 KB

Thanks.

#6

Hi @YosephKS,

Do we need to un nft/{address}/sync whenever a new NFT contract is deployed?

Thanks.

#7

Not necessarily I think, not sure why yours doesn’t appear though :thinking: but btw heads up it’s not recommended anymore to use NFTOwners table as it is going to be moved when nitro comes :raised_hands: