Анимация, список реакций

client-mobile/chats/presentation/components/MessageBubble.kt

@@ -3,6 +3,7 @@ package chats.presentation.components
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.shape.CircleShape
@@ -647,25 +648,57 @@ fun MessageContextMenu(
     onReactionSelected: (String) -> Unit,
     onAction: (String) -> Unit
 ) {
+    var isVisible by remember { mutableStateOf(false) }
+    
+    LaunchedEffect(Unit) {
+        isVisible = true
+    }
+
+    androidx.compose.animation.AnimatedVisibility(
+        visible = isVisible,
+        enter = androidx.compose.animation.fadeIn(animationSpec = androidx.compose.animation.core.tween(200)) + 
+                androidx.compose.animation.scaleIn(
+                    initialScale = 0.5f,
+                    animationSpec = androidx.compose.animation.core.spring(
+                        dampingRatio = 0.6f,
+                        stiffness = 400f
+                    ),
+                    transformOrigin = androidx.compose.ui.graphics.TransformOrigin(
+                        if (isVisible) 0.5f else 0.5f, 
+                        0f
+                    )
+                ),
+        exit = androidx.compose.animation.fadeOut() + androidx.compose.animation.scaleOut()
+    ) {
         androidx.compose.material3.Surface(
             modifier = Modifier
-            .width(220.dp)
+                .width(280.dp) // Even wider for all reactions
-            .clip(RoundedCornerShape(12.dp)),
+                .clip(RoundedCornerShape(20.dp)),
             color = Color(0xFF1E1E1E),
-        shadowElevation = 8.dp
+            shadowElevation = 15.dp,
+            border = androidx.compose.foundation.BorderStroke(0.5.dp, Color.White.copy(alpha = 0.15f))
         ) {
             Column {
-            // Reactions
+                // Extended Reactions scrollable bar
-            Row(
+                androidx.compose.foundation.lazy.LazyRow(
                     modifier = Modifier
                         .fillMaxWidth()
-                    .padding(8.dp),
+                        .padding(horizontal = 4.dp, vertical = 10.dp),
-                horizontalArrangement = Arrangement.SpaceBetween
+                    horizontalArrangement = Arrangement.spacedBy(6.dp),
+                    contentPadding = PaddingValues(horizontal = 12.dp)
                 ) {
-                listOf("👍", "❤️", "😂", "😮", "😢", "🔥").forEach { emoji ->
+                    val telegramReactions = listOf(
+                        "👍", "❤️", "😂", "🔥", "💯", "👏", "🤩", "🤔", "🤯", "😱", "🤬", 
+                        "👎", "💩", "🤡", "🥳", "😇", "🌚", "🙏", "👌", "🕊️", "🐳", 
+                        "🌭", "🦄", "🍌", "💊", "🍓", "🍾", "💋", "🖕", "👀", "👻",
+                        "🤝", "🤣", "⚡", "✨", "🎈", "🎉", "🧊", "🆒", "🤨", "😐", 
+                        "🤷‍♂️", "💅", "🏆", "👾", "🎯", "🎲", "🍷", "🤮", "🥱", "😴", 
+                        "🤐", "🥴"
+                    )
+                    items(telegramReactions) { emoji ->
                         Text(
                             text = emoji,
-                        fontSize = 24.sp,
+                            fontSize = 28.sp,
                             modifier = Modifier
                                 .clip(CircleShape)
                                 .clickable { onReactionSelected(emoji) }
@@ -694,6 +727,7 @@ fun MessageContextMenu(
         }
     }
 }
+}
 
 @Composable
 fun ContextMenuItem(