Merge pull request #5428 from EdgeApp/sam/broke-back-mt-pelerin

Fix back navigation for Mt Pelerin quotes

Author: samholmes

src/plugins/gui/providers/mtpelerinProvider.ts

@@ -507,6 +507,9 @@ export const mtpelerinProvider: FiatProviderFactory = {
               injecteJs(run)
             }
 
+            // This is the state of the user-journey through the quoting process
+            let userFlowStatus: 'preparing-quote' | 'submitted-quote' | 'navigating-back' = 'preparing-quote'
+
             const onMessage: FiatPluginOpenWebViewParams['onMessage'] = (eventMessage: string, injectJs) => {
               const message = asMessage(JSON.parse(eventMessage))
               try {
@@ -655,6 +658,9 @@ export const mtpelerinProvider: FiatProviderFactory = {
                       }
 
                       sendResponse('onsenttransaction', tx.signedTx, injectJs)
+
+                      // The user has signed and sent the transaction
+                      userFlowStatus = 'submitted-quote'
                     }
                     send().catch((e: unknown) => {
                       if (!(e instanceof Error && e.message.includes(SendErrorBackPressed))) {
@@ -739,7 +745,23 @@ export const mtpelerinProvider: FiatProviderFactory = {
               url,
               injectedJs,
               onMessage,
-              onClose: () => {}
+              onClose: () => {
+                // Hi-jack the back navigation
+                switch (userFlowStatus) {
+                  case 'preparing-quote':
+                  case 'navigating-back':
+                    return true
+                  case 'submitted-quote': {
+                    // If the user has submitted a quote, then navigating back
+                    // will skip all the way back to the plugin list scene.
+                    showUi.exitScene()
+                    showUi.exitScene()
+                    userFlowStatus = 'navigating-back'
+                    // Prevent default navigation
+                    return false
+                  }
+                }
+              }
             })
           },
           closeQuote: async (): Promise<void> => {}

src/plugins/gui/scenes/FiatPluginWebView.tsx

@@ -1,3 +1,4 @@
+import { useNavigation } from '@react-navigation/native'
 import * as React from 'react'
 import { WebView, WebViewNavigation } from 'react-native-webview'
 
@@ -8,7 +9,7 @@ import { BuyTabSceneProps } from '../../../types/routerTypes'
 export interface FiatPluginOpenWebViewParams {
   url: string
   injectedJs?: string
-  onClose?: () => void
+  onClose?: (() => boolean) | (() => void)
   onMessage?: (message: string, injectJs: (js: string) => void) => void
   onUrlChange?: (url: string) => void
 }
@@ -18,6 +19,7 @@ interface Props extends BuyTabSceneProps<'guiPluginWebView'> {}
 export function FiatPluginWebViewComponent(props: Props): JSX.Element {
   const { route } = props
   const { injectedJs, onClose, onMessage, onUrlChange, url } = route.params
+  const navigation = useNavigation()
 
   const webViewRef = React.useRef<WebView>(null)
 
@@ -35,10 +37,15 @@ export function FiatPluginWebViewComponent(props: Props): JSX.Element {
     if (onMessage != null) onMessage(data, injectJs)
   })
 
-  React.useEffect(() => () => {
-    // Cleanup code when scene unmounts
-    if (onClose != null) onClose()
-  })
+  React.useEffect(
+    () =>
+      navigation.addListener('beforeRemove', event => {
+        if (onClose != null) {
+          if (onClose() === false) event.preventDefault()
+        }
+      }),
+    [navigation, onClose]
+  )
 
   return (
     <SceneWrapper hasTabs avoidKeyboard>