Hi @alan_g,
Here is a bit more context…
In previous versions of my app I used Remix and React Router 7 (with react polaris components) but now I decided to migate everything to the new polaris web components and re-write my app from scratch.
Now I’m not using Remix, nor React Router, nor CLI scaffolding. I decided to go with Express (lower-level for more control of every part of logic & server optimizations). On client side, I use react 19 (No SSR).
Polaris and App Bridge I’m including like this
<script src="https://cdn.shopify.com/shopifycloud/polaris.js"></script>
<script src="https://cdn.shopify.com/shopifycloud/app-bridge.js"></script>
As for the modal, for this particluar modal I need responsivenes of react component, so <ui-modal> didn’t work (I have Shopify API pages loading before I can show list in <s-select> and I wanted primary button on the modal disabled until data is loaded). I couldn’t do it with <ui-modal>.
As for the <s-modal> I found some alignment issue compared to <ui-modal>. <s-modal> is not properly centered on the screen (it looks shifted down about 40 pixels or. so). Here I have a post about it: https://community.shopify.dev/t/weird-positioning-of-s-modal-compared-to-old-ui-modal-on-screen/32791
So I went with <Modal> from @shopify/app-bridge-react, so I have proper react integration.
It’s is this component that react badly on loading app-bridge script before the polaris on the page.
I just double checked, everything else functioning correctly when I load app-bridge before the polaris. So it’s only the <Modal> from @shopify/app-bridge-react that reacts badly to it.
I’m not sure if @shopify/app-bridge-react is still a priority for Shopify, or if it soon will be deprecated like polaris react components. So I also wonder, if this will be deprecated, how to create proper responsive / active functionality inside the <s-modal> modals with react.
Thank you!