I’m in the process of updating the UI of my Shopify app to make the setup process more intuitive for my users. I’m using the Shopify app template with JSX (React), but I prefer not to use Polaris for my UI components.
However, I’ve run into problems with navigation between different pages in my app. When I use standard JSX buttons instead of Polaris buttons with the url prop, the navigation doesn’t work. Specifically, I can’t seem to trigger page changes within the embedded app iframe using non-Polaris buttons.
I’ve tried using the Shopify App Bridge Redirect action in the onClick handler, but it doesn’t seem to function the same way as the Polaris button with the url prop. The navigation either doesn’t occur or doesn’t update the Shopify admin URL correctly.
My Questions:
- Is there documentation or examples on how to handle navigation in Shopify-embedded apps without using Polaris components?
- How can I properly use the App Bridge Redirect action with standard JSX buttons to navigate between pages?
- Are there best practices for building Shopify app UIs without Polaris, particularly regarding navigation and routing?
