Invisible webview rebased

.gitignore

@@ -31,9 +31,46 @@ dist-ssr
 *.ipa
 android
 
-# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
+.expo
+
+# @generated expo-cli sync-8d4afeec25ea8a192358fae2f8e2fc766bdce4ec
 # The following patterns were generated by expo-cli
 
+# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
+
+# dependencies
+node_modules/
+
+# Expo
+.expo/
+dist/
+web-build/
 expo-env.d.ts
-# @end expo-cli
-.expo
+
+# Native
+*.orig.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+
+# Metro
+.metro-health-check*
+
+# debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
+
+# macOS
+.DS_Store
+*.pem
+
+# local env files
+.env*.local
+
+# typescript
+*.tsbuildinfo
+
+# @end expo-cli

app.json

@@ -78,7 +78,10 @@
               "scheme": "http"
             }
           ],
-          "category": ["BROWSABLE", "DEFAULT"]
+          "category": [
+            "BROWSABLE",
+            "DEFAULT"
+          ]
         },
         {
           "action": "VIEW",
@@ -87,7 +90,10 @@
               "scheme": "metanet"
             }
           ],
-          "category": ["BROWSABLE", "DEFAULT"]
+          "category": [
+            "BROWSABLE",
+            "DEFAULT"
+          ]
         }
       ]
     },
@@ -103,15 +109,24 @@
         "CFBundleURLTypes": [
           {
             "CFBundleURLName": "org.bsvblockchain.metanet.urlscheme",
-            "CFBundleURLSchemes": ["metanet"]
+            "CFBundleURLSchemes": [
+              "metanet",
+              "uhrp"
+            ]
           }
         ],
-        "LSApplicationQueriesSchemes": ["https", "http"],
+        "LSApplicationQueriesSchemes": [
+          "https",
+          "http",
+          "uhrp"
+        ],
         "NSLocationWhenInUseUsageDescription": "Metanet may request your location to enable features like discovering nearby devices/services and providing region-specific functionality. Your location is only used while the app is in use."
       },
       "entitlements": {
         "aps-environment": "development",
-        "com.apple.developer.associated-domains": ["applinks:*"],
+        "com.apple.developer.associated-domains": [
+          "applinks:*"
+        ],
         "com.apple.developer.web-browser": true
       }
     },

app.json.expo-template

