title: problem with useEffect when re-render component. I am trying to open portal with window.open method
body: <p>below is my code: it's a component to create a new window using createportal and window.open method. For the first render by user-event everything is OK, but after the component unmounts and when the user initiates the new mount again it looks like useEffect does not update the state of the container - it remains 'null' and the window is not open again. Appreciate an answer much!</p>
  <pre><code>import { createPortal } from &quot;react-dom&quot;;
  import New_Window from &quot;./New_Window&quot;;
  
  
  function RenderInWindow({ handleOpen}) {
    const [container, setContainer] = useState();
    const newWindow = useRef(window);
    console.log(newWindow)
    
    
    useEffect(() =&gt; {
      const div = document.getElementById('portal');
      console.log(div);
      setContainer(div);
    }, []);
    
  
    
  useEffect(() =&gt; {
      if (container) {
        newWindow.current = window.open(
          &quot;&quot;,
          &quot;&quot;,
          &quot;width=810,height=520,left=300,top=300&quot;
        );
        newWindow.current.document.body.appendChild(container);
        const curWindow = newWindow.current;
        const parentHead = window.document.querySelector(&quot;head&quot;).childNodes;
        parentHead.forEach( item =&gt; {
          curWindow.document.head.appendChild(item.cloneNode(true));
        })
        return () =&gt; { curWindow.close(); handleOpen(); }
      }
      
    }, [container]);
  
    const handleClose = () =&gt; {
      setContainer(null)       
    }
  
    return (
      
      
      container &amp;&amp; createPortal(&lt;New_Window  handleClose={handleClose}/&gt;
        , container)
     
    )
  };
  
  export default RenderInWindow;
  </code></pre>