refactor: change from pagination to scroll on badgedex

[Darguima]

Added a fallback image to the Badges, when the url one isn't available (on the video all them are the fallback)
Added Empty badges message.
Added Infinite Scroll (with a Go To Top button)

2023-11-24.21-03-55.mp4

[EDIT] - changed video to also have the sliding effect on the button

[netlify]

✅ Deploy Preview for seium-stg ready!

Name	Link
🔨 Latest commit	95dc243
🔍 Latest deploy log	https://app.netlify.com/sites/seium-stg/deploys/657203f393ef8b0008214c0e
😎 Deploy Preview	https://deploy-preview-578--seium-stg.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[joaodiaslobo]

Can you use this badge image instead?

[Darguima]

I already edited, but the 404 have a buggy shadow

[Darguima]

Fixed

[ruilopesm]

Great work 🙌🏼
In fact, this is not an infinite scroll, as the content is not being loaded as I scroll down. However, I feel that approach is over complicated and not necessary here. Anyway, I think we should implement a skeleton rendering for when a badge is rendering - can you handle that? 💪🏼

[Darguima]

Great work 🙌🏼 In fact, this is not an infinite scroll, as the content is not being loaded as I scroll down. However, I feel that approach is over complicated and not necessary here. Anyway, I think we should implement a skeleton rendering for when a badge is rendering - can you handle that? 💪🏼

Done. Any suggestions or any already existing color schema on the project that I can use here for the skeleton?

Also, I suggest you to try because the video is a little bit confusing on the transition due quick access to the image.

2023-12-04.01-38-39.mp4

[Darguima]

I fixed that delay showing the fallback image after the skeleton. Also fixed the infinite loop fallback.

[joaodiaslobo]

Outstanding work, thank you! 🙇🚀