Improvements to ShowMore gradient and size of bubbles in chat.

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

@@ -21,6 +21,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.compositeOver
 import androidx.compose.ui.unit.dp
 import androidx.navigation.NavController
 import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel
@@ -31,6 +32,7 @@ fun ExpandableRichTextViewer(
   canPreview: Boolean,
   modifier: Modifier = Modifier,
   tags: List<List<String>>?,
+  backgroundColor: Color,
   accountViewModel: AccountViewModel,
   navController: NavController
 ) {
@@ -39,7 +41,7 @@ fun ExpandableRichTextViewer(
   val text = if (showFullText) content else content.take(350)
 
   Box(contentAlignment = Alignment.BottomCenter) {
-    RichTextViewer(text, canPreview, modifier, tags, accountViewModel, navController)
+    RichTextViewer(text, canPreview, modifier, tags, backgroundColor, accountViewModel, navController)
 
     if (content.length > 350 && !showFullText) {
       Row(
@@ -50,8 +52,8 @@ fun ExpandableRichTextViewer(
           .background(
             brush = Brush.verticalGradient(
               colors = listOf(
-                MaterialTheme.colors.background.copy(alpha = 0f),
+                backgroundColor.copy(alpha = 0f),
-                MaterialTheme.colors.background
+                backgroundColor
               )
             )
           )
@@ -61,7 +63,7 @@ fun ExpandableRichTextViewer(
           onClick = { showFullText = !showFullText },
           shape = RoundedCornerShape(20.dp),
           colors = ButtonDefaults.buttonColors(
-            backgroundColor = MaterialTheme.colors.primary
+            backgroundColor = MaterialTheme.colors.primary.copy(alpha = 0.32f).compositeOver(MaterialTheme.colors.background)
           ),
           contentPadding = PaddingValues(vertical = 6.dp, horizontal = 16.dp)
         ) {

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

@@ -11,6 +11,8 @@ import androidx.compose.runtime.*
 import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.compositeOver
 import androidx.compose.ui.text.style.TextDirection
 import androidx.compose.ui.unit.dp
 import androidx.navigation.NavController
@@ -55,6 +57,7 @@ fun RichTextViewer(
   canPreview: Boolean,
   modifier: Modifier = Modifier,
   tags: List<List<String>>?,
+  backgroundColor: Color,
   accountViewModel: AccountViewModel,
   navController: NavController,
 ) {
@@ -86,7 +89,7 @@ fun RichTextViewer(
             } else if (noProtocolUrlValidator.matcher(word).matches()) {
               UrlPreview("https://$word", word)
             } else if (tagIndex.matcher(word).matches() && tags != null) {
-              TagLink(word, tags, accountViewModel, navController)
+              TagLink(word, tags, backgroundColor, accountViewModel, navController)
             } else if (isBechLink(word)) {
               BechLink(word, navController)
             } else {
@@ -105,7 +108,7 @@ fun RichTextViewer(
             } else if (noProtocolUrlValidator.matcher(word).matches()) {
               ClickableUrl(word, "https://$word")
             } else if (tagIndex.matcher(word).matches() && tags != null) {
-              TagLink(word, tags, accountViewModel, navController)
+              TagLink(word, tags, backgroundColor, accountViewModel, navController)
             } else if (isBechLink(word)) {
               BechLink(word, navController)
             } else {
@@ -159,7 +162,7 @@ fun BechLink(word: String, navController: NavController) {
 
 
 @Composable
-fun TagLink(word: String, tags: List<List<String>>, accountViewModel: AccountViewModel, navController: NavController) {
+fun TagLink(word: String, tags: List<List<String>>, backgroundColor: Color, accountViewModel: AccountViewModel, navController: NavController) {
   val matcher = tagIndex.matcher(word)
 
   val index = try {
@@ -204,8 +207,8 @@ fun TagLink(word: String, tags: List<List<String>>, accountViewModel: AccountVie
               1.dp,
               MaterialTheme.colors.onSurface.copy(alpha = 0.12f),
               RoundedCornerShape(15.dp)
-            )
+            ),
-            .background(MaterialTheme.colors.onSurface.copy(alpha = 0.05f)),
+          parentBackgroundColor = MaterialTheme.colors.onSurface.copy(alpha = 0.05f).compositeOver(backgroundColor),
           isQuotedNote = true,
           navController = navController)
       } else {

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

@@ -25,6 +25,7 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.text.SpanStyle
 import androidx.compose.ui.text.buildAnnotatedString
@@ -44,6 +45,7 @@ fun TranslateableRichTextViewer(
   canPreview: Boolean,
   modifier: Modifier = Modifier,
   tags: List<List<String>>?,
+  backgroundColor: Color,
   accountViewModel: AccountViewModel,
   navController: NavController
 ) {
@@ -85,8 +87,9 @@ fun TranslateableRichTextViewer(
       canPreview,
       modifier,
       tags,
+      backgroundColor,
       accountViewModel,
-      navController
+      navController,
     )
 
     val target = translatedTextState.value.targetLang

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

@@ -21,6 +21,7 @@ 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.graphics.compositeOver
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.unit.dp
@@ -59,10 +60,14 @@ fun BoostSetCompose(boostSetCard: BoostSetCard, isInnerNote: Boolean = false, ro
                 NotificationCache.markAsRead(routeForLastRead, boostSetCard.createdAt, context)
         }
 
+        var backgroundColor = if (isNew) {
+            MaterialTheme.colors.primary.copy(0.12f).compositeOver(MaterialTheme.colors.background)
+        } else {
+            MaterialTheme.colors.background
+        }
+
         Column(
-            modifier = Modifier.background(
+            modifier = Modifier.background(backgroundColor).combinedClickable(
-                if (isNew) MaterialTheme.colors.primary.copy(0.12f) else MaterialTheme.colors.background
-            ).combinedClickable(
                 onClick = {
                     if (noteEvent !is ChannelMessageEvent) {
                         navController.navigate("Note/${note.idHex}"){
@@ -115,6 +120,7 @@ fun BoostSetCompose(boostSetCard: BoostSetCard, isInnerNote: Boolean = false, ro
                         routeForLastRead = null,
                         modifier = Modifier.padding(top = 5.dp),
                         isBoostedNote = true,
+                        parentBackgroundColor = backgroundColor,
                         accountViewModel = accountViewModel,
                         navController = navController
                     )

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

@@ -51,6 +51,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.graphics.ColorMatrix
 import androidx.compose.ui.graphics.Shape
+import androidx.compose.ui.graphics.compositeOver
 import androidx.compose.ui.graphics.painter.BitmapPainter
 import androidx.compose.ui.layout.onSizeChanged
 import androidx.compose.ui.platform.LocalContext
@@ -85,7 +86,16 @@ val ChatBubbleShapeThem = RoundedCornerShape(3.dp, 15.dp, 15.dp, 15.dp)
 
 @OptIn(ExperimentalFoundationApi::class)
 @Composable
-fun ChatroomMessageCompose(baseNote: Note, routeForLastRead: String?, innerQuote: Boolean = false, accountViewModel: AccountViewModel, navController: NavController, onWantsToReply: (Note) -> Unit) {
+fun ChatroomMessageCompose(
+    baseNote: Note,
+    routeForLastRead: String?,
+    innerQuote: Boolean = false,
+    parentBackgroundColor: Color? = null,
+    accountViewModel: AccountViewModel,
+    navController: NavController,
+    onWantsToReply: (Note) -> Unit
+) {
+
     val noteState by baseNote.live().metadata.observeAsState()
     val note = noteState?.note
 
@@ -128,6 +138,12 @@ fun ChatroomMessageCompose(baseNote: Note, routeForLastRead: String?, innerQuote
             shape = ChatBubbleShapeThem
         }
 
+        if (parentBackgroundColor != null) {
+            backgroundBubbleColor = backgroundBubbleColor.compositeOver(parentBackgroundColor)
+        } else {
+            backgroundBubbleColor = backgroundBubbleColor.compositeOver(MaterialTheme.colors.background)
+        }
+
         var isNew by remember { mutableStateOf<Boolean>(false) }
 
         LaunchedEffect(key1 = routeForLastRead) {
@@ -143,21 +159,23 @@ fun ChatroomMessageCompose(baseNote: Note, routeForLastRead: String?, innerQuote
         }
 
         Column() {
+            val modif = if (innerQuote) Modifier.padding(top = 10.dp, end = 5.dp) else Modifier.fillMaxWidth(1f).padding(
+                start = 12.dp,
+                end = 12.dp,
+                top = 5.dp,
+                bottom = 5.dp
+            )
+
             Row(
-                modifier = Modifier
+                modifier = modif,
-                    .fillMaxWidth(1f)
-                    .padding(
-                        start = 12.dp,
-                        end = 12.dp,
-                        top = 5.dp,
-                        bottom = 5.dp
-                    ),
                 horizontalArrangement = alignment
             ) {
                 var availableBubbleSize by remember { mutableStateOf(IntSize.Zero) }
+                val modif2 = if (innerQuote) Modifier else Modifier.fillMaxWidth(0.85f)
+
                 Row(
                     horizontalArrangement = alignment,
-                    modifier = Modifier.fillMaxWidth(if (innerQuote) 1f else 0.85f).onSizeChanged {
+                    modifier = modif2.onSizeChanged {
                         availableBubbleSize = it
                     },
                 ) {
@@ -226,6 +244,7 @@ fun ChatroomMessageCompose(baseNote: Note, routeForLastRead: String?, innerQuote
                                                 note,
                                                 null,
                                                 innerQuote = true,
+                                                parentBackgroundColor = backgroundBubbleColor,
                                                 accountViewModel = accountViewModel,
                                                 navController = navController,
                                                 onWantsToReply = onWantsToReply
@@ -259,6 +278,7 @@ fun ChatroomMessageCompose(baseNote: Note, routeForLastRead: String?, innerQuote
                                             canPreview,
                                             Modifier,
                                             note.event?.tags,
+                                            backgroundBubbleColor,
                                             accountViewModel,
                                             navController
                                         )
@@ -268,6 +288,7 @@ fun ChatroomMessageCompose(baseNote: Note, routeForLastRead: String?, innerQuote
                                             true,
                                             Modifier,
                                             note.event?.tags,
+                                            backgroundBubbleColor,
                                             accountViewModel,
                                             navController
                                         )
@@ -278,7 +299,7 @@ fun ChatroomMessageCompose(baseNote: Note, routeForLastRead: String?, innerQuote
                             Row(
                                 verticalAlignment = Alignment.CenterVertically,
                                 horizontalArrangement = Arrangement.SpaceBetween,
-                                modifier = Modifier.padding(top = 2.dp).then(
+                                modifier = Modifier.padding(top = 5.dp).then(
                                     with(LocalDensity.current) {
                                         Modifier.widthIn(bubbleSize.width.toDp(), availableBubbleSize.width.toDp())
                                     }
@@ -298,9 +319,9 @@ fun ChatroomMessageCompose(baseNote: Note, routeForLastRead: String?, innerQuote
 
                                 Row() {
                                     LikeReaction(baseNote, accountViewModel)
-                                    Spacer(modifier = Modifier.width(10.dp))
+                                    Spacer(modifier = Modifier.width(5.dp))
                                     ZapReaction(baseNote, accountViewModel)
-                                    Spacer(modifier = Modifier.width(10.dp))
+                                    Spacer(modifier = Modifier.width(5.dp))
                                     ReplyReaction(baseNote, accountViewModel, showCounter = false) {
                                         onWantsToReply(baseNote)
                                     }

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

@@ -21,6 +21,7 @@ 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.graphics.compositeOver
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.unit.dp
@@ -59,10 +60,14 @@ fun LikeSetCompose(likeSetCard: LikeSetCard, modifier: Modifier = Modifier, isIn
                 NotificationCache.markAsRead(routeForLastRead, likeSetCard.createdAt, context)
         }
 
+        var backgroundColor = if (isNew) {
+            MaterialTheme.colors.primary.copy(0.12f).compositeOver(MaterialTheme.colors.background)
+        } else {
+            MaterialTheme.colors.background
+        }
+
         Column(
-            modifier = Modifier.background(
+            modifier = Modifier.background(backgroundColor).combinedClickable(
-                if (isNew) MaterialTheme.colors.primary.copy(0.12f) else MaterialTheme.colors.background
-            ).combinedClickable(
                 onClick = {
                     if (noteEvent !is ChannelMessageEvent) {
                         navController.navigate("Note/${note.idHex}"){
@@ -115,6 +120,7 @@ fun LikeSetCompose(likeSetCard: LikeSetCard, modifier: Modifier = Modifier, isIn
                         routeForLastRead = null,
                         modifier = Modifier.padding(top = 5.dp),
                         isBoostedNote = true,
+                        parentBackgroundColor = backgroundColor,
                         accountViewModel = accountViewModel,
                         navController = navController
                     )

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

@@ -12,8 +12,10 @@ 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.graphics.Color
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.graphics.ColorMatrix
+import androidx.compose.ui.graphics.compositeOver
 import androidx.compose.ui.graphics.painter.BitmapPainter
 import androidx.compose.ui.platform.LocalClipboardManager
 import androidx.compose.ui.platform.LocalContext
@@ -50,6 +52,7 @@ fun NoteCompose(
     modifier: Modifier = Modifier,
     isBoostedNote: Boolean = false,
     isQuotedNote: Boolean = false,
+    parentBackgroundColor: Color? = null,
     accountViewModel: AccountViewModel,
     navController: NavController
 ) {
@@ -100,8 +103,18 @@ fun NoteCompose(
             }
         }
 
-        Column(modifier =
+        var backgroundColor = if (isNew) {
-            modifier.combinedClickable(
+            val newColor = MaterialTheme.colors.primary.copy(0.12f)
+            if (parentBackgroundColor != null) {
+                newColor.compositeOver(parentBackgroundColor)
+            } else {
+                newColor.compositeOver(MaterialTheme.colors.background)
+            }
+          } else {
+            parentBackgroundColor ?: MaterialTheme.colors.background
+          }
+
+        Column(modifier = modifier.combinedClickable(
                 onClick = {
                     if (noteEvent !is ChannelMessageEvent) {
                         navController.navigate("Note/${note.idHex}"){
@@ -114,13 +127,7 @@ fun NoteCompose(
                     }
                 },
                 onLongClick = { popupExpanded = true }
-            ).run {
+            ).background(backgroundColor)
-                if (isNew) {
-                    this.background(MaterialTheme.colors.primary.copy(0.12f))
-                } else {
-                    this
-                }
-            }
         ) {
             Row(
                 modifier = Modifier
@@ -253,6 +260,7 @@ fun NoteCompose(
                                 it,
                                 modifier = Modifier,
                                 isBoostedNote = true,
+                                parentBackgroundColor = backgroundColor,
                                 accountViewModel = accountViewModel,
                                 navController = navController
                             )
@@ -274,7 +282,7 @@ fun NoteCompose(
                                 ReportEvent.ReportType.SPAM -> "Spam"
                                 ReportEvent.ReportType.IMPERSONATION -> "Impersonation"
                                 ReportEvent.ReportType.ILLEGAL -> "Illegal Behavior"
-                                else -> "Unkown"
+                                else -> "Unknown"
                             }
                         }.joinToString(", ")
 
@@ -298,6 +306,7 @@ fun NoteCompose(
                                 canPreview,
                                 Modifier.fillMaxWidth(),
                                 noteEvent.tags,
+                                backgroundColor,
                                 accountViewModel,
                                 navController
                             )

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

@@ -686,8 +686,8 @@ fun UpdateZapAmountDialog(onClose: () -> Unit, account: Account) {
 }
 
 fun showCount(count: Int?): String {
-  if (count == null) return " "
+  if (count == null) return ""
-  if (count == 0) return " "
+  if (count == 0) return ""
 
   return when {
     count >= 1000000000 -> "${Math.round(count / 1000000000f)}G"
@@ -702,8 +702,8 @@ val OneMega = BigDecimal(1000000)
 val OneKilo = BigDecimal(1000)
 
 fun showAmount(amount: BigDecimal?): String {
-  if (amount == null) return " "
+  if (amount == null) return ""
-  if (amount.abs() < BigDecimal(0.01)) return " "
+  if (amount.abs() < BigDecimal(0.01)) return ""
 
   return when {
     amount >= OneGiga -> "%.1fG".format(amount.div(OneGiga).setScale(1, RoundingMode.HALF_UP))

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

@@ -22,6 +22,7 @@ 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.compositeOver
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.unit.dp
 import androidx.navigation.NavController
@@ -59,10 +60,14 @@ fun ZapSetCompose(zapSetCard: ZapSetCard, modifier: Modifier = Modifier, isInner
                 NotificationCache.markAsRead(routeForLastRead, zapSetCard.createdAt, context)
         }
 
+        var backgroundColor = if (isNew) {
+            MaterialTheme.colors.primary.copy(0.12f).compositeOver(MaterialTheme.colors.background)
+        } else {
+            MaterialTheme.colors.background
+        }
+
         Column(
-            modifier = Modifier.background(
+            modifier = Modifier.background(backgroundColor).combinedClickable(
-                if (isNew) MaterialTheme.colors.primary.copy(0.12f) else MaterialTheme.colors.background
-            ).combinedClickable(
                 onClick = {
                   if (noteEvent !is ChannelMessageEvent) {
                       navController.navigate("Note/${note.idHex}"){
@@ -115,6 +120,7 @@ fun ZapSetCompose(zapSetCard: ZapSetCard, modifier: Modifier = Modifier, isInner
                         routeForLastRead = null,
                         modifier = Modifier.padding(top = 5.dp),
                         isBoostedNote = true,
+                        parentBackgroundColor = backgroundColor,
                         accountViewModel = accountViewModel,
                         navController = navController
                     )

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

@@ -232,6 +232,7 @@ fun NoteMaster(baseNote: Note,
                             canPreview,
                             Modifier.fillMaxWidth(),
                             note.event?.tags,
+                            MaterialTheme.colors.background,
                             accountViewModel,
                             navController
                         )