Integrate NFTE component on NEAR

[bestatigen]

Create a component that gets, as props, the address of the NFT contract on NEAR (ex. 0.share-nft.testnet) and token_id, and proceeds to retrieve token metadata from the contract and show it. Add the component in StoryBook with a few examples.
The method to call on the contract is nft_token. As there is no proper design for this, use projectCard.tsx as inspiration.

Need to be discussed in the comments, or separately, on how to approach this best but the component shouldn't have a user signed in, to NEAR, to work (retrieving information from the blockchain is actually free of gas costs in this case, so it should work).

The following contracts are NFTs and should be used in the examples. hooks and eventually components package needs to be used for the component.

ml1c.ysn-1_0_0.ysn.testnet
ml1w.ysn-1_0_0.ysn.testnet
0.share-nft.testnet
apparitions.art-blocks.testnet
squiggle.art-blocks.testnet

Links

• https://github.com/contextart/nfte
• https://nfte.app
• https://docs.near.org/docs/develop/front-end/near-api-js

[bestatigen]

Creating something like this is easier once @cura/components and @cura/hooks are more stable. If you could spin up a project, import these two packages together, and showcase an NFT then it's pretty close to what you would get from importing NFTE.

[bestatigen]

This should be a good exercise issue now.

[DevLubab]

Hey @devey, I would like to get your feedback before PR about the new component. Also, there is an issue with the NFT display which I will find a solution for first.

NFTE component:
https://6172ea299f78dc003a6c934a-sxpaegeerj.chromatic.com/?path=/docs/components-nfte--light

Also, made an update to the Metadata component design:
https://6172ea299f78dc003a6c934a-sxpaegeerj.chromatic.com/?path=/docs/components-metadata--loading

For source, check today commits
https://github.com/achrafismyname/source/commits/components

[bestatigen]

Great direction @achrafismyname!

I checked the code and, besides a couple of minor comments on the Metadata (looks great) and Placeholder, I think you can open a PR and We iterate together on the NFTE. It looks already good. We just might want to clean up the code a bit, support mainnet in the examples, and extract the fetching code somewhere else.