Shopify Intent shows below App Bridge Modal

App Bridge
1

I’m using App Bridge React Modal, when launching an intent, such as metafield definition update, the intent shows below the modal:

image
image902×1102 67.5 KB

This is a regular App Bridge React modal

import { Modal } from '@shopify/app-bridge-react';

// .....

  return (
    <Modal id={id} open={open}>
      {children}
    </Modal>
  );

// ...

And a regular intent such as:

  const shopify = useAppBridge();

// ....

          await shopify?.intents?.invoke?.({
            action: 'edit',
            value: metafield.id,
            type: 'shopify/MetafieldDefinition',
            data: { ownerType: metafield.ownerType },
          }),