Contributor see a Token tab in the Address page

[igorffs]

As a Contributor, I want to see a Token tab in the Address Details page, where I can see the list of Tokens the Address holds, as well as see the Token Transfers for each of those Tokens.

https://projects.invisionapp.com/share/8EMX9IOR2V9#/screens/308371747

Acceptance Criteria

• Add a Tokens tab in the Address Details page, where there should be a list with all the Tokens that specific Address has been involved in transfers.
  • For each Token, there should be possible to see the following information:
    • Token name
      • If the token has no name, display the token Address or part of it.
    • Number of transfers (in which the associated Address has been involved)
    • The token type (ERC-20 or ERC-721)
  • There should be possible to paginate the Tokens list.

Out of Scope

• This issue doesn't include the search field as shown in the mockup.
• This issue doesn't include the token icons as shown in the mockup.
• This issue doesn't include the filtered list of token transfers as shown in the mockup (see Contributor can filter the Token Transfers by Token in the Token tab at the Address page #561)
• This issue doesn't include the balances for the Tokens list (it depends on Index Tokens balances per Address #514; see Contributor sees the Token balance for each Token listed in the Token tab for the Address page #564).

Tasks

• Create a query to get all tokens an address interacted with;
• Build a query that counts the token transfers from the given address (maybe we can reuse the query above);
• Create a controller to centralize the list of tokens given an address;
• Refactor the token's list at the dropdown to use the new controller; (not needed anymore)
• Create a new tab on the Address Details page;
• Build the front-end;
  • List the tokens that address has interacted with. Each token goes on its own card, with the following information:
  • Token name, or token address if it has no name;
  • Number of transfers that involved both that address and that token;
  • Add pagination;
  • Add links.

[gfreh]

@acravenho Based on the discussion we've just had at Gaslight's standup, we believe we should prioritize this issue. We've updated the scope in the comment above and removed the balance related parts for now because it depends on #514.

For the balance related parts, we believe the best approach would be creating a new issue with the following description:

• For each Token, there should be possible to see the following information:
  • Token balance (for the associated address) followed by the token symbol.
    • For ERC20 Tokens, the balance should be formatted as currency (thousands and decimal separators) considering the token's decimals info (if there is no decimals info, display the formatted amount). Example: 999,000.02 FREH
    • For ERC721 Tokens, the balance of non-fungible tokens. Example: 803,843 CK
    • In case the Token has no symbol, show nothing next to the amount.

[acravenho]

Do you think the number of transfers between that token and the account address should be included? I think this is a good metric to show.

The rest of the items look accurate 👍

[gfreh]

@acravenho do you mean in the Tokens tab? This is already in the acceptance criteria (it should be shown below the token name in the Token list).

[acravenho]

Perfect. I must have missed it.

[lucasnar]

Besides the questions in the PR description, we thought of this one:

• If the address hasn't interacted with any tokens, should we display this tab? If yes, what should be inside it?

[acravenho]

@lucasnar No, we should not display the tab.

[gfreh]

@acravenho two comments here:

Firstly, we've split this issue in three as follows. This way, we believe we can reduce merge code faster and accelerate the feedback loop.

1. This one will handle displaying the tokens list with the number of transfers.
2. Contributor can filter the Token Transfers by Token in the Token tab at the Address page #561 will handle clicking on a token item and displaying the list of token transfers.
3. Contributor sees the Token balance for each Token listed in the Token tab for the Address page #564 will handle displaying the token balances in the list (this also depends on Index Tokens balances per Address #514).

Also, there are some other questions in the issue's first comment. Would you mind taking a look at them, please?

[acravenho]

@gfreh I'm not seeing the questions you're referring to.