Improvements to the rendering of chat headers

app/src/main/java/com/vitorpamplona/amethyst/ui/layouts/ChatHeaderLayout.kt

@@ -6,6 +6,7 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.material3.Divider
@@ -45,16 +46,12 @@ fun ChannelNamePreview() {
                 )
             },
             firstRow = {
-                Row(verticalAlignment = Alignment.CenterVertically) {
+                Text("This is my author", Modifier.weight(1f))
-                    Text("This is my author", Modifier.weight(1f))
+                TimeAgo(TimeUtils.now())
-                    TimeAgo(TimeUtils.now())
-                }
             },
             secondRow = {
-                Row(verticalAlignment = Alignment.CenterVertically) {
+                Text("This is a message from this person", Modifier.weight(1f))
-                    Text("This is a message from this person", Modifier.weight(1f))
+                NewItemsBubble()
-                    NewItemsBubble()
-                }
             },
             onClick = {
             }
@@ -90,8 +87,8 @@ fun ChannelNamePreview() {
 @Composable
 fun ChatHeaderLayout(
     channelPicture: @Composable () -> Unit,
-    firstRow: @Composable () -> Unit,
+    firstRow: @Composable RowScope.() -> Unit,
-    secondRow: @Composable () -> Unit,
+    secondRow: @Composable RowScope.() -> Unit,
     onClick: () -> Unit
 ) {
     Column(modifier = remember { Modifier.clickable(onClick = onClick) }) {
@@ -108,11 +105,19 @@ fun ChatHeaderLayout(
             Column(
                 modifier = Modifier.fillMaxWidth()
             ) {
-                firstRow()
+                Row(
+                    verticalAlignment = Alignment.CenterVertically
+                ) {
+                    firstRow()
+                }
 
                 Spacer(modifier = Height4dpModifier)
 
-                secondRow()
+                Row(
+                    verticalAlignment = Alignment.CenterVertically
+                ) {
+                    secondRow()
+                }
             }
         }
 

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

@@ -4,7 +4,6 @@ import androidx.compose.animation.Crossfade
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 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
@@ -282,8 +281,8 @@ fun RoomNameDisplay(room: ChatroomKey, modifier: Modifier, accountViewModel: Acc
         it.user.privateChatrooms[room]?.subject
     }.distinctUntilChanged().observeAsState(accountViewModel.userProfile().privateChatrooms[room]?.subject)
 
-    Crossfade(targetState = roomSubject, modifier) {
+    Crossfade(targetState = roomSubject, modifier, label = "RoomNameDisplay") {
-        if (it != null && it.isNotBlank()) {
+        if (!it.isNullOrBlank()) {
             if (room.users.size > 1) {
                 DisplayRoomSubject(it)
             } else {
@@ -465,58 +464,43 @@ fun ChannelName(
     ChatHeaderLayout(
         channelPicture = channelPicture,
         firstRow = {
-            Row(
+            channelTitle(Modifier.weight(1f))
-                verticalAlignment = Alignment.CenterVertically
+            TimeAgo(channelLastTime)
-            ) {
-                FirstRow(channelTitle, channelLastTime, remember { Modifier.weight(1f) })
-            }
         },
         secondRow = {
-            Row(
+            if (channelLastContent != null) {
-                modifier = Modifier.fillMaxWidth(),
+                Text(
-                verticalAlignment = Alignment.CenterVertically
+                    channelLastContent,
-            ) {
+                    color = MaterialTheme.colorScheme.grayText,
-                SecondRow(channelLastContent, hasNewMessages, remember { Modifier.weight(1f) })
+                    maxLines = 1,
+                    overflow = TextOverflow.Ellipsis,
+                    style = LocalTextStyle.current.copy(textDirection = TextDirection.Content),
+                    modifier = Modifier.weight(1f)
+                )
+            } else {
+                Text(
+                    stringResource(R.string.referenced_event_not_found),
+                    color = MaterialTheme.colorScheme.grayText,
+                    maxLines = 1,
+                    overflow = TextOverflow.Ellipsis,
+                    modifier = Modifier.weight(1f)
+                )
+            }
+
+            if (hasNewMessages.value) {
+                NewItemsBubble()
             }
         },
         onClick = onClick
     )
 }
 
-@Composable
-private fun SecondRow(channelLastContent: String?, hasNewMessages: MutableState<Boolean>, modifier: Modifier) {
-    if (channelLastContent != null) {
-        Text(
-            channelLastContent,
-            color = MaterialTheme.colorScheme.grayText,
-            maxLines = 1,
-            overflow = TextOverflow.Ellipsis,
-            style = LocalTextStyle.current.copy(textDirection = TextDirection.Content),
-            modifier = modifier
-        )
-    } else {
-        Text(
-            stringResource(R.string.referenced_event_not_found),
-            color = MaterialTheme.colorScheme.grayText,
-            maxLines = 1,
-            overflow = TextOverflow.Ellipsis,
-            modifier = modifier
-        )
-    }
-
-    if (hasNewMessages.value) {
-        NewItemsBubble()
-    }
-}
-
 @Composable
 private fun FirstRow(
     channelTitle: @Composable (Modifier) -> Unit,
     channelLastTime: Long?,
     modifier: Modifier
 ) {
-    channelTitle(modifier)
-    TimeAgo(channelLastTime)
 }
 
 @Composable

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

@@ -34,6 +34,7 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.State
 import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableFloatStateOf
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
@@ -254,7 +255,7 @@ fun MainScreen(
     }
 
     val bottomBarHeightPx = with(LocalDensity.current) { 50.dp.roundToPx().toFloat() }
-    val bottomBarOffsetHeightPx = remember { mutableStateOf(0f) }
+    val bottomBarOffsetHeightPx = remember { mutableFloatStateOf(0f) }
     val shouldShow = remember { mutableStateOf(true) }
 
     val nestedScrollConnection = remember {