Adds simplified views to the video and chat feeds.

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

@@ -21,6 +21,7 @@
 package com.vitorpamplona.amethyst.ui.note
 
 import androidx.compose.animation.Crossfade
+import androidx.compose.animation.animateContentSize
 import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.combinedClickable
@@ -33,7 +34,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.widthIn
-import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
@@ -41,6 +41,7 @@ import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.State
 import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
@@ -51,7 +52,6 @@ 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.graphics.Color
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.graphics.compositeOver
@@ -66,7 +66,6 @@ import androidx.lifecycle.map
 import com.vitorpamplona.amethyst.R
 import com.vitorpamplona.amethyst.model.Note
 import com.vitorpamplona.amethyst.model.User
-import com.vitorpamplona.amethyst.ui.components.CreateClickableTextWithEmoji
 import com.vitorpamplona.amethyst.ui.components.CreateTextWithEmoji
 import com.vitorpamplona.amethyst.ui.components.RobohashFallbackAsyncImage
 import com.vitorpamplona.amethyst.ui.components.SensitivityWarning
@@ -84,10 +83,9 @@ import com.vitorpamplona.amethyst.ui.theme.ReactionRowHeightChat
 import com.vitorpamplona.amethyst.ui.theme.Size10dp
 import com.vitorpamplona.amethyst.ui.theme.Size15Modifier
 import com.vitorpamplona.amethyst.ui.theme.Size20dp
-import com.vitorpamplona.amethyst.ui.theme.Size25dp
 import com.vitorpamplona.amethyst.ui.theme.Size5dp
 import com.vitorpamplona.amethyst.ui.theme.StdHorzSpacer
-import com.vitorpamplona.amethyst.ui.theme.StdVertSpacer
+import com.vitorpamplona.amethyst.ui.theme.chatAuthorImage
 import com.vitorpamplona.amethyst.ui.theme.mediumImportanceLink
 import com.vitorpamplona.amethyst.ui.theme.placeholderText
 import com.vitorpamplona.amethyst.ui.theme.subtleBorder
