Merge branch 'develop' into feature/exchange/loading-error-screens

Signed-off-by: banklesss <105349292+banklesss@users.noreply.github.com>

apps/wallet-mobile/package.json

@@ -123,9 +123,9 @@
     "@types/bip39": "^3.0.0",
     "@types/pbkdf2": "^3.1.2",
     "@yoroi/api": "1.5.1",
-    "@yoroi/common": "1.5.1",
-    "@yoroi/exchange": "2.0.0",
-    "@yoroi/links": "1.5.3",
+    "@yoroi/common": "1.5.2",
+    "@yoroi/exchange": "2.0.1",
+    "@yoroi/links": "1.5.4",
     "@yoroi/resolver": "2.0.4",
     "@yoroi/staking": "1.5.1",
     "@yoroi/swap": "1.5.2",
@@ -244,7 +244,7 @@
     "@types/uuid": "^8.3.4",
     "@typescript-eslint/eslint-plugin": "^5.0.0",
     "@typescript-eslint/parser": "^5.32.0",
-    "@yoroi/types": "1.5.2",
+    "@yoroi/types": "1.5.4",
     "babel-eslint": "^10.1.0",
     "babel-jest": "^29.2.1",
     "babel-loader": "8.2.2",

apps/wallet-mobile/src/AppNavigator.tsx

@@ -1,6 +1,7 @@
 import {NavigationContainer, NavigationContainerRef} from '@react-navigation/native'
 import {createStackNavigator} from '@react-navigation/stack'
 import {isString} from '@yoroi/common'
+import {supportedPrefixes} from '@yoroi/links'
 import {TransferProvider} from '@yoroi/transfer'
 import * as React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
@@ -12,12 +13,13 @@ import {OsLoginScreen, PinLoginScreen, useBackgroundTimeout} from './auth'
 import {useAuth} from './auth/AuthProvider'
 import {supportsAndroidFingerprintOverlay} from './auth/biometrics'
 import {EnableLoginWithPin} from './auth/EnableLoginWithPin'
+import {useStatusBar} from './components/hooks/useStatusBar'
 import {ModalProvider} from './components/Modal/ModalContext'
 import {ModalScreen} from './components/Modal/ModalScreen'
 import {AgreementChangedNavigator, InitializationNavigator} from './features/Initialization'
 import {LegalAgreement, useLegalAgreement} from './features/Initialization/common'
 import {useDeepLinkWatcher} from './features/Links/common/useDeepLinkWatcher'
-import {CONFIG, LINKING_CONFIG, LINKING_PREFIXES} from './legacy/config'
+import {CONFIG} from './legacy/config'
 import {DeveloperScreen} from './legacy/DeveloperScreen'
 import {AppRoutes} from './navigation'
 import {SearchProvider} from './Search/SearchContext'
@@ -27,20 +29,13 @@ import {AuthSetting, useAuthOsEnabled, useAuthSetting, useAuthWithOs} from './yo
 
 const Stack = createStackNavigator<AppRoutes>()
 const navRef = React.createRef<NavigationContainerRef<ReactNavigation.RootParamList>>()
