subHtml items are not updating after call to updateSlides

[riacoding]

Description

I am having an issue when I update the slide data in react and then update the slide position with updateSlides the subHtml is not updating to the current slide subHtml. If you advance through the slides then it comes back into sync but without moving the slides it is stuck with the current image but with the previous subHtml data.

https://stackblitz.com/edit/lightgallery-react-inline-gallery-arhtun

Describe the issue that you're seeing.
the image is updating but the subHtml items are stuck on the previous value. new to light gallery but trying to have it inline and dynamic in react.

Steps to reproduce

Clear steps describing how to reproduce the issue. Please link to
a demo project (Your website URL, codepen, or jsfiddle) if possible.
see below
https://stackblitz.com/edit/lightgallery-react-inline-gallery-arhtun

JS code that you use to initialize lightGallery.

<LightGallery
          plugins={[lgZoom]}
          elementClassNames="custom-classname"
          closable={false}
          showMaximizeIcon
          onInit={onInit}
          onAfterAppendSubHtml={afterAppendHTML}
          appendSubHtmlTo={".lg-sub-html"}
          container={container}
          dynamic={true}
          dynamicEl={items}
        ></LightGallery>

Sample HTML markup

see below
https://stackblitz.com/edit/lightgallery-react-inline-gallery-arhtun

Environment

• Browser and version - Chrome 100
• OS - Mac OSx
• lightGallery React version - "lightgallery": "^2.4.0",

Additional context

[Sachin Neravath]

Hey @riacoding,

Here is the working demo - https://stackblitz.com/edit/lightgallery-react-inline-gallery-3e7vrn?file=index.tsx

You don't need to call the refresh and updateSlide methods together. That was causing the issue

Also, use useEffect to update the slide instead of calling it in the same addItems method

useEffect(() => {
    if (lightGallery.current) {
      lightGallery.current.updateSlides(items, lightGallery.current.index);

      // Use this only if you want to navigate to the added slide
      lightGallery.current.slide(3);
    }
  }, [items]);

If you face any issues, please let me know

[riacoding]

Thanks I appreciate your help and speedy reply!!