Verify Contract Details

[blackdevelopa]

Development & PR Process

1. Follow MetaMask Mobile Coding Standards
2. Add release-xx label to identify the PR slated for a upcoming release (will be used in release discussion)
3. Add needs-dev-review label when work is completed
4. Add needs-qa label when dev review is completed
5. Add QA Passed label when QA has signed off

Description
The aim of this code (PR) is to provide more insights before approving a transaction. There will now be the option to learn more about the contract and token involved and to verify these addresses, as well as add familiar addresses to the Contact list.
https://github.com/MetaMask/MetaMask-planning/issues/179

Write a short description of the changes included in this pull request, also include relevant motivation and context. Have in mind the following questions,
1. What is the reason for the change?
2. What is the improvement/solution?

See design

Screenshots/Recordings
Before
http://recordit.co/luMSaC7IrQ

After
http://recordit.co/ecgFtvxIox

On smaller device (SE)
http://recordit.co/bLxbYGJJyP

Todo:

• Show a default (loading) token (image) state while fetching address details
• Hide block explorer icon if block explorer url isn't provided
• Show warning of potential fund loss when adding token address. See here

If applicable, add screenshots and/or recordings to visualize the before and after of your change

Issue

Test Case
Update in a bit

Progresses https://github.com/MetaMask/MetaMask-planning/issues/179

Checklist

• There is a related GitHub issue
• Tests are included if applicable
• Any added code is fully documented

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[tommasini]

Hey, @blackdevelopa great job here!

Left some questions/suggestions.

[tommasini]

Thanks! LGTM!

[jpuri]

I added some NIT feedbacks.

PR is huge and touches important part of code. Thus QA is very important.

For complex changes smaller PRs with test coverage help a lot.

[seaona]

The issue above is fixed. Few things:

• This PR needs to go over the dev review process again before being merged, so I've added the needs-red-review label
• This PR cannot be introduced in the 6.2 release, as we need to fix the pending issues (the different tickets that @bschorchit created)
• Once all issues are fixed, all the corresponding PRs should target the same release and we can add the release label

Let me know if this sounds good @bschorchit @blackdevelopa

[bschorchit]

The issue above is fixed. Few things:

• This PR needs to go over the dev review process again before being merged, so I've added the needs-red-review label

Would you mind giving this a final re-review once you have a chance, @jpuri ? Once this is re-reviewed, we'll merge this PR and address the non-blocking issues found during QA as part of the tickets tagged above. 🧡

[jpuri]

Looks good for merge 👍

cc @bschorchit , @blackdevelopa

[jpuri]

Plz ignore PR closing, that was accidental.

[bschorchit]

We're now following the practice of 2 reviews for confirmations mobile PRs, would you mind also giving this a re-review to check the latest changes @tommasini? Thank you 🧡

[tommasini]

Thanks for the tag @bschorchit!
Let me know your thoughts @blackdevelopa 🙌

[blackdevelopa]

Thank you @tommasini. Good catch.

[tommasini]

Thanks! LGTM! Awesome work! 🚀

[bschorchit]

🚀🚀🚀

[seaona]

Looks good! I merge the PR.
Notice, for SetApprovalForAll and Revoke custom screens, we should also add the Verify Contract Details. At the moment, we don't have custom screens for these cases on Mobile, but whenever we add them, we should take this into account.

cc @bschorchit @blackdevelopa