Logging out the time to display reactions

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

@@ -1,11 +1,17 @@
 package com.vitorpamplona.amethyst.ui.note
 
 import android.content.Context
+import android.util.Log
 import android.widget.Toast
 import androidx.compose.animation.AnimatedContent
+import androidx.compose.animation.AnimatedContentScope
+import androidx.compose.animation.ContentTransform
 import androidx.compose.animation.Crossfade
 import androidx.compose.animation.ExperimentalAnimationApi
 import androidx.compose.animation.core.animateFloatAsState
+import androidx.compose.animation.core.tween
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.fadeOut
 import androidx.compose.animation.slideInVertically
 import androidx.compose.animation.slideOutVertically
 import androidx.compose.animation.with
@@ -112,6 +118,8 @@ import kotlinx.coroutines.launch
 import java.math.BigDecimal
 import java.math.RoundingMode
 import kotlin.math.roundToInt
+import kotlin.time.ExperimentalTime
+import kotlin.time.measureTimedValue
 
 @Composable
 fun ReactionsRow(
@@ -137,6 +145,7 @@ fun ReactionsRow(
     Spacer(modifier = HalfDoubleVertSpacer)
 }
 
+@OptIn(ExperimentalTime::class)
 @Composable
 private fun InnerReactionRow(
     baseNote: Note,
@@ -163,49 +172,69 @@ private fun InnerReactionRow(
             verticalArrangement = Arrangement.Center,
             modifier = remember { Modifier.weight(1f) }
         ) {
-            Row(verticalAlignment = CenterVertically) {
+            val (value, elapsed) = measureTimedValue {
-                ReplyReactionWithDialog(baseNote, MaterialTheme.colors.placeholderText, accountViewModel, nav)
+                Row(verticalAlignment = CenterVertically) {
+                    ReplyReactionWithDialog(baseNote, MaterialTheme.colors.placeholderText, accountViewModel, nav)
+                }
             }
+            Log.d("Rendering Metrics", "Reaction Reply: ${baseNote.event?.content()?.split("\n")?.getOrNull(0)?.take(15)}.. $elapsed")
         }
 
         Column(
             verticalArrangement = Arrangement.Center,
             modifier = remember { Modifier.weight(1f) }
         ) {
-            Row(verticalAlignment = CenterVertically) {
+            val (value, elapsed) = measureTimedValue {
-                BoostWithDialog(baseNote, MaterialTheme.colors.placeholderText, accountViewModel, nav)
+                Row(verticalAlignment = CenterVertically) {
+                    BoostWithDialog(
+                        baseNote,
+                        MaterialTheme.colors.placeholderText,
+                        accountViewModel,
+                        nav
+                    )
+                }
             }
+            Log.d("Rendering Metrics", "Reaction Boost: ${baseNote.event?.content()?.split("\n")?.getOrNull(0)?.take(15)}.. $elapsed")
         }
 
         Column(
             verticalArrangement = Arrangement.Center,
             modifier = remember { Modifier.weight(1f) }
         ) {
-            Row(verticalAlignment = CenterVertically) {
+            val (value, elapsed) = measureTimedValue {
-                LikeReaction(baseNote, MaterialTheme.colors.placeholderText, accountViewModel)
+                Row(verticalAlignment = CenterVertically) {
+                    LikeReaction(baseNote, MaterialTheme.colors.placeholderText, accountViewModel)
+                }
             }
+            Log.d("Rendering Metrics", "Reaction Likes: ${baseNote.event?.content()?.split("\n")?.getOrNull(0)?.take(15)}.. $elapsed")
         }
 
         Column(
             verticalArrangement = Arrangement.Center,
             modifier = remember { Modifier.weight(1f) }
         ) {
-            Row(verticalAlignment = CenterVertically) {
+            val (value, elapsed) = measureTimedValue {
-                ZapReaction(baseNote, MaterialTheme.colors.placeholderText, accountViewModel)
+                Row(verticalAlignment = CenterVertically) {
+                    ZapReaction(baseNote, MaterialTheme.colors.placeholderText, accountViewModel)
+                }
             }
+            Log.d("Rendering Metrics", "Reaction Zaps:  ${baseNote.event?.content()?.split("\n")?.getOrNull(0)?.take(15)}.. $elapsed")
         }
 
         Column(
             verticalArrangement = Arrangement.Center,
             modifier = remember { Modifier.weight(1f) }
         ) {
-            Row(verticalAlignment = CenterVertically) {
+            val (value, elapsed) = measureTimedValue {
-                ViewCountReaction(
+                Row(verticalAlignment = CenterVertically) {
-                    note = baseNote,
+                    ViewCountReaction(
-                    grayTint = MaterialTheme.colors.placeholderText,
+                        note = baseNote,
-                    viewCountColorFilter = MaterialTheme.colors.placeholderTextColorFilter
+                        grayTint = MaterialTheme.colors.placeholderText,
-                )
+                        viewCountColorFilter = MaterialTheme.colors.placeholderTextColorFilter
+                    )
+                }
             }
+            Log.d("Rendering Metrics", "Reaction Views: ${baseNote.event?.content()?.split("\n")?.getOrNull(0)?.take(15)}.. $elapsed")
         }
     }
 }
@@ -492,16 +521,10 @@ fun ReplyReaction(
     val context = LocalContext.current
     val scope = rememberCoroutineScope()
 
-    val iconButtonModifier = remember {
-        Modifier.size(iconSize)
-    }
-
-    val iconModifier = remember {
-        Modifier.size(iconSize)
-    }
-
     IconButton(
-        modifier = iconButtonModifier,
+        modifier = remember {
+            Modifier.size(iconSize)
+        },
         onClick = {
             if (accountViewModel.isWriteable()) {
                 onPress()
@@ -518,8 +541,8 @@ fun ReplyReaction(
     ) {
         Icon(
             painter = painterResource(R.drawable.ic_comment),
-            null,
+            contentDescription = null,
-            modifier = iconModifier,
+            modifier = remember { Modifier.size(iconSize) },
             tint = grayTint
         )
     }
@@ -538,23 +561,29 @@ fun ReplyCounter(baseNote: Note, textColor: Color) {
     SlidingAnimation(repliesState, textColor)
 }
 
-@Composable
 @OptIn(ExperimentalAnimationApi::class)
+@Composable
 private fun SlidingAnimation(baseCount: Int, textColor: Color) {
     AnimatedContent<Int>(
         targetState = baseCount,
-        transitionSpec = {
+        transitionSpec = AnimatedContentScope<Int>::transitionSpec
-            if (targetState > initialState) {
-                slideInVertically { -it } with slideOutVertically { it }
-            } else {
-                slideInVertically { it } with slideOutVertically { -it }
-            }
-        }
     ) { count ->
         TextCount(count, textColor)
     }
 }
 
+@OptIn(ExperimentalAnimationApi::class)
+private fun <S> AnimatedContentScope<S>.transitionSpec(): ContentTransform {
+    return slideAnimation
+}
+
+@ExperimentalAnimationApi
+val slideAnimation: ContentTransform = slideInVertically(animationSpec = tween(durationMillis = 100)) { height -> height } + fadeIn(
+    animationSpec = tween(durationMillis = 100)
+) with slideOutVertically(animationSpec = tween(durationMillis = 100)) { height -> -height } + fadeOut(
+    animationSpec = tween(durationMillis = 100)
+)
+
 @Composable
 private fun TextCount(count: Int, textColor: Color) {
     Text(
@@ -569,15 +598,9 @@ private fun TextCount(count: Int, textColor: Color) {
 @Composable
 @OptIn(ExperimentalAnimationApi::class)
 private fun SlidingAnimation(amount: String, textColor: Color) {
-    AnimatedContent<String>(
+    AnimatedContent(
         targetState = amount,
-        transitionSpec = {
+        transitionSpec = AnimatedContentScope<String>::transitionSpec
-            if (targetState > initialState) {
-                slideInVertically { -it } with slideOutVertically { it }
-            } else {
-                slideInVertically { it } with slideOutVertically { -it }
-            }
-        }
     ) { count ->
         Text(
             text = count,