setOpen(false) does not close the window

[Ofer-Gal]

Your app is the only one, I found, that allows the child component to have any events inside. Thank you.

But what I found is that using the setOpen(false); does not close the popup.
Do you have a suggestion to kill the popout from the children?

[Ofer-Gal]

I figured this one
but I don't have CSS in the popout.
Can you explain for URL "can be used to load the CSS"?

[sidharthancr]

@Ofer-Gal Create a route in the application and pass the URL. It would help you to load the CSS.

[Ofer-Gal]

Thanks for answering.
Could you show some code for "Create a route in the application" you mean like with react-rout?
Where will the import {the CSS file} will go?
Please help.

[sidharthancr]

@Ofer-Gal

What I mean by creating a route is,

1. Create a react route for example, /popout in the router.
2. Pass the URL in the popout component

When creating the new route in the application, the new URL loads the application with CSS and no content. Then the Children's content will be added to the popout.

[Ofer-Gal]

So import "react-datepicker/dist/react-datepicker.css"; (for one of my components) should be added to a component in the /popout route?
I will give it a try Thanks

[Ofer-Gal]

Wait, Can I do all the content of the child popup in the /popout route and nothing in the "children=" ?
just have

<Popout url={'/PopOut'}
  id={openJob}
  reactDom={ReactDOM}
  options={{ left: '0', top: '0', width: '800px', height: '800px', resizable: 'yes', location:'no' }}
  onClose={() => setOpen(false)} containerId={'#forPopOut'}
  title={'Request '+ openJob}
/>

Will that work? Thank you in advance

[Ofer-Gal]

I added routes with "react-router-dom"
Using URL {'/PopOut'} did not work because there was no page like that.
Using URL {'#/PopOut'} works but it shows the entire sending page with the component inside it.
I can't figure out how to render just the component in the route

   <Route path="/PopOut" element={<PopOut />} />

What am I doing wrong?