Render ix Modal in same DOM


I am rendering a IX-modal in my app, but struggle a bit.
The issue is that this modal renders in a separate DOM, i guess using ReactPortal or something.
The modal is supposed to use redux for some state handling, but when it renders outside the main DOM, it doesn’t get wrapped in a redux-provider, resulting in crash.

Is there a way to force the modals to render in the main apps DOM tree?

This is how I call the component

  async function showAddWidgetModal() {

    if (dashboard) {
      await showModal({
        content: <AddWidgetModal dashboard={dashboard} onClose={handleAddWidgetModalClose} />,

Modal component:

const AddWidgetModal: React.FC<AddWidgetProps> = ({ dashboard, onClose }) => {

//some code

    return (
        <Modal ref={modalRef}>
            <IxModalHeader>Add widget</IxModalHeader>
                    Widget Name:
                    <input type="text" value={widgetName} onChange={(e) => setWidgetName(} />

                <IxButton outline onClick={close}>
                <IxButton onClick={handleOkClick}>OK</IxButton>

I fixed this by moving the Provider in the top of the root.render like this:

  <Provider store={store}>

          <App />

      </BrowserRouter >