fix(wallet-mobile): tx review uat overview tab (#3785)

Emurgo · Jan 15, 2025 · 46c8118 · 46c8118
1 parent 263e4e3
commit 46c8118
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 17 deletions.
diff --git a/apps/wallet-mobile/src/components/Info/Info.tsx b/apps/wallet-mobile/src/components/Info/Info.tsx
@@ -40,7 +40,7 @@ const useStyles = () => {
 
   const colors = {
     yellow: color.sys_orange_500,
-    blue: color.primary_500,
+    blue: color.el_primary_medium,
   }
 
   return {colors, styles} as const

diff --git a/apps/wallet-mobile/src/features/ReviewTx/common/CopiableText.tsx b/apps/wallet-mobile/src/features/ReviewTx/common/CopiableText.tsx
@@ -4,6 +4,7 @@ import {StyleSheet, TouchableOpacity, View, ViewStyle} from 'react-native'
 
 import {useCopy} from '../../../components/Clipboard/ClipboardProvider'
 import {Icon} from '../../../components/Icon'
+import {Space} from '../../../components/Space/Space'
 
 export const CopiableText = ({
   children,
@@ -20,6 +21,8 @@ export const CopiableText = ({
     <View style={[styles.text, style]}>
       {children}
 
+      <Space width="xs" />
+
       <CopyButton textToCopy={textToCopy} />
     </View>
   )
@@ -30,7 +33,7 @@ export const CopyButton = ({textToCopy}: {textToCopy: string}) => {
   const {copy} = useCopy()
   return (
     <TouchableOpacity onPress={() => copy({text: textToCopy})} activeOpacity={0.5}>
-      <Icon.Copy size={24} color={colors.copy} />
+      <Icon.Copy size={25} color={colors.copy} />
     </TouchableOpacity>
   )
 }

diff --git a/...et-mobile/src/features/ReviewTx/useCases/ReviewTxScreen/ReviewTx/Overview/OverviewTab.tsx b/...et-mobile/src/features/ReviewTx/useCases/ReviewTxScreen/ReviewTx/Overview/OverviewTab.tsx
@@ -116,7 +116,7 @@ const WalletInfoSection = ({tx, createdBy}: {tx: FormattedTx; createdBy?: React.
         <View style={styles.plate}>
           <Icon.WalletAvatar image={seedImage} style={styles.walletChecksum} size={24} />
 
-          <Space width="xs" />
+          <Space width="sm" />
 
           <TouchableOpacity activeOpacity={0.5} onPress={handleShowWalletBalance}>
             <Text style={styles.walletInfoText}>{`${plate} | ${meta.name}`}</Text>
@@ -177,7 +177,13 @@ const MyWalletSection = ({
           {address}
         </Text>
 
-        {ownedOutputs[0]?.addressKind === CredKind.Script && <Icon.DigitalAsset size={24} color={colors.icon} />}
+        {ownedOutputs[0]?.addressKind === CredKind.Script && (
+          <>
+            <Space width="xs" />
+
+            <Icon.DigitalAsset size={24} color={colors.icon} />
+          </>
+        )}
       </CopiableText>
 
       <Space height="sm" />
@@ -273,12 +279,7 @@ const OneExternalPartySection = ({
       <Space height="sm" />
 
       <View style={styles.externalPartyAddress}>
-        <Text style={styles.externalPartyAddressText}>
-          {output?.addressKind === CredKind.Script && receiverCustomTitle == null
-            ? strings.receiveToScriptLabel
-            : strings.receiveToLabel}
-          :
-        </Text>
+        <Text style={styles.externalPartyAddressText}>{strings.receiveToLabel}:</Text>
 
         {receiverCustomTitle ?? (
           <CopiableText textToCopy={address}>
@@ -290,7 +291,13 @@ const OneExternalPartySection = ({
               {address}
             </Text>
 
-            {output?.addressKind === CredKind.Script && <Icon.DigitalAsset size={24} color={colors.icon} />}
+            {output?.addressKind === CredKind.Script && (
+              <>
+                <Space width="xs" />
+
+                <Icon.DigitalAsset size={24} color={colors.icon} />
+              </>
+            )}
           </CopiableText>
         )}
       </View>
@@ -320,7 +327,13 @@ const MultiExternalPartiesSection = ({outputs}: {outputs: FormattedOutputs}) =>
             {address}
           </Text>
 
-          {output?.addressKind === CredKind.Script && <Icon.DigitalAsset size={24} color={colors.icon} />}
+          {output?.addressKind === CredKind.Script && (
+            <>
+              <Space width="xs" />
+
+              <Icon.DigitalAsset size={24} color={colors.icon} />
+            </>
+          )}
         </CopiableText>
 
         <Space height="sm" />
@@ -489,7 +502,7 @@ export const CreatedByInfoItem = ({logo, url}: {logo?: string; url: string}) =>
       <View style={styles.plate}>
         {logo != null && <Image source={{uri: logo}} style={styles.logo} />}
 
-        <Space width="xs" />
+        <Space width="sm" />
 
         <TouchableOpacity onPress={() => Linking.openURL(url)}>
           <Text style={styles.link}>{url.replace(/^https?:\/\//, '').replace(/\/+$/, '')}</Text>
@@ -678,7 +691,7 @@ const useStyles = () => {
   })
 
   const colors = {
-    send: color.primary_500,
+    send: color.el_primary_medium,
     received: color.green_static,
     icon: color.el_gray_medium,
   }

diff --git a/apps/wallet-mobile/src/features/ReviewTx/useCases/ReviewTxScreen/ReviewTx/ReviewTx.tsx b/apps/wallet-mobile/src/features/ReviewTx/useCases/ReviewTxScreen/ReviewTx/ReviewTx.tsx
@@ -201,10 +201,10 @@ const useStyles = () => {
     },
     indicator: {
       ...atoms.absolute,
-      bottom: 0,
-      height: 2,
+      bottom: -2,
+      height: 2.5,
       width: '100%',
-      backgroundColor: color.primary_500,
+      backgroundColor: color.el_primary_medium,
     },
   })