Vertical thumbnail scrolling broken with react 18 rendering

[p-young]

The thumbnail scrolling does not get the proper translate when rendering with react 18.

Using the latest image gallery version (1.2.8) and react (18.1.0).

My guess is that the thumbnailsWrapperHeight is registering as 0 at the start (the translation seems to match that) maybe because of how batch updates or rendering has changed in react 18.

After manually resizing the window and thus resizing react-image-gallery, the resize observers fire and the issue improves. However the calculation is still wrong and it is slightly offset from where the scroll should be.

To reproduce, use the latest react and the new way to start the rendering (createRoot() and root.render() instead of ReactDOM.render()), and set thumbnail position to "left" or "right". Then just change slides around and the issue can be seen.

Changing the render back to ReactDOM.render() (which reverts rendering the same way as React 17) fixes the issue.

A picture attached demonstrates the thumbnail scroll being in the wrong position (and out of bounds)

[p-young]

Is there anything I can add to help get this looked at? Thanks for the updates!

[xiaolin]

Thanks for reporting, I've not had a chance to test react18's new render. Will look into it when I get a chance.

Fastest way is to open a PR if anyone is down to tackle this issue.

[alexdevmotion]

Anyone found a fix for this? Can't figure it out.

[MohammedSaberMohammed]

@xiaolin @alexdevmotion I've the same issue, any clue ?

[alexdevmotion]

@MohammedSaberMohammed unfortunately not, haven't dug for a workaround yet.

[xiaolin]

This should be fixed in v1.2.10

[pickyourdestiny]

This same issue still exists in React 18.2 and react-image-gallery version 1.30 Thank you in advance.

[FridoAnggoro123]

This same issue still exists in React 18.2 and react-image-gallery version 1.30 Thank you in advance.

yess same with me, issue still exists

[subhanyousaf]

any update or fix for this?