[email protected] fails to use setSate

[lev-savranskiy]

• i have a list of images with previews. On click on preview main area should show activeImage using same GatsbyImage container
• It works fine only on initial load via useEffect. on click on previews i am getting an error and no images appear as an activeImage anymore
• react_devtools_backend.js:2430 Warning: render(...): It looks like the React-rendered content of this container was removed without using React. This is not supported and will cause errors. Instead, call ReactDOM.unmountComponentAtNode to empty a container.
• i make no DOM manipulations outside of React
• i have no issues using orignial "gatsby-image", but would like to move to new plugin
• tried both "gatsby-plugin-image": "1.0.0"/ "1.1.0-next.1", any ideas are very welcome
• relates to gatsby-image-plugin unexpected behaviour #30024

    const [activeImage, setActiveImage] = useState(images[0])
     useEffect(() => {
        setActiveImage(images[0])
      }, [images])
    //previews
    <GatsbyImage image={images[0]}  onClick={()=>setActiveImage(images[0])}  className="small"/>
    <GatsbyImage image={images[1]}  onClick={()=>setActiveImage(images[1])}  className="small"/>
   //active  image
    <GatsbyImage image={activeImage} className="large" />

GQL part is

    query={graphql`
      query {
        images: allFile {
          edges {
            node {
              relativePath
              name
              childImageSharp {
                gatsbyImageData( layout: FULL_WIDTH, placeholder: BLURRED)
              }
            }
          }
        }
      }
    `}

package.json https://pastebin.com/x8cqtrTT

[laurieontech]

Thanks so much for asking this question. This is in fact a bug and I'm looking into it.

[popeating]

I think the Issue is open here:
#29982

hoping for a fix, cant wait to use the new image plugin

[laurieontech]

I'm not entirely sure those are caused by the same issue. But certainly looking into both.

[laurieontech]

A fix for this is now available in gatsby-plugin-image@next