+const prefixes = [...supportedPrefixes]
 
 export const AppNavigator = () => {
   useDeepLinkWatcher()
   const strings = useStrings()
   const [routeName, setRouteName] = React.useState<string>()
-
-  // NOTE: mind some routes are handled by the event listener
-  const enableDeepLink = routeName === 'history-list'
-
-  const linking = {
-    enabled: enableDeepLink,
-    prefixes: LINKING_PREFIXES,
-    config: LINKING_CONFIG,
-  }
+  useStatusBar(routeName)
 
   useHideScreenInAppSwitcher()
   useAutoLogout()
@@ -81,7 +76,12 @@ export const AppNavigator = () => {
   }
 
   return (
-    <NavigationContainer onStateChange={handleStateChange} linking={linking} onReady={onReady} ref={navRef}>
+    <NavigationContainer
+      onStateChange={handleStateChange}
+      linking={{enabled: true, prefixes}}
+      onReady={onReady}
+      ref={navRef}
+    >
       <ModalProvider>
         <Stack.Navigator
           screenOptions={{

apps/wallet-mobile/src/Dashboard/Dashboard.tsx

@@ -6,7 +6,6 @@ import {defineMessages, useIntl} from 'react-intl'
 import {ActivityIndicator, RefreshControl, ScrollView, StyleSheet, View, ViewProps} from 'react-native'
 
 import {Banner, Button, useModal} from '../components'
-import {useStatusBar} from '../components/hooks/useStatusBar'
 import {
   useGovernanceStrings,
   useIsParticipatingInGovernance,
@@ -56,8 +55,6 @@ export const Dashboard = () => {
   const isParticipatingInGovernance = useIsParticipatingInGovernance(wallet)
   const walletNavigateTo = useWalletNavigation()
 
-  useStatusBar()
-
   const handleOnParticipatePress = () => {
     walletNavigateTo.navigateToGovernanceCentre({navigateToStakingOnSuccess: true})
   }

apps/wallet-mobile/src/Nfts/Nfts.tsx

@@ -7,7 +7,6 @@ import {RefreshControl, ScrollView, StyleSheet, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Icon, NftImageGallery, SkeletonGallery, Spacer} from '../components'
-import {useStatusBar} from '../components/hooks/useStatusBar'
 import {useMetrics} from '../metrics/metricsManager'
 import {useSearch, useSearchOnNavBar} from '../Search/SearchContext'
 import {useSelectedWallet} from '../SelectedWallet'
@@ -21,7 +20,6 @@ export const Nfts = () => {
   const strings = useStrings()
   const styles = useStyles()
   const {track} = useMetrics()
-  useStatusBar()
 
   // use case: search nfts
   useSearchOnNavBar({

apps/wallet-mobile/src/SelectedWallet/WalletSelection/WalletSelectionScreen.tsx

@@ -5,7 +5,6 @@ import {FlatList, InteractionManager, Linking, RefreshControl, StyleSheet, Text,
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Button} from '../../components/Button'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {Icon} from '../../components/Icon'
 import {PleaseWaitModal} from '../../components/PleaseWaitModal'
 import {showErrorDialog} from '../../dialogs'
@@ -15,7 +14,6 @@ import {isNightly} from '../../legacy/config'
 import {useMetrics} from '../../metrics/metricsManager'
 import {useWalletNavigation} from '../../navigation'
 import {COLORS} from '../../theme'
-import {HexColor} from '../../theme/types'
 import {WalletMeta} from '../../wallet-manager/types'
 import {useWalletManager} from '../../wallet-manager/WalletManagerContext'
 import * as HASKELL_SHELLEY from '../../yoroi-wallets/cardano/constants/mainnet/constants'
@@ -63,8 +61,6 @@ export const WalletSelectionScreen = () => {
     },
   })
 
-  useStatusBar(COLORS.BACKGROUND_BLUE as HexColor, isLoading)
-
   const onSelect = async (walletMeta: WalletMeta) => {
     // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
     if (walletMeta.isShelley || isJormungandr(walletMeta.networkId)) {
@@ -174,6 +170,7 @@ const ShelleyButton = () => {
       }
       title={strings.addWalletButton}
       style={styles.topButton}
+      testID="addWalletMainnetButton"
     />
   )
 }

apps/wallet-mobile/src/Staking/StakingCenter/StakingCenter.tsx

@@ -6,7 +6,6 @@ import {View} from 'react-native'
 import {WebView, WebViewMessageEvent} from 'react-native-webview'
 
 import {PleaseWaitModal, Spacer} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {useStakingTx} from '../../Dashboard/StakePoolInfos'
 import {showErrorDialog} from '../../dialogs'
 import {features} from '../../features'
@@ -61,8 +60,6 @@ export const StakingCenter = () => {
     },
   )
 
-  useStatusBar(undefined, isLoading)
-
   const handleOnMessage = async (event: WebViewMessageEvent) => {
     const selectedPoolHashes = JSON.parse(decodeURI(event.nativeEvent.data))
     if (!Array.isArray(selectedPoolHashes) || selectedPoolHashes.length < 1) {

apps/wallet-mobile/src/TxHistory/TxDetails/TxDetails.tsx

@@ -10,7 +10,6 @@ import {LayoutAnimation, StyleSheet, TouchableOpacity, View, ViewProps} from 're
 import {ScrollView} from 'react-native-gesture-handler'
 
 import {Banner, Boundary, Button, CopyButton, FadeIn, Icon, Text} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import AddressModal from '../../features/Receive/common/AddressModal/AddressModal'
 import {usePrivacyMode} from '../../features/Settings/PrivacyMode/PrivacyMode'
 import globalMessages from '../../i18n/global-messages'
@@ -28,7 +27,6 @@ import {useAssetListStyles} from './AssetListTransaction.style'
 export const TxDetails = () => {
   const strings = useStrings()
   const {styles, colors} = useStyles()
-  useStatusBar()
   const intl = useIntl()
   const {id} = useRoute().params as Params
   const wallet = useSelectedWallet()

apps/wallet-mobile/src/TxHistory/TxHistory.tsx

@@ -6,7 +6,6 @@ import {LayoutAnimation, StyleSheet, View} from 'react-native'
 
 import infoIcon from '../assets/img/icon/info-light-green.png'
 import {Boundary, ResetErrorRef, Spacer} from '../components'
-import {useStatusBar} from '../components/hooks/useStatusBar'
 import {Tab, TabPanel, TabPanels, Tabs} from '../components/Tabs'
 import {assetMessages, txLabels} from '../i18n/global-messages'
 import {useSelectedWallet} from '../SelectedWallet'
@@ -143,7 +142,6 @@ const warningBannerMessages = defineMessages({
 const useStyles = () => {
   const {theme} = useTheme()
   const {color, padding} = theme
-  useStatusBar(color.primary[100])
 
   const styles = StyleSheet.create({
     scrollView: {

apps/wallet-mobile/src/TxHistory/TxHistoryNavigator.tsx

@@ -184,7 +184,7 @@ export const TxHistoryNavigator = () => {
                     name="receive-single"
                     component={DescribeSelectedAddressScreen}
                     options={{
-                      title: strings.receiveTitle,
+                      title: strings.describeSelectedAddressTitle,
                       gestureEnabled: false,
                     }}
                   />
@@ -445,6 +445,10 @@ const messages = defineMessages({
     id: 'components.receive.receivescreen.title',
     defaultMessage: '!!!Receive',
   },
+  describeSelectedAddressTitle: {
+    id: 'components.receive.describeselectedaddressscreen.title',
+    defaultMessage: '!!!Address details',
+  },
   swapTitle: {
     id: 'swap.swapScreen.swapTitle',
     defaultMessage: '!!!Swap',
@@ -550,6 +554,7 @@ const useStrings = () => {
     exchangeCreateOrderTitle: intl.formatMessage(messages.exchangeCreateOrderTitle),
     exchangeSelectBuyProvider: intl.formatMessage(messages.exchangeSelectBuyProvider),
     exchangeSelectSellProvider: intl.formatMessage(messages.exchangeSelectSellProvider),
+    describeSelectedAddressTitle: intl.formatMessage(messages.describeSelectedAddressTitle),
   }
 }
 

apps/wallet-mobile/src/WalletInit/MnemonicCheck/MnemonicCheckScreen.tsx

@@ -5,7 +5,6 @@ import {InteractionManager, ScrollView, StyleSheet, TouchableOpacity, View} from
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Button, Spacer, Text} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {showErrorDialog} from '../../dialogs'
 import {errorMessages} from '../../i18n/global-messages'
 import {useMetrics} from '../../metrics/metricsManager'
@@ -23,7 +22,6 @@ export const MnemonicCheckScreen = () => {
   const route = useRoute<RouteProp<WalletInitRoutes, 'mnemonic-check'>>()
   const {mnemonic, password, name, networkId, walletImplementationId} = route.params
   const {track} = useMetrics()
-  useStatusBar()
 
   const mnemonicEntries: Array<Entry> = mnemonic
     .split(' ')

apps/wallet-mobile/src/WalletInit/MnemonicShow/MnemonicShowScreen.tsx

@@ -7,7 +7,6 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 
 import recoveryPhrase from '../../assets/img/recovery_phrase.png'
 import {Button, Text} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {WalletInitRouteNavigation, WalletInitRoutes} from '../../navigation'
 import {isEmptyString} from '../../utils/utils'
 import {MnemonicBackupImportanceModal} from '../MnemonicBackupModal'
@@ -16,7 +15,6 @@ export const MnemonicShowScreen = () => {
   const navigation = useNavigation<WalletInitRouteNavigation>()
   const route = useRoute<RouteProp<WalletInitRoutes, 'mnemonic-show'>>()
   const strings = useStrings()
-  useStatusBar()
   const mnemonic = route.params.mnemonic
   const [modal, setModal] = React.useState(false)
   const showModal = () => setModal(true)

apps/wallet-mobile/src/WalletInit/RestoreWallet/RestoreWalletScreen.tsx

@@ -5,15 +5,13 @@ import {View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Button, KeyboardAvoidingView, KeyboardSpacer, ScrollableView, Spacer, Text} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {WalletInitRouteNavigation, WalletInitRoutes} from '../../navigation'
 import {isEmptyString} from '../../utils/utils'
 import {getWalletConfigById} from '../../yoroi-wallets/cardano/utils'
 import {MnemonicInput} from '../MnemonicInput'
 
 export const RestoreWalletScreen = () => {
   const strings = useStrings()
-  useStatusBar()
   const navigation = useNavigation<WalletInitRouteNavigation>()
   const route = useRoute<RouteProp<WalletInitRoutes, 'restore-wallet-form'>>()
   const {networkId, walletImplementationId} = route.params

apps/wallet-mobile/src/WalletInit/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx

@@ -5,7 +5,6 @@ import {FlatList, InteractionManager, ScrollView, StyleSheet, View} from 'react-
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Boundary, Icon, Line, Text} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {showErrorDialog} from '../../dialogs'
 import {errorMessages} from '../../i18n/global-messages'
 import {useMetrics} from '../../metrics/metricsManager'
@@ -25,7 +24,6 @@ const addressMode: AddressMode = 'multiple'
 export const SaveReadOnlyWalletScreen = () => {
   const intl = useIntl()
   const strings = useStrings()
-  useStatusBar()
   const {resetToWalletSelection} = useWalletNavigation()
   const {track} = useMetrics()
   const route = useRoute<RouteProp<WalletInitRoutes, 'save-read-only'>>()

apps/wallet-mobile/src/WalletInit/VerifyRestoredWallet/VerifyRestoredWalletScreen.tsx

@@ -5,7 +5,6 @@ import {ActivityIndicator, ScrollView, StyleSheet, View, ViewProps} from 'react-
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {BulletPointItem, Button, Icon, Spacer, Text} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {WalletInitRouteNavigation, WalletInitRoutes} from '../../navigation'
 import {COLORS} from '../../theme'
 import {generateByronPlateFromMnemonics} from '../../yoroi-wallets/cardano/byron/plate'
@@ -20,7 +19,6 @@ import {WalletAddress} from '../WalletAddress'
 
 export const VerifyRestoredWalletScreen = () => {
   const strings = useStrings()
-  useStatusBar()
   const navigation = useNavigation<WalletInitRouteNavigation>()
   const route = useRoute<RouteProp<WalletInitRoutes, 'wallet-credentials'>>()
   const {phrase, networkId, walletImplementationId} = route.params

apps/wallet-mobile/src/WalletInit/WalletForm.tsx

@@ -3,7 +3,6 @@ import {defineMessages, useIntl} from 'react-intl'
 import {ScrollView, StyleSheet, TextInput as RNTextInput, View, ViewProps} from 'react-native'
 
 import {Button, Checkmark, KeyboardAvoidingView, Spacer, TextInput} from '../components'
-import {useStatusBar} from '../components/hooks/useStatusBar'
 import {debugWalletInfo, features} from '../features'
 import globalMessages from '../i18n/global-messages'
 import {COLORS} from '../theme'
@@ -23,7 +22,6 @@ type Props = {
 
 export const WalletForm = ({onSubmit}: Props) => {
   const strings = useStrings()
-  useStatusBar()
   const walletManager = useWalletManager()
   const {walletNames} = useWalletNames(walletManager)
   const [name, setName] = React.useState(features.prefillWalletInfo ? debugWalletInfo.WALLET_NAME : '')

apps/wallet-mobile/src/WalletInit/WalletFreshInit/WalletFreshInitScreen.tsx

@@ -5,7 +5,6 @@ import {StyleSheet, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Button, ButtonProps, Spacer} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {isNightly} from '../../legacy/config'
 import {WalletInitRouteNavigation} from '../../navigation'
 import {COLORS} from '../../theme'
@@ -17,7 +16,6 @@ import {WalletDescription} from '../WalletDescription'
 export const WalletFreshInitScreen = () => {
   const strings = useStrings()
   const navigateTo = useNavigateTo()
-  useStatusBar()
 
   return (
     <SafeAreaView edges={['left', 'right', 'top', 'bottom']} style={styles.safeAreaView}>

apps/wallet-mobile/src/WalletInit/WalletInit/WalletInitScreen.tsx

@@ -5,13 +5,11 @@ import {StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Button, ScreenBackground} from '../../components'
-import {useStatusBar} from '../../components/hooks/useStatusBar'
 import {LedgerTransportSwitchModal} from '../../HW'
 import globalMessages from '../../i18n/global-messages'
 import {Modal} from '../../legacy/Modal'
 import {WalletInitRouteNavigation, WalletInitRoutes} from '../../navigation'
 import {COLORS} from '../../theme'
-import {HexColor} from '../../theme/types'
 import {WALLET_CONFIG_24} from '../../yoroi-wallets/cardano/constants/mainnet/constants'
 import {isJormungandr} from '../../yoroi-wallets/cardano/networks'
 import {isByron, isHaskellShelley} from '../../yoroi-wallets/cardano/utils'
@@ -24,7 +22,6 @@ export const WalletInitScreen = () => {
   const strings = useStrings()
   const route = useRoute<RouteProp<WalletInitRoutes, 'choose-create-restore'>>()
   const [modalState, setModalState] = React.useState<ModalState>(MODAL_STATES.CLOSED)
-  useStatusBar(COLORS.BACKGROUND_BLUE as HexColor, modalState !== MODAL_STATES.CLOSED)
 
   const {networkId, walletImplementationId: implementationId} = route.params
   const navigateTo = useNavigateTo({networkId})

apps/wallet-mobile/src/YoroiApp.tsx

@@ -49,12 +49,12 @@ export const YoroiApp = () => {
 
   return (
     <AsyncStorageProvider storage={rootStorage}>
-      <MetricsProvider metricsManager={metricsManager}>
-        <WalletManagerProvider walletManager={walletManager}>
-          <ErrorBoundary>
-            <QueryClientProvider client={queryClient}>
-              <LoadingBoundary style={StyleSheet.absoluteFill}>
-                <ThemeProvider>
+      <ThemeProvider>
+        <MetricsProvider metricsManager={metricsManager}>
+          <WalletManagerProvider walletManager={walletManager}>
+            <ErrorBoundary>
+              <QueryClientProvider client={queryClient}>
+                <LoadingBoundary style={StyleSheet.absoluteFill}>
                   <LanguageProvider>
                     <CurrencyProvider>
                       <SafeAreaProvider>
@@ -72,12 +72,12 @@ export const YoroiApp = () => {
                       </SafeAreaProvider>
                     </CurrencyProvider>
                   </LanguageProvider>
-                </ThemeProvider>
-              </LoadingBoundary>
-            </QueryClientProvider>
-          </ErrorBoundary>
-        </WalletManagerProvider>
-      </MetricsProvider>
+                </LoadingBoundary>
+              </QueryClientProvider>
+            </ErrorBoundary>
+          </WalletManagerProvider>
+        </MetricsProvider>
+      </ThemeProvider>
     </AsyncStorageProvider>
   )
 }