Version 0.6

README.md

@@ -13,7 +13,7 @@ Amethyst brings the best social network to your Android phone. Just insert your
 - [x] Reactions (like, boost, reply)
 - [x] Image Preview
 - [x] Url Preview
-- [ ] View Threads
+- [x] View Threads
 - [ ] Private Messages
 - [ ] Communities
 - [ ] Profile Edit
@@ -21,6 +21,25 @@ Amethyst brings the best social network to your Android phone. Just insert your
 
 # Development Overview
 
+## Overall Architecture 
+
+This is a native Android app made with Kotlin and Jetpack Compose.
+The app uses a modified version of the [nostrpostrlib](https://github.com/Giszmo/NostrPostr/tree/master/nostrpostrlib) to talk to Nostr relays.
+The overall architecture consists in the UI, which uses the usual State/ViewModel/Composition, the service layer that connects with Nostr relays,
+and the model/repository layer, which keeps all Nostr objects in memory, in a full OO graph.
+
+The repository layer stores Nostr Events as Notes and Users separately. Those classes use LiveData objects to
+allow the UI and other parts of the app to subscribe to each individual Note/User and receive updates when they happen.
+They are also responsible for updating viewModels when needed. Filters react to changes in the screen. As the user
+sees different Events, the Datasource classes are used to receive more information about those particular Events.
+
+Most of the UI is reactive to changes in the repository classes. The service layer assembles Nostr filters for each need of the app,
+receives the data from the Relay, and sends it to the repository. Connection with relays is never closed during the use of the app.
+The UI receives a notification that objects were updated. Instances of User and Notes are mutable directly.
+There will never be two Notes with the same ID or two User instances with the same pubkey.
+
+Lastly, the user's account information (priv key/pub key) is stored in the Android KeyStore for security.
+
 ## Setup
 
 Make sure to have the following pre-requisites installed:

app/build.gradle

@@ -11,8 +11,8 @@ android {
         applicationId "com.vitorpamplona.amethyst"
         minSdk 26
         targetSdk 33
-        versionCode 1
-        versionName "0.1"
+        versionCode 6
+        versionName "0.6"
 
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         vectorDrawables {
@@ -56,8 +56,9 @@ dependencies {
 
     // Navigation
     implementation("androidx.navigation:navigation-compose:$nav_version")
-    implementation 'androidx.lifecycle:lifecycle-runtime-compose:2.6.0-alpha03'
-    implementation 'androidx.compose.runtime:runtime-livedata:1.4.0-alpha03'
+    implementation 'androidx.lifecycle:lifecycle-runtime-compose:2.6.0-alpha04'
+    implementation 'androidx.compose.runtime:runtime-livedata:1.4.0-alpha04'
+    implementation "androidx.compose.material:material-icons-extended:1.3.1"
 
     // Input
     implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.5.1'
@@ -90,7 +91,17 @@ dependencies {
 
     // link preview
     implementation 'tw.com.oneup.www:Baha-UrlPreview:1.0.1'
-    implementation 'androidx.security:security-crypto-ktx:1.1.0-alpha03'
+    implementation 'androidx.security:security-crypto-ktx:1.1.0-alpha04'
+
+    // upload pictures:
+    implementation "com.google.accompanist:accompanist-permissions:0.28.0"
+
+    // view videos
+    implementation 'com.google.android.exoplayer:exoplayer:2.18.2'
+
+    // tabs for user profiles
+    implementation "com.google.accompanist:accompanist-pager:$accompanist_version" // Pager
+    implementation "com.google.accompanist:accompanist-pager-indicators:$accompanist_version" // Pager Indicators
 
     testImplementation 'junit:junit:4.13.2'
     androidTestImplementation 'androidx.test.ext:junit:1.1.5'

app/src/androidTest/java/com/vitorpamplona/amethyst/ExampleInstrumentedTest.kt

@@ -1,13 +1,11 @@
 package com.vitorpamplona.amethyst
 
-import androidx.test.platform.app.InstrumentationRegistry
 import androidx.test.ext.junit.runners.AndroidJUnit4
-
+import androidx.test.platform.app.InstrumentationRegistry
+import org.junit.Assert.*
 import org.junit.Test
 import org.junit.runner.RunWith
 
-import org.junit.Assert.*
-
 /**
  * Instrumented test, which will execute on an Android device.
  *

app/src/main/AndroidManifest.xml

@@ -3,6 +3,7 @@
     xmlns:tools="http://schemas.android.com/tools">
 
     <uses-permission android:name="android.permission.INTERNET"/>
+    <uses-permission android:name="android.permission.READ_MEDIA_IMAGES"/>
 
     <application
         android:allowBackup="true"

app/src/main/java/com/vitorpamplona/amethyst/model/Account.kt

@@ -1,10 +1,15 @@
 package com.vitorpamplona.amethyst.model
 
 import androidx.lifecycle.LiveData
+import com.vitorpamplona.amethyst.service.Constants
 import com.vitorpamplona.amethyst.service.model.ReactionEvent
 import com.vitorpamplona.amethyst.service.model.RepostEvent
 import com.vitorpamplona.amethyst.service.relays.Client
+import nostr.postr.Contact
 import nostr.postr.Persona
+import nostr.postr.Utils
+import nostr.postr.events.ContactListEvent
+import nostr.postr.events.PrivateDmEvent
 import nostr.postr.events.TextNoteEvent
 import nostr.postr.toHex
 
@@ -22,6 +27,11 @@ class Account(val loggedIn: Persona) {
   fun reactTo(note: Note) {
     if (!isWriteable()) return
 
+    if (note.reactions.firstOrNull { it.author == userProfile() } != null) {
+      // has already liked this note
+      return
+    }
+
     note.event?.let {
       val event = ReactionEvent.create(it, loggedIn.privKey!!)
       Client.send(event)
@@ -39,6 +49,38 @@ class Account(val loggedIn: Persona) {
     }
   }
 
+  fun broadcast(note: Note) {
+    note.event?.let {
+      Client.send(it)
+    }
+  }
+
+  fun follow(user: User) {
+    if (!isWriteable()) return
+
+    val lastestContactList = userProfile().lastestContactList
+    val event = if (lastestContactList != null) {
+      ContactListEvent.create(lastestContactList.follows.plus(Contact(user.pubkeyHex, null)), lastestContactList.relayUse, loggedIn.privKey!!)
+    } else {
+      val relays = Constants.defaultRelays.associate { it.url to ContactListEvent.ReadWrite(it.read, it.write) }
+      ContactListEvent.create(listOf(Contact(user.pubkeyHex, null)), relays, loggedIn.privKey!!)
+    }
+
+    Client.send(event)
+    LocalCache.consume(event)
+  }
+
+  fun unfollow(user: User) {
+    if (!isWriteable()) return
+
+    val lastestContactList = userProfile().lastestContactList
+    if (lastestContactList != null) {
+      val event = ContactListEvent.create(lastestContactList.follows.filter { it.pubKeyHex != user.pubkeyHex }, lastestContactList.relayUse, loggedIn.privKey!!)
+      Client.send(event)
+      LocalCache.consume(event)
+    }
+  }
+
   fun sendPost(message: String, replyingTo: Note?) {
     if (!isWriteable()) return
 
@@ -67,6 +109,51 @@ class Account(val loggedIn: Persona) {
     }
   }
 
+  fun sendPrivateMeesage(message: String, toUser: String, replyingTo: Note? = null) {
+    if (!isWriteable()) return
+    val user = LocalCache.users[toUser] ?: return
+
+    val signedEvent = PrivateDmEvent.create(
+      recipientPubKey = user.pubkey,
+      publishedRecipientPubKey = user.pubkey,
+      msg = message,
+      privateKey = loggedIn.privKey!!,
+      advertiseNip18 = false
+    )
+    Client.send(signedEvent)
+    LocalCache.consume(signedEvent)
+  }
+
+  fun decryptContent(note: Note): String? {
+    val event = note.event
+    return if (event is PrivateDmEvent && loggedIn.privKey != null) {
+      var pubkeyToUse = event.pubKey
+
+      val recepientPK = event.recipientPubKey
+
+      if (note.author == userProfile() && recepientPK != null)
+        pubkeyToUse = recepientPK
+
+      return try {
+        val sharedSecret = Utils.getSharedSecret(loggedIn.privKey!!, pubkeyToUse)
+
+        val retVal = Utils.decrypt(event.content, sharedSecret)
+
+        if (retVal.startsWith(PrivateDmEvent.nip18Advertisement)) {
+          retVal.substring(16)
+        } else {
+          retVal
+        }
+
+      } catch (e: Exception) {
+        e.printStackTrace()
+        null
+      }
+    } else {
+      event?.content
+    }
+  }
+
   // Observers line up here.
   val live: AccountLiveData = AccountLiveData(this)
 

app/src/main/java/com/vitorpamplona/amethyst/model/Hex.kt

@@ -3,6 +3,7 @@ package com.vitorpamplona.amethyst.model
 import com.vitorpamplona.amethyst.ui.note.toDisplayHex
 import fr.acinq.secp256k1.Hex
 import java.util.regex.Pattern
+import nostr.postr.Bech32
 import nostr.postr.Persona
 import nostr.postr.bechToBytes
 import nostr.postr.toHex
@@ -10,6 +11,8 @@ import nostr.postr.toHex
 /** Makes the distinction between String and Hex **/
 typealias HexKey = String
 
+fun ByteArray.toNote() = Bech32.encodeBytes(hrp = "note", this, Bech32.Encoding.Bech32)
+
 fun ByteArray.toHexKey(): HexKey {
   return toHex()
 }

app/src/main/java/com/vitorpamplona/amethyst/model/LocalCache.kt

@@ -103,6 +103,8 @@ object LocalCache {
       it.addReply(note)
     }
 
+    UrlCachedPreviewer.preloadPreviewsFor(note)
+
     refreshObservers()
   }
 
@@ -112,9 +114,9 @@ object LocalCache {
 
   fun consume(event: ContactListEvent) {
     val user = getOrCreateUser(event.pubKey)
-    //Log.d("CL", "${user.toBestDisplayName()} ${event.follows}")
 
     if (event.createdAt > user.updatedFollowsAt) {
+      Log.d("CL", "AAA ${user.toBestDisplayName()} ${event.follows.size}")
       user.updateFollows(
         event.follows.map {
           try {
@@ -129,13 +131,35 @@ object LocalCache {
         }.filterNotNull(),
         event.createdAt
       )
+
+      user.lastestContactList = event
     }
 
     refreshObservers()
   }
 
   fun consume(event: PrivateDmEvent) {
-    //Log.d("PM", event.toJson())
+    val note = getOrCreateNote(event.id.toHex())
+
+    // Already processed this event.
+    if (note.event != null) return
+
+    val author = getOrCreateUser(event.pubKey)
+    val recipient = event.recipientPubKey?.let { getOrCreateUser(it) }
+
+    //Log.d("PM", "${author.toBestDisplayName()} to ${recipient?.toBestDisplayName()}")
+
+    val repliesTo = event.tags.filter { it.firstOrNull() == "e" }.mapNotNull { it.getOrNull(1) }.map { getOrCreateNote(it) }.toMutableList()
+    val mentions = event.tags.filter { it.firstOrNull() == "p" }.mapNotNull { it.getOrNull(1) }.map { getOrCreateUser(decodePublicKey(it)) }
+
+    note.loadEvent(event, author, mentions, repliesTo)
+
+    if (recipient != null) {
+      author.addMessage(recipient, note)
+      recipient.addMessage(author, note)
+    }
+
+    refreshObservers()
   }
 
   fun consume(event: DeletionEvent) {

app/src/main/java/com/vitorpamplona/amethyst/model/Note.kt

@@ -4,18 +4,30 @@ import androidx.lifecycle.LiveData
 import com.vitorpamplona.amethyst.service.NostrSingleEventDataSource
 import com.vitorpamplona.amethyst.ui.note.toDisplayHex
 import fr.acinq.secp256k1.Hex
+import java.time.Instant
+import java.time.ZoneId
+import java.time.format.DateTimeFormatter
 import java.util.Collections
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.Job
+import kotlinx.coroutines.launch
 import nostr.postr.events.Event
 
 class Note(val idHex: String) {
+    // These fields are always available.
+    // They are immutable
     val id = Hex.decode(idHex)
     val idDisplayHex = id.toDisplayHex()
 
+    // These fields are only available after the Text Note event is received.
+    // They are immutable after that.
     var event: Event? = null
     var author: User? = null
     var mentions: List<User>? = null
     var replyTo: MutableList<Note>? = null
 
+    // These fields are updated every time an event related to this note is received.
     val replies = Collections.synchronizedSet(mutableSetOf<Note>())
     val reactions = Collections.synchronizedSet(mutableSetOf<Note>())
     val boosts = Collections.synchronizedSet(mutableSetOf<Note>())
@@ -29,6 +41,33 @@ class Note(val idHex: String) {
         refreshObservers()
     }
 
+    fun formattedDateTime(timestamp: Long): String {
+        return Instant.ofEpochSecond(timestamp).atZone(ZoneId.systemDefault())
+            .format(DateTimeFormatter.ofPattern("uuuu-MM-dd-HH:mm:ss"))
+    }
+
+    fun replyLevelSignature(): String {
+        val replyTo = replyTo
+        if (replyTo == null || replyTo.isEmpty()) {
+            return "/" + formattedDateTime(event?.createdAt ?: 0) + ";"
+        }
+
+        return replyTo
+            .map { it.replyLevelSignature() }
+            .maxBy { it.length }.removeSuffix(";") + "/" + formattedDateTime(event?.createdAt ?: 0) + ";"
+    }
+
+    fun replyLevel(): Int {
+        val replyTo = replyTo
+        if (replyTo == null || replyTo.isEmpty()) {
+            return 0
+        }
+
+        return replyTo.maxOf {
+            it.replyLevel()
+        } + 1
+    }
+
     fun addReply(note: Note) {
         if (replies.add(note))
             refreshObservers()
@@ -61,18 +100,24 @@ class Note(val idHex: String) {
 }
 
 class NoteLiveData(val note: Note): LiveData<NoteState>(NoteState(note)) {
+    val scope = CoroutineScope(Job() + Dispatchers.Main)
+
     fun refresh() {
         postValue(NoteState(note))
     }
 
     override fun onActive() {
         super.onActive()
-        NostrSingleEventDataSource.add(note.idHex)
+        scope.launch {
+            NostrSingleEventDataSource.add(note.idHex)
+        }
     }
 
     override fun onInactive() {
         super.onInactive()
-        NostrSingleEventDataSource.remove(note.idHex)
+        scope.launch {
+            NostrSingleEventDataSource.remove(note.idHex)
+        }
     }
 }
 

app/src/main/java/com/vitorpamplona/amethyst/model/UrlCachedPreviewer.kt

@@ -0,0 +1,55 @@
+package com.vitorpamplona.amethyst.model
+
+import com.baha.url.preview.BahaUrlPreview
+import com.baha.url.preview.IUrlPreviewCallback
+import com.baha.url.preview.UrlInfoItem
+import com.vitorpamplona.amethyst.ui.components.imageExtension
+import com.vitorpamplona.amethyst.ui.components.isValidURL
+import com.vitorpamplona.amethyst.ui.components.noProtocolUrlValidator
+import com.vitorpamplona.amethyst.ui.components.videoExtension
+import java.util.concurrent.ConcurrentHashMap
+
+object UrlCachedPreviewer {
+  val cache = ConcurrentHashMap<String, UrlInfoItem>()
+
+  fun previewInfo(url: String, callback: IUrlPreviewCallback? = null) {
+    cache[url]?.let {
+      callback?.onComplete(it)
+      return
+    }
+
+    BahaUrlPreview(url, object : IUrlPreviewCallback {
+      override fun onComplete(urlInfo: UrlInfoItem) {
+        cache.put(url, urlInfo)
+        callback?.onComplete(urlInfo)
+      }
+
+      override fun onFailed(throwable: Throwable) {
+        callback?.onFailed(throwable)
+      }
+    }).fetchUrlPreview()
+  }
+
+  fun findUrlsInMessage(message: String): List<String> {
+    return message.split('\n').map { paragraph ->
+      paragraph.split(' ').filter { word: String ->
+        isValidURL(word) || noProtocolUrlValidator.matcher(word).matches()
+      }
+    }.flatten()
+  }
+
+  fun preloadPreviewsFor(note: Note) {
+    note.event?.content?.let {
+      findUrlsInMessage(it).forEach {
+        val removedParamsFromUrl = it.split("?")[0].toLowerCase()
+        if (imageExtension.matcher(removedParamsFromUrl).matches()) {
+          // Preload Images? Isn't this too heavy?
+        } else if (videoExtension.matcher(removedParamsFromUrl).matches()) {
+          // Do nothing for now.
+        } else {
+          previewInfo(it)
+        }
+      }
+    }
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/model/User.kt

@@ -4,6 +4,8 @@ import androidx.lifecycle.LiveData
 import com.vitorpamplona.amethyst.service.NostrSingleUserDataSource
 import com.vitorpamplona.amethyst.ui.note.toDisplayHex
 import java.util.Collections
+import java.util.concurrent.ConcurrentHashMap
+import nostr.postr.events.ContactListEvent
 
 class User(val pubkey: ByteArray) {
     val pubkeyHex = pubkey.toHexKey()
@@ -14,11 +16,15 @@ class User(val pubkey: ByteArray) {
     var updatedMetadataAt: Long = 0;
     var updatedFollowsAt: Long = 0;
 
+    var lastestContactList: ContactListEvent? = null
+
     val notes = Collections.synchronizedSet(mutableSetOf<Note>())
     val follows = Collections.synchronizedSet(mutableSetOf<User>())
     val taggedPosts = Collections.synchronizedSet(mutableSetOf<Note>())
 
-    var follower: Number? = null
+    val followers = Collections.synchronizedSet(mutableSetOf<User>())
+
+    val messages = ConcurrentHashMap<User, MutableSet<Note>>()
 
     fun toBestDisplayName(): String {
         return bestDisplayName() ?: bestUsername() ?: pubkeyDisplayHex
@@ -37,9 +43,40 @@ class User(val pubkey: ByteArray) {
         return info.picture ?: "https://robohash.org/${pubkeyHex}.png"
     }
 
+    fun follow(user: User) {
+        follows.add(user)
+        user.followers.add(this)
+    }
+    fun unfollow(user: User) {
+        follows.remove(user)
+        user.followers.remove(this)
+    }
+
+    @Synchronized
+    fun getOrCreateChannel(user: User): MutableSet<Note> {
+        return messages[user] ?: run {
+            val channel = mutableSetOf<Note>()
+            messages[user] = channel
+            channel
+        }
+    }
+
+    fun addMessage(user: User, msg: Note) {
+        getOrCreateChannel(user).add(msg)
+        live.refresh()
+    }
+
     fun updateFollows(newFollows: List<User>, updateAt: Long) {
-        follows.clear()
-        follows.addAll(newFollows)
+        val toBeAdded = newFollows - follows
+        val toBeRemoved = follows - newFollows
+
+        toBeAdded.forEach {
+            follow(it)
+        }
+        toBeRemoved.forEach {
+            unfollow(it)
+        }
+
         updatedFollowsAt = updateAt
 
         live.refresh()
@@ -66,6 +103,7 @@ class UserMetadata {
     var display_name: String? = null
     var displayName: String? = null
     var picture: String? = null
+    var banner: String? = null
     var website: String? = null
     var about: String? = null
     var nip05: String? = null

app/src/main/java/com/vitorpamplona/amethyst/service/NostrAccountDataSource.kt

@@ -6,10 +6,11 @@ import com.vitorpamplona.amethyst.model.Note
 import com.vitorpamplona.amethyst.model.UserState
 import com.vitorpamplona.amethyst.service.model.RepostEvent
 import nostr.postr.JsonFilter
+import nostr.postr.events.ContactListEvent
+import nostr.postr.events.MetadataEvent
 import nostr.postr.events.TextNoteEvent
-import nostr.postr.toHex
 
-object NostrAccountDataSource: NostrDataSource("AccountData") {
+object NostrAccountDataSource: NostrDataSource<Note>("AccountData") {
   lateinit var account: Account
 
   private val cacheListener: (UserState) -> Unit = {
@@ -30,8 +31,9 @@ object NostrAccountDataSource: NostrDataSource("AccountData") {
 
   fun createAccountFilter(): JsonFilter {
     return JsonFilter(
+      kinds = listOf(MetadataEvent.kind, ContactListEvent.kind),
       authors = listOf(account.userProfile().pubkeyHex),
-      since = System.currentTimeMillis() / 1000 - (60 * 60 * 24 * 4), // 4 days
+      since = System.currentTimeMillis() / 1000 - (60 * 60 * 24 * 7), // 4 days
     )
   }
 

app/src/main/java/com/vitorpamplona/amethyst/service/NostrChatRoomDataSource.kt

@@ -0,0 +1,45 @@
+package com.vitorpamplona.amethyst.service
+
+import com.vitorpamplona.amethyst.model.Account
+import com.vitorpamplona.amethyst.model.LocalCache
+import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.model.User
+import nostr.postr.JsonFilter
+import nostr.postr.events.PrivateDmEvent
+
+object NostrChatRoomDataSource: NostrDataSource<Note>("ChatroomFeed") {
+  lateinit var account: Account
+  var withUser: User? = null
+
+  fun loadMessagesBetween(accountIn: Account, userId: String) {
+    account = accountIn
+    withUser = LocalCache.users[userId]
+  }
+
+  fun createMessagesToMeFilter() = JsonFilter(
+    kinds = listOf(PrivateDmEvent.kind),
+    authors = withUser?.let { listOf(it.pubkeyHex) },
+    tags = mapOf("p" to listOf(account.userProfile().pubkeyHex))
+  )
+
+  fun createMessagesFromMeFilter() = JsonFilter(
+    kinds = listOf(PrivateDmEvent.kind),
+    authors = listOf(account.userProfile().pubkeyHex),
+    tags = withUser?.let { mapOf("p" to listOf(it.pubkeyHex)) }
+  )
+
+  val incomingChannel = requestNewChannel()
+  val outgoingChannel = requestNewChannel()
+
+  // returns the last Note of each user.
+  override fun feed(): List<Note> {
+    val messages = account.userProfile().messages[withUser]
+
+    return messages?.sortedBy { it.event!!.createdAt } ?: emptyList()
+  }
+
+  override fun updateChannelFilters() {
+    incomingChannel.filter = createMessagesToMeFilter()
+    outgoingChannel.filter = createMessagesFromMeFilter()
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/service/NostrChatroomListDataSource.kt

@@ -0,0 +1,38 @@
+package com.vitorpamplona.amethyst.service
+
+import com.vitorpamplona.amethyst.model.Account
+import com.vitorpamplona.amethyst.model.Note
+import nostr.postr.JsonFilter
+import nostr.postr.events.PrivateDmEvent
+
+object NostrChatroomListDataSource: NostrDataSource<Note>("MailBoxFeed") {
+  lateinit var account: Account
+
+  fun createMessagesToMeFilter() = JsonFilter(
+    kinds = listOf(PrivateDmEvent.kind),
+    tags = mapOf("p" to listOf(account.userProfile().pubkeyHex))
+  )
+
+  fun createMessagesFromMeFilter() = JsonFilter(
+    kinds = listOf(PrivateDmEvent.kind),
+    authors = listOf(account.userProfile().pubkeyHex)
+  )
+
+  val incomingChannel = requestNewChannel()
+  val outgoingChannel = requestNewChannel()
+
+  // returns the last Note of each user.
+  override fun feed(): List<Note> {
+    val messages = account.userProfile().messages
+    val messagingWith = messages.keys().toList()
+
+    return messagingWith.mapNotNull {
+      messages[it]?.sortedBy { it.event?.createdAt }?.last { it.event != null }
+    }.sortedBy { it.event?.createdAt }.reversed()
+  }
+
+  override fun updateChannelFilters() {
+    incomingChannel.filter = createMessagesToMeFilter()
+    outgoingChannel.filter = createMessagesFromMeFilter()
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/service/NostrDataSource.kt

@@ -1,7 +1,6 @@
 package com.vitorpamplona.amethyst.service
 
 import com.vitorpamplona.amethyst.model.LocalCache
-import com.vitorpamplona.amethyst.model.Note
 import com.vitorpamplona.amethyst.service.model.ReactionEvent
 import com.vitorpamplona.amethyst.service.model.RepostEvent
 import com.vitorpamplona.amethyst.service.relays.Client
@@ -15,7 +14,7 @@ import nostr.postr.events.PrivateDmEvent
 import nostr.postr.events.RecommendRelayEvent
 import nostr.postr.events.TextNoteEvent
 
-abstract class NostrDataSource(val debugName: String) {
+abstract class NostrDataSource<T>(val debugName: String) {
   private val channels = Collections.synchronizedSet(mutableSetOf<Channel>())
   private val channelIds =  Collections.synchronizedSet(mutableSetOf<String>())
 
@@ -57,6 +56,10 @@ abstract class NostrDataSource(val debugName: String) {
         resetFilters()
       }*/
     }
+
+    override fun onSendResponse(eventId: String, success: Boolean, message: String, relay: Relay) {
+
+    }
   }
 
   init {
@@ -74,7 +77,7 @@ abstract class NostrDataSource(val debugName: String) {
     }
   }
 
-  fun loadTop(): List<Note> {
+  fun loadTop(): List<T> {
     return feed().take(100)
   }
 
@@ -131,5 +134,5 @@ abstract class NostrDataSource(val debugName: String) {
   }
 
   abstract fun updateChannelFilters()
-  abstract fun feed(): List<Note>
+  abstract fun feed(): List<T>
 }

app/src/main/java/com/vitorpamplona/amethyst/service/NostrGlobalDataSource.kt

@@ -1,10 +1,11 @@
 package com.vitorpamplona.amethyst.service
 
 import com.vitorpamplona.amethyst.model.LocalCache
+import com.vitorpamplona.amethyst.model.Note
 import nostr.postr.JsonFilter
 import nostr.postr.events.TextNoteEvent
 
-object NostrGlobalDataSource: NostrDataSource("GlobalFeed") {
+object NostrGlobalDataSource: NostrDataSource<Note>("GlobalFeed") {
   val fifteenMinutes = (60*15) // 15 mins
 
   fun createGlobalFilter() = JsonFilter(

app/src/main/java/com/vitorpamplona/amethyst/service/NostrHomeDataSource.kt

@@ -9,7 +9,7 @@ import nostr.postr.JsonFilter
 import nostr.postr.events.TextNoteEvent
 import nostr.postr.toHex
 
-object NostrHomeDataSource: NostrDataSource("HomeFeed") {
+object NostrHomeDataSource: NostrDataSource<Note>("HomeFeed") {
   lateinit var account: Account
 
   private val cacheListener: (UserState) -> Unit = {
@@ -29,11 +29,13 @@ object NostrHomeDataSource: NostrDataSource("HomeFeed") {
   }
 
   fun createFollowAccountsFilter(): JsonFilter? {
-    val follows = account.userProfile().follows?.map {
-      it.pubkey.toHex().substring(0, 6)
-    }
+    val follows = listOf(account.userProfile().pubkeyHex.substring(0, 6)).plus(
+      account.userProfile().follows?.map {
+        it.pubkey.toHex().substring(0, 6)
+      } ?: emptyList()
+    )
 
-    if (follows == null || follows.isEmpty()) return null
+    if (follows.isEmpty()) return null
 
     return JsonFilter(
       kinds = listOf(TextNoteEvent.kind, RepostEvent.kind),

app/src/main/java/com/vitorpamplona/amethyst/service/NostrNotificationDataSource.kt

@@ -4,11 +4,11 @@ import com.vitorpamplona.amethyst.model.Account
 import com.vitorpamplona.amethyst.model.Note
 import nostr.postr.JsonFilter
 
-object NostrNotificationDataSource: NostrDataSource("GlobalFeed") {
+object NostrNotificationDataSource: NostrDataSource<Note>("GlobalFeed") {
   lateinit var account: Account
 
   fun createGlobalFilter() = JsonFilter(
-    since = System.currentTimeMillis() / 1000 - (60 * 60 * 24 * 7), // 2 days
+    since = System.currentTimeMillis() / 1000 - (60 * 60 * 24 * 7), // 7 days
     tags = mapOf("p" to listOf(account.userProfile().pubkeyHex).filterNotNull())
   )
 

app/src/main/java/com/vitorpamplona/amethyst/service/NostrSingleEventDataSource.kt

@@ -2,10 +2,13 @@ package com.vitorpamplona.amethyst.service
 
 import com.vitorpamplona.amethyst.model.LocalCache
 import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.service.model.ReactionEvent
+import com.vitorpamplona.amethyst.service.model.RepostEvent
 import java.util.Collections
 import nostr.postr.JsonFilter
+import nostr.postr.events.TextNoteEvent
 
-object NostrSingleEventDataSource: NostrDataSource("SingleEventFeed") {
+object NostrSingleEventDataSource: NostrDataSource<Note>("SingleEventFeed") {
   val eventsToWatch = Collections.synchronizedList(mutableListOf<String>())
 
   fun createRepliesAndReactionsFilter(): JsonFilter? {
@@ -15,24 +18,35 @@ object NostrSingleEventDataSource: NostrDataSource("SingleEventFeed") {
       return null
     }
 
+    // downloads all the reactions to a given event.
     return JsonFilter(
+      kinds = listOf(TextNoteEvent.kind, ReactionEvent.kind, RepostEvent.kind),
       tags = mapOf("e" to reactionsToWatch)
     )
   }
 
   fun createLoadEventsIfNotLoadedFilter(): JsonFilter? {
-    val eventsToLoad = eventsToWatch
-      .map { LocalCache.notes[it] }
-      .filterNotNull()
+    val directEventsToLoad = eventsToWatch
+      .mapNotNull { LocalCache.notes[it] }
       .filter { it.event == null }
+
+    val threadingEventsToLoad = eventsToWatch
+      .mapNotNull { LocalCache.notes[it] }
+      .mapNotNull { it.replyTo }
+      .flatten()
+      .filter { it.event == null }
+
+    val interestedEvents =
+      (directEventsToLoad + threadingEventsToLoad)
       .map { it.idHex.substring(0, 8) }
 
-    if (eventsToLoad.isEmpty()) {
+    if (interestedEvents.isEmpty()) {
       return null
     }
 
+    // downloads linked events to this event.
     return JsonFilter(
-      ids = eventsToLoad
+      ids = interestedEvents
     )
   }
 

app/src/main/java/com/vitorpamplona/amethyst/service/NostrSingleUserDataSource.kt

@@ -6,7 +6,7 @@ import java.util.Collections
 import nostr.postr.JsonFilter
 import nostr.postr.events.MetadataEvent
 
-object NostrSingleUserDataSource: NostrDataSource("SingleUserFeed") {
+object NostrSingleUserDataSource: NostrDataSource<Note>("SingleUserFeed") {
   val usersToWatch = Collections.synchronizedList(mutableListOf<String>())
 
   fun createUserFilter(): JsonFilter? {

app/src/main/java/com/vitorpamplona/amethyst/service/NostrThreadDataSource.kt

@@ -0,0 +1,82 @@
+package com.vitorpamplona.amethyst.service
+
+import com.vitorpamplona.amethyst.model.LocalCache
+import com.vitorpamplona.amethyst.model.Note
+import java.util.Collections
+import nostr.postr.JsonFilter
+
+object NostrThreadDataSource: NostrDataSource<Note>("SingleThreadFeed") {
+  val eventsToWatch = Collections.synchronizedList(mutableListOf<String>())
+
+  fun createRepliesAndReactionsFilter(): JsonFilter? {
+    val reactionsToWatch = eventsToWatch.map { it.substring(0, 8) }
+
+    if (reactionsToWatch.isEmpty()) {
+      return null
+    }
+
+    return JsonFilter(
+      tags = mapOf("e" to reactionsToWatch)
+    )
+  }
+
+  fun createLoadEventsIfNotLoadedFilter(): JsonFilter? {
+    val eventsToLoad = eventsToWatch
+      .map { LocalCache.notes[it] }
+      .filterNotNull()
+      .filter { it.event == null }
+      .map { it.idHex.substring(0, 8) }
+
+    if (eventsToLoad.isEmpty()) {
+      return null
+    }
+
+    return JsonFilter(
+      ids = eventsToLoad
+    )
+  }
+
+  val repliesAndReactionsChannel = requestNewChannel()
+  val loadEventsChannel = requestNewChannel()
+
+  override fun feed(): List<Note> {
+    return eventsToWatch.map {
+      LocalCache.notes[it]
+    }.filterNotNull()
+  }
+
+  override fun updateChannelFilters() {
+    repliesAndReactionsChannel.filter = createRepliesAndReactionsFilter()
+    loadEventsChannel.filter = createLoadEventsIfNotLoadedFilter()
+  }
+
+  fun loadThread(noteId: String) {
+    val note = LocalCache.notes[noteId] ?: return
+
+    val thread = mutableListOf<Note>()
+    val threadSet = mutableSetOf<Note>()
+
+    val threadRoot = note.replyTo?.firstOrNull() ?: note
+
+    loadDown(threadRoot, thread, threadSet)
+
+    // Currently orders by date of each event, descending, at each level of the reply stack
+    val order = compareByDescending<Note> { it.replyLevelSignature() }
+
+    eventsToWatch.clear()
+    eventsToWatch.addAll(thread.sortedWith(order).map { it.idHex })
+
+    resetFilters()
+  }
+
+  fun loadDown(note: Note, thread: MutableList<Note>, threadSet: MutableSet<Note>) {
+    if (note !in threadSet) {
+      thread.add(note)
+      threadSet.add(note)
+
+      note.replies.forEach {
+        loadDown(it, thread, threadSet)
+      }
+    }
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/service/NostrUserProfileDataSource.kt

@@ -0,0 +1,45 @@
+package com.vitorpamplona.amethyst.service
+
+import com.vitorpamplona.amethyst.model.LocalCache
+import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.model.User
+import nostr.postr.JsonFilter
+import nostr.postr.events.MetadataEvent
+import nostr.postr.events.TextNoteEvent
+
+object NostrUserProfileDataSource: NostrDataSource<Note>("UserProfileFeed") {
+  var user: User? = null
+
+  fun loadUserProfile(userId: String) {
+    user = LocalCache.users[userId]
+    resetFilters()
+  }
+
+  fun createUserInfoFilter(): JsonFilter {
+    return JsonFilter(
+      kinds = listOf(MetadataEvent.kind),
+      authors = listOf(user!!.pubkeyHex),
+      since = System.currentTimeMillis() / 1000 - (60 * 60 * 24 * 7)
+    )
+  }
+
+  fun createUserPostsFilter(): JsonFilter {
+    return JsonFilter(
+      kinds = listOf(TextNoteEvent.kind),
+      authors = listOf(user!!.pubkeyHex),
+      since = System.currentTimeMillis() / 1000 - (60 * 60 * 24 * 4)
+    )
+  }
+
+  val userInfoChannel = requestNewChannel()
+  val notesChannel = requestNewChannel()
+
+  override fun feed(): List<Note> {
+    return user?.notes?.sortedBy { it.event?.createdAt }?.reversed() ?: emptyList()
+  }
+
+  override fun updateChannelFilters() {
+    userInfoChannel.filter = createUserInfoFilter()
+    notesChannel.filter = createUserPostsFilter()
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/service/NostrUserProfileFollowersDataSource.kt

@@ -0,0 +1,31 @@
+package com.vitorpamplona.amethyst.service
+
+import com.vitorpamplona.amethyst.model.LocalCache
+import com.vitorpamplona.amethyst.model.User
+import nostr.postr.JsonFilter
+import nostr.postr.events.ContactListEvent
+
+object NostrUserProfileFollowersDataSource: NostrDataSource<User>("UserProfileFollowerFeed") {
+  var user: User? = null
+
+  fun loadUserProfile(userId: String) {
+    user = LocalCache.users[userId]
+    resetFilters()
+  }
+
+  fun createFollowersFilter() = JsonFilter(
+    kinds = listOf(ContactListEvent.kind),
+    since = System.currentTimeMillis() / 1000 - (60 * 60 * 24 * 7), // 7 days
+    tags = mapOf("p" to listOf(user!!.pubkeyHex).filterNotNull())
+  )
+
+  val followerChannel = requestNewChannel()
+
+  override fun feed(): List<User> {
+    return user?.followers?.toList() ?: emptyList()
+  }
+
+  override fun updateChannelFilters() {
+    followerChannel.filter = createFollowersFilter()
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/service/NostrUserProfileFollowsDataSource.kt

@@ -0,0 +1,33 @@
+package com.vitorpamplona.amethyst.service
+
+import com.vitorpamplona.amethyst.model.LocalCache
+import com.vitorpamplona.amethyst.model.User
+import nostr.postr.JsonFilter
+import nostr.postr.events.ContactListEvent
+
+object NostrUserProfileFollowsDataSource: NostrDataSource<User>("UserProfileFollowsFeed") {
+  var user: User? = null
+
+  fun loadUserProfile(userId: String) {
+    user = LocalCache.users[userId]
+    resetFilters()
+  }
+
+  fun createFollowFilter(): JsonFilter {
+    return JsonFilter(
+      kinds = listOf(ContactListEvent.kind),
+      authors = listOf(user!!.pubkeyHex),
+      since = System.currentTimeMillis() / 1000 - (60 * 60 * 24 * 7), // 4 days
+    )
+  }
+
+  val followChannel = requestNewChannel()
+
+  override fun feed(): List<User> {
+    return user?.follows?.toList() ?: emptyList()
+  }
+
+  override fun updateChannelFilters() {
+    followChannel.filter = createFollowFilter()
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/service/relays/Client.kt

@@ -85,6 +85,10 @@ object Client: RelayPool.Listener {
         listeners.forEach { it.onRelayStateChange(type, relay) }
     }
 
+    override fun onSendResponse(eventId: String, success: Boolean, message: String, relay: Relay) {
+        listeners.forEach { it.onSendResponse(eventId, success, message, relay) }
+    }
+
     fun subscribe(listener: Listener) {
         listeners.add(listener)
     }
@@ -109,5 +113,10 @@ object Client: RelayPool.Listener {
          * Connected to or disconnected from a relay
          */
         open fun onRelayStateChange(type: Relay.Type, relay: Relay) = Unit
+
+        /**
+         * When an relay saves or rejects a new event.
+         */
+        open fun onSendResponse(eventId: String, success: Boolean, message: String, relay: Relay) = Unit
     }
 }

app/src/main/java/com/vitorpamplona/amethyst/service/relays/Relay.kt

@@ -59,8 +59,7 @@ class Relay(
                             it.onError(this@Relay, channel, Error("Relay sent notice: $channel"))
                         }
                         "OK" -> listeners.forEach {
-                            // "channel" being the second string in the string array ...
-                            // Event was saved correctly?
+                            it.onSendResponse(this@Relay, msg[1].asString, msg[2].asBoolean, msg[3].asString)
                         }
                         else -> listeners.forEach {
                             it.onError(
@@ -155,6 +154,7 @@ class Relay(
 
         fun onError(relay: Relay, subscriptionId: String, error: Error)
 
+        fun onSendResponse(relay: Relay, eventId: String, success: Boolean, message: String)
         /**
          * Connected to or disconnected from a relay
          *

app/src/main/java/com/vitorpamplona/amethyst/service/relays/RelayPool.kt

@@ -12,9 +12,12 @@ object RelayPool: Relay.Listener {
     private val relays = Collections.synchronizedList(ArrayList<Relay>())
     private val listeners = Collections.synchronizedSet(HashSet<Listener>())
 
-    fun report(): String {
-        val connected = relays.filter { it.isConnected() }
-        return "${connected.size}/${relays.size}"
+    fun availableRelays(): Int {
+        return relays.size
+    }
+
+    fun connectedRelays(): Int {
+        return relays.filter { it.isConnected() }.size
     }
 
     fun loadRelays(relayList: List<Relay>? = null){
@@ -79,6 +82,8 @@ object RelayPool: Relay.Listener {
         fun onError(error: Error, subscriptionId: String, relay: Relay)
 
         fun onRelayStateChange(type: Relay.Type, relay: Relay)
+
+        fun onSendResponse(eventId: String, success: Boolean, message: String, relay: Relay)
     }
 
     @Synchronized
@@ -96,6 +101,10 @@ object RelayPool: Relay.Listener {
         refreshObservers()
     }
 
+    override fun onSendResponse(relay: Relay, eventId: String, success: Boolean, message: String) {
+        listeners.forEach { it.onSendResponse(eventId, success, message, relay) }
+    }
+
     // Observers line up here.
     val live: RelayPoolLiveData = RelayPoolLiveData(this)
 

app/src/main/java/com/vitorpamplona/amethyst/ui/MainActivity.kt

@@ -10,11 +10,16 @@ import androidx.compose.ui.Modifier
 import androidx.lifecycle.viewmodel.compose.viewModel
 import com.vitorpamplona.amethyst.KeyStorage
 import com.vitorpamplona.amethyst.service.NostrAccountDataSource
+import com.vitorpamplona.amethyst.service.NostrChatroomListDataSource
 import com.vitorpamplona.amethyst.service.NostrGlobalDataSource
 import com.vitorpamplona.amethyst.service.NostrHomeDataSource
 import com.vitorpamplona.amethyst.service.NostrNotificationDataSource
 import com.vitorpamplona.amethyst.service.NostrSingleEventDataSource
 import com.vitorpamplona.amethyst.service.NostrSingleUserDataSource
+import com.vitorpamplona.amethyst.service.NostrThreadDataSource
+import com.vitorpamplona.amethyst.service.NostrUserProfileDataSource
+import com.vitorpamplona.amethyst.service.NostrUserProfileFollowersDataSource
+import com.vitorpamplona.amethyst.service.NostrUserProfileFollowsDataSource
 import com.vitorpamplona.amethyst.service.relays.Client
 import com.vitorpamplona.amethyst.ui.screen.AccountScreen
 import com.vitorpamplona.amethyst.ui.screen.AccountStateViewModel
@@ -49,11 +54,16 @@ class MainActivity : ComponentActivity() {
   override fun onPause() {
     NostrAccountDataSource.stop()
     NostrHomeDataSource.stop()
+    NostrChatroomListDataSource.stop()
+    NostrUserProfileDataSource.stop()
+    NostrUserProfileFollowersDataSource.stop()
+    NostrUserProfileFollowsDataSource.stop()
 
     NostrGlobalDataSource.stop()
     NostrNotificationDataSource.stop()
     NostrSingleEventDataSource.stop()
     NostrSingleUserDataSource.stop()
+    NostrThreadDataSource.stop()
     Client.disconnect()
     super.onPause()
   }

app/src/main/java/com/vitorpamplona/amethyst/ui/actions/ImageUploader.kt

@@ -0,0 +1,57 @@
+package com.vitorpamplona.amethyst.ui.actions
+
+import android.graphics.Bitmap
+import com.fasterxml.jackson.module.kotlin.jacksonObjectMapper
+import java.io.ByteArrayOutputStream
+import java.io.IOException
+import java.util.UUID
+import okhttp3.Call
+import okhttp3.Callback
+import okhttp3.MediaType.Companion.toMediaType
+import okhttp3.MultipartBody
+import okhttp3.OkHttpClient
+import okhttp3.Request
+import okhttp3.RequestBody
+import okhttp3.RequestBody.Companion.toRequestBody
+import okhttp3.Response
+
+object ImageUploader {
+  private fun encodeImage(bitmap: Bitmap): ByteArray {
+    val byteArrayOutPutStream = ByteArrayOutputStream()
+    bitmap.compress(Bitmap.CompressFormat.JPEG, 100, byteArrayOutPutStream)
+    return byteArrayOutPutStream.toByteArray()
+  }
+
+  fun uploadImage(bitmap: Bitmap, onSuccess: (String) -> Unit) {
+    val client = OkHttpClient.Builder().build()
+
+    val body: RequestBody = MultipartBody.Builder()
+      .setType(MultipartBody.FORM)
+      .addFormDataPart(
+        "image",
+        "${UUID.randomUUID()}.png",
+        encodeImage(bitmap).toRequestBody("image/png".toMediaType())
+      )
+      .build()
+
+    val request: Request = Request.Builder()
+      .url("https://api.imgur.com/3/image")
+      .header("Authorization", "Client-ID e6aea87296f3f96")
+      .post(body)
+      .build()
+
+    client.newCall(request).enqueue(object : Callback {
+      override fun onResponse(call: Call, response: Response) {
+        response.use {
+          val tree = jacksonObjectMapper().readTree(response.body!!.string())
+          val url = tree.get("data").get("link").asText()
+          onSuccess(url)
+        }
+      }
+
+      override fun onFailure(call: Call, e: IOException) {
+        e.printStackTrace()
+      }
+    })
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/actions/NewPostView.kt

@@ -17,48 +17,64 @@ import androidx.compose.material.Surface
 import androidx.compose.material.Text
 import androidx.compose.material.TextFieldDefaults
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.setValue
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.ui.Alignment
+import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.focus.FocusRequester
+import androidx.compose.ui.focus.focusRequester
+import androidx.compose.ui.focus.onFocusChanged
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalSoftwareKeyboardController
 import androidx.compose.ui.text.input.KeyboardCapitalization
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.compose.ui.window.Dialog
 import androidx.compose.ui.window.DialogProperties
-import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewmodel.compose.viewModel
+import coil.compose.AsyncImage
 import com.vitorpamplona.amethyst.model.Account
 import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.ui.components.UrlPreview
+import com.vitorpamplona.amethyst.ui.components.imageExtension
+import com.vitorpamplona.amethyst.ui.navigation.UploadFromGallery
+import kotlinx.coroutines.delay
 import nostr.postr.events.TextNoteEvent
 
-class PostViewModel: ViewModel() {
-    var account: Account? = null
-    var message by mutableStateOf("")
-    var replyingTo: Note? = null
-
-    fun sendPost() {
-        account?.sendPost(message, replyingTo)
-    }
-}
 
+@OptIn(ExperimentalComposeUiApi::class)
 @Composable
 fun NewPostView(onClose: () -> Unit, replyingTo: Note? = null, account: Account) {
-    val postViewModel: PostViewModel = viewModel<PostViewModel>().apply {
+    val postViewModel: NewPostViewModel = viewModel<NewPostViewModel>().apply {
         this.replyingTo = replyingTo
         this.account = account
     }
 
-    val dialogProperties = DialogProperties()
+    val context = LocalContext.current
+
+    // initialize focus reference to be able to request focus programmatically
+    val focusRequester = FocusRequester()
+    val keyboardController = LocalSoftwareKeyboardController.current
+
+    LaunchedEffect(Unit) {
+        delay(100)
+        focusRequester.requestFocus()
+    }
+
     Dialog(
-        onDismissRequest = { onClose() }, properties = dialogProperties
+        onDismissRequest = { onClose() },
+        properties = DialogProperties(
+            usePlatformDefaultWidth = false,
+            dismissOnClickOutside = false
+        )
     ) {
         Surface(
             modifier = Modifier
                 .fillMaxWidth()
-                .fillMaxHeight(0.5f)
+                .fillMaxHeight()
         ) {
             Column(
                 modifier = Modifier.padding(10.dp)
@@ -69,13 +85,21 @@ fun NewPostView(onClose: () -> Unit, replyingTo: Note? = null, account: Account)
                     horizontalArrangement = Arrangement.SpaceBetween,
                     verticalAlignment = Alignment.CenterVertically
                 ) {
-                    CloseButton(onCancel = onClose)
+                    CloseButton(onCancel = {
+                        postViewModel.cancel()
+                        onClose()
+                    })
+
+                    UploadFromGallery {
+                        postViewModel.upload(it, context)
+                    }
 
                     PostButton(
                         onPost = {
                             postViewModel.sendPost()
                             onClose()
-                        }
+                        },
+                        postViewModel.message.isNotBlank()
                     )
                 }
 
@@ -96,16 +120,26 @@ fun NewPostView(onClose: () -> Unit, replyingTo: Note? = null, account: Account)
 
                 OutlinedTextField(
                     value = postViewModel.message,
-                    onValueChange = { postViewModel.message = it },
+                    onValueChange = {
+                        postViewModel.message = it
+                        postViewModel.urlPreview = postViewModel.findUrlInMessage()
+                    },
                     keyboardOptions = KeyboardOptions.Default.copy(
                         capitalization = KeyboardCapitalization.Sentences
                     ),
-                    modifier = Modifier.fillMaxWidth().fillMaxHeight()
+                    modifier = Modifier
+                        .fillMaxWidth()
                         .border(
                             width = 1.dp,
                             color = MaterialTheme.colors.surface,
                             shape = RoundedCornerShape(8.dp)
-                        ),
+                        )
+                        .focusRequester(focusRequester)
+                        .onFocusChanged {
+                            if (it.isFocused) {
+                                keyboardController?.show()
+                            }
+                        },
                     placeholder = {
                         Text(
                             text = "What's on your mind?",
@@ -117,15 +151,39 @@ fun NewPostView(onClose: () -> Unit, replyingTo: Note? = null, account: Account)
                             unfocusedBorderColor = Color.Transparent,
                             focusedBorderColor = Color.Transparent
                         )
-
                 )
+
+                val myUrlPreview = postViewModel.urlPreview
+                if (myUrlPreview != null) {
+                    Column(modifier = Modifier.padding(top = 5.dp)) {
+                        val removedParamsFromUrl = myUrlPreview.split("?")[0].toLowerCase()
+                        if (imageExtension.matcher(removedParamsFromUrl).matches()) {
+                            AsyncImage(
+                                model = myUrlPreview,
+                                contentDescription = myUrlPreview,
+                                contentScale = ContentScale.FillWidth,
+                                modifier = Modifier
+                                    .padding(top = 4.dp)
+                                    .fillMaxWidth()
+                                    .clip(shape = RoundedCornerShape(15.dp))
+                                    .border(
+                                        1.dp,
+                                        MaterialTheme.colors.onSurface.copy(alpha = 0.12f),
+                                        RoundedCornerShape(15.dp)
+                                    )
+                            )
+                        } else {
+                            UrlPreview("https://$myUrlPreview", myUrlPreview, false)
+                        }
+                    }
+                }
             }
         }
     }
 }
 
 @Composable
-private fun CloseButton(onCancel: () -> Unit) {
+fun CloseButton(onCancel: () -> Unit) {
     Button(
         onClick = {
             onCancel()
@@ -141,15 +199,17 @@ private fun CloseButton(onCancel: () -> Unit) {
 }
 
 @Composable
-private fun PostButton(onPost: () -> Unit = {}) {
+fun PostButton(onPost: () -> Unit = {}, isActive: Boolean) {
     Button(
         onClick = {
-            onPost()
+            if (isActive) {
+                onPost()
+            }
         },
         shape = RoundedCornerShape(20.dp),
         colors = ButtonDefaults
             .buttonColors(
-                backgroundColor = MaterialTheme.colors.primary
+                backgroundColor = if (isActive) MaterialTheme.colors.primary else Color.Gray
             )
     ) {
         Text(text = "Post", color = Color.White)

app/src/main/java/com/vitorpamplona/amethyst/ui/actions/NewPostViewModel.kt

@@ -0,0 +1,57 @@
+package com.vitorpamplona.amethyst.ui.actions
+
+import android.content.Context
+import android.graphics.ImageDecoder
+import android.net.Uri
+import android.os.Build
+import android.provider.MediaStore
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.lifecycle.ViewModel
+import com.vitorpamplona.amethyst.model.Account
+import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.ui.components.isValidURL
+import com.vitorpamplona.amethyst.ui.components.noProtocolUrlValidator
+
+class NewPostViewModel: ViewModel() {
+    var account: Account? = null
+    var replyingTo: Note? = null
+
+    var message by mutableStateOf("")
+    var urlPreview by mutableStateOf<String?>(null)
+
+    fun sendPost() {
+        account?.sendPost(message, replyingTo)
+        message = ""
+        urlPreview = null
+    }
+
+    fun upload(it: Uri, context: Context) {
+        val img = if (Build.VERSION.SDK_INT < 28) {
+            MediaStore.Images.Media.getBitmap(context.contentResolver, it)
+        } else {
+            ImageDecoder.decodeBitmap(ImageDecoder.createSource(context.contentResolver, it))
+        }
+
+        img?.let {
+            ImageUploader.uploadImage(img) {
+                message = message + "\n\n" + it
+                urlPreview = findUrlInMessage()
+            }
+        }
+    }
+
+    fun cancel() {
+        message = ""
+        urlPreview = null
+    }
+
+    fun findUrlInMessage(): String? {
+        return message.split('\n').firstNotNullOfOrNull { paragraph ->
+            paragraph.split(' ').firstOrNull { word: String ->
+                isValidURL(word) || noProtocolUrlValidator.matcher(word).matches()
+            }
+        }
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/actions/UploadFromGallery.kt

@@ -0,0 +1,84 @@
+package com.vitorpamplona.amethyst.ui.navigation
+
+import android.net.Uri
+import androidx.activity.compose.rememberLauncherForActivityResult
+import androidx.activity.result.contract.ActivityResultContracts
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Button
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.SideEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import com.google.accompanist.permissions.ExperimentalPermissionsApi
+import com.google.accompanist.permissions.isGranted
+import com.google.accompanist.permissions.rememberPermissionState
+
+@OptIn(ExperimentalPermissionsApi::class)
+@Composable
+fun UploadFromGallery(onImageChosen: (Uri) -> Unit) {
+    val cameraPermissionState = rememberPermissionState(
+        android.Manifest.permission.READ_MEDIA_IMAGES
+    )
+
+    if (cameraPermissionState.status.isGranted) {
+        var showGallerySelect by remember { mutableStateOf(false) }
+        if (showGallerySelect) {
+            GallerySelect(
+                onImageUri = { uri ->
+                    showGallerySelect = false
+                    if (uri != null)
+                        onImageChosen(uri)
+                }
+            )
+        } else {
+            Box() {
+                Button(
+                    modifier = Modifier
+                        .align(Alignment.TopCenter)
+                        .padding(4.dp),
+                    onClick = {
+                        showGallerySelect = true
+                    }
+                ) {
+                    Text("Add Image from Gallery")
+                }
+            }
+        }
+    } else {
+        Column {
+            Button(onClick = { cameraPermissionState.launchPermissionRequest() }) {
+                Text("Add Image from Gallery")
+            }
+        }
+    }
+}
+
+
+@Composable
+fun GallerySelect(
+    onImageUri: (Uri?) -> Unit = { }
+) {
+    val launcher = rememberLauncherForActivityResult(
+        contract = ActivityResultContracts.GetContent(),
+        onResult = { uri: Uri? ->
+            onImageUri(uri)
+        }
+    )
+
+    @Composable
+    fun LaunchGallery() {
+        SideEffect {
+            launcher.launch("image/*")
+        }
+    }
+
+    LaunchGallery()
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/components/ExtendedImageView.kt

@@ -0,0 +1,77 @@
+package com.vitorpamplona.amethyst.ui.components
+
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Surface
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.ExperimentalComposeUiApi
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.window.Dialog
+import androidx.compose.ui.window.DialogProperties
+import coil.compose.AsyncImage
+import com.vitorpamplona.amethyst.ui.actions.CloseButton
+
+@Composable
+@OptIn(ExperimentalComposeUiApi::class)
+fun ExtendedImageView(word: String) {
+  // store the dialog open or close state
+  var dialogOpen by remember {
+    mutableStateOf(false)
+  }
+
+  AsyncImage(
+    model = word,
+    contentDescription = word,
+    contentScale = ContentScale.FillWidth,
+    modifier = Modifier
+      .padding(top = 4.dp)
+      .fillMaxWidth()
+      .clip(shape = RoundedCornerShape(15.dp))
+      .border(1.dp, MaterialTheme.colors.onSurface.copy(alpha = 0.12f), RoundedCornerShape(15.dp))
+      .clickable(
+        onClick = { dialogOpen = true }
+      )
+  )
+
+  if (dialogOpen) {
+    Dialog(
+      onDismissRequest = { dialogOpen = false },
+      properties = DialogProperties(usePlatformDefaultWidth = false)
+    ) {
+      Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colors.background) {
+        Column(
+          modifier = Modifier.padding(10.dp)
+        ) {
+          Row(
+            modifier = Modifier
+              .fillMaxWidth(),
+            horizontalArrangement = Arrangement.SpaceBetween,
+            verticalAlignment = Alignment.CenterVertically
+          ) {
+            CloseButton(onCancel = {
+              dialogOpen = false
+            })
+          }
+
+          ZoomableAsyncImage(word)
+        }
+      }
+    }
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/components/InvoicePreview.kt

@@ -0,0 +1,106 @@
+package com.vitorpamplona.amethyst.ui.components
+
+import android.content.Intent
+import android.net.Uri
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Button
+import androidx.compose.material.ButtonDefaults
+import androidx.compose.material.Divider
+import androidx.compose.material.Icon
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import androidx.core.content.ContextCompat.startActivity
+import com.vitorpamplona.amethyst.R
+
+@Composable
+fun InvoicePreview(lnInvoice: String) {
+  val amount = try {
+    LnInvoiceUtil.getAmountInSats(lnInvoice)
+  } catch (e: Exception) {
+    e.printStackTrace()
+    null
+  }
+
+  val context = LocalContext.current
+
+  Column(modifier = Modifier
+    .fillMaxWidth()
+    .padding(start = 30.dp, end = 30.dp)
+    .clip(shape = RoundedCornerShape(10.dp))
+    .border(1.dp, MaterialTheme.colors.onSurface.copy(alpha = 0.12f), RoundedCornerShape(15.dp))
+  ) {
+
+    Column(
+      modifier = Modifier
+        .fillMaxWidth()
+        .padding(30.dp)
+    ) {
+
+      Row(
+        verticalAlignment = Alignment.CenterVertically,
+        modifier = Modifier
+          .fillMaxWidth()
+          .padding(bottom = 10.dp)
+      ) {
+        Icon(
+          painter = painterResource(R.drawable.lightning),
+          null,
+          modifier = Modifier.size(20.dp),
+          tint = Color.Unspecified
+        )
+
+        Text(
+          text = "Lightning Invoice",
+          fontSize = 20.sp,
+          fontWeight = FontWeight.W500,
+          modifier = Modifier.padding(start = 10.dp)
+        )
+      }
+
+      Divider()
+
+      amount?.let {
+        Text(
+          text = "${amount.toInt()} sats",
+          fontSize = 25.sp,
+          fontWeight = FontWeight.W500,
+          modifier = Modifier
+            .fillMaxWidth()
+            .padding(vertical = 10.dp),
+        )
+      } 
+
+      Button(
+        modifier = Modifier.fillMaxWidth().padding(vertical = 10.dp),
+        onClick = {
+          runCatching {
+            val intent = Intent(Intent.ACTION_VIEW, Uri.parse("lightning://$lnInvoice"))
+            startActivity(context, intent, null)
+          }
+        },
+        shape = RoundedCornerShape(15.dp),
+        colors = ButtonDefaults.buttonColors(
+          backgroundColor = MaterialTheme.colors.primary
+        )
+      ) {
+        Text(text = "Pay", color = Color.White, fontSize = 20.sp)
+      }
+    }
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/components/LnInvoiceUtil.kt

@@ -0,0 +1,156 @@
+package com.vitorpamplona.amethyst.ui.components
+
+import java.math.BigDecimal
+import java.util.Locale
+import java.util.regex.Pattern
+
+/** based on litecoinj */
+object LnInvoiceUtil {
+  private val invoicePattern = Pattern.compile("lnbc((?<amount>\\d+)(?<multiplier>[munp])?)?1[^1\\s]+")
+
+  /** The Bech32 character set for encoding.  */
+  private const val CHARSET = "qpzry9x8gf2tvdw0s3jn54khce6mua7l"
+
+  /** The Bech32 character set for decoding.  */
+  private val CHARSET_REV = byteArrayOf(
+    -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1,
+    -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1,
+    -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1,
+    15, -1, 10, 17, 21, 20, 26, 30, 7, 5, -1, -1, -1, -1, -1, -1,
+    -1, 29, -1, 24, 13, 25, 9, 8, 23, -1, 18, 22, 31, 27, 19, -1,
+    1, 0, 3, 16, 11, 28, 12, 14, 6, 4, 2, -1, -1, -1, -1, -1,
+    -1, 29, -1, 24, 13, 25, 9, 8, 23, -1, 18, 22, 31, 27, 19, -1,
+    1, 0, 3, 16, 11, 28, 12, 14, 6, 4, 2, -1, -1, -1, -1, -1
+  )
+
+
+  /** Find the polynomial with value coefficients mod the generator as 30-bit.  */
+  private fun polymod(values: ByteArray): Int {
+    var c = 1
+    for (v_i in values) {
+      val c0 = c ushr 25 and 0xff
+      c = c and 0x1ffffff shl 5 xor (v_i.toInt() and 0xff)
+      if (c0 and 1 != 0) c = c xor 0x3b6a57b2
+      if (c0 and 2 != 0) c = c xor 0x26508e6d
+      if (c0 and 4 != 0) c = c xor 0x1ea119fa
+      if (c0 and 8 != 0) c = c xor 0x3d4233dd
+      if (c0 and 16 != 0) c = c xor 0x2a1462b3
+    }
+    return c
+  }
+
+  /** Expand a HRP for use in checksum computation.  */
+  private fun expandHrp(hrp: String): ByteArray {
+    val hrpLength = hrp.length
+    val ret = ByteArray(hrpLength * 2 + 1)
+    for (i in 0 until hrpLength) {
+      val c = hrp[i].code and 0x7f // Limit to standard 7-bit ASCII
+      ret[i] = (c ushr 5 and 0x07).toByte()
+      ret[i + hrpLength + 1] = (c and 0x1f).toByte()
+    }
+    ret[hrpLength] = 0
+    return ret
+  }
+
+  /** Verify a checksum.  */
+  private fun verifyChecksum(hrp: String, values: ByteArray): Boolean {
+    val hrpExpanded: ByteArray = expandHrp(hrp)
+    val combined = ByteArray(hrpExpanded.size + values.size)
+    System.arraycopy(hrpExpanded, 0, combined, 0, hrpExpanded.size)
+    System.arraycopy(values, 0, combined, hrpExpanded.size, values.size)
+    return polymod(combined) == 1
+  }
+
+  class AddressFormatException(message: String): Exception(message) {
+
+  }
+
+  fun decodeUnlimitedLength(invoice: String): Boolean {
+    var lower = false
+    var upper = false
+    for (i in 0 until invoice.length) {
+      val c = invoice[i]
+      if (c.code < 33 || c.code > 126) throw AddressFormatException("Invalid character: $c, pos: $i")
+      if (c in 'a'..'z') {
+        if (upper) throw AddressFormatException("Invalid character: $c, pos: $i")
+        lower = true
+      }
+      if (c in 'A'..'Z') {
+        if (lower) throw AddressFormatException("Invalid character: $c, pos: $i")
+        upper = true
+      }
+    }
+    val pos = invoice.lastIndexOf('1')
+    if (pos < 1) throw AddressFormatException("Missing human-readable part")
+    val dataPartLength = invoice.length - 1 - pos
+    if (dataPartLength < 6) throw AddressFormatException("Data part too short: $dataPartLength")
+    val values = ByteArray(dataPartLength)
+    for (i in 0 until dataPartLength) {
+      val c = invoice[i + pos + 1]
+      if (CHARSET_REV.get(c.code).toInt() == -1) throw AddressFormatException("Invalid character: " + c + ", pos: " + (i + pos + 1))
+      values[i] = CHARSET_REV.get(c.code)
+    }
+    val hrp = invoice.substring(0, pos).lowercase(Locale.ROOT)
+    if (!verifyChecksum(hrp, values)) throw AddressFormatException("Invalid Checksum")
+    return true
+  }
+
+  /**
+   * Parses invoice amount according to
+   * https://github.com/lightningnetwork/lightning-rfc/blob/master/11-payment-encoding.md#human-readable-part
+   * @return invoice amount in bitcoins, zero if the invoice has no amount
+   * @throws RuntimeException if invoice format is incorrect
+   */
+  fun getAmount(invoice: String): BigDecimal {
+    try {
+      decodeUnlimitedLength(invoice) // checksum must match
+    } catch (e: AddressFormatException) {
+      throw IllegalArgumentException("Cannot decode invoice", e)
+    }
+
+    val matcher = invoicePattern.matcher(invoice)
+    require(matcher.matches()) { "Failed to match HRP pattern" }
+    val amountGroup = matcher.group("amount")
+    val multiplierGroup = matcher.group("multiplier")
+    if (amountGroup == null) {
+      return BigDecimal.ZERO
+    }
+    val amount = BigDecimal(amountGroup)
+    if (multiplierGroup == null) {
+      return amount
+    }
+    require(!(multiplierGroup == "p" && amountGroup[amountGroup.length - 1] != '0')) { "sub-millisatoshi amount" }
+    return amount.multiply(multiplier(multiplierGroup))
+  }
+
+  fun getAmountInSats(invoice: String): BigDecimal {
+    return getAmount(invoice).multiply(BigDecimal(100000000))
+  }
+
+  private fun multiplier(multiplier: String): BigDecimal {
+    return when (multiplier) {
+      "m" -> BigDecimal("0.001")
+      "u" -> BigDecimal("0.000001")
+      "n" -> BigDecimal("0.000000001")
+      "p" -> BigDecimal("0.000000000001")
+      else -> throw IllegalArgumentException("Invalid multiplier: $multiplier")
+    }
+  }
+
+  /**
+   * Finds LN invoice in the provided input string and returns it.
+   * For example for input = "aaa bbb lnbc1xxx ccc" it will return "lnbc1xxx"
+   * It will only return the first invoice found in the input.
+   *
+   * @return the invoice if it was found. null for null input or if no invoice is found
+   */
+  fun findInvoice(input: String?): String? {
+    if (input == null) {
+      return null
+    }
+    val matcher = invoicePattern.matcher(input)
+    return if (matcher.find()) {
+      matcher.group()
+    } else null
+  }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/components/RichTextViewer.kt

@@ -1,30 +1,38 @@
 package com.vitorpamplona.amethyst.ui.components
 
-import androidx.compose.foundation.border
+import android.util.Patterns
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.ClickableText
+import androidx.compose.material.LocalTextStyle
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.clip
-import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.unit.dp
-import coil.compose.AsyncImage
+import androidx.navigation.NavController
 import com.google.accompanist.flowlayout.FlowRow
 import com.vitorpamplona.amethyst.model.LocalCache
+import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.model.toNote
+import com.vitorpamplona.amethyst.ui.note.toDisplayHex
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 import java.net.MalformedURLException
 import java.net.URISyntaxException
 import java.net.URL
 import java.util.regex.Pattern
 
 val imageExtension = Pattern.compile("(.*/)*.+\\.(png|jpg|gif|bmp|jpeg|webp)$")
+val videoExtension = Pattern.compile("(.*/)*.+\\.(mp4|avi|wmv|mpg|amv|webm)$")
 val noProtocolUrlValidator = Pattern.compile("^[-a-zA-Z0-9@:%._\\+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b(?:[-a-zA-Z0-9()@:%_\\+.~#?&//=]*)$")
-val tagIndex = Pattern.compile("\\#\\[([0-9]*)\\]")
+val tagIndex = Pattern.compile(".*\\#\\[([0-9]+)\\].*")
+
+val mentionsPattern: Pattern = Pattern.compile("@([A-Za-z0-9_-]+)")
+val hashTagsPattern: Pattern = Pattern.compile("#([A-Za-z0-9_-]+)")
+val urlPattern: Pattern = Patterns.WEB_URL
 
 fun isValidURL(url: String?): Boolean {
   return try {
@@ -38,7 +46,7 @@ fun isValidURL(url: String?): Boolean {
 }
 
 @Composable
-fun RichTextViewer(content: String, tags: List<List<String>>?) {
+fun RichTextViewer(content: String, tags: List<List<String>>?, note: Note, accountViewModel: AccountViewModel, navController: NavController) {
   Column(modifier = Modifier.padding(top = 5.dp)) {
     // FlowRow doesn't work well with paragraphs. So we need to split them
     content.split('\n').forEach { paragraph ->
@@ -46,26 +54,22 @@ fun RichTextViewer(content: String, tags: List<List<String>>?) {
       FlowRow() {
         paragraph.split(' ').forEach { word: String ->
           // Explicit URL
-          if (isValidURL(word)) {
+          val lnInvoice = LnInvoiceUtil.findInvoice(word)
+          if (lnInvoice != null) {
+            InvoicePreview(lnInvoice)
+          } else if (isValidURL(word)) {
             val removedParamsFromUrl = word.split("?")[0].toLowerCase()
             if (imageExtension.matcher(removedParamsFromUrl).matches()) {
-              AsyncImage(
-                model = word,
-                contentDescription = word,
-                contentScale = ContentScale.FillWidth,
-                modifier = Modifier
-                  .padding(top = 4.dp)
-                  .fillMaxWidth()
-                  .clip(shape = RoundedCornerShape(15.dp))
-                  .border(1.dp, MaterialTheme.colors.onSurface.copy(alpha = 0.12f), RoundedCornerShape(15.dp))
-              )
+              ExtendedImageView(word)
+            } else if (videoExtension.matcher(removedParamsFromUrl).matches()) {
+              VideoView(word)
             } else {
               UrlPreview(word, word)
             }
           } else if (noProtocolUrlValidator.matcher(word).matches()) {
             UrlPreview("https://$word", word)
           } else if (tagIndex.matcher(word).matches() && tags != null) {
-            TagLink(word, tags)
+            TagLink(word, tags, navController)
           } else {
             Text(text = "$word ")
           }
@@ -77,7 +81,7 @@ fun RichTextViewer(content: String, tags: List<List<String>>?) {
 }
 
 @Composable
-fun TagLink(word: String, tags: List<List<String>>) {
+fun TagLink(word: String, tags: List<List<String>>, navController: NavController) {
   val matcher = tagIndex.matcher(word)
 
   val index = try {
@@ -92,21 +96,23 @@ fun TagLink(word: String, tags: List<List<String>>) {
     return Text(text = "$word ")
   }
 
-  if (index > 0 && index < tags.size) {
+  if (index >= 0 && index < tags.size) {
     if (tags[index][0] == "p") {
       val user = LocalCache.users[tags[index][1]]
       if (user != null) {
         val innerUserState by user.live.observeAsState()
         Text(
-          "${innerUserState?.user?.toBestDisplayName()}"
+          "@${innerUserState?.user?.toBestDisplayName()} "
         )
       }
     } else if (tags[index][0] == "e") {
       val note = LocalCache.notes[tags[index][1]]
       if (note != null) {
         val innerNoteState by note.live.observeAsState()
-        Text(
-          "${innerNoteState?.note?.idDisplayHex}"
+        ClickableText(
+          text = AnnotatedString("@${innerNoteState?.note?.id?.toNote()?.toDisplayHex()} "),
+          onClick = { navController.navigate("Note/${note.idHex}") },
+          style = LocalTextStyle.current.copy(color = MaterialTheme.colors.primary)
         )
       }
     } else

app/src/main/java/com/vitorpamplona/amethyst/ui/components/UrlPreview.kt

@@ -7,7 +7,6 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.ClickableText
 import androidx.compose.material.LocalTextStyle
@@ -19,6 +18,7 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
+import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
@@ -28,37 +28,34 @@ import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import coil.compose.AsyncImage
-import com.baha.url.preview.BahaUrlPreview
 import com.baha.url.preview.IUrlPreviewCallback
 import com.baha.url.preview.UrlInfoItem
+import com.vitorpamplona.amethyst.model.UrlCachedPreviewer
 
 
+@OptIn(ExperimentalComposeUiApi::class)
 @Composable
-fun UrlPreview(url: String, urlText: String) {
+fun UrlPreview(url: String, urlText: String, showUrlIfError: Boolean = true) {
   var urlPreviewState by remember { mutableStateOf<UrlPreviewState>(UrlPreviewState.Loading) }
 
-  // Doesn't use a viewModel because of viewModel reusing issues (too many UrlPreview are created).
-  LaunchedEffect(urlPreviewState) {
-    if (urlPreviewState == UrlPreviewState.Loading) {
-      val urlPreview = BahaUrlPreview(url, object : IUrlPreviewCallback {
-        override fun onComplete(urlInfo: UrlInfoItem) {
-          if (urlInfo.allFetchComplete() && urlInfo.url == url)
-            urlPreviewState = UrlPreviewState.Loaded(urlInfo)
-          else
-            urlPreviewState = UrlPreviewState.Empty
-        }
-
-        override fun onFailed(throwable: Throwable) {
-          urlPreviewState = UrlPreviewState.Error("Error parsing preview for ${url}: ${throwable.message}")
-        }
-      })
-
-      urlPreview.fetchUrlPreview()
-    }
-  }
-
   val uri = LocalUriHandler.current
 
+  // Doesn't use a viewModel because of viewModel reusing issues (too many UrlPreview are created).
+  LaunchedEffect(url) {
+    UrlCachedPreviewer.previewInfo(url, object : IUrlPreviewCallback {
+      override fun onComplete(urlInfo: UrlInfoItem) {
+        if (urlInfo.allFetchComplete() && urlInfo.url == url)
+          urlPreviewState = UrlPreviewState.Loaded(urlInfo)
+        else
+          urlPreviewState = UrlPreviewState.Empty
+      }
+
+      override fun onFailed(throwable: Throwable) {
+        urlPreviewState = UrlPreviewState.Error("Error parsing preview for ${url}: ${throwable.message}")
+      }
+    })
+  }
+
   Crossfade(targetState = urlPreviewState) { state ->
     when (state) {
       is UrlPreviewState.Loaded -> {
@@ -97,11 +94,13 @@ fun UrlPreview(url: String, urlText: String) {
         }
       }
       else -> {
-        ClickableText(
-          text = AnnotatedString("$urlText "),
-          onClick = { runCatching { uri.openUri(url) } },
-          style = LocalTextStyle.current.copy(color = MaterialTheme.colors.primary),
-        )
+        if (showUrlIfError) {
+          ClickableText(
+            text = AnnotatedString("$urlText "),
+            onClick = { runCatching { uri.openUri(url) } },
+            style = LocalTextStyle.current.copy(color = MaterialTheme.colors.primary),
+          )
+        }
       }
     }
   }

app/src/main/java/com/vitorpamplona/amethyst/ui/components/VideoView.kt

@@ -0,0 +1,48 @@
+package com.vitorpamplona.amethyst.ui.components
+
+import android.view.ViewGroup
+import android.widget.FrameLayout
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.viewinterop.AndroidView
+import com.google.android.exoplayer2.C
+import com.google.android.exoplayer2.ExoPlayer
+import com.google.android.exoplayer2.MediaItem
+import com.google.android.exoplayer2.Player
+import com.google.android.exoplayer2.ui.AspectRatioFrameLayout
+import com.google.android.exoplayer2.ui.StyledPlayerView
+
+@Composable
+fun VideoView(videoUri: String) {
+  val context = LocalContext.current
+
+  val exoPlayer = ExoPlayer.Builder(LocalContext.current).build().apply {
+    repeatMode = Player.REPEAT_MODE_ALL
+    videoScalingMode = C.VIDEO_SCALING_MODE_SCALE_TO_FIT_WITH_CROPPING
+    setMediaItem(MediaItem.fromUri(videoUri))
+    prepare()
+  }
+
+  DisposableEffect(exoPlayer) {
+    onDispose {
+      exoPlayer.release()
+    }
+  }
+
+  AndroidView(
+    modifier = Modifier
+      .fillMaxWidth(),
+    factory = {
+      StyledPlayerView(context).apply {
+        player = exoPlayer
+        layoutParams = FrameLayout.LayoutParams(
+          ViewGroup.LayoutParams.MATCH_PARENT,
+          ViewGroup.LayoutParams.WRAP_CONTENT
+        )
+        resizeMode = AspectRatioFrameLayout.RESIZE_MODE_FIXED_WIDTH
+      }
+    })
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/components/ZoomableAsyncImage.kt

@@ -0,0 +1,60 @@
+package com.vitorpamplona.amethyst.ui.components
+
+import androidx.compose.foundation.gestures.awaitFirstDown
+import androidx.compose.foundation.gestures.calculatePan
+import androidx.compose.foundation.gestures.calculateZoom
+import androidx.compose.foundation.gestures.forEachGesture
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.graphicsLayer
+import androidx.compose.ui.input.pointer.pointerInput
+import androidx.compose.ui.layout.ContentScale
+import coil.compose.AsyncImage
+
+@Composable
+fun ZoomableAsyncImage(imageUrl: String) {
+    var scale by remember { mutableStateOf(1f) }
+    var offsetX by remember { mutableStateOf(0f) }
+    var offsetY by remember { mutableStateOf(0f) }
+
+    Column(
+        verticalArrangement = Arrangement.Center,
+        horizontalAlignment = Alignment.CenterHorizontally,
+        modifier = Modifier
+            .pointerInput(Unit) {
+                forEachGesture {
+                    awaitPointerEventScope {
+                        awaitFirstDown()
+                        do {
+                            val event = awaitPointerEvent()
+                            scale *= event.calculateZoom()
+                            val offset = event.calculatePan()
+                            offsetX += offset.x
+                            offsetY += offset.y
+                        } while (event.changes.any { it.pressed })
+                    }
+                }
+            }
+    ) {
+
+        AsyncImage(
+            model = imageUrl,
+            contentDescription = "Profile Image",
+            contentScale = ContentScale.FillWidth,
+            modifier = Modifier.fillMaxSize().graphicsLayer(
+                scaleX = scale,
+                scaleY = scale,
+                translationX = offsetX,
+                translationY = offsetY
+            ),
+        )
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/navigation/AppNavigation.kt

@@ -13,7 +13,7 @@ fun AppNavigation(
 ) {
     NavHost(navController, startDestination = Route.Home.route) {
         Routes.forEach {
-            composable(it.route, content = it.buildScreen(accountViewModel))
+            composable(it.route, it.arguments, content = it.buildScreen(accountViewModel, navController))
         }
     }
 }

app/src/main/java/com/vitorpamplona/amethyst/ui/navigation/AppTopBar.kt

@@ -3,6 +3,7 @@ package com.vitorpamplona.amethyst.ui.navigation
 import android.util.Log
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
@@ -37,14 +38,13 @@ import kotlinx.coroutines.launch
 
 @Composable
 fun AppTopBar(navController: NavHostController, scaffoldState: ScaffoldState, accountViewModel: AccountViewModel) {
+
+
     when (currentRoute(navController)) {
-        Route.Profile.route,
-        Route.Lists.route,
-        Route.Topics.route,
-        Route.Bookmarks.route,
-        Route.Moments.route -> TopBarWithBackButton(navController)
+        //Route.Profile.route -> TopBarWithBackButton(navController)
         else -> MainTopBar(scaffoldState, accountViewModel)
     }
+
 }
 
 @Composable
@@ -53,7 +53,8 @@ fun MainTopBar(scaffoldState: ScaffoldState, accountViewModel: AccountViewModel)
     val accountUser = accountUserState?.user
 
     val relayViewModel: RelayPoolViewModel = viewModel { RelayPoolViewModel() }
-    val relayPoolLiveData by relayViewModel.relayPoolLiveData.observeAsState()
+    val connectedRelaysLiveData by relayViewModel.connectedRelaysLiveData.observeAsState()
+    val availableRelaysLiveData by relayViewModel.availableRelaysLiveData.observeAsState()
 
     val coroutineScope = rememberCoroutineScope()
 
@@ -98,15 +99,15 @@ fun MainTopBar(scaffoldState: ScaffoldState, accountViewModel: AccountViewModel)
                         model = accountUser?.profilePicture() ?: "https://robohash.org/ohno.png",
                         contentDescription = "Profile Image",
                         modifier = Modifier
-                            .width(34.dp)
+                            .width(34.dp).height(34.dp)
                             .clip(shape = CircleShape),
                     )
                 }
             },
             actions = {
                 Text(
-                    relayPoolLiveData ?: "--/--",
-                    color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
+                    "${connectedRelaysLiveData ?: "--"}/${availableRelaysLiveData ?: "--"}",
+                    color = if (connectedRelaysLiveData == 0) Color.Red else MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
                 )
 
                 IconButton(

app/src/main/java/com/vitorpamplona/amethyst/ui/navigation/DrawerContent.kt

@@ -8,15 +8,14 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material.Divider
 import androidx.compose.material.Icon
-import androidx.compose.material.IconButton
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.ScaffoldState
 import androidx.compose.material.Surface
@@ -35,6 +34,7 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.font.FontWeight.Companion.W500
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import androidx.navigation.NavController
 import androidx.navigation.NavHostController
 import coil.compose.AsyncImage
 import com.vitorpamplona.amethyst.R
@@ -43,14 +43,6 @@ import com.vitorpamplona.amethyst.ui.screen.AccountStateViewModel
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 import kotlinx.coroutines.launch
 
-val bottomNavigations = listOf(
-    Route.Profile,
-    Route.Lists,
-    //Route.Topics,
-    Route.Bookmarks,
-    //Route.Moments
-)
-
 @Composable
 fun DrawerContent(navController: NavHostController,
                   scaffoldState: ScaffoldState,
@@ -66,19 +58,31 @@ fun DrawerContent(navController: NavHostController,
     ) {
         Column() {
             Box {
-                Image(
-                    painter = painterResource(R.drawable.profile_banner),
-                    contentDescription = "Profile Banner",
-                    contentScale = ContentScale.FillWidth,
-                    modifier = Modifier.fillMaxWidth()
-                )
+                val banner = accountUser?.info?.banner
+                if (banner != null && banner.isNotBlank()) {
+                    AsyncImage(
+                        model = banner,
+                        contentDescription = "Profile Image",
+                        contentScale = ContentScale.FillWidth,
+                        modifier = Modifier.fillMaxWidth().height(150.dp)
+                    )
+                } else {
+                    Image(
+                        painter = painterResource(R.drawable.profile_banner),
+                        contentDescription = "Profile Banner",
+                        contentScale = ContentScale.FillWidth,
+                        modifier = Modifier.fillMaxWidth().height(150.dp)
+                    )
+                }
 
                 ProfileContent(
                     accountUser,
                     modifier = Modifier
                         .fillMaxWidth()
                         .padding(horizontal = 25.dp)
-                        .padding(top = 125.dp)
+                        .padding(top = 100.dp),
+                    scaffoldState,
+                    navController
                 )
             }
             Divider(
@@ -86,6 +90,7 @@ fun DrawerContent(navController: NavHostController,
                 modifier = Modifier.padding(top = 20.dp)
             )
             ListContent(
+                accountUser,
                 navController,
                 scaffoldState,
                 modifier = Modifier
@@ -98,16 +103,26 @@ fun DrawerContent(navController: NavHostController,
 }
 
 @Composable
-fun ProfileContent(accountUser: User?, modifier: Modifier = Modifier) {
+fun ProfileContent(accountUser: User?, modifier: Modifier = Modifier, scaffoldState: ScaffoldState, navController: NavController) {
+    val coroutineScope = rememberCoroutineScope()
+
     Column(modifier = modifier) {
         AsyncImage(
             model = accountUser?.profilePicture() ?: "https://robohash.org/ohno.png",
             contentDescription = "Profile Image",
             modifier = Modifier
-                .width(100.dp)
+                .width(100.dp).height(100.dp)
                 .clip(shape = CircleShape)
                 .border(3.dp, MaterialTheme.colors.background, CircleShape)
                 .background(MaterialTheme.colors.background)
+                .clickable(onClick = {
+                    accountUser?.let {
+                        navController.navigate("User/${it.pubkeyHex}")
+                    }
+                    coroutineScope.launch {
+                        scaffoldState.drawerState.close()
+                    }
+                })
         )
         Text(
             accountUser?.bestDisplayName() ?: "",
@@ -118,11 +133,11 @@ fun ProfileContent(accountUser: User?, modifier: Modifier = Modifier) {
         Text(" @${accountUser?.bestUsername()}", color = Color.LightGray)
         Row(modifier = Modifier.padding(top = 15.dp)) {
             Row() {
-                Text("${accountUser?.follows?.size}", fontWeight = FontWeight.Bold)
+                Text("${accountUser?.follows?.size ?: "--"}", fontWeight = FontWeight.Bold)
                 Text(" Following")
             }
             Row(modifier = Modifier.padding(start = 10.dp)) {
-                Text("${accountUser?.follower ?: "--"}", fontWeight = FontWeight.Bold)
+                Text("${accountUser?.followers?.size ?: "--"}", fontWeight = FontWeight.Bold)
                 Text(" Followers")
             }
         }
@@ -131,21 +146,25 @@ fun ProfileContent(accountUser: User?, modifier: Modifier = Modifier) {
 
 @Composable
 fun ListContent(
+    accountUser: User?,
     navController: NavHostController,
     scaffoldState: ScaffoldState,
     modifier: Modifier,
     accountViewModel: AccountStateViewModel
 ) {
-    Column(
-        modifier = modifier
-    ) {
+    Column(modifier = modifier) {
         LazyColumn() {
-            items(items = bottomNavigations) {
-                NavigationRow(navController, scaffoldState, it)
-            }
             item {
+                if (accountUser != null)
+                    NavigationRow(navController,
+                        scaffoldState,
+                        "User/${accountUser.pubkeyHex}",
+                        Route.Profile.icon,
+                        "Profile"
+                    )
+
                 Divider(
-                    modifier = Modifier.padding(vertical = 15.dp),
+                    modifier = Modifier.padding(bottom = 15.dp),
                     thickness = 0.25.dp
                 )
                 Column(modifier = modifier.padding(horizontal = 25.dp)) {
@@ -171,31 +190,36 @@ fun ListContent(
 }
 
 @Composable
-fun NavigationRow(navController: NavHostController, scaffoldState: ScaffoldState, route: Route) {
+fun NavigationRow(navController: NavHostController, scaffoldState: ScaffoldState, route: String, icon: Int, title: String) {
     val coroutineScope = rememberCoroutineScope()
     val currentRoute = currentRoute(navController)
-    Row(
-        modifier = Modifier
-            .padding(vertical = 15.dp, horizontal = 25.dp)
-            .clickable(onClick = {
-                if (currentRoute != route.route) {
-                    navController.navigate(route.route)
-                }
-                coroutineScope.launch {
-                    scaffoldState.drawerState.close()
-                }
-            }),
-        verticalAlignment = Alignment.CenterVertically
+    Row(modifier = Modifier
+        .fillMaxWidth()
+        .clickable(onClick = {
+            if (currentRoute != route) {
+                navController.navigate(route)
+            }
+            coroutineScope.launch {
+                scaffoldState.drawerState.close()
+            }
+        })
     ) {
-        Icon(
-            painter = painterResource(route.icon), null,
-            modifier = Modifier.size(22.dp),
-            tint = MaterialTheme.colors.primary
-        )
-        Text(
-            modifier = Modifier.padding(start = 16.dp),
-            text = route.route,
-            fontSize = 18.sp,
-        )
+        Row(
+            modifier = Modifier.fillMaxWidth()
+                .padding(vertical = 15.dp, horizontal = 25.dp),
+            verticalAlignment = Alignment.CenterVertically
+        ) {
+            Icon(
+                painter = painterResource(icon), null,
+                modifier = Modifier.size(22.dp),
+                tint = MaterialTheme.colors.primary
+            )
+            Text(
+                modifier = Modifier.padding(start = 16.dp),
+                text = title,
+                fontSize = 18.sp,
+            )
+        }
     }
+
 }

app/src/main/java/com/vitorpamplona/amethyst/ui/navigation/Routes.kt

@@ -2,32 +2,49 @@ package com.vitorpamplona.amethyst.ui.navigation
 
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
+import androidx.navigation.NamedNavArgument
 import androidx.navigation.NavBackStackEntry
+import androidx.navigation.NavController
 import androidx.navigation.NavHostController
+import androidx.navigation.NavType
 import androidx.navigation.compose.currentBackStackEntryAsState
+import androidx.navigation.navArgument
 import com.vitorpamplona.amethyst.R
+import com.vitorpamplona.amethyst.ui.screen.ChatroomListScreen
+import com.vitorpamplona.amethyst.ui.screen.ChatroomScreen
 import com.vitorpamplona.amethyst.ui.screen.HomeScreen
-import com.vitorpamplona.amethyst.ui.screen.MessageScreen
 import com.vitorpamplona.amethyst.ui.screen.NotificationScreen
 import com.vitorpamplona.amethyst.ui.screen.ProfileScreen
 import com.vitorpamplona.amethyst.ui.screen.SearchScreen
+import com.vitorpamplona.amethyst.ui.screen.ThreadScreen
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 
 
 sealed class Route(
     val route: String,
     val icon: Int,
-    val buildScreen: (AccountViewModel) -> @Composable (NavBackStackEntry) -> Unit
+    val arguments: List<NamedNavArgument> = emptyList(),
+    val buildScreen: (AccountViewModel, NavController) -> @Composable (NavBackStackEntry) -> Unit
 ) {
-    object Home : Route("Home", R.drawable.ic_home, { acc -> { _ -> HomeScreen(acc) } })
-    object Search : Route("Search", R.drawable.ic_search, { acc -> { _ -> SearchScreen(acc) }})
-    object Notification : Route("Notification", R.drawable.ic_notifications, { acc -> { _ -> NotificationScreen(acc) }})
-    object Message : Route("Message", R.drawable.ic_dm, { acc -> { _ -> MessageScreen(acc) }})
-    object Profile : Route("Profile", R.drawable.ic_profile, { acc -> { _ -> ProfileScreen(acc) }})
-    object Lists : Route("Lists", R.drawable.ic_lists, { acc -> { _ -> ProfileScreen(acc) }})
-    object Topics : Route("Topics", R.drawable.ic_topics, { acc -> { _ -> ProfileScreen(acc) }})
-    object Bookmarks : Route("Bookmarks", R.drawable.ic_bookmarks, { acc -> { _ -> ProfileScreen(acc) }})
-    object Moments : Route("Moments", R.drawable.ic_moments, { acc -> { _ -> ProfileScreen(acc) }})
+    object Home : Route("Home", R.drawable.ic_home, buildScreen = { acc, nav -> { _ -> HomeScreen(acc, nav) } })
+    object Search : Route("Search", R.drawable.ic_search, buildScreen = { acc, nav -> { _ -> SearchScreen(acc, nav) }})
+    object Notification : Route("Notification", R.drawable.ic_notifications,buildScreen = { acc, nav -> { _ -> NotificationScreen(acc, nav) }})
+    object Message : Route("Message", R.drawable.ic_dm, buildScreen = { acc, nav -> { _ -> ChatroomListScreen(acc, nav) }})
+
+    object Profile : Route("User/{id}", R.drawable.ic_profile,
+        arguments = listOf(navArgument("id") { type = NavType.StringType } ),
+        buildScreen = { acc, nav -> { ProfileScreen(it.arguments?.getString("id"), acc, nav) }}
+    )
+
+    object Note : Route("Note/{id}", R.drawable.ic_moments,
+        arguments = listOf(navArgument("id") { type = NavType.StringType } ),
+        buildScreen = { acc, nav -> { ThreadScreen(it.arguments?.getString("id"), acc, nav) }}
+    )
+
+    object Room : Route("Room/{id}", R.drawable.ic_moments,
+        arguments = listOf(navArgument("id") { type = NavType.StringType } ),
+        buildScreen = { acc, nav -> { ChatroomScreen(it.arguments?.getString("id"), acc, nav) }}
+    )
 }
 
 val Routes = listOf(
@@ -39,10 +56,8 @@ val Routes = listOf(
 
     //drawer
     Route.Profile,
-    Route.Lists,
-    Route.Topics,
-    Route.Bookmarks,
-    Route.Moments
+    Route.Note,
+    Route.Room
 )
 
 @Composable

app/src/main/java/com/vitorpamplona/amethyst/ui/note/BlankNote.kt

@@ -12,7 +12,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 
 @Composable
-fun BlankNote(modifier: Modifier = Modifier, isQuote: Boolean) {
+fun BlankNote(modifier: Modifier = Modifier, isQuote: Boolean = false) {
   Column(modifier = modifier) {
     Row(modifier = Modifier.padding(horizontal = if (!isQuote) 12.dp else 6.dp)) {
       Column(modifier = Modifier.padding(start = if (!isQuote) 10.dp else 5.dp)) {

app/src/main/java/com/vitorpamplona/amethyst/ui/note/BoostSetCompose.kt

@@ -1,9 +1,6 @@
 package com.vitorpamplona.amethyst.ui.note
 
-import android.text.format.DateUtils
-import android.text.format.DateUtils.getRelativeTimeSpanString
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -12,10 +9,7 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.Divider
 import androidx.compose.material.Icon
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
@@ -24,30 +18,29 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
 import coil.compose.AsyncImage
 import com.google.accompanist.flowlayout.FlowRow
 import com.vitorpamplona.amethyst.R
-import com.vitorpamplona.amethyst.model.Note
-import com.vitorpamplona.amethyst.service.model.ReactionEvent
-import com.vitorpamplona.amethyst.service.model.RepostEvent
-import com.vitorpamplona.amethyst.ui.components.RichTextViewer
 import com.vitorpamplona.amethyst.ui.screen.BoostSetCard
-import com.vitorpamplona.amethyst.ui.screen.LikeSetCard
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
-import nostr.postr.events.TextNoteEvent
 
 @Composable
-fun BoostSetCompose(likeSetCard: BoostSetCard, modifier: Modifier = Modifier, isInnerNote: Boolean = false, accountViewModel: AccountViewModel) {
+fun BoostSetCompose(likeSetCard: BoostSetCard, isInnerNote: Boolean = false, accountViewModel: AccountViewModel, navController: NavController) {
     val noteState by likeSetCard.note.live.observeAsState()
     val note = noteState?.note
 
     if (note?.event == null) {
-        BlankNote(modifier, isInnerNote)
+        BlankNote(Modifier, isInnerNote)
     } else {
-        Column(modifier = modifier) {
-            Row(modifier = Modifier.padding(horizontal = if (!isInnerNote) 12.dp else 0.dp)) {
+        Column() {
+            Row(modifier = Modifier
+                .padding(
+                    start = if (!isInnerNote) 12.dp else 0.dp,
+                    end = if (!isInnerNote) 12.dp else 0.dp,
+                    top = 10.dp)
+            ) {
 
                 // Draws the like picture outside the boosted card.
                 if (!isInnerNote) {
@@ -79,12 +72,17 @@ fun BoostSetCompose(likeSetCard: BoostSetCard, modifier: Modifier = Modifier, is
                                         .width(35.dp)
                                         .height(35.dp)
                                         .clip(shape = CircleShape)
+                                        .clickable(onClick = {
+                                            userState?.let {
+                                                navController.navigate("User/${it.user.pubkeyHex}")
+                                            }
+                                        })
                                 )
                             }
                         }
                     }
 
-                    NoteCompose(note, modifier = Modifier.padding(top = 5.dp), isInnerNote = true, accountViewModel = accountViewModel)
+                    NoteCompose(note, Modifier.padding(top = 5.dp), true, accountViewModel, navController)
                 }
             }
         }

app/src/main/java/com/vitorpamplona/amethyst/ui/note/ChatroomCompose.kt

@@ -0,0 +1,99 @@
+package com.vitorpamplona.amethyst.ui.note
+
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.Divider
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
+import coil.compose.AsyncImage
+import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.ui.components.RichTextViewer
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun ChatroomCompose(baseNote: Note, accountViewModel: AccountViewModel, navController: NavController) {
+    val noteState by baseNote.live.observeAsState()
+    val note = noteState?.note
+
+    val accountUserState by accountViewModel.userLiveData.observeAsState()
+    val accountUser = accountUserState?.user
+
+    if (note?.event == null) {
+        BlankNote(Modifier)
+    } else {
+        val authorState by note.author!!.live.observeAsState()
+        val author = authorState?.user
+
+        val replyAuthorBase = note.mentions?.first()
+
+        var userToComposeOn = author
+
+        if ( replyAuthorBase != null ) {
+            val replyAuthorState by replyAuthorBase.live.observeAsState()
+            val replyAuthor = replyAuthorState?.user
+
+            if (author == accountUser) {
+                userToComposeOn = replyAuthor
+            }
+        }
+
+        Column(modifier =
+            Modifier.clickable(
+                    onClick = { navController.navigate("Room/${userToComposeOn?.pubkeyHex}") }
+            )
+        ) {
+            Row(
+                modifier = Modifier
+                    .padding(
+                        start = 12.dp,
+                        end = 12.dp,
+                        top = 10.dp)
+            ) {
+
+                AsyncImage(
+                    model = userToComposeOn?.profilePicture(),
+                    contentDescription = "Profile Image",
+                    modifier = Modifier
+                        .width(55.dp).height(55.dp)
+                        .clip(shape = CircleShape)
+                )
+
+                Column(modifier = Modifier.padding(start = 10.dp)) {
+                    Row(verticalAlignment = Alignment.CenterVertically) {
+                        if (userToComposeOn != null)
+                            UserDisplay(userToComposeOn)
+
+                        Text(
+                            timeAgo(note.event?.createdAt),
+                            color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
+                        )
+                    }
+
+                    val eventContent = accountViewModel.decrypt(note)
+                    if (eventContent != null)
+                        RichTextViewer(eventContent.take(100), note.event?.tags, note, accountViewModel, navController)
+                    else
+                        RichTextViewer("Referenced event not found", note.event?.tags, note, accountViewModel, navController)
+                }
+            }
+
+            Divider(
+                modifier = Modifier.padding(top = 10.dp),
+                thickness = 0.25.dp
+            )
+        }
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/note/ChatroomMessageCompose.kt

@@ -0,0 +1,116 @@
+package com.vitorpamplona.amethyst.ui.note
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Surface
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.Shape
+import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
+import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.ui.components.RichTextViewer
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+val ChatBubbleShapeMe = RoundedCornerShape(20.dp, 20.dp, 3.dp, 20.dp)
+val ChatBubbleShapeThem = RoundedCornerShape(20.dp, 20.dp, 20.dp, 3.dp)
+
+@Composable
+fun ChatroomMessageCompose(baseNote: Note, accountViewModel: AccountViewModel, navController: NavController) {
+    val noteState by baseNote.live.observeAsState()
+    val note = noteState?.note
+
+    val accountUserState by accountViewModel.userLiveData.observeAsState()
+    val accountUser = accountUserState?.user
+
+    if (note?.event == null) {
+        BlankNote(Modifier)
+    } else {
+        val authorState by note.author!!.live.observeAsState()
+        val author = authorState?.user
+
+        Column() {
+            var backgroundBubbleColor: Color
+            var alignment: Arrangement.Horizontal
+            var shape: Shape
+
+            if (author == accountUser) {
+                backgroundBubbleColor = MaterialTheme.colors.primary.copy(alpha = 0.32f)
+                alignment = Arrangement.End
+                shape = ChatBubbleShapeMe
+            } else {
+                backgroundBubbleColor = MaterialTheme.colors.onSurface.copy(alpha = 0.12f)
+                alignment = Arrangement.Start
+                shape = ChatBubbleShapeThem
+            }
+
+            Row(
+                horizontalArrangement = alignment,
+                modifier = Modifier.fillMaxWidth()
+                    .padding(
+                        start = 12.dp,
+                        end = 12.dp,
+                        top = 10.dp)
+            ) {
+
+                Row(
+                    verticalAlignment = Alignment.CenterVertically
+                ) {
+                    Surface(
+                        color = backgroundBubbleColor,
+                        shape = shape
+                    ) {
+                        Column(
+                            modifier = Modifier.padding(10.dp),
+                        ) {
+                            Row(
+                                verticalAlignment = Alignment.CenterVertically
+                            ) {
+                                val eventContent = accountViewModel.decrypt(note)
+
+                                if (eventContent != null)
+                                    RichTextViewer(
+                                        eventContent,
+                                        note.event?.tags,
+                                        note,
+                                        accountViewModel,
+                                        navController
+                                    )
+                                else
+                                    RichTextViewer(
+                                        "Could Not decrypt the message",
+                                        note.event?.tags,
+                                        note,
+                                        accountViewModel,
+                                        navController
+                                    )
+
+                            }
+
+                            Row(
+                                verticalAlignment = Alignment.CenterVertically,
+                                horizontalArrangement = alignment
+                            ) {
+                                Text(
+                                    timeAgoLong(note.event?.createdAt),
+                                    color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
+                                )
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+

app/src/main/java/com/vitorpamplona/amethyst/ui/note/LikeSetCompose.kt

@@ -1,9 +1,6 @@
 package com.vitorpamplona.amethyst.ui.note
 
-import android.text.format.DateUtils
-import android.text.format.DateUtils.getRelativeTimeSpanString
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -12,10 +9,7 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.Divider
 import androidx.compose.material.Icon
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
@@ -24,29 +18,29 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
 import coil.compose.AsyncImage
 import com.google.accompanist.flowlayout.FlowRow
 import com.vitorpamplona.amethyst.R
-import com.vitorpamplona.amethyst.model.Note
-import com.vitorpamplona.amethyst.service.model.ReactionEvent
-import com.vitorpamplona.amethyst.service.model.RepostEvent
-import com.vitorpamplona.amethyst.ui.components.RichTextViewer
 import com.vitorpamplona.amethyst.ui.screen.LikeSetCard
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
-import nostr.postr.events.TextNoteEvent
 
 @Composable
-fun LikeSetCompose(likeSetCard: LikeSetCard, modifier: Modifier = Modifier, isInnerNote: Boolean = false, accountViewModel: AccountViewModel) {
+fun LikeSetCompose(likeSetCard: LikeSetCard, modifier: Modifier = Modifier, isInnerNote: Boolean = false, accountViewModel: AccountViewModel, navController: NavController) {
     val noteState by likeSetCard.note.live.observeAsState()
     val note = noteState?.note
 
     if (note?.event == null) {
-        BlankNote(modifier, isInnerNote)
+        BlankNote(Modifier, isInnerNote)
     } else {
         Column(modifier = modifier) {
-            Row(modifier = Modifier.padding(horizontal = if (!isInnerNote) 12.dp else 0.dp)) {
+            Row(                modifier = Modifier
+                .padding(
+                    start = if (!isInnerNote) 12.dp else 0.dp,
+                    end = if (!isInnerNote) 12.dp else 0.dp,
+                    top = 10.dp)
+            ) {
 
                 // Draws the like picture outside the boosted card.
                 if (!isInnerNote) {
@@ -75,15 +69,20 @@ fun LikeSetCompose(likeSetCard: LikeSetCard, modifier: Modifier = Modifier, isIn
                                     model = userState?.user?.profilePicture(),
                                     contentDescription = "Profile Image",
                                     modifier = Modifier
-                                        .width(35.dp)
+                                        .width(35.dp).height(35.dp)
                                         .height(35.dp)
                                         .clip(shape = CircleShape)
+                                        .clickable(onClick = {
+                                            userState?.let {
+                                                navController.navigate("User/${it.user.pubkeyHex}")
+                                            }
+                                        })
                                 )
                             }
                         }
                     }
 
-                    NoteCompose(note, modifier = Modifier.padding(top = 5.dp), isInnerNote = true, accountViewModel = accountViewModel)
+                    NoteCompose(note, Modifier.padding(top = 5.dp), true, accountViewModel, navController)
                 }
             }
         }

app/src/main/java/com/vitorpamplona/amethyst/ui/note/NoteCompose.kt

@@ -1,47 +1,73 @@
 package com.vitorpamplona.amethyst.ui.note
 
-import android.text.format.DateUtils
-import android.text.format.DateUtils.getRelativeTimeSpanString
+import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material.Divider
+import androidx.compose.material.DropdownMenu
+import androidx.compose.material.DropdownMenuItem
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.platform.LocalClipboardManager
+import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
 import coil.compose.AsyncImage
 import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.model.toNote
 import com.vitorpamplona.amethyst.service.model.ReactionEvent
 import com.vitorpamplona.amethyst.service.model.RepostEvent
 import com.vitorpamplona.amethyst.ui.components.RichTextViewer
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 import nostr.postr.events.TextNoteEvent
+import nostr.postr.toNpub
 
+@OptIn(ExperimentalFoundationApi::class)
 @Composable
-fun NoteCompose(baseNote: Note, modifier: Modifier = Modifier, isInnerNote: Boolean = false, accountViewModel: AccountViewModel) {
+fun NoteCompose(baseNote: Note, modifier: Modifier = Modifier, isInnerNote: Boolean = false, accountViewModel: AccountViewModel, navController: NavController) {
     val noteState by baseNote.live.observeAsState()
     val note = noteState?.note
 
+    var popupExpanded by remember { mutableStateOf(false) }
+
     if (note?.event == null) {
         BlankNote(modifier, isInnerNote)
     } else {
         val authorState by note.author!!.live.observeAsState()
         val author = authorState?.user
 
-        Column(modifier = modifier) {
-            Row(modifier = Modifier.padding(horizontal = if (!isInnerNote) 12.dp else 0.dp)) {
+        Column(modifier =
+            modifier.combinedClickable(
+                onClick = { navController.navigate("Note/${note.idHex}") },
+                onLongClick = { popupExpanded = true },
+            )
+        ) {
+            Row(
+                modifier = Modifier
+                    .padding(
+                        start = if (!isInnerNote) 12.dp else 0.dp,
+                        end = if (!isInnerNote) 12.dp else 0.dp,
+                        top = 10.dp)
+            ) {
 
                 // Draws the boosted picture outside the boosted card.
                 if (!isInnerNote) {
@@ -50,8 +76,13 @@ fun NoteCompose(baseNote: Note, modifier: Modifier = Modifier, isInnerNote: Bool
                             model = author?.profilePicture(),
                             contentDescription = "Profile Image",
                             modifier = Modifier
-                                .width(55.dp)
+                                .width(55.dp).height(55.dp)
                                 .clip(shape = CircleShape)
+                                .clickable(onClick = {
+                                    author?.let {
+                                        navController.navigate("User/${it.pubkeyHex}")
+                                    }
+                                })
                         )
 
                         // boosted picture
@@ -61,24 +92,35 @@ fun NoteCompose(baseNote: Note, modifier: Modifier = Modifier, isInnerNote: Bool
                                 model = boostedPosts[0].author?.profilePicture(),
                                 contentDescription = "Profile Image",
                                 modifier = Modifier
-                                    .width(35.dp)
+                                    .width(35.dp).height(35.dp)
                                     .clip(shape = CircleShape)
                                     .align(Alignment.BottomEnd)
                                     .background(MaterialTheme.colors.background)
                                     .border(2.dp, MaterialTheme.colors.primary, CircleShape)
+                                    .clickable(onClick = {
+                                        boostedPosts[0].author?.let {
+                                            navController.navigate("User/${it.pubkeyHex}")
+                                        }
+                                    })
                             )
                         }
                     }
                 }
 
-                Column(modifier = Modifier.padding(start = if (!isInnerNote) 10.dp else 0.dp)) {
+                Column(modifier = Modifier.padding(start = if (!isInnerNote) 10.dp else 0.dp)
+                    .clickable(onClick = {
+                        note?.let {
+                            navController.navigate("Note/${note.idHex}")
+                        }
+                    })
+                ) {
                     Row(verticalAlignment = Alignment.CenterVertically) {
                         if (author != null)
                             UserDisplay(author)
 
                         if (note.event !is RepostEvent) {
                             Text(
-                                "   " + timeAgo(note.event?.createdAt),
+                                timeAgo(note.event?.createdAt),
                                 color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
                             )
                         } else {
@@ -100,7 +142,8 @@ fun NoteCompose(baseNote: Note, modifier: Modifier = Modifier, isInnerNote: Bool
                                 note,
                                 modifier = Modifier.padding(top = 5.dp),
                                 isInnerNote = true,
-                                accountViewModel = accountViewModel
+                                accountViewModel = accountViewModel,
+                                navController = navController
                             )
                         }
 
@@ -116,17 +159,43 @@ fun NoteCompose(baseNote: Note, modifier: Modifier = Modifier, isInnerNote: Bool
                     } else {
                         val eventContent = note.event?.content
                         if (eventContent != null)
-                            RichTextViewer(eventContent, note.event?.tags)
+                            RichTextViewer(eventContent, note.event?.tags, note, accountViewModel, navController)
 
                         ReactionsRowState(note, accountViewModel)
 
                         Divider(
-                            modifier = Modifier.padding(vertical = 10.dp),
+                            modifier = Modifier.padding(top = 10.dp),
                             thickness = 0.25.dp
                         )
                     }
+
+                    NoteDropDownMenu(note, popupExpanded, { popupExpanded = false }, accountViewModel)
                 }
             }
         }
     }
+}
+
+@Composable
+fun NoteDropDownMenu(note: Note, popupExpanded: Boolean, onDismiss: () -> Unit, accountViewModel: AccountViewModel) {
+    val clipboardManager = LocalClipboardManager.current
+
+    DropdownMenu(
+        expanded = popupExpanded,
+        onDismissRequest = onDismiss
+    ) {
+        DropdownMenuItem(onClick = { clipboardManager.setText(AnnotatedString(note.event?.content ?: "")); onDismiss() }) {
+            Text("Copy Text")
+        }
+        DropdownMenuItem(onClick = { clipboardManager.setText(AnnotatedString(note.author?.pubkey?.toNpub() ?: "")); onDismiss() }) {
+            Text("Copy User ID")
+        }
+        DropdownMenuItem(onClick = { clipboardManager.setText(AnnotatedString(note.id.toNote())); onDismiss() }) {
+            Text("Copy Note ID")
+        }
+        Divider()
+        DropdownMenuItem(onClick = { accountViewModel.broadcast(note); onDismiss() }) {
+            Text("Broadcast")
+        }
+    }
 }

app/src/main/java/com/vitorpamplona/amethyst/ui/note/ReactionsRow.kt

@@ -1,5 +1,6 @@
 package com.vitorpamplona.amethyst.ui.note
 
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -35,7 +36,7 @@ fun ReactionsRow(note: Note, account: Account, boost: (Note) -> Unit, reactTo: (
     NewPostView({ wantsToReplyTo = null }, wantsToReplyTo, account)
 
   Row(modifier = Modifier.padding(top = 8.dp)) {
-    Row(verticalAlignment = Alignment.CenterVertically) {
+    Row(verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.SpaceBetween) {
       IconButton(
         modifier = Modifier.then(Modifier.size(24.dp)),
         onClick = { if (account.isWriteable()) wantsToReplyTo = note }

app/src/main/java/com/vitorpamplona/amethyst/ui/note/TimeAgoFormatter.kt

@@ -14,5 +14,25 @@ fun timeAgo(mills: Long?): String {
   if (humanReadable.startsWith("In") || humanReadable.startsWith("0")) {
     humanReadable = "now";
   }
+
+  return " • " + humanReadable
+    .replace(" hr. ago", "h")
+    .replace(" min. ago", "m")
+    .replace(" days. ago", "d")
+}
+
+fun timeAgoLong(mills: Long?): String {
+  if (mills == null) return " "
+
+  var humanReadable = DateUtils.getRelativeTimeSpanString(
+    mills * 1000,
+    System.currentTimeMillis(),
+    DateUtils.MINUTE_IN_MILLIS,
+    DateUtils.FORMAT_SHOW_TIME
+  ).toString()
+  if (humanReadable.startsWith("In") || humanReadable.startsWith("0")) {
+    humanReadable = "now";
+  }
+
   return humanReadable
 }

app/src/main/java/com/vitorpamplona/amethyst/ui/note/UserCompose.kt

@@ -0,0 +1,80 @@
+package com.vitorpamplona.amethyst.ui.note
+
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.Divider
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
+import coil.compose.AsyncImage
+import com.vitorpamplona.amethyst.model.User
+import com.vitorpamplona.amethyst.ui.screen.FollowButton
+import com.vitorpamplona.amethyst.ui.screen.UnfollowButton
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun UserCompose(baseUser: User, accountViewModel: AccountViewModel, navController: NavController) {
+    val accountState by accountViewModel.accountLiveData.observeAsState()
+
+    val userState by baseUser.live.observeAsState()
+    val user = userState?.user ?: return
+
+    Column(modifier =
+        Modifier.clickable(
+            onClick = { navController.navigate("User/${user.pubkeyHex}") }
+        )
+    ) {
+        Row(
+            modifier = Modifier
+                .padding(
+                    start = 12.dp,
+                    end = 12.dp,
+                    top = 10.dp)
+        ) {
+
+            AsyncImage(
+                model = user.profilePicture(),
+                contentDescription = "Profile Image",
+                modifier = Modifier
+                    .width(55.dp).height(55.dp)
+                    .clip(shape = CircleShape)
+            )
+
+            Column(modifier = Modifier.padding(start = 10.dp).weight(1f)) {
+                Row(verticalAlignment = Alignment.CenterVertically) {
+                    UserDisplay(user)
+                }
+
+                Text(
+                    user.info.about?.take(100) ?: "",
+                    color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
+                )
+            }
+
+            Column(modifier = Modifier.padding(start = 10.dp)) {
+                if (accountState?.account?.userProfile()?.follows?.contains(user) == true) {
+                    UnfollowButton { accountState?.account?.unfollow(user) }
+                } else {
+                    FollowButton { accountState?.account?.follow(user) }
+                }
+            }
+        }
+
+        Divider(
+            modifier = Modifier.padding(top = 10.dp),
+            thickness = 0.25.dp
+        )
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/note/UserDisplay.kt

@@ -9,14 +9,21 @@ import com.vitorpamplona.amethyst.model.User
 @Composable
 fun UserDisplay(user: User) {
     if (user.bestUsername() != null || user.bestDisplayName() != null) {
-      Text(
-        user.bestDisplayName() ?: "",
-        fontWeight = FontWeight.Bold,
-      )
-      Text(
-        "@${(user.bestUsername() ?: "")}",
-        color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f),
-      )
+      if (user.bestDisplayName().isNullOrBlank()) {
+        Text(
+          "@${(user.bestUsername() ?: "")}",
+          fontWeight = FontWeight.Bold,
+        )
+      } else {
+        Text(
+          user.bestDisplayName() ?: "",
+          fontWeight = FontWeight.Bold,
+        )
+        Text(
+          "@${(user.bestUsername() ?: "")}",
+          color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f),
+        )
+      }
     } else {
       Text(
         user.pubkeyDisplayHex,

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/AccountScreen.kt

@@ -4,11 +4,9 @@ import androidx.compose.animation.Crossfade
 import androidx.compose.foundation.layout.Column
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
-import androidx.lifecycle.compose.ExperimentalLifecycleComposeApi
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 
-@OptIn(ExperimentalLifecycleComposeApi::class)
 @Composable
 fun AccountScreen(accountStateViewModel: AccountStateViewModel) {
   val accountState by accountStateViewModel.accountContent.collectAsStateWithLifecycle()

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/AccountStateViewModel.kt

@@ -5,11 +5,13 @@ import androidx.security.crypto.EncryptedSharedPreferences
 import com.vitorpamplona.amethyst.model.Account
 import com.vitorpamplona.amethyst.model.toByteArray
 import com.vitorpamplona.amethyst.service.NostrAccountDataSource
+import com.vitorpamplona.amethyst.service.NostrChatroomListDataSource
 import com.vitorpamplona.amethyst.service.NostrGlobalDataSource
 import com.vitorpamplona.amethyst.service.NostrHomeDataSource
 import com.vitorpamplona.amethyst.service.NostrNotificationDataSource
 import com.vitorpamplona.amethyst.service.NostrSingleEventDataSource
 import com.vitorpamplona.amethyst.service.NostrSingleUserDataSource
+import com.vitorpamplona.amethyst.service.NostrThreadDataSource
 import fr.acinq.secp256k1.Hex
 import java.util.regex.Pattern
 import kotlinx.coroutines.flow.MutableStateFlow
@@ -43,6 +45,7 @@ class AccountStateViewModel(private val encryptedPreferences: EncryptedSharedPre
         Persona(Hex.decode(key))
       }
     )
+
   }
 
   fun login(person: Persona) {
@@ -58,6 +61,7 @@ class AccountStateViewModel(private val encryptedPreferences: EncryptedSharedPre
     NostrAccountDataSource.account = loggedIn
     NostrHomeDataSource.account = loggedIn
     NostrNotificationDataSource.account = loggedIn
+    NostrChatroomListDataSource.account = loggedIn
 
     NostrAccountDataSource.start()
     NostrGlobalDataSource.start()
@@ -65,6 +69,8 @@ class AccountStateViewModel(private val encryptedPreferences: EncryptedSharedPre
     NostrNotificationDataSource.start()
     NostrSingleEventDataSource.start()
     NostrSingleUserDataSource.start()
+    NostrThreadDataSource.start()
+    NostrChatroomListDataSource.start()
   }
 
   fun newKey() {

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/CardFeedView.kt

@@ -1,28 +1,20 @@
 package com.vitorpamplona.amethyst.ui.screen
 
 import androidx.compose.animation.Crossfade
-import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.fillMaxHeight
-import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.foundation.lazy.rememberLazyListState
-import androidx.compose.material.Button
-import androidx.compose.material.OutlinedButton
-import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import androidx.lifecycle.compose.ExperimentalLifecycleComposeApi
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import androidx.navigation.NavController
 import com.google.accompanist.swiperefresh.SwipeRefresh
 import com.google.accompanist.swiperefresh.rememberSwipeRefreshState
 import com.vitorpamplona.amethyst.ui.note.BoostSetCompose
@@ -30,9 +22,8 @@ import com.vitorpamplona.amethyst.ui.note.LikeSetCompose
 import com.vitorpamplona.amethyst.ui.note.NoteCompose
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 
-@OptIn(ExperimentalLifecycleComposeApi::class)
 @Composable
-fun CardFeedView(viewModel: CardFeedViewModel, accountViewModel: AccountViewModel) {
+fun CardFeedView(viewModel: CardFeedViewModel, accountViewModel: AccountViewModel, navController: NavController) {
     val feedState by viewModel.feedContent.collectAsStateWithLifecycle()
 
     var isRefreshing by remember { mutableStateOf(false) }
@@ -76,9 +67,9 @@ fun CardFeedView(viewModel: CardFeedViewModel, accountViewModel: AccountViewMode
                         ) {
                             itemsIndexed(state.feed) { index, item ->
                                 when (item) {
-                                    is NoteCard -> NoteCompose(item.note, isInnerNote = false, accountViewModel = accountViewModel)
-                                    is LikeSetCard -> LikeSetCompose(item, isInnerNote = false, accountViewModel = accountViewModel)
-                                    is BoostSetCard -> BoostSetCompose(item, isInnerNote = false, accountViewModel = accountViewModel)
+                                    is NoteCard -> NoteCompose(item.note, isInnerNote = false, accountViewModel = accountViewModel, navController = navController)
+                                    is LikeSetCard -> LikeSetCompose(item, isInnerNote = false, accountViewModel = accountViewModel, navController = navController)
+                                    is BoostSetCard -> BoostSetCompose(item, isInnerNote = false, accountViewModel = accountViewModel, navController = navController)
                                 }
                             }
                         }

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/CardFeedViewModel.kt

@@ -14,7 +14,7 @@ import kotlinx.coroutines.flow.asStateFlow
 import kotlinx.coroutines.flow.update
 import kotlinx.coroutines.launch
 
-class CardFeedViewModel(val dataSource: NostrDataSource): ViewModel() {
+class CardFeedViewModel(val dataSource: NostrDataSource<Note>): ViewModel() {
     private val _feedContent = MutableStateFlow<CardFeedState>(CardFeedState.Loading)
     val feedContent = _feedContent.asStateFlow()
 

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/ChatroomFeedView.kt

@@ -0,0 +1,83 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import androidx.compose.animation.Crossfade
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.unit.dp
+import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import androidx.navigation.NavController
+import com.google.accompanist.swiperefresh.SwipeRefresh
+import com.google.accompanist.swiperefresh.rememberSwipeRefreshState
+import com.vitorpamplona.amethyst.ui.note.ChatroomMessageCompose
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun ChatroomFeedView(userId: String, viewModel: FeedViewModel, accountViewModel: AccountViewModel, navController: NavController) {
+    val feedState by viewModel.feedContent.collectAsStateWithLifecycle()
+
+    var isRefreshing by remember { mutableStateOf(false) }
+    val swipeRefreshState = rememberSwipeRefreshState(isRefreshing)
+
+    val listState = rememberLazyListState()
+
+    LaunchedEffect(isRefreshing) {
+        if (isRefreshing) {
+            viewModel.refresh()
+            isRefreshing = false
+        }
+    }
+
+    SwipeRefresh(
+        state = swipeRefreshState,
+        onRefresh = {
+            isRefreshing = true
+        },
+    ) {
+        Column() {
+            Crossfade(targetState = feedState) { state ->
+                when (state) {
+                    is FeedState.Empty -> {
+                        FeedEmpty {
+                            isRefreshing = true
+                        }
+                    }
+                    is FeedState.FeedError -> {
+                        FeedError(state.errorMessage) {
+                            isRefreshing = true
+                        }
+                    }
+                    is FeedState.Loaded -> {
+                        LazyColumn(
+                            contentPadding = PaddingValues(
+                                top = 10.dp,
+                                bottom = 10.dp
+                            ),
+                            state = listState
+                        ) {
+                            var previousDate: String = ""
+                            itemsIndexed(state.feed, key = { _, item -> item.idHex }) { index, item ->
+                                ChatroomMessageCompose(item, accountViewModel = accountViewModel, navController = navController)
+                            }
+                        }
+
+                        LaunchedEffect(Unit) {
+                            listState.animateScrollToItem(state.feed.size-1, 0)
+                        }
+                    }
+                    FeedState.Loading -> {
+                        LoadingFeed()
+                    }
+                }
+            }
+        }
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/ChatroomListFeedView.kt

@@ -0,0 +1,78 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import androidx.compose.animation.Crossfade
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.unit.dp
+import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import androidx.navigation.NavController
+import com.google.accompanist.swiperefresh.SwipeRefresh
+import com.google.accompanist.swiperefresh.rememberSwipeRefreshState
+import com.vitorpamplona.amethyst.ui.note.ChatroomCompose
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun ChatroomListFeedView(viewModel: FeedViewModel, accountViewModel: AccountViewModel, navController: NavController) {
+    val feedState by viewModel.feedContent.collectAsStateWithLifecycle()
+
+    var isRefreshing by remember { mutableStateOf(false) }
+    val swipeRefreshState = rememberSwipeRefreshState(isRefreshing)
+
+    val listState = rememberLazyListState()
+
+    LaunchedEffect(isRefreshing) {
+        if (isRefreshing) {
+            viewModel.refresh()
+            isRefreshing = false
+        }
+    }
+
+    SwipeRefresh(
+        state = swipeRefreshState,
+        onRefresh = {
+            isRefreshing = true
+        },
+    ) {
+        Column() {
+            Crossfade(targetState = feedState) { state ->
+                when (state) {
+                    is FeedState.Empty -> {
+                        FeedEmpty {
+                            isRefreshing = true
+                        }
+                    }
+                    is FeedState.FeedError -> {
+                        FeedError(state.errorMessage) {
+                            isRefreshing = true
+                        }
+                    }
+                    is FeedState.Loaded -> {
+                        LazyColumn(
+                            contentPadding = PaddingValues(
+                                top = 10.dp,
+                                bottom = 10.dp
+                            ),
+                            state = listState
+                        ) {
+                            itemsIndexed(state.feed, key = { _, item -> item.idHex }) { index, item ->
+                                ChatroomCompose(item, accountViewModel = accountViewModel, navController = navController)
+                            }
+                        }
+                    }
+                    FeedState.Loading -> {
+                        LoadingFeed()
+                    }
+                }
+            }
+        }
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/FeedView.kt

@@ -21,16 +21,15 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import androidx.lifecycle.compose.ExperimentalLifecycleComposeApi
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import androidx.navigation.NavController
 import com.google.accompanist.swiperefresh.SwipeRefresh
 import com.google.accompanist.swiperefresh.rememberSwipeRefreshState
 import com.vitorpamplona.amethyst.ui.note.NoteCompose
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 
-@OptIn(ExperimentalLifecycleComposeApi::class)
 @Composable
-fun FeedView(viewModel: FeedViewModel, accountViewModel: AccountViewModel) {
+fun FeedView(viewModel: FeedViewModel, accountViewModel: AccountViewModel, navController: NavController) {
     val feedState by viewModel.feedContent.collectAsStateWithLifecycle()
 
     var isRefreshing by remember { mutableStateOf(false) }
@@ -73,7 +72,7 @@ fun FeedView(viewModel: FeedViewModel, accountViewModel: AccountViewModel) {
                             state = listState
                         ) {
                             itemsIndexed(state.feed, key = { _, item -> item.idHex }) { index, item ->
-                                NoteCompose(item, isInnerNote = false, accountViewModel = accountViewModel)
+                                NoteCompose(item, isInnerNote = false, accountViewModel = accountViewModel, navController = navController)
                             }
                         }
                     }
@@ -132,57 +131,4 @@ fun FeedEmpty(onRefresh: () -> Unit) {
             Text(text = "Refresh")
         }
     }
-}
-
-
-// Bosted code to be deleted:
-
-/*
-
-                                Boosted By: removed because it was ugly
-
-                                if (item.event is RepostEvent) {
-                                    Row(
-                                        modifier = Modifier.padding(
-                                            start = 12.dp,
-                                            end = 12.dp,
-                                            bottom = 8.dp
-                                        ),
-                                        verticalAlignment = Alignment.CenterVertically
-                                    ) {
-                                        Icon(
-                                            painter = painterResource(R.drawable.ic_retweet),
-                                            null,
-                                            modifier = Modifier.size(20.dp),
-                                            tint = Color.Gray
-                                        )
-                                        Text(
-                                            text = "Boosted by ${item.author.toBestDisplayName()}",
-                                            modifier = Modifier.padding(start = 10.dp),
-                                            fontWeight = FontWeight.Bold,
-                                            color = Color.Gray,
-                                        )
-                                    }
-                                    val refNote = item.replyTo.firstOrNull()
-                                    if (refNote != null) {
-                                        NoteCompose(index, refNote)
-                                    } else {
-                                        Row(
-                                            modifier = Modifier.padding(
-                                                start = 40.dp,
-                                                end = 40.dp,
-                                                bottom = 25.dp,
-                                                top = 15.dp
-                                            ),
-                                            verticalAlignment = Alignment.CenterVertically
-                                        ) {
-                                            Text(
-                                                text = "Could not find referenced event",
-                                                modifier = Modifier.padding(30.dp),
-                                                color = Color.Gray,
-                                            )
-                                        }
-                                    }
-                                } else {
-                                    NoteCompose(index, item)
-                                }*/
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/FeedViewModel.kt

@@ -6,7 +6,6 @@ import com.vitorpamplona.amethyst.model.LocalCache
 import com.vitorpamplona.amethyst.model.LocalCacheState
 import com.vitorpamplona.amethyst.model.Note
 import com.vitorpamplona.amethyst.service.NostrDataSource
-import com.vitorpamplona.amethyst.service.model.ReactionEvent
 import kotlinx.coroutines.cancel
 import kotlinx.coroutines.flow.MutableStateFlow
 import kotlinx.coroutines.flow.asStateFlow
@@ -14,7 +13,7 @@ import kotlinx.coroutines.flow.update
 import kotlinx.coroutines.launch
 
 
-class FeedViewModel(val dataSource: NostrDataSource): ViewModel() {
+class FeedViewModel(val dataSource: NostrDataSource<Note>): ViewModel() {
     private val _feedContent = MutableStateFlow<FeedState>(FeedState.Loading)
     val feedContent = _feedContent.asStateFlow()
 

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/RelayPoolViewModel.kt

@@ -6,7 +6,10 @@ import androidx.lifecycle.ViewModel
 import com.vitorpamplona.amethyst.service.relays.RelayPool
 
 class RelayPoolViewModel: ViewModel() {
-  val relayPoolLiveData: LiveData<String> = Transformations.map(RelayPool.live) {
-    it.relays.report()
+  val connectedRelaysLiveData: LiveData<Int> = Transformations.map(RelayPool.live) {
+    it.relays.connectedRelays()
+  }
+  val availableRelaysLiveData: LiveData<Int> = Transformations.map(RelayPool.live) {
+    it.relays.availableRelays()
   }
 }

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/ThreadFeedView.kt

@@ -0,0 +1,216 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import androidx.compose.animation.Crossfade
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.Divider
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.draw.drawBehind
+import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import androidx.navigation.NavController
+import coil.compose.AsyncImage
+import com.google.accompanist.swiperefresh.SwipeRefresh
+import com.google.accompanist.swiperefresh.rememberSwipeRefreshState
+import com.vitorpamplona.amethyst.model.Note
+import com.vitorpamplona.amethyst.ui.components.RichTextViewer
+import com.vitorpamplona.amethyst.ui.note.BlankNote
+import com.vitorpamplona.amethyst.ui.note.NoteCompose
+import com.vitorpamplona.amethyst.ui.note.ReactionsRowState
+import com.vitorpamplona.amethyst.ui.note.UserDisplay
+import com.vitorpamplona.amethyst.ui.note.timeAgoLong
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun ThreadFeedView(noteId: String, viewModel: FeedViewModel, accountViewModel: AccountViewModel, navController: NavController) {
+    val feedState by viewModel.feedContent.collectAsStateWithLifecycle()
+
+    var isRefreshing by remember { mutableStateOf(false) }
+    val swipeRefreshState = rememberSwipeRefreshState(isRefreshing)
+
+    val listState = rememberLazyListState()
+
+    LaunchedEffect(isRefreshing) {
+        if (isRefreshing) {
+            viewModel.refresh()
+            isRefreshing = false
+        }
+    }
+
+    SwipeRefresh(
+        state = swipeRefreshState,
+        onRefresh = {
+            isRefreshing = true
+        },
+    ) {
+        Column() {
+            Crossfade(targetState = feedState) { state ->
+                when (state) {
+                    is FeedState.Empty -> {
+                        FeedEmpty {
+                            isRefreshing = true
+                        }
+                    }
+                    is FeedState.FeedError -> {
+                        FeedError(state.errorMessage) {
+                            isRefreshing = true
+                        }
+                    }
+                    is FeedState.Loaded -> {
+                        var noteIdPositionInThread by remember { mutableStateOf(0) }
+                        // only in the first transition
+                        LaunchedEffect(noteIdPositionInThread) {
+                            listState.animateScrollToItem(noteIdPositionInThread, 0)
+                        }
+
+                        val notePosition = state.feed.filter { it.idHex == noteId}.firstOrNull()
+                        if (notePosition != null) {
+                            noteIdPositionInThread = state.feed.indexOf(notePosition)
+                        }
+
+                        LazyColumn(
+                            contentPadding = PaddingValues(
+                                top = 10.dp,
+                                bottom = 10.dp
+                            ),
+                            state = listState
+                        ) {
+                            itemsIndexed(state.feed, key = { _, item -> item.idHex }) { index, item ->
+                                if (index == 0)
+                                    NoteMaster(item, accountViewModel = accountViewModel, navController = navController)
+                                else {
+                                    Column() {
+                                        Row() {
+                                            NoteCompose(
+                                                item,
+                                                Modifier.drawReplyLevel(item.replyLevel(), MaterialTheme.colors.onSurface.copy(alpha = 0.32f)),
+                                                isInnerNote = false,
+                                                accountViewModel = accountViewModel,
+                                                navController = navController,
+                                            )
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                    FeedState.Loading -> {
+                        LoadingFeed()
+                    }
+                }
+            }
+        }
+    }
+}
+
+// Creates a Zebra pattern where each bar is a reply level.
+fun Modifier.drawReplyLevel(level: Int, color: Color): Modifier = this
+    .drawBehind {
+        val paddingDp = 2
+        val strokeWidthDp = 2
+        val levelWidthDp = strokeWidthDp + 1
+
+        val padding = paddingDp.dp.toPx()
+        val strokeWidth = strokeWidthDp.dp.toPx()
+        val levelWidth = levelWidthDp.dp.toPx()
+
+        repeat(level) {
+            this.drawLine(
+                color,
+                Offset(padding + it * levelWidth, 0f),
+                Offset(padding + it * levelWidth, size.height),
+                strokeWidth = strokeWidth
+            )
+        }
+
+        return@drawBehind
+    }
+    .padding(start = (2 + (level * 3)).dp)
+
+@Composable
+fun NoteMaster(baseNote: Note, accountViewModel: AccountViewModel, navController: NavController) {
+    val noteState by baseNote.live.observeAsState()
+    val note = noteState?.note
+
+    if (note?.event == null) {
+        BlankNote()
+    } else {
+        val authorState by note.author!!.live.observeAsState()
+        val author = authorState?.user
+
+        Column(
+            Modifier
+                .fillMaxWidth()
+                .padding(top = 10.dp)) {
+            Row(modifier = Modifier
+                .padding(start = 12.dp, end = 12.dp)
+                .clickable(onClick = {
+                    author?.let {
+                        navController.navigate("User/${it.pubkeyHex}")
+                    }
+                })
+            ) {
+                // Draws the boosted picture outside the boosted card.
+                AsyncImage(
+                    model = author?.profilePicture(),
+                    contentDescription = "Profile Image",
+                    modifier = Modifier
+                        .width(55.dp).height(55.dp)
+                        .clip(shape = CircleShape)
+                )
+
+                Column(modifier = Modifier.padding(start = 10.dp)) {
+                    Row(verticalAlignment = Alignment.CenterVertically) {
+                        if (author != null)
+                            UserDisplay(author)
+                    }
+
+                    Row(verticalAlignment = Alignment.CenterVertically) {
+                        Text(
+                            timeAgoLong(note.event?.createdAt),
+                            color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
+                        )
+                    }
+                }
+            }
+
+            Row(modifier = Modifier.padding(horizontal = 12.dp)) {
+                Column() {
+                    val eventContent = note.event?.content
+                    if (eventContent != null)
+                        RichTextViewer(eventContent, note.event?.tags, note, accountViewModel, navController)
+
+                    ReactionsRowState(note, accountViewModel)
+
+                    Divider(
+                        modifier = Modifier.padding(top = 10.dp),
+                        thickness = 0.25.dp
+                    )
+                }
+            }
+        }
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/UserFeedState.kt

@@ -0,0 +1,10 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import com.vitorpamplona.amethyst.model.User
+
+sealed class UserFeedState {
+    object Loading : UserFeedState()
+    class Loaded(val feed: List<User>) : UserFeedState()
+    object Empty : UserFeedState()
+    class FeedError(val errorMessage: String) : UserFeedState()
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/UserFeedView.kt

@@ -0,0 +1,78 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import androidx.compose.animation.Crossfade
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.unit.dp
+import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import androidx.navigation.NavController
+import com.google.accompanist.swiperefresh.SwipeRefresh
+import com.google.accompanist.swiperefresh.rememberSwipeRefreshState
+import com.vitorpamplona.amethyst.ui.note.UserCompose
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun UserFeedView(viewModel: UserFeedViewModel, accountViewModel: AccountViewModel, navController: NavController) {
+    val feedState by viewModel.feedContent.collectAsStateWithLifecycle()
+
+    var isRefreshing by remember { mutableStateOf(false) }
+    val swipeRefreshState = rememberSwipeRefreshState(isRefreshing)
+
+    val listState = rememberLazyListState()
+
+    LaunchedEffect(isRefreshing) {
+        if (isRefreshing) {
+            viewModel.refresh()
+            isRefreshing = false
+        }
+    }
+
+    SwipeRefresh(
+        state = swipeRefreshState,
+        onRefresh = {
+            isRefreshing = true
+        },
+    ) {
+        Column() {
+            Crossfade(targetState = feedState) { state ->
+                when (state) {
+                    is UserFeedState.Empty -> {
+                        FeedEmpty {
+                            isRefreshing = true
+                        }
+                    }
+                    is UserFeedState.FeedError -> {
+                        FeedError(state.errorMessage) {
+                            isRefreshing = true
+                        }
+                    }
+                    is UserFeedState.Loaded -> {
+                        LazyColumn(
+                            contentPadding = PaddingValues(
+                                top = 10.dp,
+                                bottom = 10.dp
+                            ),
+                            state = listState
+                        ) {
+                            itemsIndexed(state.feed, key = { _, item -> item.pubkeyHex }) { index, item ->
+                                UserCompose(item, accountViewModel = accountViewModel, navController = navController)
+                            }
+                        }
+                    }
+                    UserFeedState.Loading -> {
+                        LoadingFeed()
+                    }
+                }
+            }
+        }
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/UserFeedViewModel.kt

@@ -0,0 +1,79 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import androidx.lifecycle.ViewModel
+import androidx.lifecycle.viewModelScope
+import com.vitorpamplona.amethyst.model.LocalCache
+import com.vitorpamplona.amethyst.model.LocalCacheState
+import com.vitorpamplona.amethyst.model.User
+import com.vitorpamplona.amethyst.service.NostrDataSource
+import com.vitorpamplona.amethyst.service.NostrUserProfileFollowersDataSource
+import com.vitorpamplona.amethyst.service.NostrUserProfileFollowsDataSource
+import kotlinx.coroutines.cancel
+import kotlinx.coroutines.flow.MutableStateFlow
+import kotlinx.coroutines.flow.asStateFlow
+import kotlinx.coroutines.flow.update
+import kotlinx.coroutines.launch
+
+class NostrUserProfileFollowsUserFeedViewModel(): UserFeedViewModel(
+    NostrUserProfileFollowsDataSource
+)
+
+class NostrUserProfileFollowersUserFeedViewModel(): UserFeedViewModel(
+    NostrUserProfileFollowersDataSource
+)
+
+open class UserFeedViewModel(val dataSource: NostrDataSource<User>): ViewModel() {
+    private val _feedContent = MutableStateFlow<UserFeedState>(UserFeedState.Loading)
+    val feedContent = _feedContent.asStateFlow()
+
+    fun refresh() {
+        // For some reason, view Model Scope doesn't call
+        viewModelScope.launch {
+            refreshSuspend()
+        }
+    }
+
+    fun refreshSuspend() {
+        val notes = dataSource.loadTop()
+
+        val oldNotesState = feedContent.value
+        if (oldNotesState is UserFeedState.Loaded) {
+            if (notes != oldNotesState.feed) {
+                updateFeed(notes)
+            }
+        } else {
+            updateFeed(notes)
+        }
+    }
+
+    fun updateFeed(notes: List<User>) {
+        if (notes.isEmpty()) {
+            _feedContent.update { UserFeedState.Empty }
+        } else {
+            _feedContent.update { UserFeedState.Loaded(notes) }
+        }
+    }
+
+    fun refreshCurrentList() {
+        val state = feedContent.value
+        if (state is UserFeedState.Loaded) {
+            _feedContent.update { UserFeedState.Loaded(state.feed) }
+        }
+    }
+
+    private val cacheListener: (LocalCacheState) -> Unit = {
+        refresh()
+    }
+
+    init {
+        LocalCache.live.observeForever(cacheListener)
+    }
+
+    override fun onCleared() {
+        LocalCache.live.removeObserver(cacheListener)
+
+        dataSource.stop()
+        viewModelScope.cancel()
+        super.onCleared()
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/AccountViewModel.kt

@@ -19,4 +19,12 @@ class AccountViewModel(private val account: Account): ViewModel() {
   fun boost(note: Note) {
     account.boost(note)
   }
+
+  fun broadcast(note: Note) {
+    account.broadcast(note)
+  }
+
+  fun decrypt(note: Note): String? {
+    return account.decryptContent(note)
+  }
 }

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/ChatroomListScreen.kt

@@ -0,0 +1,32 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.padding
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import androidx.lifecycle.viewmodel.compose.viewModel
+import androidx.navigation.NavController
+import com.vitorpamplona.amethyst.service.NostrChatroomListDataSource
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun ChatroomListScreen(accountViewModel: AccountViewModel, navController: NavController) {
+    val account by accountViewModel.accountLiveData.observeAsState()
+
+    if (account != null) {
+        val feedViewModel: FeedViewModel = viewModel { FeedViewModel( NostrChatroomListDataSource ) }
+
+        Column(Modifier.fillMaxHeight()) {
+            Column(
+                modifier = Modifier.padding(vertical = 0.dp)
+            ) {
+                ChatroomListFeedView(feedViewModel, accountViewModel, navController)
+            }
+        }
+    }
+}
+

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/ChatroomScreen.kt

@@ -0,0 +1,133 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material.Divider
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.OutlinedTextField
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.text.input.KeyboardCapitalization
+import androidx.compose.ui.text.input.TextFieldValue
+import androidx.compose.ui.unit.dp
+import androidx.lifecycle.viewmodel.compose.viewModel
+import androidx.navigation.NavController
+import coil.compose.AsyncImage
+import com.vitorpamplona.amethyst.model.User
+import com.vitorpamplona.amethyst.service.NostrChatRoomDataSource
+import com.vitorpamplona.amethyst.ui.actions.PostButton
+import com.vitorpamplona.amethyst.ui.note.UserDisplay
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun ChatroomScreen(userId: String?, accountViewModel: AccountViewModel, navController: NavController) {
+    val accountState by accountViewModel.accountLiveData.observeAsState()
+    val account = accountState?.account
+
+    if (account != null && userId != null) {
+        val newPost = remember { mutableStateOf(TextFieldValue("")) }
+
+        NostrChatRoomDataSource.loadMessagesBetween(account, userId)
+
+        val feedViewModel: FeedViewModel = viewModel { FeedViewModel( NostrChatRoomDataSource ) }
+
+        Column(Modifier.fillMaxHeight()) {
+            NostrChatRoomDataSource.withUser?.let {
+                ChatroomHeader(
+                    it,
+                    accountViewModel = accountViewModel,
+                    navController = navController
+                )
+            }
+
+            Column(
+                modifier = Modifier.fillMaxHeight().padding(vertical = 0.dp).weight(1f, true)
+            ) {
+                ChatroomFeedView(userId, feedViewModel, accountViewModel, navController)
+            }
+
+            //LAST ROW
+            Row(modifier = Modifier.padding(10.dp).fillMaxWidth(),
+                horizontalArrangement = Arrangement.SpaceBetween,
+                verticalAlignment = Alignment.CenterVertically
+            ) {
+                OutlinedTextField(
+                    value = newPost.value,
+                    onValueChange = { newPost.value = it },
+                    keyboardOptions = KeyboardOptions.Default.copy(
+                        capitalization = KeyboardCapitalization.Sentences
+                    ),
+                    modifier = Modifier.weight(1f, true).padding(end = 10.dp),
+                    placeholder = {
+                        Text(
+                            text = "reply here.. ",
+                            color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
+                        )
+                    }
+                )
+
+                PostButton(
+                    onPost = {
+                        account.sendPrivateMeesage(newPost.value.text, userId)
+                        newPost.value = TextFieldValue("")
+                    },
+                    newPost.value.text.isNotBlank()
+                )
+            }
+        }
+    }
+}
+
+
+@Composable
+fun ChatroomHeader(baseUser: User, accountViewModel: AccountViewModel, navController: NavController) {
+    val authorState by baseUser.live.observeAsState()
+    val author = authorState?.user
+
+    Column(modifier =
+        Modifier
+            .padding(12.dp)
+            .clickable(
+                onClick = { navController.navigate("User/${author?.pubkeyHex}") }
+            )
+    ) {
+        Row(verticalAlignment = Alignment.CenterVertically) {
+
+            AsyncImage(
+                model = author?.profilePicture(),
+                contentDescription = "Profile Image",
+                modifier = Modifier
+                    .width(35.dp).height(35.dp)
+                    .clip(shape = CircleShape)
+            )
+
+            Column(modifier = Modifier.padding(start = 10.dp)) {
+                Row(verticalAlignment = Alignment.CenterVertically) {
+                    if (author != null)
+                        UserDisplay(author)
+                }
+            }
+        }
+
+        Divider(
+            modifier = Modifier.padding(top = 12.dp, start = 12.dp, end = 12.dp),
+            thickness = 0.25.dp
+        )
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/HomeScreen.kt

@@ -8,24 +8,23 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import androidx.lifecycle.compose.ExperimentalLifecycleComposeApi
 import androidx.lifecycle.viewmodel.compose.viewModel
+import androidx.navigation.NavController
 import com.vitorpamplona.amethyst.service.NostrHomeDataSource
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 
-@OptIn(ExperimentalLifecycleComposeApi::class)
 @Composable
-fun HomeScreen(accountViewModel: AccountViewModel) {
-    val account by accountViewModel.accountLiveData.observeAsState()
+fun HomeScreen(accountViewModel: AccountViewModel, navController: NavController) {
+    val accountState by accountViewModel.accountLiveData.observeAsState()
 
-    if (account != null) {
+    if (accountState != null) {
         val feedViewModel: FeedViewModel = viewModel { FeedViewModel( NostrHomeDataSource ) }
 
         Column(Modifier.fillMaxHeight()) {
             Column(
                 modifier = Modifier.padding(vertical = 0.dp)
             ) {
-                FeedView(feedViewModel, accountViewModel)
+                FeedView(feedViewModel, accountViewModel, navController)
             }
         }
     }

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/MainScreen.kt

@@ -5,11 +5,14 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.statusBarsPadding
-import androidx.compose.material.*
+import androidx.compose.material.DrawerValue
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Scaffold
+import androidx.compose.material.rememberDrawerState
+import androidx.compose.material.rememberScaffoldState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.ui.Modifier
-import androidx.lifecycle.compose.ExperimentalLifecycleComposeApi
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.rememberNavController
@@ -51,7 +54,6 @@ fun MainScreen(accountViewModel: AccountViewModel, accountStateViewModel: Accoun
     }
 }
 
-@OptIn(ExperimentalLifecycleComposeApi::class)
 @Composable
 fun FloatingButton(navController: NavHostController, accountViewModel: AccountStateViewModel) {
     val accountState by accountViewModel.accountContent.collectAsStateWithLifecycle()

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/MessageScreen.kt

@@ -1,29 +0,0 @@
-package com.vitorpamplona.amethyst.ui.screen
-
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.fillMaxHeight
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.material.Text
-import androidx.compose.material.rememberScaffoldState
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.rememberCoroutineScope
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
-
-@Composable
-fun MessageScreen(accountViewModel: AccountViewModel) {
-    val state = rememberScaffoldState()
-    val scope = rememberCoroutineScope()
-
-    Column(
-        Modifier
-            .fillMaxHeight()
-            .fillMaxWidth(),
-        horizontalAlignment = Alignment.CenterHorizontally,
-        verticalArrangement = Arrangement.Center,
-    ) {
-        Text("Message Screen")
-    }
-}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/NotificationScreen.kt

@@ -8,14 +8,13 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import androidx.lifecycle.compose.ExperimentalLifecycleComposeApi
 import androidx.lifecycle.viewmodel.compose.viewModel
+import androidx.navigation.NavController
 import com.vitorpamplona.amethyst.service.NostrNotificationDataSource
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 
-@OptIn(ExperimentalLifecycleComposeApi::class)
 @Composable
-fun NotificationScreen(accountViewModel: AccountViewModel) {
+fun NotificationScreen(accountViewModel: AccountViewModel, navController: NavController) {
     val account by accountViewModel.accountLiveData.observeAsState()
 
     if (account != null) {
@@ -26,7 +25,7 @@ fun NotificationScreen(accountViewModel: AccountViewModel) {
             Column(
                 modifier = Modifier.padding(vertical = 0.dp)
             ) {
-                CardFeedView(feedViewModel, accountViewModel = accountViewModel)
+                CardFeedView(feedViewModel, accountViewModel = accountViewModel, navController)
             }
         }
     }

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/ProfileScreen.kt

@@ -1,29 +1,346 @@
 package com.vitorpamplona.amethyst.ui.screen
 
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
 import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Button
+import androidx.compose.material.ButtonDefaults
+import androidx.compose.material.Divider
+import androidx.compose.material.Icon
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Surface
+import androidx.compose.material.Tab
+import androidx.compose.material.TabRow
+import androidx.compose.material.TabRowDefaults
 import androidx.compose.material.Text
-import androidx.compose.material.rememberScaffoldState
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.ClipboardManager
+import androidx.compose.ui.platform.LocalClipboardManager
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.AnnotatedString
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import androidx.lifecycle.viewmodel.compose.viewModel
+import androidx.navigation.NavController
+import coil.compose.AsyncImage
+import com.google.accompanist.pager.ExperimentalPagerApi
+import com.google.accompanist.pager.HorizontalPager
+import com.google.accompanist.pager.pagerTabIndicatorOffset
+import com.google.accompanist.pager.rememberPagerState
+import com.vitorpamplona.amethyst.R
+import com.vitorpamplona.amethyst.model.User
+import com.vitorpamplona.amethyst.service.NostrUserProfileDataSource
+import com.vitorpamplona.amethyst.service.NostrUserProfileFollowersDataSource
+import com.vitorpamplona.amethyst.service.NostrUserProfileFollowsDataSource
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+import kotlinx.coroutines.launch
+import nostr.postr.toNpub
+
+data class TabRowItem(
+    val title: String,
+    val screen: @Composable () -> Unit,
+)
+
+@OptIn(ExperimentalPagerApi::class)
+@Composable
+fun ProfileScreen(userId: String?, accountViewModel: AccountViewModel, navController: NavController) {
+    val accountState by accountViewModel.accountLiveData.observeAsState()
+    val account = accountState?.account
+
+    val accountUserState by accountViewModel.userLiveData.observeAsState()
+    val accountUser = accountUserState?.user
+
+    val clipboardManager = LocalClipboardManager.current
+
+    if (userId != null && account != null && accountUser != null) {
+        DisposableEffect(account) {
+            NostrUserProfileDataSource.loadUserProfile(userId)
+            NostrUserProfileFollowersDataSource.loadUserProfile(userId)
+            NostrUserProfileFollowsDataSource.loadUserProfile(userId)
+
+            onDispose {
+                NostrUserProfileDataSource.stop()
+                NostrUserProfileFollowsDataSource.stop()
+                NostrUserProfileFollowersDataSource.stop()
+            }
+        }
+
+        val baseUser = NostrUserProfileDataSource.user ?: return
+
+        val userState by baseUser.live.observeAsState()
+        val user = userState?.user ?: return
+
+        Surface(
+            modifier = Modifier.fillMaxWidth(),
+            color = MaterialTheme.colors.background
+        ) {
+            Column() {
+                Box {
+                    val banner = user.info.banner
+                    if (banner != null && banner.isNotBlank()) {
+                        AsyncImage(
+                            model = banner,
+                            contentDescription = "Profile Image",
+                            contentScale = ContentScale.FillWidth,
+                            modifier = Modifier.fillMaxWidth().height(125.dp)
+                        )
+                    } else {
+                        Image(
+                            painter = painterResource(R.drawable.profile_banner),
+                            contentDescription = "Profile Banner",
+                            contentScale = ContentScale.FillWidth,
+                            modifier = Modifier.fillMaxWidth().height(125.dp)
+                        )
+                    }
+
+                    Column(modifier = Modifier
+                        .fillMaxWidth()
+                        .padding(horizontal = 10.dp)
+                        .padding(top = 75.dp)) {
+
+                        Row(horizontalArrangement = Arrangement.SpaceBetween,
+                            verticalAlignment = Alignment.Bottom) {
+                            AsyncImage(
+                                model = user.profilePicture(),
+                                contentDescription = "Profile Image",
+                                modifier = Modifier
+                                    .width(100.dp)
+                                    .height(100.dp)
+                                    .clip(shape = CircleShape)
+                                    .border(3.dp, MaterialTheme.colors.background, CircleShape)
+                                    .background(MaterialTheme.colors.background)
+                            )
+
+                            Spacer(Modifier.weight(1f))
+
+                            MessageButton(user, navController)
+
+                            NPubCopyButton(clipboardManager, user)
+
+                            if (accountUser == user) {
+                                EditButton()
+                            } else {
+                                if (accountUser.follows?.contains(user) == true) {
+                                    UnfollowButton { account.unfollow(user) }
+                                } else {
+                                    FollowButton { account.follow(user) }
+                                }
+                            }
+                        }
+
+                        Text(
+                            user.bestDisplayName() ?: "",
+                            modifier = Modifier.padding(top = 7.dp),
+                            fontWeight = FontWeight.Bold,
+                            fontSize = 25.sp
+                        )
+                        Text(" @${user.bestUsername()}", color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f))
+                        Text(
+                            "${user.info.about}",
+                            color = Color.White,
+                            modifier = Modifier.padding(top = 5.dp, bottom = 5.dp)
+                        )
+
+                        Divider(modifier = Modifier.padding(top = 6.dp))
+                    }
+                }
+
+                val pagerState = rememberPagerState()
+                val coroutineScope = rememberCoroutineScope()
+
+                Column(modifier = Modifier.padding(start = 10.dp, end = 10.dp)) {
+                    TabRow(
+                        selectedTabIndex = pagerState.currentPage,
+                        indicator = { tabPositions ->
+                            TabRowDefaults.Indicator(
+                                Modifier.pagerTabIndicatorOffset(pagerState, tabPositions),
+                                color = MaterialTheme.colors.primary
+                            )
+                        },
+                    ) {
+                        Tab(
+                            selected = pagerState.currentPage == 0,
+                            onClick = { coroutineScope.launch { pagerState.animateScrollToPage(0) } },
+                            text = {
+                                Text(text = "Notes")
+                            }
+                        )
+
+                        Tab(
+                            selected = pagerState.currentPage == 1,
+                            onClick = { coroutineScope.launch { pagerState.animateScrollToPage(1) } },
+                            text = {
+                                Text(text = "${user.follows?.size ?: "--"} Following")
+                            }
+                        )
+
+                        Tab(
+                            selected = pagerState.currentPage == 2,
+                            onClick = { coroutineScope.launch { pagerState.animateScrollToPage(2) } },
+                            text = {
+                                Text(text = "${user.followers?.size ?: "--"} Followers")
+                            }
+                        )
+                    }
+                    HorizontalPager(count = 3, state = pagerState) {
+                        when (pagerState.currentPage) {
+                            0 -> TabNotes(user, accountViewModel, navController)
+                            1 -> TabFollows(user, accountViewModel, navController)
+                            2 -> TabFollowers(user, accountViewModel, navController)
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
 
 @Composable
-fun ProfileScreen(accountViewModel: AccountViewModel) {
-    val state = rememberScaffoldState()
-    val scope = rememberCoroutineScope()
+fun TabNotes(user: User, accountViewModel: AccountViewModel, navController: NavController) {
+    val accountState by accountViewModel.accountLiveData.observeAsState()
+    if (accountState != null) {
+        val feedViewModel: FeedViewModel = viewModel { FeedViewModel( NostrUserProfileDataSource ) }
 
-    Column(
-        Modifier
-            .fillMaxHeight()
-            .fillMaxWidth(),
-        horizontalAlignment = Alignment.CenterHorizontally,
-        verticalArrangement = Arrangement.Center,
-    ) {
-        Text("Profile Screen")
+        Column(Modifier.fillMaxHeight()) {
+            Column(
+                modifier = Modifier.padding(vertical = 0.dp)
+            ) {
+                FeedView(feedViewModel, accountViewModel, navController)
+            }
+        }
     }
-}
+}
+
+@Composable
+fun TabFollows(user: User, accountViewModel: AccountViewModel, navController: NavController) {
+    val feedViewModel: NostrUserProfileFollowsUserFeedViewModel = viewModel()
+
+    Column(Modifier.fillMaxHeight()) {
+        Column(
+            modifier = Modifier.padding(vertical = 0.dp)
+        ) {
+            UserFeedView(feedViewModel, accountViewModel, navController)
+        }
+    }
+}
+
+@Composable
+fun TabFollowers(user: User, accountViewModel: AccountViewModel, navController: NavController) {
+    val feedViewModel: NostrUserProfileFollowersUserFeedViewModel = viewModel()
+
+    Column(Modifier.fillMaxHeight()) {
+        Column(
+            modifier = Modifier.padding(vertical = 0.dp)
+        ) {
+            UserFeedView(feedViewModel, accountViewModel, navController)
+        }
+    }
+}
+
+@Composable
+private fun NPubCopyButton(
+    clipboardManager: ClipboardManager,
+    user: User
+) {
+    Button(
+        modifier = Modifier.padding(horizontal = 3.dp),
+        onClick = { clipboardManager.setText(AnnotatedString(user.pubkey.toNpub())) },
+        shape = RoundedCornerShape(20.dp),
+        colors = ButtonDefaults
+            .buttonColors(
+                backgroundColor = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
+            ),
+    ) {
+        Text(text = "npub", color = Color.White)
+    }
+}
+
+@Composable
+private fun MessageButton(user: User, navController: NavController) {
+    Button(
+        modifier = Modifier.padding(horizontal = 3.dp),
+        onClick = { navController.navigate("Room/${user.pubkeyHex}") },
+        shape = RoundedCornerShape(20.dp),
+        colors = ButtonDefaults
+            .buttonColors(
+                backgroundColor = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
+            ),
+    ) {
+        Icon(
+            painter = painterResource(R.drawable.ic_dm),
+            "Send a Direct Message",
+            modifier = Modifier.size(20.dp),
+            tint = Color.Unspecified
+        )
+    }
+}
+
+@Composable
+private fun EditButton() {
+    Button(
+        modifier = Modifier.padding(horizontal = 3.dp),
+        onClick = {},
+        shape = RoundedCornerShape(20.dp),
+        colors = ButtonDefaults
+            .buttonColors(
+                backgroundColor = MaterialTheme.colors.primary
+            )
+    ) {
+        Text(text = "Edit", color = Color.White)
+    }
+}
+
+@Composable
+fun UnfollowButton(onClick: () -> Unit) {
+    Button(
+        modifier = Modifier.padding(horizontal = 3.dp),
+        onClick = onClick,
+        shape = RoundedCornerShape(20.dp),
+        colors = ButtonDefaults
+            .buttonColors(
+                backgroundColor = MaterialTheme.colors.primary
+            )
+    ) {
+        Text(text = "Unfollow", color = Color.White)
+    }
+}
+
+@Composable
+fun FollowButton(onClick: () -> Unit) {
+    Button(
+        modifier = Modifier.padding(start = 3.dp),
+        onClick = onClick,
+        shape = RoundedCornerShape(20.dp),
+        colors = ButtonDefaults
+            .buttonColors(
+                backgroundColor = MaterialTheme.colors.primary
+            )
+    ) {
+        Text(text = "Follow", color = Color.White)
+    }
+}
+
+

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/SearchScreen.kt

@@ -6,21 +6,20 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import androidx.lifecycle.compose.ExperimentalLifecycleComposeApi
 import androidx.lifecycle.viewmodel.compose.viewModel
+import androidx.navigation.NavController
 import com.vitorpamplona.amethyst.service.NostrGlobalDataSource
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
 
-@OptIn(ExperimentalLifecycleComposeApi::class)
 @Composable
-fun SearchScreen(accountViewModel: AccountViewModel) {
+fun SearchScreen(accountViewModel: AccountViewModel, navController: NavController) {
     val feedViewModel: FeedViewModel = viewModel { FeedViewModel( NostrGlobalDataSource ) }
 
     Column(Modifier.fillMaxHeight()) {
         Column(
             modifier = Modifier.padding(vertical = 0.dp)
         ) {
-            FeedView(feedViewModel, accountViewModel)
+            FeedView(feedViewModel, accountViewModel, navController)
         }
     }
 }

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/ThreadScreen.kt

@@ -0,0 +1,40 @@
+package com.vitorpamplona.amethyst.ui.screen
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.padding
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import androidx.lifecycle.viewmodel.compose.viewModel
+import androidx.navigation.NavController
+import com.vitorpamplona.amethyst.service.NostrThreadDataSource
+import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
+
+@Composable
+fun ThreadScreen(noteId: String?, accountViewModel: AccountViewModel, navController: NavController) {
+    val account by accountViewModel.accountLiveData.observeAsState()
+
+    DisposableEffect(account) {
+        onDispose {
+            NostrThreadDataSource.stop()
+        }
+    }
+
+    if (account != null && noteId != null) {
+        NostrThreadDataSource.loadThread(noteId)
+
+        val feedViewModel: FeedViewModel = viewModel { FeedViewModel( NostrThreadDataSource ) }
+
+        Column(Modifier.fillMaxHeight()) {
+            Column(
+                modifier = Modifier.padding(vertical = 0.dp)
+            ) {
+                ThreadFeedView(noteId, feedViewModel, accountViewModel, navController)
+            }
+        }
+    }
+}

app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/LoginScreen.kt

@@ -12,29 +12,37 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.ClickableText
+import androidx.compose.foundation.text.KeyboardActions
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material.Button
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.OutlinedTextField
 import androidx.compose.material.Text
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.outlined.Visibility
+import androidx.compose.material.icons.outlined.VisibilityOff
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.text.input.PasswordVisualTransformation
 import androidx.compose.ui.text.input.TextFieldValue
+import androidx.compose.ui.text.input.VisualTransformation
 import androidx.compose.ui.text.style.TextDecoration
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import com.vitorpamplona.amethyst.R
-import com.vitorpamplona.amethyst.ui.theme.Purple700
 
 @Composable
 fun LoginPage(accountViewModel: AccountStateViewModel) {
@@ -48,7 +56,7 @@ fun LoginPage(accountViewModel: AccountStateViewModel) {
             style = TextStyle(
                 fontSize = 14.sp,
                 textDecoration = TextDecoration.Underline,
-                color = Purple700
+                color = MaterialTheme.colors.primary
             )
         )
     }
@@ -59,6 +67,7 @@ fun LoginPage(accountViewModel: AccountStateViewModel) {
     ) {
 
         val key = remember { mutableStateOf(TextFieldValue("")) }
+        var errorMessage by remember { mutableStateOf("") }
 
         Image(
             painterResource(id = R.drawable.amethyst_logo),
@@ -71,27 +80,62 @@ fun LoginPage(accountViewModel: AccountStateViewModel) {
 
         //Text(text = "Insert your private or public key (view-only)")
 
+        var showPassword by remember {
+            mutableStateOf(false)
+        }
+
         OutlinedTextField(
             value = key.value,
             onValueChange = { key.value = it },
             keyboardOptions = KeyboardOptions(
                 autoCorrect = false,
                 keyboardType = KeyboardType.Ascii,
-                imeAction = ImeAction.Next
+                imeAction = ImeAction.Go
             ),
             placeholder = {
                 Text(
                     text = "nsec / npub / hex private key",
                     color = MaterialTheme.colors.onSurface.copy(alpha = 0.32f)
                 )
-            }
+            },
+            trailingIcon = {
+                IconButton(onClick = { showPassword = !showPassword }) {
+                    Icon(
+                        imageVector = if (showPassword) Icons.Outlined.VisibilityOff else Icons.Outlined.Visibility,
+                        contentDescription = if (showPassword) "Show Password" else "Hide Password"
+                    )
+                }
+            },
+            visualTransformation = if (showPassword) VisualTransformation.None else PasswordVisualTransformation(),
+            keyboardActions = KeyboardActions(
+                onGo = {
+                    try {
+                        accountViewModel.login(key.value.text)
+                    } catch (e: Exception) {
+                        errorMessage = "Invalid key"
+                    }
+                }
+            )
         )
+        if (errorMessage.isNotBlank()) {
+            Text(
+                text = "${errorMessage}",
+                color = MaterialTheme.colors.error,
+                style = MaterialTheme.typography.caption
+            )
+        }
 
         Spacer(modifier = Modifier.height(20.dp))
 
         Box(modifier = Modifier.padding(40.dp, 0.dp, 40.dp, 0.dp)) {
             Button(
-                onClick = { accountViewModel.login(key.value.text) },
+                onClick = {
+                    try {
+                        accountViewModel.login(key.value.text)
+                    } catch (e: Exception) {
+                        errorMessage = "Invalid key"
+                    }
+                },
                 shape = RoundedCornerShape(35.dp),
                 modifier = Modifier
                     .fillMaxWidth()

app/src/main/res/drawable/lightning.xml

@@ -0,0 +1,12 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="280dp"
+    android:height="280dp"
+    android:viewportWidth="280"
+    android:viewportHeight="280">
+  <path
+      android:pathData="M7,140.5C7,66.77 66.77,7 140.5,7C214.23,7 274,66.77 274,140.5C274,214.23 214.23,274 140.5,274C66.77,274 7,214.23 7,140.5Z"
+      android:fillColor="#f7931a"/>
+  <path
+      android:pathData="M161.19,51.5C153.23,72.16 145.28,94.41 135.72,116.66C135.72,116.66 135.72,119.84 138.91,119.84L204.17,119.84C204.17,119.84 204.17,121.43 205.77,123.02L110.25,229.5C108.66,227.91 108.66,226.32 108.66,224.73L142.09,153.21L142.09,146.86L75.23,146.86L75.23,140.5L156.42,51.5L161.19,51.5Z"
+      android:fillColor="#ffffff"/>
+</vector>

app/src/test/java/com/vitorpamplona/amethyst/ExampleUnitTest.kt

@@ -1,9 +1,8 @@
 package com.vitorpamplona.amethyst
 
+import org.junit.Assert.assertEquals
 import org.junit.Test
 
-import org.junit.Assert.*
-
 /**
  * Example local unit test, which will execute on the development machine (host).
  *

build.gradle

@@ -1,8 +1,9 @@
 buildscript {
     ext {
-        compose_ui_version = '1.3.2'
+        compose_ui_version = '1.3.3'
         nav_version = "2.5.3"
         room_version = "2.4.3"
+        accompanist_version = "0.28.0"
     }
 }// Top-level build file where you can add configuration options common to all sub-projects/modules.
 plugins {