returning to embedded app after redirecting to admin page

Solved
Highlighted
New Member
2 1 0

I have an embedded app running in my store, built on React and Next js, that uses Customer information. I am using  @shopify/app-bridge-react to interact with shopify admin.

From a page in my app I am able to redirect to a specific admin Customer page. I do this using redirect.dispatch(). I am also setting the browser history so my page url is shown in the browser. I do that using @shopify/react-shopify-app-route-propagator.

 

My problem - getting back to my app in the same state as when I left. If I press Back in the browser I am returned to the correct page in my app, BUT it is reloading from the server, and therefore I lose all state. I would like to be able to navigate from my app to the admin Customer info and back again seamlessly, without doing a full page reload of my app from the server, as if the admin page is just another local Link in my client.

 

What is the best practice for achieving this behavior in my app?

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1040 140 165

Hey @guinantf,

 

While apps use iframes the reload is unavoidable. A frameless UI kit is in the works. Until then, an awkward workaround might be to keep state in local storage and rebuild the UI.

0 Likes
Highlighted
New Member
2 1 0

This is an accepted solution.

That is what I thought. I will use local storage and do my best to recreate state on returning. I look forward to the new UI kit. Thanks!

0 Likes