```jsx const Child = () => { const [ setRef ] = useIntersectionObserver(() => {}, { root: document.body }); return <div ref={setRef}></div> } function App() { return ( <div className="App"> <Child /> <Child /> </div> ); } ``` ## Expected behavior <!--- What should happen --> the observer instance create in first child would be reuse in second child ## Current behavior <!--- What is happening instead of the expected behavior --> two child create two observer instance