feat(Bounty): Bring the new experience of showing NFT [ethshanghai]

[agangdi]

Description

• Bring the new experience of showing nft
• Show NFT badge after avatar in your post-Twitter content
• Explore NFT holders with one click

How it works:

• Bind the Twitter user-id with the wallet address on the profile page
• Fetch NFT badge with wallet address from Opensae
• Selector each post content and get NFT badges with the Twitter user-id

Closes # (https://github.com/DimensionDev/Maskbook/issues/6311)

Type of change

• [ ] Documentation
• [ ] Code refactoring (Restructuring existing code w/o changing its observable behavior)
• [ ] Bug fix (non-breaking change which fixes an issue)
• [x] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (a fix or feature that would make something no longer possible to do/require old user must upgrade their Mask Network to this new version)

Previews

Demo VVideo

https://www.youtube.com/watch?v=u5TIVFBH270

Checklist

• [x] My code follows the style guidelines of this project.
• [x] I have performed a self-review of my own code.
  • [x] I have removed all in development console.logs
  • [x] I have removed all commented code.
• [x] I have commented on my code, particularly in hard-to-understand areas.
• [x] I have read Internationalization Guide and moved text fields to the i18n JSON file.

If this PR depends on external APIs:

• https://soul.sustainablebtc.org/get_badges_by_address

• https://soul.sustainablebtc.org/get_twitters_by_badge

• [x] I have configured those APIs with CORS headers to let extension requests get passed.

  • chrome extension: chrome-extension://[id]
  • firefox extension: moz-extension://[id]

• [ ] I have delegated all web requests to the background service via the internal RPC bridge.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.