New UI Logo (#143)

frontend/Components/Logo/index.tsx

@@ -11,16 +11,19 @@ interface LogoProps {
 
 export const Logo: React.FC<LogoProps> = ({ onlyIcon = false, size = 'small' }) => {
   const logoHeight = {
-    small: 60,
+    small: 30,
     medium: 90,
     large: 120,
     big: 280,
   }
   return (
     <View style={styles.container}>
-      <SvgXml height={logoHeight[size]} xml={nostrosLogoSvg} style={styles.logo} />
+      <SvgXml height={logoHeight[size]} xml={nostrosLogoSvg} />
       {!onlyIcon && (
-        <Text style={styles.text} variant={size === 'small' ? 'headlineSmall' : 'displayMedium'}>
+        <Text
+          style={[styles.text, { paddingLeft: size === 'small' ? 0 : 16 }]}
+          variant={size === 'small' ? 'headlineSmall' : 'displayMedium'}
+        >
           NOSTROS
         </Text>
       )}
@@ -29,17 +32,12 @@ export const Logo: React.FC<LogoProps> = ({ onlyIcon = false, size = 'small' })
 }
 
 const styles = StyleSheet.create({
-  logo: {
-    flex: 1,
-  },
   container: {
     flexDirection: 'row',
-    justifyContent: 'space-between',
     alignItems: 'center',
   },
   text: {
     fontFamily: 'Iceland-Regular',
-    flex: 2,
     height: 60,
     textAlignVertical: 'center',
   },

frontend/Components/MenuItems/index.tsx

@@ -55,7 +55,7 @@ export const MenuItems: React.FC = () => {
           },
         ]}
       >
-        <Drawer.Section showDivider={false}>
+        <Drawer.Section showDivider={false} style={styles.logo}>
           <Logo />
         </Drawer.Section>
         {nPub && (
@@ -165,6 +165,10 @@ export const MenuItems: React.FC = () => {
 }
 
 const styles = StyleSheet.create({
+  logo: {
+    justifyContent: 'center',
+    flexDirection: 'row',
+  },
   drawerContent: {
     flex: 1,
     borderTopRightRadius: 28,

frontend/Components/NoteCard/index.tsx

@@ -189,28 +189,35 @@ export const NoteCard: React.FC<NoteCardProps> = ({
     note && (
       <Card>
         <Card.Content style={styles.title}>
-          <View style={styles.titleUser}>
-            <View>
-              <NostrosAvatar
-                name={note.name}
-                pubKey={nPub}
-                src={note.picture}
-                lud06={note.lnurl}
-                size={54}
-              />
+          <TouchableRipple onPress={onPressOptions}>
+            <View style={styles.titleUser}>
+              <View>
+                <NostrosAvatar
+                  name={note.name}
+                  pubKey={nPub}
+                  src={note.picture}
+                  lud06={note.lnurl}
+                  size={54}
+                />
+              </View>
+              <View style={styles.titleUserInfo}>
+                <Text style={styles.titleUsername}>{usernamePubKey(note.name, nPub)}</Text>
+                <Text>{timestamp}</Text>
+              </View>
             </View>
-            <View style={styles.titleUserInfo}>
-              <Text style={styles.titleUsername}>{usernamePubKey(note.name, nPub)}</Text>
-              <Text>{timestamp}</Text>
-            </View>
-          </View>
+          </TouchableRipple>
           <View>
             <IconButton icon='dots-vertical' size={25} onPress={onPressOptions} />
           </View>
         </Card.Content>
         {getNoteContent()}
         <Card.Content style={[styles.actions, { borderColor: theme.colors.onSecondary }]}>
-          <Button icon={() => <MaterialCommunityIcons name='message-outline' size={25} />}>
+          <Button
+            icon={() => <MaterialCommunityIcons name='message-outline' size={25} />}
+            onPress={() =>
+              note.kind !== EventKind.recommendServer && push('Note', { noteId: note.id })
+            }
+          >
             {repliesCount}
           </Button>
           <Button

frontend/Pages/NotePage/index.tsx

@@ -183,21 +183,23 @@ export const NotePage: React.FC<NotePageProps> = ({ route }) => {
       >
         <Surface elevation={1}>
           <View style={styles.title}>
-            <View style={styles.titleUser}>
-              <View>
-                <NostrosAvatar
-                  name={note.name}
-                  pubKey={nPub}
-                  src={note.picture}
-                  lud06={note.lnurl}
-                  size={54}
-                />
+            <TouchableRipple onPress={openProfileDrawer}>
+              <View style={styles.titleUser}>
+                <View>
+                  <NostrosAvatar
+                    name={note.name}
+                    pubKey={nPub}
+                    src={note.picture}
+                    lud06={note.lnurl}
+                    size={54}
+                  />
+                </View>
+                <View style={styles.titleUserData}>
+                  <Text style={styles.titleUsername}>{usernamePubKey(note.name, nPub)}</Text>
+                  <Text>{timestamp}</Text>
+                </View>
               </View>
-              <View style={styles.titleUserData}>
-                <Text style={styles.titleUsername}>{usernamePubKey(note.name, nPub)}</Text>
-                <Text>{timestamp}</Text>
-              </View>
-            </View>
+            </TouchableRipple>
             <View>
               <IconButton icon='dots-vertical' size={25} onPress={openProfileDrawer} />
             </View>

frontend/Pages/ProfileConfigPage/index.tsx

@@ -321,9 +321,10 @@ export const ProfileConfigPage: React.FC = () => {
             label={t('profileConfigPage.npub') ?? ''}
             value={nPub}
             selectTextOnFocus={true}
+            editable={false}
             right={
               <TextInput.Icon
-                icon='content-paste'
+                icon='content-copy'
                 onPress={() => {
                   setShowNotification('npubCopied')
                   Clipboard.setString(nPub ?? '')
@@ -337,10 +338,11 @@ export const ProfileConfigPage: React.FC = () => {
             label={t('profileConfigPage.nsec') ?? ''}
             value={nSec}
             secureTextEntry={true}
+            editable={false}
             selectTextOnFocus={true}
             right={
               <TextInput.Icon
-                icon='content-paste'
+                icon='content-copy'
                 onPress={() => {
                   setShowNotification('nsecCopied')
                   Clipboard.setString(nSec ?? '')

frontend/Pages/ProfileConnectPage/index.tsx

@@ -58,7 +58,9 @@ export const ProfileConnectPage: React.FC = () => {
   return (
     <>
       <View style={styles.container}>
-        <Logo size='medium' />
+        <View style={styles.logo}>
+          <Logo size='medium' />
+        </View>
         <View style={styles.loginMain}>
           <TextInput
             mode='outlined'
@@ -101,6 +103,11 @@ const styles = StyleSheet.create({
     flex: 1,
     padding: 16,
   },
+  logo: {
+    justifyContent: 'center',
+    alignContent: 'center',
+    flexDirection: 'row',
+  },
   loginMain: {
     flex: 1,
     justifyContent: 'center',

frontend/Pages/ProfileLoadPage/index.tsx

@@ -39,7 +39,10 @@ export const ProfileLoadPage: React.FC = () => {
   }, [publicKey])
 
   useEffect(() => {
-    if (user) setProfileFound(true)
+    if (user) {
+      setProfileFound(true)
+      loadPets()
+    }
   }, [user])
 
   const loadMeta: () => void = () => {
@@ -80,7 +83,9 @@ export const ProfileLoadPage: React.FC = () => {
   return (
     <View style={styles.container}>
       <View style={styles.info}>
-        <Logo onlyIcon size='medium' />
+        <View style={styles.logo}>
+          <Logo onlyIcon size='medium' />
+        </View>
         <Text variant='titleMedium' style={styles.center}>
           {profileFound ? t('profileLoadPage.foundProfile') : t('profileLoadPage.searchingProfile')}
         </Text>
@@ -120,6 +125,11 @@ const styles = StyleSheet.create({
     justifyContent: 'space-between',
     flex: 1,
   },
+  logo: {
+    justifyContent: 'center',
+    alignContent: 'center',
+    flexDirection: 'row',
+  },
   center: {
     alignContent: 'center',
     textAlign: 'center',