nibbstack / erc721

The reference implementation of the ERC-721 non-fungible token standard.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Help in displaying all minted tokens

erectilereptiles opened this issue · comments

Hi! I am using this token along with my team members for our final year university project. I asked a question a couple of weeks back (forgive me I am still unsure of how to label this a question) and just had another question. So we are meant to be tokenising a personal loan (as an asset). The following is the code from remix as we are using it:

We are then calling these (and the other functions the token already had such as ownerOf) from our react developed front end. So as we are meant to be mimicking a bank interface, where the tokens represent personal loans, we need to display all of the tokens that are minted. Currently we can use functions such as mint from the interface by having text boxes, then passing the values of the text boxes as the parameters of the functions. This definitely works and we can for example call multiple functions with one parse - we have a text box for tokenID and then parse that in multiple async functions to retrieve data associated to that tokenID such as owner address, rate, amount etc. We need a way to display all tokens that have been minted in a listview or listbox now so that when a user logs in they are shown the "Active Loans" page where each minted token (and perhaps some data surrounding it such as amount and rate) are displayed in a grid.

I just want to know if this is a method i can/need to implement on remix? Or if this is a method i need to implement on react side and maybe some tips or help in doing whichever it is. If i know tokens with ID 1, 2, & 3 have been minted, technically i could call all the info of those 3 on startup using multiple functions such as "getRate" and "ownerOf" and display it in a grid, but this is not very elegant and how would i then know which tokenID's exist/have been minted. Additionally, how would i then add a newly minted tokens information to this list after a token has been minted?

Any help would be greatly appreciated!

// SPDX-License-Identifier: MIT
pragma solidity 0.8.6;
 
import "https://github.com/0xcert/ethereum-erc721/src/contracts/tokens/nf-token-metadata.sol";
import "https://github.com/0xcert/ethereum-erc721/src/contracts/ownership/ownable.sol";
 
contract newNFT is NFTokenMetadata, Ownable {
    
  constructor() {
    
    nftName = "Innov8 Token";
    nftSymbol = "NVT";
        
  }
  function mint(address _to, uint256 _tokenId, string calldata _uri, uint256 amount, uint256 rate,uint256 term, string memory start, string memory end) external onlyOwner {
    super._mint(_to, _tokenId);
    super._setTokenUri(_tokenId, _uri);
    tokenidToloanamount[_tokenId] = amount;
    tokenidTointerestrate[_tokenId] = rate;
    tokenidTotermmonths[_tokenId] = term;
    tokenidTostartdate[_tokenId] = start;
    tokenidToenddate[_tokenId] = end;
  }
  
  function burn (uint256 _tokenId) external onlyOwner {
    super._burn(_tokenId);
    delete tokenidToloanamount[_tokenId];
    delete tokenidTointerestrate[_tokenId];
    delete tokenidTotermmonths[_tokenId];
  }
  
  
  function getLoanAmount (uint256 _tokenId) public view returns (uint256 amount) {
      amount = tokenidToloanamount[_tokenId];
      return amount;
  }
  
  function getRate (uint256 _tokenId) public view returns (uint256 rate) {
      rate = tokenidTointerestrate[_tokenId];
      return rate;
  }
  
  function getTerm (uint256 _tokenId) public view returns (uint256 term) {
      term = tokenidTotermmonths[_tokenId];
      return term;
  }
  
  function getStartDate (uint256 _tokenId) public view returns (string memory start) {
      start = tokenidTostartdate[_tokenId];
      return start;
  }
  
  function getEndDate (uint256 _tokenId) public view returns (string memory end) {
      end = tokenidToenddate[_tokenId];
      return end;
  }
   mapping (uint256 => uint256) public tokenidToloanamount;
   mapping (uint256 => uint256) public tokenidTointerestrate;
   mapping (uint256 => uint256) public tokenidTotermmonths;
   mapping (uint256 => string) public tokenidTostartdate;
   mapping (uint256 => string) public tokenidToenddate;
 
}

@erectilereptiles please edit your question and put your code into '''sol ... ''' brackets. It's very difficult to read code in the current format (as text).

@erectilereptiles please edit your question and put your code into '''sol ... ''' brackets. It's very difficult to read code in the current format (as text).

sorry about that!

@erectilereptiles If you want to list tokens you should look at enumerable extension:
https://github.com/0xcert/ethereum-erc721/blob/master/src/contracts/mocks/nf-token-metadata-enumerable-mock.sol

Enumerable adds a few new methods:
https://github.com/0xcert/ethereum-erc721/blob/master/src/contracts/tokens/erc721-enumerable.sol

This way you can call: totalSupply to get amount of existing tokens and iterate from 0 < totalSupply and call tokenByIndex to get IDs of all existing tokes.

Similarly you can call balanceOf(owner) to get amount of user tokens and then iterate and call tokenOfOwnerByIndex to get that specific owners tokens.

For each ID you get you can then call tokenUri or other functions to get details you are interested about.

Hope this answers your question.

@MoMannn Thank you so much for this! I will try implementing it as soon as i can and maybe get back to you if have any trouble? If thats okay!

@MoMannn Sorry i am just a bit confused as to how i get the enumerable extension? Is the enumerable extension all of the regular functionality with the addition of things like total supply? I simply used the example implementation given on the page. I am using Remix IDE. How to i instead import the one that includes the total supply functions and whatever else is included in the enumerable extension? I really appreciate all of the help you are providing me with as a student it is valuable for learning!

The example is only with metedata extension. Check the code here to see how to use enumerable extension:

https://github.com/0xcert/ethereum-erc721/blob/master/src/contracts/mocks/nf-token-metadata-enumerable-mock.sol

You can also checkout tests to see some basic usage:

https://github.com/0xcert/ethereum-erc721/blob/master/src/tests/tokens/nf-token-metadata-enumerable.js

Otherwise I would suggest reading and learning more about erc721 and how it works:

@MoMannn Thank you so much! I totally understand what you are saying after playing around in remix a bit! I just want a bit of advice maybe and then the issue can be closed! So i can call the total supply method in react.js (which is what we are using for our interface) and then the console logs the correct number! My though process is creating an array from 0 up until total supply. So with 5 tokens out we'll have 0,1,2,3,4 in an array. Then use a foreach statement to pass each number in the array to tokenbyindex to get the ids, then add all ids to another array. Similarly, use a foreach statement for each number (id) in the second array to get all info for each token id. Is this a good solution? Also should all of this be done in the app.js correct? Or do you think there would be a better way to do some of it in remix itself? Any info is appreciated and then the comment can be closed! Thanks so much for all your help its been invaluable.

That is the correct way yes. if you want tokens for only specific user you call balanceOf(address) and then tokenOfOwnerByIndex(address, index).

You should do this in app.js and it he only way to get this information directly from chain.

Ok, then I am closing this issue. Glad I could help.