useEffect cleanup function not propagated on component in uland

[kethan]

Please refer to this: https://github.com/WebReflection/discussions/discussions/79

I am planning to migrate my preact app to uland but I need this functionality using the JSX component.

[WebReflection]

It's very possible this is a uhooks issue and it would help a lot if I could have a minimal reproducible example/issue in there

[kethan]

Hmm. Not sure how much I can reduce it.

import { Component, useState,useEffect, render, html } from '//cdn.skypack.dev/uland/jsx';

let A = Component(() => {
  useEffect(() => {
    console.log("effect");
    return () => console.log("clean effect");
  }, []);
  return <div>A Component</div>;
});

const App = Component(() => {
  const [show, setShow] = useState(true);
  return (
    <div>
      <button onClick={() => setShow(!show)}>Show</button>
      {show ? <A /> : <div></div>}
    </div>
  );
});

render( document.body,(<div><App /></div>));

https://codepen.io/kethan-the-selector/pen/RwQPdyj?editors=0011 A small update if I use template HTML string like this {show ? html`${A}/>` : <div></div>} the clean up function is triggered. But I want the same in JSX.

[alexey13]

Good day Andrea! Could you please check this example https://codepen.io/alexzhav/pen/JjpJwNJ?editors=0011

Click on "ShowA" twice, after that each click on "ShowB" will trigger effect in A component to rerun(you can see it in console)

[WebReflection]

This has been fixed in latest via uhooks 👋

If you find other hooks related bugs please file an issue in uhooks or in here, don't just add comments to previous issues, thank you.