Merge branch 'develop' of https://github.com/Emurgo/yoroi into chore/…

…event-swap

apps/wallet-mobile/android/app/src/dev/res/values/colors.xml

@@ -1,3 +1,3 @@
 <resources>
-    <color name="bootsplash_background">#1036A0</color>
+    <color name="bootsplash_background">#3154CB</color>
 </resources>

apps/wallet-mobile/android/app/src/dev/res/values/styles.xml

@@ -1,7 +1,7 @@
 <resources>
 
     <!-- Base application theme. -->
-    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
+    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
         <!-- Customize your theme here. -->
         <item name="android:forceDarkAllowed">false</item>
         <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>

apps/wallet-mobile/android/app/src/nightly/res/values/colors.xml

@@ -1,3 +1,3 @@
 <resources>
-    <color name="bootsplash_background">#1036A0</color>
+    <color name="bootsplash_background">#3154CB</color>
 </resources>

apps/wallet-mobile/android/app/src/nightly/res/values/styles.xml

@@ -1,7 +1,7 @@
 <resources>
 
     <!-- Base application theme. -->
-    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
+    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
         <!-- Customize your theme here. -->
         <item name="android:forceDarkAllowed">false</item>
         <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>

apps/wallet-mobile/android/app/src/production/res/values/colors.xml

@@ -1,3 +1,3 @@
 <resources>
-    <color name="bootsplash_background">#1036A0</color>
+    <color name="bootsplash_background">#3154CB</color>
 </resources>

apps/wallet-mobile/android/app/src/production/res/values/styles.xml

@@ -1,7 +1,7 @@
 <resources>
 
     <!-- Base application theme. -->
-    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
+    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
         <!-- Customize your theme here. -->
         <item name="android:forceDarkAllowed">false</item>
         <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>

apps/wallet-mobile/package.json

@@ -89,7 +89,7 @@
     "@emurgo/csl-mobile-bridge": "^5.1.2",
     "@emurgo/react-native-blockies-svg": "^0.0.2",
     "@emurgo/react-native-hid": "^5.15.6",
-    "@emurgo/yoroi-lib": "^0.5.2",
+    "@emurgo/yoroi-lib": "0.5.3",
     "@formatjs/intl-datetimeformat": "^6.7.0",
     "@formatjs/intl-getcanonicallocales": "^2.1.0",
     "@formatjs/intl-locale": "^3.2.1",

apps/wallet-mobile/src/Catalyst/ConfirmVotingTx.tsx

