fix(profile): show first nft image as metadata

[roiLeo]

#465 related

[yangwao]

Seems doesn't work in tg or Twitter 👀

Any idea what's could going on?
However through some meta plugin I see there is og:image and twitter:image as well

[yangwao]

you need to rename that default file as you mentioned hash bundle there

[yangwao]

Still doesn't render...
Maybe try to add these, I sense it's conditional for that
twitter:title
og:title

[roiLeo]

I think the card is not showing because we don't provide 'description' and 'title' for twitter and open graph.
I will try to set with some data. Should I rely on the first nft ?

[yangwao]

Yes, that would be awesome, yes try that one, to fill title and description from NFT :)
The same can go to CollectionItem.vue then :)

Meanwhile, I'm testing it on other PR til lit build with some generic ones #493
Will know in few seconds :)

[yangwao]

Oh hint, to mitigate cache, it's fine to add some parameter, like ?abc to end of URL while testing rendering on crawlers, as some cache it hard, even for 3days+

[yangwao]

This one seems working tho!
https://deploy-preview-493--nftkodadot.netlify.app/rmrk/u/CxQJNQeowRUJBgUHQpspudWy4BU6Rk2u93yDZEKe6GzcLDe?abd

[yangwao]

Well now is the question, why doesn't fetch at least the default picture if I don't see any other?
Testing URL https://deploy-preview-489--nftkodadot.netlify.app/rmrk/u/FqCJeGcPidYSsvvmT17fHVaYdE2nXMYgPsBn3CP9gugvZR5?qweqwdsa

[roiLeo]

My SEO plugin show the right picture and description but on twitter card it show the default data and I don't know why.

[yangwao]

I mean, let's push it to production.
You are welcome to show on our discord https://discord.gg/35hzy2dXXh
Let's reach me there, @yangwao , so I can process some small bounty for your work :)
You will need to have KSM address

[yangwao]

For now, I'll merge it as it's at least something and you're welcome to continue cracking why doesn't work:)