@@ -108,11 +108,7 @@
         "CFBundleURLTypes": [
           {
             "CFBundleURLName": "org.bsvblockchain.metanet.urlscheme",
-            "CFBundleURLSchemes": [
-              "metanet",
-              "http",
-              "https"
-            ]
+            "CFBundleURLSchemes": ["metanet"]
           }
         ],
         "LSApplicationQueriesSchemes": [

app/_layout.tsx

@@ -5,7 +5,7 @@ import React, { useEffect, useState } from 'react'
 import { Stack } from 'expo-router'
 import { UserContextProvider, NativeHandlers } from '../context/UserContext'
 import packageJson from '../package.json'
-import { WalletContextProvider } from '@/context/WalletContext'
+import { WalletContextProvider } from '@/context/WalletWebViewContext'
 import { ExchangeRateContextProvider } from '@/context/ExchangeRateContext'
 import { ThemeProvider } from '@/context/theme/ThemeContext'
 import PasswordHandler from '@/components/PasswordHandler'

app/auth/otp.tsx

@@ -16,15 +16,15 @@ import { StatusBar } from 'expo-status-bar'
 import { useTranslation } from 'react-i18next'
 import { useTheme } from '@/context/theme/ThemeContext'
 import { useThemeStyles } from '@/context/theme/useThemeStyles'
-import { useWallet } from '@/context/WalletContext'
+import { useWallet } from '@/context/WalletWebViewContext'
 
 export default function OtpScreen() {
   const { t } = useTranslation()
   // Apply theme
   const { colors, isDark } = useTheme()
   const themeStyles = useThemeStyles()
 
-  const { managers } = useWallet()
+  const { webviewComingEvent, sendWebViewEvent } = useWallet()
   const params = useLocalSearchParams()
   const phoneNumber = params.phoneNumber as string
 
@@ -52,6 +52,43 @@ export default function OtpScreen() {
     return () => clearInterval(timer)
   }, [])
 
+  useEffect(() => {
+    // Handle incoming events from the webview
+    if (webviewComingEvent) {
+      const { name, results } = webviewComingEvent;
+
+      switch (name) {
+        case 'restartAuth.callback': // startAuth webview callback
+          setLoading(false);
+
+          if (results) {
+            setCountdown(60)
+            setCanResend(false)
+
+            Alert.alert(t('code_sent'), t('new_verification_code_sent'))
+          } else {
+            console.error('Error resending OTP:')
+            Alert.alert(t('error'), t('failed_to_resend'))
+          }
+          break;
+        case 'completeAuth.callback': // completeAuth webview callback
+          setLoading(false)
+
+          if (results) {
+            // Navigate to password screen after OTP verification
+            router.push({
+              pathname: '/auth/password',
+              params: { phoneNumber: phoneNumber }
+            });
+          } else {
+            console.error('Error verifying OTP:')
+            Alert.alert(t('verification_failed'), t('code_incorrect_try_again'))
+          }
+          break;
+      }
+    }
+  }, [webviewComingEvent])
+
   // Handle OTP verification
   const handleVerify = useCallback(
     async (otp: string) => {
@@ -60,25 +97,9 @@ export default function OtpScreen() {
 
       setLoading(true)
 
-      try {
-        await managers!.walletManager!.completeAuth({
-          phoneNumber,
-          otp
-        })
-
-        // Navigate to password screen after OTP verification
-        router.push({
-          pathname: '/auth/password',
-          params: { phoneNumber: phoneNumber }
-        })
-      } catch (error) {
-        console.error('Error verifying OTP:', error)
-        Alert.alert(t('verification_failed'), t('code_incorrect_try_again'))
-      } finally {
-        setLoading(false)
-      }
+      sendWebViewEvent('completeAuth', { phoneNumber, otp});
     },
-    [otp, managers, phoneNumber]
+    [otp, phoneNumber]
   )
 
   // Handle resend OTP
@@ -87,21 +108,8 @@ export default function OtpScreen() {
 
     setLoading(true)
 
-    try {
-      await managers!.walletManager!.startAuth({ phoneNumber })
-
-      // Reset countdown
-      setCountdown(60)
-      setCanResend(false)
-
-      Alert.alert(t('code_sent'), t('new_verification_code_sent'))
-    } catch (error) {
-      console.error('Error resending OTP:', error)
-      Alert.alert(t('error'), t('failed_to_resend'))
-    } finally {
-      setLoading(false)
-    }
-  }, [canResend, managers, phoneNumber])
+    sendWebViewEvent('restartAuth', phoneNumber);
+  }, [canResend, phoneNumber])
 
   return (
     <SafeAreaView style={[styles.container, { backgroundColor: colors.background }]}>

app/auth/password.tsx

@@ -16,7 +16,7 @@ import { Ionicons } from '@expo/vector-icons'
 import { useTranslation } from 'react-i18next'
 import { useTheme } from '@/context/theme/ThemeContext'
 import { useThemeStyles } from '@/context/theme/useThemeStyles'
-import { useWallet } from '@/context/WalletContext'
+import { useWallet } from '@/context/WalletWebViewContext'
 import { Utils } from '@bsv/sdk'
 import { useLocalStorage } from '@/context/LocalStorageProvider'
 

app/auth/phone.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useCallback } from 'react'
+import React, { useState, useCallback, useEffect } from 'react'
 import {
   View,
   Text,
@@ -17,7 +17,7 @@ import { StatusBar } from 'expo-status-bar'
 import { useTranslation } from 'react-i18next'
 import { useTheme } from '@/context/theme/ThemeContext'
 import { useThemeStyles } from '@/context/theme/useThemeStyles'
-import { useWallet } from '@/context/WalletContext'
+import { useWallet } from '@/context/WalletWebViewContext'
 import { useBrowserMode } from '@/context/BrowserModeContext'
 import { countryCodes } from '@/utils/countryCodes'
 
@@ -27,7 +27,7 @@ export default function PhoneScreen() {
   const [selectedCountry, setSelectedCountry] = useState(countryCodes[222])
   const [showCountryPicker, setShowCountryPicker] = useState(false)
   const [loading, setLoading] = useState(false)
-  const { managers } = useWallet()
+  const { webviewComingEvent, sendWebViewEvent } = useWallet()
   const { showWeb3Benefits } = useBrowserMode()
 
   // Get theme styles and colors
@@ -54,23 +54,8 @@ export default function PhoneScreen() {
 
     setLoading(true)
 
-    try {
-      await managers!.walletManager!.startAuth({
-        phoneNumber: formattedNumber
-      })
-
-      // Navigate to OTP screen
-      router.push({
-        pathname: '/auth/otp',
-        params: { phoneNumber: formattedNumber }
-      })
-    } catch (error) {
-      console.error('Error sending OTP:', error)
-      // Show error message to user
-    } finally {
-      setLoading(false)
-    }
-  }, [managers?.walletManager, formattedNumber])
+    sendWebViewEvent('startAuth', formattedNumber);
+  }, [formattedNumber])
 
   // Handle skip login for web2 mode
   const handleSkipLogin = useCallback(() => {
@@ -90,6 +75,29 @@ export default function PhoneScreen() {
     )
   }, [showWeb3Benefits])
 
+  useEffect(() => {
+    // Handle incoming events from the webview
+    if (webviewComingEvent) {
+      const { name, results } = webviewComingEvent;
+
+      switch (name) {
+        case 'startAuth.callback':
+          setLoading(false);
+
+          if (results) {
+            // Navigate to OTP screen
+            router.push({
+              pathname: '/auth/otp',
+              params: { phoneNumber: formattedNumber }
+            });
+          } else {
+            console.error('Error sending OTP:');
+          }
+          break
+      }
+    }
+  }, [webviewComingEvent])
+
   return (
     <SafeAreaView style={styles.container}>
       <StatusBar style={isDark ? 'light' : 'dark'} />