I am currently creating a React Native app using an existing Storefront to access via the Storefront API. From there I am leveraging the checkoutUrl on the created cart object to pass into a Webview to provide the checkout experience (i believe this is the preferred way to use the Shopify Checkout?). The issue I am having is that there are multiple things that are handled poorly when in a webview (links that navigate outside of checkout such as "Continue Shopping", Header logo to return to homepage, Cart Icon to return to the cart, as well as similar links on the Thank You page such as Subscription Management that links to the Account) or just not supported (Google Pay doesnt seem to work in a webview as noted in your Checkout SDK repo: https://github.com/Shopify/checkout-sheet-kit-react-native/issues/56).
My questions are:
1. Is there a way to use a different checkout profile for my headless checkout than what is published to the Storefront - possibly specify it by id if its saved as draft? I was thinking that maybe it would be possible to remove express checkout (Google Pay) for the app but keep it on for the Storefront? Also would allow us to adjust checkout for any other native specific use cases
2. Is there a suggested solution for handling all of these links within checkout so that the customer doesn't get into unusable situations where they have navigated away from checkout within the Webview. I have a "solution" where I use injectedJavaScript to hide areas (such as the header and continue shopping buttons) as well as onNavigationStateChange to detect if they have left the /checkout route, and close the webview if they have - but I was just hoping there was a more elegant solution that would allow us greater control of the UX.
Thank you,