@@ -25,14 +25,20 @@ export const ConfirmVotingTx = ({
   onNext: () => void
   pin: string
 }) => {
+  const [supportsCIP36, setSupportsCIP36] = useState(true)
+
   const strings = useStrings()
   const wallet = useSelectedWallet()
   const votingRegTx = useVotingRegTx(
-    {wallet, pin}, //
+    {wallet, pin, supportsCIP36},
     {onSuccess: ({votingKeyEncrypted}) => onSuccess(votingKeyEncrypted)},
   )
   const [password, setPassword] = useState(features.prefillWalletInfo ? debugWalletInfo.PASSWORD : '')
-  const [useUSB, setUseUSB] = useState<boolean>(false)
+  const [useUSB, setUseUSB] = useState(false)
+
+  const handleCIP36SupportChange = (supportsCIP36: boolean) => {
+    setSupportsCIP36(supportsCIP36)
+  }
 
   return (
     <SafeAreaView edges={['left', 'right', 'bottom']} style={styles.safeAreaView}>
@@ -88,6 +94,9 @@ export const ConfirmVotingTx = ({
           yoroiUnsignedTx={votingRegTx}
           biometricInstructions={[strings.authOsInstructions]}
           chooseTransportOnConfirmation
+          onCIP36SupportChange={handleCIP36SupportChange}
+          autoConfirm={!supportsCIP36}
+          supportsCIP36={supportsCIP36}
         />
       </Actions>
     </SafeAreaView>

apps/wallet-mobile/src/Settings/PrivacyMode/PrivacyMode.tsx

@@ -33,7 +33,7 @@ export const useSetPrivacyMode = ({...options}: UseMutationOptions<void, Error,
   return mutation.mutate
 }
 
-type PrivacyMode = 'SHOWN' | 'HIDDEN'
+export type PrivacyMode = 'SHOWN' | 'HIDDEN'
 const defaultPrivacyMode: PrivacyMode = 'SHOWN'
 
 const parsePrivacyMode = (data: unknown) => {

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

@@ -8,6 +8,7 @@ import {AmountItem, AmountItemProps} from '../../components/AmountItem/AmountIte
 import {Spacer} from '../../components/Spacer'
 import globalMessages, {actionMessages} from '../../i18n/global-messages'
 import {useSelectedWallet} from '../../SelectedWallet'
+import {usePrivacyMode} from '../../Settings/PrivacyMode/PrivacyMode'
 import {sortTokenInfos} from '../../utils'
 import {getNetworkConfigById} from '../../yoroi-wallets/cardano/networks'
 import {useBalances, useTokenInfos} from '../../yoroi-wallets/hooks'
@@ -69,9 +70,10 @@ type ExplorableAssetItemProps = AmountItemProps & {
   onPress(): void
 }
 const ExplorableAssetItem = ({wallet, amount, onPress}: ExplorableAssetItemProps) => {
+  const privacyMode = usePrivacyMode()
   return (
     <TouchableOpacity style={styles.button} onPress={onPress} testID="assetSelectorItem">
-      <AmountItem wallet={wallet} amount={amount} />
+      <AmountItem privacyMode={privacyMode} wallet={wallet} amount={amount} />
     </TouchableOpacity>
   )
 }

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

@@ -1,10 +1,11 @@
-import React, {useState} from 'react'
+import React from 'react'
 import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 
 import {Boundary, ResetErrorRef, Spacer} from '../components'
 import {Icon} from '../components/Icon'
 import {formatTokenWithText, formatTokenWithTextWhenHidden} from '../legacy/format'
 import {useSelectedWallet} from '../SelectedWallet'
+import {PrivacyMode, usePrivacyMode, useSetPrivacyMode} from '../Settings/PrivacyMode/PrivacyMode'
 import {COLORS} from '../theme'
 import {useBalances} from '../yoroi-wallets/hooks'
 import {Amounts} from '../yoroi-wallets/utils'
@@ -14,7 +15,8 @@ export const BalanceBanner = React.forwardRef<ResetErrorRef>((_, ref) => {
   const wallet = useSelectedWallet()
   const balances = useBalances(wallet)
   const primaryAmount = Amounts.getAmount(balances, wallet.primaryTokenInfo.id)
-  const [privacy, setPrivacy] = useState(false)
+  const setPrivacyMode = useSetPrivacyMode()
+  const privacyMode = usePrivacyMode()
 
   return (
     <View style={styles.banner}>
@@ -26,29 +28,33 @@ export const BalanceBanner = React.forwardRef<ResetErrorRef>((_, ref) => {
 
       <Spacer height={10} />
 
-      <TouchableOpacity onPress={() => setPrivacy(!privacy)} style={styles.button}>
+      <TouchableOpacity
+        onPress={() => setPrivacyMode(privacyMode === 'SHOWN' ? 'HIDDEN' : 'SHOWN')}
+        style={styles.button}
+      >
         <Row>
           <Boundary loading={{size: 'small'}} error={{size: 'inline'}}>
-            <Balance privacy={privacy} />
+            <Balance privacyMode={privacyMode} />
           </Boundary>
         </Row>
 
         <Row>
-          <PairedBalance privacy={privacy} amount={primaryAmount} ref={ref} />
+          <PairedBalance privacyMode={privacyMode} amount={primaryAmount} ref={ref} />
         </Row>
       </TouchableOpacity>
     </View>
   )
 })
 
 const hiddenBalance = '*.******'
-const Balance = ({privacy}: {privacy: boolean}) => {
+const Balance = ({privacyMode}: {privacyMode: PrivacyMode}) => {
   const wallet = useSelectedWallet()
   const balances = useBalances(wallet)
 
-  const balance = privacy
-    ? formatTokenWithTextWhenHidden(hiddenBalance, wallet.primaryToken)
-    : formatTokenWithText(Amounts.getAmount(balances, wallet.primaryToken.identifier).quantity, wallet.primaryToken)
+  const balance =
+    privacyMode === 'HIDDEN'
+      ? formatTokenWithTextWhenHidden(hiddenBalance, wallet.primaryToken)
+      : formatTokenWithText(Amounts.getAmount(balances, wallet.primaryToken.identifier).quantity, wallet.primaryToken)
 
   return (
     <Row>

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

@@ -55,7 +55,7 @@ storiesOf('PairedBalance', module)
         >
           <View style={{flex: 1, justifyContent: 'center'}}>
             <View style={{borderWidth: 1}}>
-              <PairedBalance amount={{quantity: '2', tokenId: mocks.wallet.primaryTokenInfo.id}} privacy />
+              <PairedBalance amount={{quantity: '2', tokenId: mocks.wallet.primaryTokenInfo.id}} privacyMode="HIDDEN" />
             </View>
           </View>
         </SelectedWalletProvider>

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

@@ -1,7 +1,8 @@
-import {Balance} from '@yoroi/types'
+import {Balance as BalanceType} from '@yoroi/types'
 import * as React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, Text} from 'react-native'
+import {PrivacyMode} from 'src/Settings/PrivacyMode/PrivacyMode'
 
 import {Boundary, ResetError, ResetErrorRef} from '../components'
 import {useSelectedWallet} from '../SelectedWallet'
@@ -12,10 +13,11 @@ import {CurrencySymbol} from '../yoroi-wallets/types'
 import {Quantities} from '../yoroi-wallets/utils'
 
 type Props = {
-  privacy?: boolean
-  amount: Balance.Amount
+  privacyMode?: PrivacyMode
+  amount: BalanceType.Amount
 }
-export const PairedBalance = React.forwardRef<ResetErrorRef, Props>(({privacy, amount}, ref) => {
+
+export const PairedBalance = React.forwardRef<ResetErrorRef, Props>(({privacyMode, amount}, ref) => {
   const {currency} = useCurrencyContext()
 
   return (
@@ -30,13 +32,13 @@ export const PairedBalance = React.forwardRef<ResetErrorRef, Props>(({privacy, a
         ),
       }}
     >
-      <PrimaryBalance privacy={privacy} amount={amount} />
+      <Balance privacyMode={privacyMode} amount={amount} />
     </Boundary>
   )
 })
 
 const hiddenPairedTotal = '*.**'
-const PrimaryBalance = ({privacy, amount}: Props) => {
+const Balance = ({privacyMode, amount}: Props) => {
   const wallet = useSelectedWallet()
   const {currency, config} = useCurrencyContext()
   const rate = useExchangeRate({wallet, to: currency})
@@ -62,7 +64,7 @@ const PrimaryBalance = ({privacy, amount}: Props) => {
     Quantities.product([primaryExchangeQuantity, `${rate}`]),
     config.decimals,
   )
-  const pairedTotal = privacy ? hiddenPairedTotal : secondaryExchangeQuantity
+  const pairedTotal = privacyMode === 'HIDDEN' ? hiddenPairedTotal : secondaryExchangeQuantity
   return (
     <Text style={styles.pairedBalanceText} testID="pairedTotalText">
       {`${pairedTotal} ${currency}`}

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

@@ -12,6 +12,7 @@ import {formatTime, formatTokenFractional, formatTokenInteger} from '../../legac
 import utfSymbols from '../../legacy/utfSymbols'
 import {TxHistoryRouteNavigation} from '../../navigation'
 import {useSelectedWallet} from '../../SelectedWallet'
+import {usePrivacyMode} from '../../Settings/PrivacyMode/PrivacyMode'
 import {COLORS} from '../../theme'
 import {isEmptyString} from '../../utils/utils'
 import {MultiToken} from '../../yoroi-wallets/cardano/MultiToken'
@@ -105,6 +106,7 @@ const Middle = ({style, ...props}: ViewProps) => (
 )
 const Right = ({style, ...props}: ViewProps) => <View style={[style, {padding: 4}]} {...props} />
 const Amount = ({wallet, transaction}: {wallet: YoroiWallet; transaction: TransactionInfo}) => {
+  const privacyMode = usePrivacyMode()
   const amountAsMT = MultiToken.fromArray(transaction.amount)
   const amount: BigNumber = amountAsMT.getDefault()
   const fee = transaction.fee ? transaction.fee[0] : null
@@ -118,9 +120,11 @@ const Amount = ({wallet, transaction}: {wallet: YoroiWallet; transaction: Transa
   return (
     <View style={styles.amount} testID="transactionAmount">
       <Text style={style} secondary={transaction.assurance === 'PENDING'}>
-        <Text>{formatTokenInteger(asQuantity(amount), wallet.primaryToken)}</Text>
+        <Text>{privacyMode === 'HIDDEN' ? '*' : formatTokenInteger(asQuantity(amount), wallet.primaryToken)}</Text>
 
-        <Text small>{formatTokenFractional(asQuantity(amount), wallet.primaryToken)}</Text>
+        <Text small>
+          {privacyMode === 'HIDDEN' ? '.******' : formatTokenFractional(asQuantity(amount), wallet.primaryToken)}
+        </Text>
       </Text>
 
       <Text style={style}>{`${utfSymbols.NBSP}${wallet.primaryTokenInfo.symbol}`}</Text>

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

@@ -15,6 +15,7 @@ import {EditAmountScreen} from '../features/Send/useCases/ListAmountsToSend/Edit
 import {ReadQRCodeScreen} from '../features/Send/useCases/StartMultiTokenTx/InputReceiver/ReadQRCodeScreen'
 import {StartMultiTokenTxScreen} from '../features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen'
 import {
+  BackButton,
   defaultStackNavigationOptions,
   defaultStackNavigationOptionsV2,
   TxHistoryRoutes,
@@ -141,8 +142,11 @@ export const TxHistoryNavigator = () => {
           name="send-read-qr-code"
           component={ReadQRCodeScreen}
           options={{
-            title: strings.qrScannerTitle,
             ...sendOptions,
+            headerTransparent: true,
+            title: strings.qrScannerTitle,
+            headerTintColor: '#fff',
+            headerLeft: (props) => <BackButton color="#fff" {...props} />,
           }}
         />
 

apps/wallet-mobile/src/WalletNavigator.tsx

@@ -1,4 +1,5 @@
 import {createBottomTabNavigator} from '@react-navigation/bottom-tabs'
+import {getFocusedRouteNameFromRoute} from '@react-navigation/native'
 import {createStackNavigator} from '@react-navigation/stack'
 import {useMetrics} from '@yoroi/metrics-react-native'
 import React from 'react'
@@ -41,7 +42,7 @@ const WalletTabNavigator = () => {
       >
         <Tab.Screen
           name="history"
-          options={{
+          options={(route) => ({
             tabBarIcon: ({focused}) => (
               <Icon.TabWallet
                 size={24}
@@ -50,7 +51,8 @@ const WalletTabNavigator = () => {
             ),
             tabBarLabel: strings.walletTabBarLabel,
             tabBarTestID: 'walletTabBarButton',
-          }}
+            tabBarStyle: getFocusedRouteNameFromRoute(route.route) === 'send-read-qr-code' ? {display: 'none'} : {},
+          })}
         >
           {() => (
             <SearchProvider>

apps/wallet-mobile/src/components/AmountItem/AmountItem.tsx

@@ -2,6 +2,7 @@ import {Balance} from '@yoroi/types'
 import * as React from 'react'
 import {StyleSheet, View, ViewProps} from 'react-native'
 
+import {PrivacyMode} from '../../Settings/PrivacyMode/PrivacyMode'
 import {COLORS} from '../../theme'
 import {PairedBalance} from '../../TxHistory/PairedBalance'
 import {isEmptyString} from '../../utils'
@@ -14,9 +15,10 @@ export type AmountItemProps = {
   wallet: YoroiWallet
   amount: Balance.Amount
   style?: ViewProps['style']
+  privacyMode?: PrivacyMode
 }
 
-export const AmountItem = ({wallet, style, amount}: AmountItemProps) => {
+export const AmountItem = ({privacyMode, wallet, style, amount}: AmountItemProps) => {
   const {quantity, tokenId} = amount
   const tokenInfo = useTokenInfo({wallet, tokenId})
 
@@ -46,11 +48,11 @@ export const AmountItem = ({wallet, style, amount}: AmountItemProps) => {
       <Right>
         {tokenInfo.kind !== 'nft' && (
           <Text style={styles.quantity} testID="tokenAmountText">
-            {denominatedQuantity}
+            {privacyMode === 'HIDDEN' ? '**.*******' : denominatedQuantity}
           </Text>
         )}
 
-        {isPrimary && <PairedBalance amount={{quantity, tokenId: tokenInfo.id}} />}
+        {isPrimary && <PairedBalance privacyMode={privacyMode} amount={{quantity, tokenId: tokenInfo.id}} />}
       </Right>
     </View>
   )