Better UX: transaction note, contact detail

minibits-cash · Oct 14, 2024 · 00337ce · 00337ce
1 parent fcffbc2
commit 00337ce
Show file tree

Hide file tree

Showing 8 changed files with 145 additions and 191 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "minibits_wallet",
-  "version": "0.1.9-beta.19",
+  "version": "0.1.9-beta.20",
   "private": true,
   "scripts": {
     "android:clean": "cd android && ./gradlew clean",

diff --git a/src/components/MemoInputCard.tsx b/src/components/MemoInputCard.tsx
@@ -4,6 +4,7 @@ import {spacing, useThemeColor} from '../theme'
 import {Button} from './Button'
 import {Card} from './Card'
 import {translate} from '../i18n'
+import { verticalScale } from '@gocodingnow/rn-size-matters'
 
 interface MemoInputProps {
   memo: string
@@ -67,17 +68,17 @@ const $memoContainer: ViewStyle = {
 
 const $memoCard: ViewStyle = {
   marginBottom: spacing.small,
-  minHeight: 80,
+  minHeight: verticalScale(80),
 }
 
 const $memoButton: ViewStyle = {
-  maxHeight: 50,
+  maxHeight: verticalScale(50),
 }
 
 const $memoInput: TextStyle = {
   flex: 1,
   borderRadius: spacing.small,
-  fontSize: 16,
+  fontSize: verticalScale(16),
   textAlignVertical: 'center',
   marginRight: spacing.small,
 }
diff --git a/src/i18n_messages/en.json b/src/i18n_messages/en.json
@@ -50,6 +50,7 @@
 		"copyFailParam": "Couldn't copy %{param}",
 		"create": "Create",
 		"disabled": "Disabled",
+		"edit": "Edit",
 		"enabled": "Enabled",
 		"hideMore": "Collapse",
 		"import": "Import",
@@ -142,7 +143,7 @@
 		"resetDescription": "This will wipe out all local data from storage and from the local database. Do only during development or testing.",
 		"title": "Developer options",
 		"transactions": "Sync recent transactions",
-		"transactionsDescription": "There are {{count}} recent transactions cached in the app's fast storage. Resetting will reload them from the app's database. Do only during development or testing."
+		"transactionsDescription": "There are %{count} recent transactions cached in the app's fast storage. Resetting will reload them from the app's database. Do only during development or testing."
 	},
 	"errorScreen": {
 		"friendlySubtitle": "Unfortunately, the Minibits app encountered an unexpected error. Please contact us at [email protected] or raise an issue on Github.",
@@ -293,7 +294,7 @@
 	"privateKey": "Private key",
 	"privateNotePlaceholder": "Your private note",
 	"profileMissingAddressError": "Missing address",
-	"profileMissingNostrAddress": "This profile does not have nostr address to send ecash to.",
+	"profileMissingNostrAddress": "This profile does not have a Nostr address.",
 	"profileOnboarding": {
 		"desc": "Your minibits.cash wallet address allows you to receive encrypted ecash over Nostr. Simultaneously, it serves as your Lightning address, enabling you to receive payments from any Lightning wallet or zaps on the Nostr social network.",
 		"minibitsDesc": "Share your wallet address to receive encrypted ecash over Nostr. This also serves as your Lightning address, enabling you to receive payments from any Lightning wallet or zaps on the Nostr social network.",
@@ -318,8 +319,8 @@
 	"receiveScreen": {
 		"memoFromSender": "Memo from sender",
 		"newMintsAdded": {
-			"one": "{{count}} mint has been added to your wallet",
-			"other": "{{count}} mints have been added to your wallet"
+			"one": "%{count} mint has been added to your wallet",
+			"other": "%{count} mints have been added to your wallet"
 		},
 		"pasteoReceiveDescription": "Paste ecash token to receive it into your wallet.",
 		"pasteToReceive": "Paste",
@@ -419,8 +420,8 @@
 		"devOptions": "Developer options",
 		"go": "Let's go!",
 		"mintsCount": {
-			"one": "{{count}} mint",
-			"other": "{{count}} mints"
+			"one": "%{count} mint",
+			"other": "%{count} mints"
 		},
 		"preferredUnit": "Preferred unit",
 		"exchangeCurrency": "Balance conversion",

diff --git a/src/screens/ContactDetailScreen.tsx b/src/screens/ContactDetailScreen.tsx
@@ -111,7 +111,6 @@ export const ContactDetailScreen: FC<ContactDetailScreenProps> = observer(
             ? noteInputRef.current.focus()
             : false
         }, 100)
-
     }
 
     const onCopyNpub = function () {        
@@ -155,7 +154,7 @@ export const ContactDetailScreen: FC<ContactDetailScreenProps> = observer(
     const saveToPrivateContacts = async function () {
         if(contact.type === ContactType.PUBLIC) {            
             contactsStore.addContact({...contact})
-            toggleContactModal()            
+            setIsContactModalVisible(false)            
             setInfo('Contact saved.')
         }
     }
@@ -183,7 +182,7 @@ export const ContactDetailScreen: FC<ContactDetailScreenProps> = observer(
     const {type, name, display_name, npub, nip05, picture, about, lud16} = contact
 
     return (
-      <Screen contentContainerStyle={$screen} preset='auto'>        
+      <Screen contentContainerStyle={$screen} preset='scroll'>
         <View style={[$headerContainer, {backgroundColor: headerBg}]}>            
             {picture ? (
                 <View style={{borderRadius: 48, overflow: 'hidden'}}>
@@ -212,7 +211,7 @@ export const ContactDetailScreen: FC<ContactDetailScreenProps> = observer(
                 />
             ) : (
                 <Card
-                    style={[$card, {minHeight: 80}]}
+                    style={[$card, {minHeight: verticalScale(80)}]}
                     ContentComponent={
                         <View style={$noteContainer}>    
                             <TextInput
@@ -253,18 +252,18 @@ export const ContactDetailScreen: FC<ContactDetailScreenProps> = observer(
                     }
                 />
             )}
+            {lud16 && (
             <Card
-                style={[$card, {marginTop: spacing.small}]}                
+                labelTx='lightningAddress'
+                style={$card}
+                labelStyle={{marginTop: spacing.small}}                
                 ContentComponent={
-                    <>
-                    {lud16 && (
+                    <>                        
                         <ListItem                                    
-                            text={lud16}
-                            subTx='lightningAddress'                  
-                            leftIcon='faBolt'
-                            leftIconColor={colors.palette.orange200}                          
-                        />
-                        )}
+                                text={lud16}                                
+                                leftIcon='faBolt'
+                                leftIconColor={colors.palette.orange200}                          
+                        />                        
                         <ListItem                                                                
                             LeftComponent={
                                 <Button
@@ -275,22 +274,32 @@ export const ContactDetailScreen: FC<ContactDetailScreenProps> = observer(
                                     preset='tertiary'
                                 />
                             }
-                            RightComponent={lud16 ? (
+                            RightComponent={
                                 <Button
                                     tx="payCommon.payToAddress"
                                     style={{marginLeft: spacing.small, alignSelf: 'center', minHeight: verticalScale(20)}}
                                     textStyle={{fontSize: verticalScale(14), lineHeight: verticalScale(16)}}
                                     onPress={gotoTransfer}
                                     preset='tertiary'
                                 />
-                            ) : undefined}
-                            topSeparator={lud16 ? true : false}                             
+                            }
+                            topSeparator
                         />                        
                     </>
                 }
-            />            
+            />
+            )}            
         </View>
         <View style={[$bottomContainer]}>
+            {type === ContactType.PUBLIC &&  contact.nip05 && (                
+                <Button
+                    tx="saveContactPrivate"   
+                    style={{marginLeft: spacing.small, alignSelf: 'center', minHeight: verticalScale(20)}}
+                    textStyle={{fontSize: verticalScale(14), lineHeight: verticalScale(16)}}                                     
+                    onPress={saveToPrivateContacts}
+                    preset='tertiary'                    
+                />
+            )}
             <View style={$buttonContainer}>
                 {contact.nip05 ? (
                     <Button
@@ -352,7 +361,7 @@ export const ContactDetailScreen: FC<ContactDetailScreenProps> = observer(
                     />
                 </>
             )}
-            {type === ContactType.PUBLIC && (                
+            {type === ContactType.PUBLIC &&  contact.nip05 && (                
                 <ListItem
                     tx="saveContactPrivate"
                     subText={translate('saveContactPrivateDesc', { nip05: contact.nip05 })}
@@ -401,15 +410,15 @@ const $noteContainer: ViewStyle = {
 const $noteInput: TextStyle = {
     flex: 1,
     borderRadius: spacing.small,
-    fontSize: 16,
+    fontSize: verticalScale(16),
     textAlignVertical: 'center',
-    marginRight: spacing.small,
+    marginRight: spacing.small,    
 }
 
 
 const $noteButton: ViewStyle = {
-    maxHeight: 50,
-    minWidth: 70,
+    maxHeight: verticalScale(50),
+    minWidth: verticalScale(70),
 }
 
 
@@ -437,7 +446,7 @@ const $qrCodeContainer: ViewStyle = {
 }
 
 const $card: ViewStyle = {
-    // marginVertical: 0,
+    paddingVertical: 0,
 }
 
 const $item: ViewStyle = {

diff --git a/src/screens/ExportBackupScreen.tsx b/src/screens/ExportBackupScreen.tsx
@@ -63,21 +63,24 @@ export const ExportBackupScreen: FC<ExportBackupScreenProps> =
     useEffect(() => {
         const loadProofs = async () => {            
             setIsLoading(true)
-
-            // fix if rootStore migration failed and some proofs are missing urls
-            if (proofsStore.allProofs.some(proof => proof.mintUrl.length === 0 )) {
-              for (const mint of mintsStore.allMints) {
-                for(const keysetId of mint.keysetIds) {
-                    Database.updateProofsMintUrl(keysetId, mint.mintUrl)
-                }                
+            try {
+              // fix if rootStore migration failed and some proofs are missing urls
+              if (proofsStore.allProofs.some(proof => proof.mintUrl.length === 0 )) {
+                for (const mint of mintsStore.allMints) {
+                  for(const keysetId of mint.keysetIds) {
+                      Database.updateProofsMintUrl(keysetId, mint.mintUrl)
+                  }                
+                }
               }
-            }
 
-            // full refresh of proofs from DB in case the state is broken
-            await proofsStore.loadProofsFromDatabase()
+              // full refresh of proofs from DB in case the state is broken
+              await proofsStore.loadProofsFromDatabase()
 
-            // log.trace('[loadProofs]', {refreshedProofs: proofsStore.proofs})
-            setIsLoading(false)
+              // log.trace('[loadProofs]', {refreshedProofs: proofsStore.proofs})
+              setIsLoading(false)
+            } catch (e: any) {
+              handleError(e)
+            }            
         }
 
         loadProofs()
@@ -480,15 +483,15 @@ export const ExportBackupScreen: FC<ExportBackupScreenProps> =
             <View style={{
                 flexDirection: 'row', 
                 alignItems: 'center', 
-                marginBottom: spacing.small,
-                marginRight: spacing.small
+                marginBottom: spacing.small,     
+                paddingRight: spacing.medium           
               }}
             >
               <Icon icon='faInfoCircle' />
               <Text 
-                style={{color: hint, flexWrap: 'wrap'}} 
+                style={{color: hint}} 
                 size='xs' 
-                text='You still need your seed phrase when using this backup to recover wallet.'
+                text='You will still need your seed phrase when using this backup to recover your wallet.'
               />
             </View>
             <View style={$buttonContainer}>              
@@ -572,6 +575,5 @@ const $rightContainer: ViewStyle = {
 }
 
 const $bottomContainer: ViewStyle = { 
-  marginBottom: spacing.medium,
-
+  marginHorizontal: spacing.medium,  
 }