Can't trigger a Custom UI Modal from portalRequestDetailPanel

Hi there,

I’m trying to trigger a Custom UI modal from a button inside a portalRequestDetailPanel with custom ui resources. The code relatively simple and looks a bit like this:

const openModal = () => {
	console.log("trying to open modal with external resource");
	const modal = new Modal({
		resource: "modal-res",
		size: "large"
	});
	modal.open();
	};
<Button
	appearance="link"
	onClick={() => openModal()}>
	Click me
</Button>

The modal resource is simple a react component which returns a <div>this is an example</div>.
When I click the button, I get the following error in the console:

Uncaught (in promise) Error: Unable to open modal.
    at e.<anonymous> (2.eb46d349.chunk.js:2:237891)
    at d (2.eb46d349.chunk.js:2:33409)
    at Generator._invoke (2.eb46d349.chunk.js:2:33162)
    at Generator.next (2.eb46d349.chunk.js:2:33772)
    at a (2.eb46d349.chunk.js:2:3048)

Btw.: the UI Kit component ModalDialog works fine and the Custom UI modal works in all other places too, just not within the portalRequestDetailPanel

Hi @MatthiasClasen,

I’ve taken a look at this issue and I’ve been able to reproduce it on my end as well.

I’ve identified a fix for this issue and raised it to the relevant internal team; I’ll keep you updated.

Cheers,
Samuel

4 Likes