When a user navigates inside an embedded app, the URL of the embedded app iframe changes. If the user reloads the page, then the navigation isn't reflected in the URL of the parent page.
RoutePropagator lets you synchronize a Shopify embedded app's URL with the parent page.
You can use RoutePropagator as a hook (
useRoutePropagation) or a component (
The package can be used with any routing solution.
Both the hook and component versions of this library needs to be mounted inside the
Provider component and take the same
You can also use the App Bridge History API to keep the parent URL in sync manually.
useRoutePropagation hook. Only one
Provider is needed for your application. The following example assumes your app uses the
withRouter enhancer from
<RoutePropagator> components. Only one
Provider is needed for your application. The following example assumes your app uses: