fix: fetch image on explore collection

[preschian]

Thank you for your contribution to the KodaDot NFT gallery.

👇 _ Let's make a quick check before the contribution.

PR Type

• Bugfix
• Feature
• Refactoring

Context

• Closes Gallery images don't load in Firefox Private mode #4651

Before submitting pull request, please make sure:

• My contribution builds clean without any errors or warnings
• I've merged recent default branch -- main and I've no conflicts
• I've tried to respect high code quality standards
• I've didn't break any original functionality
• I've posted a screenshot of demonstrated change in this PR

Optional

• I've tested it at </bsx/collection>
• I've tested PR on mobile
• I've written unit tests 🧪
• I've found edge cases

Had issue bounty label?

• Fill up your KSM address: Payout

Community participation

• Are you at KodaDot Discord?

Screenshot 📸

• My fix has changed something on UI; a screenshot is best to understand changes for others.

[netlify]

✅ Deploy Preview for koda-nuxt ready!

Name	Link
🔨 Latest commit	51fa52a
🔍 Latest deploy log	https://app.netlify.com/sites/koda-nuxt/deploys/63c019b2690fc60008cbb575
😎 Deploy Preview	https://deploy-preview-4653--koda-nuxt.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 settings.

[kodabot]

WARNING @preschian PR for issue #4651 which isn't assigned to you. Please be warned that this PR may get rejected if there's another assignee for issue #4651

[preschian]

TIL: indexedDB will throw an error on firefox private mode. so functions that rely on indexedDB will have different behaviour than chrome

• https://bugzilla.mozilla.org/show_bug.cgi?id=1639542
• https://bugzilla.mozilla.org/show_bug.cgi?id=1414262

btw, is that ok if I remove prefetchPage() on that page? @Jarsen136 @roiLeo

[roiLeo]

TIL: indexedDB will throw an error on firefox private mode. so functions that rely on indexedDB will have different behaviour than chrome

Aight, this is only present in firefox private mode. Will we restrict all browsers only for this case?
Or we can try to migrate idb store to Vuex/Pinia

btw, is that ok if I remove prefetchPage() on that page? @Jarsen136 @roiLeo

isn't this used for infiniteScroll? it seems to me that this has been added to speed up images display

[preschian]

Will we restrict all browsers only for this case?

hhmm, I am still not sure if should we restrict this case or not. or maybe we move to localStorage

isn't this used for infiniteScroll? it seems to me that this has been added to speed up images display

I thought that also, but it seems the response time is still the same. CMIIW

[Jarsen136]

TIL: indexedDB will throw an error on firefox private mode. so functions that rely on indexedDB will have different behaviour than chrome

Aight, this is only present in firefox private mode. Will we restrict all browsers only for this case? Or we can try to migrate idb store to Vuex/Pinia

I would prefer to restrict the usage of indexedDB only on firefox browsers in this case.

btw, is that ok if I remove prefetchPage() on that page? @Jarsen136 @roiLeo

isn't this used for infiniteScroll? it seems to me that this has been added to speed up images display

Yup, we guess we should keep the prefetchPage there for the shortened loading time. How about disable the cache method only on firefox.

I thought that also, but it seems the response time is still the same. CMIIW

IMO It would prefetch the metadata in advance to reduce the waiting time. 🤔

[vikiival]

Code LGTM

ref:

• https://github.com/kodadot/rubick/issues/175

[vikiival]

Ref

• Resolver to return data which should be prefetched rubick#176

[roiLeo]

let's go

[vikiival]

pay 50 usd

[yangwao]

😍 Perfect, I’ve sent the payout
💵 $50 @ 27.49 USD/KSM ~ 1.819 $KSM
🧗 DY4SQF2iD456tH89aQtz5wv1EV3BbSW8wKKuMcwbmXaj1pM
🔗 0x6946cd8545b33906bc9f0251e875d87036c550fd5f5698ffd6bd044c4834ed57

🪅 Let’s grab another issue and get rewarded!
🪄 github.com/kodadot/nft-gallery/issues

[codeclimate]

Code Climate has analyzed commit 51fa52a and detected 0 issues on this pull request.

View more on Code Climate.