Stale thumbnail images when slides change
Aleafan opened this issue · 1 comments
Describe the bug
Hello, thanks for your work!
I noticed a small bug concerning thumbnails. When you change slides set you see old stale thumbnails in thumbnails row until new thumbs are downloaded which replace old ones. And when images are rather heavy and bandwidth is slow you get a few seconds of old thumbnails onscreen.
Expected behavior
I guess the correct way is to immediately clear old thumbnails and show loading status icon if it takes time to load new ones.
How to reproduce
Change set of slides on same Lightbox instance.
Screenshots / Logs
No response
Additional context
The root cause of this is that ImageSlide components in thumbnails just rerender on slide change, React keeps underlying dom node and if you don't remove img src it shows stale image (https://stackoverflow.com/questions/70588348/how-to-update-screen-immediately-after-changing-an-images-source-with-javascrip).
I fixed that by adding key=src to ImageSlide. This way React destroys and recreates img dom node on src change leading to correct work of loading status as well.
<ImageSlide key={src} {...props} />
Hope it helps to make this lib even better)
🎉 This issue has been resolved in version 3.17.5 🎉
The release is available on:
Your semantic-release bot 📦🚀