@@ -306,12 +304,16 @@ fun NormalChatNote(
 
             val modif2 = if (innerQuote) Modifier else ChatBubbleMaxSizeModifier
 
+            val showDetails = remember { mutableStateOf(false) }
+
             val clickableModifier =
                 remember {
                     Modifier.combinedClickable(
                         onClick = {
                             if (note.event is ChannelCreateEvent) {
                                 nav("Channel/${note.idHex}")
+                            } else {
+                                showDetails.value = !showDetails.value
                             }
                         },
                         onLongClick = { popupExpanded = true },
@@ -341,6 +343,7 @@ fun NormalChatNote(
                         onWantsToReply,
                         canPreview,
                         availableBubbleSize,
+                        showDetails,
                         accountViewModel,
                         nav,
                     )
@@ -367,6 +370,7 @@ private fun RenderBubble(
     onWantsToReply: (Note) -> Unit,
     canPreview: Boolean,
     availableBubbleSize: MutableState<Int>,
+    showDetails: State<Boolean>,
     accountViewModel: AccountViewModel,
     nav: (String) -> Unit,
 ) {
@@ -375,12 +379,13 @@ private fun RenderBubble(
     val bubbleModifier =
         remember {
             Modifier
-                .padding(start = 10.dp, end = 5.dp, bottom = 5.dp)
+                .padding(start = 10.dp, end = 10.dp, bottom = 5.dp)
                 .onSizeChanged {
                     if (bubbleSize.intValue != it.width) {
                         bubbleSize.intValue = it.width
                     }
                 }
+                .animateContentSize()
         }
 
     Column(modifier = bubbleModifier) {
@@ -388,14 +393,15 @@ private fun RenderBubble(
             drawAuthorInfo,
             baseNote,
             alignment,
-            nav,
+            availableBubbleSize,
             innerQuote,
             backgroundBubbleColor,
-            accountViewModel,
+            bubbleSize,
             onWantsToReply,
             canPreview,
-            bubbleSize,
+            showDetails,
-            availableBubbleSize,
+            accountViewModel,
+            nav,
         )
     }
 }
@@ -405,14 +411,15 @@ private fun MessageBubbleLines(
     drawAuthorInfo: Boolean,
     baseNote: Note,
     alignment: Arrangement.Horizontal,
-    nav: (String) -> Unit,
+    availableBubbleSize: MutableState<Int>,
     innerQuote: Boolean,
     backgroundBubbleColor: MutableState<Color>,
-    accountViewModel: AccountViewModel,
+    bubbleSize: MutableState<Int>,
     onWantsToReply: (Note) -> Unit,
     canPreview: Boolean,
-    bubbleSize: MutableState<Int>,
+    showDetails: State<Boolean>,
-    availableBubbleSize: MutableState<Int>,
+    accountViewModel: AccountViewModel,
+    nav: (String) -> Unit,
 ) {
     if (drawAuthorInfo) {
         DrawAuthorInfo(
@@ -421,8 +428,6 @@ private fun MessageBubbleLines(
             accountViewModel.settings.showProfilePictures.value,
             nav,
         )
-    } else {
-        Spacer(modifier = StdVertSpacer)
     }
 
     RenderReplyRow(
@@ -442,6 +447,7 @@ private fun MessageBubbleLines(
         nav = nav,
     )
 
+    if (showDetails.value || baseNote.zaps.isNotEmpty() || baseNote.zapPayments.isNotEmpty() || baseNote.reactions.isNotEmpty()) {
         ConstrainedStatusRow(
             bubbleSize = bubbleSize,
             availableBubbleSize = availableBubbleSize,
@@ -468,6 +474,7 @@ private fun MessageBubbleLines(
                 Spacer(modifier = StdHorzSpacer)
             },
         )
+    }
 }
 
 @Composable
@@ -479,9 +486,7 @@ private fun RenderReplyRow(
     nav: (String) -> Unit,
     onWantsToReply: (Note) -> Unit,
 ) {
-    val hasReply by remember { derivedStateOf { !innerQuote && note.replyTo?.lastOrNull() != null } }
+    if (!innerQuote && note.replyTo?.lastOrNull() != null) {
-
-    if (hasReply) {
         RenderReply(note, backgroundBubbleColor, accountViewModel, nav, onWantsToReply)
     }
 }
@@ -504,8 +509,8 @@ private fun RenderReply(
 
         replyTo.value?.let { note ->
             ChatroomMessageCompose(
-                note,
+                baseNote = note,
-                null,
+                routeForLastRead = null,
                 innerQuote = true,
                 parentBackgroundColor = backgroundBubbleColor,
                 accountViewModel = accountViewModel,
@@ -525,7 +530,7 @@ private fun NoteRow(
     nav: (String) -> Unit,
 ) {
     Row(verticalAlignment = Alignment.CenterVertically) {
-        when (remember(note) { note.event }) {
+        when (note.event) {
             is ChannelCreateEvent -> {
                 RenderCreateChannelNote(note)
             }
@@ -719,23 +724,20 @@ private fun DrawAuthorInfo(
     loadProfilePicture: Boolean,
     nav: (String) -> Unit,
 ) {
+    baseNote.author?.let {
         Row(
             verticalAlignment = Alignment.CenterVertically,
             horizontalArrangement = alignment,
-        modifier = Modifier.padding(top = Size10dp),
+            modifier =
+                Modifier
+                    .padding(top = Size10dp)
+                    .clickable {
+                        nav("User/${baseNote.author?.pubkeyHex}")
+                    },
         ) {
-        DisplayAndWatchNoteAuthor(baseNote, loadProfilePicture, nav)
+            WatchAndDisplayUser(it, loadProfilePicture, nav)
+        }
     }
-}
-
-@Composable
-private fun DisplayAndWatchNoteAuthor(
-    baseNote: Note,
-    loadProfilePicture: Boolean,
-    nav: (String) -> Unit,
-) {
-    val author = remember { baseNote.author }
-    author?.let { WatchAndDisplayUser(it, loadProfilePicture, nav) }
 }
 
 @Composable
@@ -744,16 +746,14 @@ private fun WatchAndDisplayUser(
     loadProfilePicture: Boolean,
     nav: (String) -> Unit,
 ) {
-    val route = "User/${author.pubkeyHex}"
-
     val userState by author.live().userMetadataInfo.observeAsState()
 
-    UserIcon(author.pubkeyHex, userState?.picture, loadProfilePicture, nav, route)
+    UserIcon(author.pubkeyHex, userState?.picture, loadProfilePicture)
 
-    userState?.let {
+    if (userState != null) {
-        it.bestName()?.let { name ->
+        DisplayMessageUsername(userState?.bestName() ?: author.pubkeyDisplayHex(), userState?.tags ?: EmptyTagList)
-            DisplayMessageUsername(name, it.tags, route, nav)
+    } else {
-        }
+        DisplayMessageUsername(author.pubkeyDisplayHex(), EmptyTagList)
     }
 }
 
@@ -762,40 +762,26 @@ private fun UserIcon(
     pubkeyHex: String,
     userProfilePicture: String?,
     loadProfilePicture: Boolean,
-    nav: (String) -> Unit,
-    route: String,
 ) {
     RobohashFallbackAsyncImage(
         robot = pubkeyHex,
         model = userProfilePicture,
         contentDescription = stringResource(id = R.string.profile_image),
         loadProfilePicture = loadProfilePicture,
-        modifier =
+        modifier = chatAuthorImage,
-            remember {
-                Modifier
-                    .width(Size25dp)
-                    .height(Size25dp)
-                    .clip(shape = CircleShape)
-                    .clickable(onClick = { nav(route) })
-            },
     )
 }
 
 @Composable
 private fun DisplayMessageUsername(
     userDisplayName: String,
-    userTags: ImmutableListOfLists<String>?,
+    userTags: ImmutableListOfLists<String>,
-    route: String,
-    nav: (String) -> Unit,
 ) {
     Spacer(modifier = StdHorzSpacer)
-    CreateClickableTextWithEmoji(
+    CreateTextWithEmoji(
-        clickablePart = userDisplayName,
+        text = userDisplayName,
-        maxLines = 1,
         tags = userTags,
+        maxLines = 1,
         fontWeight = FontWeight.Bold,
-        overrideColor = MaterialTheme.colorScheme.onBackground,
-        route = route,
-        nav = nav,
     )
 }

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

@@ -35,7 +35,6 @@ 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.pager.PagerState
 import androidx.compose.foundation.pager.VerticalPager
 import androidx.compose.foundation.pager.rememberPagerState
@@ -64,6 +63,7 @@ import androidx.lifecycle.Lifecycle
 import androidx.lifecycle.LifecycleEventObserver
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.vitorpamplona.amethyst.R
+import com.vitorpamplona.amethyst.model.FeatureSetType
 import com.vitorpamplona.amethyst.model.Note
 import com.vitorpamplona.amethyst.service.NostrVideoDataSource
 import com.vitorpamplona.amethyst.ui.actions.NewPostView
@@ -91,11 +91,14 @@ import com.vitorpamplona.amethyst.ui.screen.NostrVideoFeedViewModel
 import com.vitorpamplona.amethyst.ui.screen.RefresheableBox
 import com.vitorpamplona.amethyst.ui.screen.ScrollStateKeys
 import com.vitorpamplona.amethyst.ui.screen.rememberForeverPagerState
+import com.vitorpamplona.amethyst.ui.theme.AuthorInfoVideoFeed
+import com.vitorpamplona.amethyst.ui.theme.DoubleHorzSpacer
 import com.vitorpamplona.amethyst.ui.theme.Size35Modifier
 import com.vitorpamplona.amethyst.ui.theme.Size35dp
 import com.vitorpamplona.amethyst.ui.theme.Size39Modifier
 import com.vitorpamplona.amethyst.ui.theme.Size40Modifier
 import com.vitorpamplona.amethyst.ui.theme.Size40dp
+import com.vitorpamplona.amethyst.ui.theme.Size55dp
 import com.vitorpamplona.amethyst.ui.theme.onBackgroundColorFilter
 import com.vitorpamplona.amethyst.ui.theme.placeholderText
 import com.vitorpamplona.quartz.events.FileHeaderEvent
@@ -321,8 +324,8 @@ private fun RenderVideoOrPictureNote(
     accountViewModel: AccountViewModel,
     nav: (String) -> Unit,
 ) {
-    Column(remember { Modifier.fillMaxSize(1f) }, verticalArrangement = Arrangement.Center) {
+    Column(Modifier.fillMaxSize(1f), verticalArrangement = Arrangement.Center) {
-        Row(remember { Modifier.weight(1f) }, verticalAlignment = Alignment.CenterVertically) {
+        Row(Modifier.weight(1f), verticalAlignment = Alignment.CenterVertically) {
             val noteEvent = remember { note.event }
             if (noteEvent is FileHeaderEvent) {
                 FileHeaderDisplay(note, false, accountViewModel)
@@ -332,20 +335,19 @@ private fun RenderVideoOrPictureNote(
         }
     }
 
-    Row(verticalAlignment = Alignment.Bottom, modifier = remember { Modifier.fillMaxSize(1f) }) {
+    Row(modifier = Modifier.fillMaxSize(1f), verticalAlignment = Alignment.Bottom) {
-        Column(remember { Modifier.weight(1f) }) {
+        Column(Modifier.weight(1f), verticalArrangement = Arrangement.Center) {
             RenderAuthorInformation(note, nav, accountViewModel)
         }
 
         Column(
-            remember { Modifier.width(65.dp).padding(bottom = 10.dp) },
+            modifier = AuthorInfoVideoFeed,
             verticalArrangement = Arrangement.Center,
+            horizontalAlignment = Alignment.CenterHorizontally,
         ) {
-            Row(horizontalArrangement = Arrangement.Center) {
             ReactionsColumn(note, accountViewModel, nav)
         }
     }
-    }
 }
 
 @Composable
@@ -354,19 +356,20 @@ private fun RenderAuthorInformation(
     nav: (String) -> Unit,
     accountViewModel: AccountViewModel,
 ) {
-    Row(remember { Modifier.padding(10.dp) }, verticalAlignment = Alignment.Bottom) {
+    Row(modifier = Modifier.padding(start = 10.dp, end = 10.dp, bottom = 10.dp), verticalAlignment = Alignment.CenterVertically) {
-        Column(remember { Modifier.size(55.dp) }, verticalArrangement = Arrangement.Center) {
+        NoteAuthorPicture(note, nav, accountViewModel, Size55dp)
-            NoteAuthorPicture(note, nav, accountViewModel, 55.dp)
+
-        }
+        Spacer(modifier = DoubleHorzSpacer)
 
         Column(
-            remember { Modifier.padding(start = 10.dp, end = 10.dp).height(65.dp).weight(1f) },
+            Modifier.height(65.dp).weight(1f),
             verticalArrangement = Arrangement.Center,
         ) {
             Row(verticalAlignment = Alignment.CenterVertically) {
                 NoteUsernameDisplay(note, remember { Modifier.weight(1f) })
                 VideoUserOptionAction(note, accountViewModel, nav)
             }
+            if (accountViewModel.settings.featureSet != FeatureSetType.SIMPLIFIED) {
                 Row(verticalAlignment = Alignment.CenterVertically) {
                     ObserveDisplayNip05Status(
                         note.author!!,
@@ -383,6 +386,7 @@ private fun RenderAuthorInformation(
                 }
             }
         }
+    }
 }
 
 @Composable
@@ -457,11 +461,9 @@ fun ReactionsColumn(
         )
     }
 
-    Spacer(modifier = Modifier.height(8.dp))
-
     Column(
         horizontalAlignment = Alignment.CenterHorizontally,
-        modifier = Modifier.padding(bottom = 75.dp, end = 20.dp),
+        modifier = Modifier.padding(bottom = 75.dp, end = 10.dp),
     ) {
         ReplyReaction(
             baseNote = baseNote,

app/src/main/java/com/vitorpamplona/amethyst/ui/theme/Shape.kt

@@ -175,7 +175,7 @@ val ZeroPadding = PaddingValues(0.dp)
 val FeedPadding = PaddingValues(top = 10.dp, bottom = 10.dp)
 val ButtonPadding = PaddingValues(vertical = 6.dp, horizontal = 16.dp)
 
-val ChatPaddingInnerQuoteModifier = Modifier.padding(top = 10.dp, end = 5.dp)
+val ChatPaddingInnerQuoteModifier = Modifier.padding(top = 10.dp)
 val ChatPaddingModifier =
     Modifier.fillMaxWidth(1f)
         .padding(
@@ -228,3 +228,6 @@ val liveStreamTag =
         .clip(SmallBorder)
         .background(Color.Black)
         .padding(horizontal = Size5dp)
+
+val chatAuthorImage = Modifier.size(20.dp).clip(shape = CircleShape)
+val AuthorInfoVideoFeed = Modifier.width(75.dp)