shopifypolaris

Are links in Polaris embedded app supposed to not change url path?


I'm using Next.js with Polaris (from following their guide here). Using Link component imported from either Polaris or Next.js is not updating the url in the embedded app.

While the url path doesn't change, the view does change correctly (i.e. the component for the new path does render). Same result with breadcrumbs and url prop for ResourceList.

Is this expected behavior?


Solution

  • Ended up figuring this out after many variations of trying to make links work correctly.

    Answer: no, that's not expected behavior and links should change url path for Shopify embedded apps.

    For Polaris, in order to make links change the URL you will need to install this library (@shopify/react-shopify-app-route-propagator). There is enough instructions on the page to figure out how to install it.

    Important note on library usage: AppProvider had to be in the parent component for this.context.polaris.appBridge to work correctly. All the logic for context needed to be in a child component. This issue might've been unique to just my case, but maybe not.