Implementation of Leave Page Popup

Shopify Apps
,

Topic summary

Request to add a “leave page confirmation” dialog in a Shopify app, mirroring Shopify Admin behavior. Goal: warn users about unsaved form changes and require confirmation before navigating away.

Key behavior desired:

  • Detect when form data is modified and block navigation until user confirms.
  • Example: after editing product details, navigating to the Customers page should trigger a confirmation popup rather than redirect immediately.

Purpose: prevent accidental loss of unsaved changes within the app’s forms.

Current status: seeking implementation ideas/approaches; no solutions or decisions yet. No attachments or code provided. Discussion remains open.

Summarized with AI on December 24. AI used: gpt-5.
1

Hello,

I want to implement a leave page confirmation popup in my Shopify app, similar to what Shopify store admins have. If I update any form data and try to navigate to another page without saving, it should display a leave page confirmation popup.

For example, if I update product details and try to navigate to the customers page without saving, it should show a leave page confirmation popup instead of redirecting me to the customers page.

Do you have any ideas on how I can implement this?

Thanks in advance.