Update command input layout in composer thread mode as per designer review

stream-chat-android-compose/api/stream-chat-android-compose.api

@@ -1353,8 +1353,10 @@ public final class io/getstream/chat/android/compose/ui/components/composer/Comp
 	public fun <init> ()V
 	public final fun getLambda$-1141807280$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 	public final fun getLambda$-1150438384$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
+	public final fun getLambda$-120349014$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 	public final fun getLambda$-1240289060$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 	public final fun getLambda$-1320161390$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
+	public final fun getLambda$-132642371$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 	public final fun getLambda$-1355851382$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 	public final fun getLambda$-148308776$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 	public final fun getLambda$-1789505997$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
@@ -2008,11 +2010,11 @@ public final class io/getstream/chat/android/compose/ui/messages/composer/intern
 	public final fun getLambda$1901566342$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 }
 
-public final class io/getstream/chat/android/compose/ui/messages/composer/internal/ComposableSingletons$MessageComposerInputCenterBottomContentKt {
-	public static final field INSTANCE Lio/getstream/chat/android/compose/ui/messages/composer/internal/ComposableSingletons$MessageComposerInputCenterBottomContentKt;
+public final class io/getstream/chat/android/compose/ui/messages/composer/internal/ComposableSingletons$MessageComposerInputBottomContentKt {
+	public static final field INSTANCE Lio/getstream/chat/android/compose/ui/messages/composer/internal/ComposableSingletons$MessageComposerInputBottomContentKt;
 	public fun <init> ()V
-	public final fun getLambda$-251225122$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
-	public final fun getLambda$-914010537$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
+	public final fun getLambda$-1649672542$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
+	public final fun getLambda$494648681$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 }
 
 public final class io/getstream/chat/android/compose/ui/messages/composer/internal/ComposableSingletons$MessageComposerInputTrailingContentKt {
@@ -3414,7 +3416,7 @@ public abstract interface class io/getstream/chat/android/compose/ui/theme/ChatC
 	public fun MessageComposerCoolDownIndicator (Lio/getstream/chat/android/compose/ui/theme/MessageComposerCoolDownIndicatorParams;Landroidx/compose/runtime/Composer;I)V
 	public fun MessageComposerEditIndicator (Lio/getstream/chat/android/compose/ui/theme/MessageComposerEditIndicatorParams;Landroidx/compose/runtime/Composer;I)V
 	public fun MessageComposerInput (Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputParams;Landroidx/compose/runtime/Composer;I)V
-	public fun MessageComposerInputCenterBottomContent (Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputCenterBottomContentParams;Landroidx/compose/runtime/Composer;I)V
+	public fun MessageComposerInputBottomContent (Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputBottomContentParams;Landroidx/compose/runtime/Composer;I)V
 	public fun MessageComposerInputCenterContent (Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputCenterContentParams;Landroidx/compose/runtime/Composer;I)V
 	public fun MessageComposerInputLeadingContent (Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputLeadingContentParams;Landroidx/compose/runtime/Composer;I)V
 	public fun MessageComposerInputTrailingContent (Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputTrailingContentParams;Landroidx/compose/runtime/Composer;I)V
@@ -3602,7 +3604,7 @@ public final class io/getstream/chat/android/compose/ui/theme/ChatComponentFacto
 	public static fun MessageComposerCoolDownIndicator (Lio/getstream/chat/android/compose/ui/theme/ChatComponentFactory;Lio/getstream/chat/android/compose/ui/theme/MessageComposerCoolDownIndicatorParams;Landroidx/compose/runtime/Composer;I)V
 	public static fun MessageComposerEditIndicator (Lio/getstream/chat/android/compose/ui/theme/ChatComponentFactory;Lio/getstream/chat/android/compose/ui/theme/MessageComposerEditIndicatorParams;Landroidx/compose/runtime/Composer;I)V
 	public static fun MessageComposerInput (Lio/getstream/chat/android/compose/ui/theme/ChatComponentFactory;Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputParams;Landroidx/compose/runtime/Composer;I)V
-	public static fun MessageComposerInputCenterBottomContent (Lio/getstream/chat/android/compose/ui/theme/ChatComponentFactory;Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputCenterBottomContentParams;Landroidx/compose/runtime/Composer;I)V
+	public static fun MessageComposerInputBottomContent (Lio/getstream/chat/android/compose/ui/theme/ChatComponentFactory;Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputBottomContentParams;Landroidx/compose/runtime/Composer;I)V
 	public static fun MessageComposerInputCenterContent (Lio/getstream/chat/android/compose/ui/theme/ChatComponentFactory;Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputCenterContentParams;Landroidx/compose/runtime/Composer;I)V
 	public static fun MessageComposerInputLeadingContent (Lio/getstream/chat/android/compose/ui/theme/ChatComponentFactory;Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputLeadingContentParams;Landroidx/compose/runtime/Composer;I)V
 	public static fun MessageComposerInputTrailingContent (Lio/getstream/chat/android/compose/ui/theme/ChatComponentFactory;Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputTrailingContentParams;Landroidx/compose/runtime/Composer;I)V
@@ -4485,15 +4487,15 @@ public final class io/getstream/chat/android/compose/ui/theme/MessageComposerEdi
 	public fun toString ()Ljava/lang/String;
 }
 
-public final class io/getstream/chat/android/compose/ui/theme/MessageComposerInputCenterBottomContentParams {
+public final class io/getstream/chat/android/compose/ui/theme/MessageComposerInputBottomContentParams {
 	public static final field $stable I
 	public fun <init> (Lio/getstream/chat/android/ui/common/state/messages/composer/MessageComposerState;Lkotlin/jvm/functions/Function1;Landroidx/compose/ui/Modifier;)V
 	public synthetic fun <init> (Lio/getstream/chat/android/ui/common/state/messages/composer/MessageComposerState;Lkotlin/jvm/functions/Function1;Landroidx/compose/ui/Modifier;ILkotlin/jvm/internal/DefaultConstructorMarker;)V
 	public final fun component1 ()Lio/getstream/chat/android/ui/common/state/messages/composer/MessageComposerState;
 	public final fun component2 ()Lkotlin/jvm/functions/Function1;
 	public final fun component3 ()Landroidx/compose/ui/Modifier;
-	public final fun copy (Lio/getstream/chat/android/ui/common/state/messages/composer/MessageComposerState;Lkotlin/jvm/functions/Function1;Landroidx/compose/ui/Modifier;)Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputCenterBottomContentParams;
-	public static synthetic fun copy$default (Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputCenterBottomContentParams;Lio/getstream/chat/android/ui/common/state/messages/composer/MessageComposerState;Lkotlin/jvm/functions/Function1;Landroidx/compose/ui/Modifier;ILjava/lang/Object;)Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputCenterBottomContentParams;
+	public final fun copy (Lio/getstream/chat/android/ui/common/state/messages/composer/MessageComposerState;Lkotlin/jvm/functions/Function1;Landroidx/compose/ui/Modifier;)Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputBottomContentParams;
+	public static synthetic fun copy$default (Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputBottomContentParams;Lio/getstream/chat/android/ui/common/state/messages/composer/MessageComposerState;Lkotlin/jvm/functions/Function1;Landroidx/compose/ui/Modifier;ILjava/lang/Object;)Lio/getstream/chat/android/compose/ui/theme/MessageComposerInputBottomContentParams;
 	public fun equals (Ljava/lang/Object;)Z
 	public final fun getModifier ()Landroidx/compose/ui/Modifier;
 	public final fun getOnAlsoSendToChannelChange ()Lkotlin/jvm/functions/Function1;

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/components/common/Checkbox.kt

@@ -54,7 +54,7 @@ internal fun Checkbox(
     val colors = ChatTheme.colors
     Box(
         modifier = modifier
-            .size(24.dp)
+            .size(20.dp)
             .run {
                 when {
                     !checked && enabled -> border(1.dp, borderColor, CheckboxShape)
@@ -92,14 +92,19 @@ private val CheckboxShape = RoundedCornerShape(StreamTokens.radiusSm)
 @Composable
 private fun CheckboxPreview() {
     ChatTheme {
-        Row(
-            modifier = Modifier.padding(16.dp),
-            horizontalArrangement = Arrangement.spacedBy(16.dp),
-        ) {
-            Checkbox(checked = false, enabled = true, onCheckedChange = {})
-            Checkbox(checked = true, enabled = true, onCheckedChange = {})
-            Checkbox(checked = false, enabled = false, onCheckedChange = {})
-            Checkbox(checked = true, enabled = false, onCheckedChange = {})
-        }
+        CheckboxStates()
+    }
+}
+
+@Composable
+internal fun CheckboxStates() {
+    Row(
+        modifier = Modifier.padding(16.dp),
+        horizontalArrangement = Arrangement.spacedBy(16.dp),
+    ) {
+        Checkbox(checked = false, enabled = true, onCheckedChange = {})
+        Checkbox(checked = true, enabled = true, onCheckedChange = {})
+        Checkbox(checked = false, enabled = false, onCheckedChange = {})
+        Checkbox(checked = true, enabled = false, onCheckedChange = {})
     }
 }

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/components/composer/MessageInput.kt

@@ -42,7 +42,7 @@ import io.getstream.chat.android.compose.ui.theme.ComposerConfig
 import io.getstream.chat.android.compose.ui.theme.LocalChatUiConfig
 import io.getstream.chat.android.compose.ui.theme.MessageComposerAttachmentsParams
 import io.getstream.chat.android.compose.ui.theme.MessageComposerEditIndicatorParams
-import io.getstream.chat.android.compose.ui.theme.MessageComposerInputCenterBottomContentParams
+import io.getstream.chat.android.compose.ui.theme.MessageComposerInputBottomContentParams
 import io.getstream.chat.android.compose.ui.theme.MessageComposerInputCenterContentParams
 import io.getstream.chat.android.compose.ui.theme.MessageComposerInputLeadingContentParams
 import io.getstream.chat.android.compose.ui.theme.MessageComposerInputTrailingContentParams
@@ -130,25 +130,26 @@ public fun MessageInput(
                 .minimumInteractiveComponentSize(),
             verticalAlignment = Alignment.Bottom,
         ) {
-            ChatTheme.componentFactory.MessageComposerInputLeadingContent(
-                params = MessageComposerInputLeadingContentParams(
-                    state = messageComposerState,
-                    onActiveCommandDismiss = onActiveCommandDismiss,
-                ),
-            )
-
             val isRecording = messageComposerState.recording !is RecordingState.Idle
             if (!isRecording) {
                 Column(modifier = Modifier.weight(1f)) {
-                    ChatTheme.componentFactory.MessageComposerInputCenterContent(
-                        params = MessageComposerInputCenterContentParams(
-                            modifier = Modifier.fillMaxWidth(),
-                            state = messageComposerState,
-                            onValueChange = onValueChange,
-                        ),
-                    )
-                    ChatTheme.componentFactory.MessageComposerInputCenterBottomContent(
-                        params = MessageComposerInputCenterBottomContentParams(
+                    Row(verticalAlignment = Alignment.Bottom) {
+                        ChatTheme.componentFactory.MessageComposerInputLeadingContent(
+                            params = MessageComposerInputLeadingContentParams(
+                                state = messageComposerState,
+                                onActiveCommandDismiss = onActiveCommandDismiss,
+                            ),
+                        )
+                        ChatTheme.componentFactory.MessageComposerInputCenterContent(
+                            params = MessageComposerInputCenterContentParams(
+                                modifier = Modifier.weight(1f),
+                                state = messageComposerState,
+                                onValueChange = onValueChange,
+                            ),
+                        )
+                    }
+                    ChatTheme.componentFactory.MessageComposerInputBottomContent(
+                        params = MessageComposerInputBottomContentParams(
                             state = messageComposerState,
                             onAlsoSendToChannelChange = onAlsoSendToChannelChange,
                         ),
@@ -346,6 +347,7 @@ internal fun MessageComposerInputThreadModeAlsoSendToChannel() {
             messageMode = MessageMode.MessageThread(
                 parentMessage = PreviewMessageData.message1,
             ),
+            inputValue = "Great, thanks! \uD83D\uDE4C Let me also share it in the channel",
             alsoSendToChannel = true,
         ),
     )
@@ -368,6 +370,26 @@ internal fun MessageComposerInputActiveCommandPlaceholder() {
     )
 }
 
+@Preview
+@Composable
+private fun MessageComposerInputActiveCommandPlaceholderInThreadModePreview() {
+    ChatTheme {
+        MessageComposerInputActiveCommandPlaceholderInThreadMode()
+    }
+}
+
+@Composable
+internal fun MessageComposerInputActiveCommandPlaceholderInThreadMode() {
+    MessageInput(
+        messageComposerState = PreviewMessageComposerState.copy(
+            messageMode = MessageMode.MessageThread(
+                parentMessage = PreviewMessageData.message1,
+            ),
+            activeCommand = PreviewCommandData.command1,
+        ),
+    )
+}
+
 @Preview
 @Composable
 private fun MessageComposerInputActiveCommandFilledPreview() {
@@ -386,6 +408,27 @@ internal fun MessageComposerInputActiveCommandFilled() {
     )
 }
 
+@Preview
+@Composable
+private fun MessageComposerInputActiveCommandFilledInThreadModePreview() {
+    ChatTheme {
+        MessageComposerInputActiveCommandFilledInThreadMode()
+    }
+}
+
+@Composable
+internal fun MessageComposerInputActiveCommandFilledInThreadMode() {
+    MessageInput(
+        messageComposerState = PreviewMessageComposerState.copy(
+            messageMode = MessageMode.MessageThread(
+                parentMessage = PreviewMessageData.message1,
+            ),
+            activeCommand = PreviewCommandData.command1,
+            inputValue = "The Office",
+        ),
+    )
+}
+
 @Preview
 @Composable
 private fun MessageComposerInputAttachmentsPreview() {

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/messages/composer/MessageComposer.kt

@@ -37,6 +37,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Alignment.Companion.Bottom
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.focus.FocusRequester
+import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
@@ -123,7 +124,9 @@ public fun MessageComposer(
 
         ChatTheme.componentFactory.MessageComposerInput(
             params = MessageComposerInputParams(
-                modifier = Modifier.weight(1f),
+                modifier = Modifier
+                    .weight(1f)
+                    .focusRequester(inputFocusRequester),
                 state = state,
                 onInputChanged = onValueChange,
                 onAttachmentRemoved = onAttachmentRemoved,

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/messages/composer/internal/MessageComposerInputCenterBottomContent.kt → stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/messages/composer/internal/MessageComposerInputBottomContent.kt

@@ -35,7 +35,7 @@ import io.getstream.chat.android.compose.ui.theme.ChatTheme
 import io.getstream.chat.android.compose.ui.theme.StreamTokens
 
 @Composable
-internal fun MessageComposerInputCenterBottomContent(
+internal fun MessageComposerInputBottomContent(
     alsoSendToChannel: Boolean,
     onAlsoSendToChannelChange: (Boolean) -> Unit,
     modifier: Modifier = Modifier,
@@ -51,7 +51,7 @@ internal fun MessageComposerInputCenterBottomContent(
             .padding(
                 start = StreamTokens.spacingMd,
                 end = StreamTokens.spacingMd,
-                bottom = StreamTokens.spacingMd,
+                bottom = StreamTokens.spacingSm,
             ),
         verticalAlignment = Alignment.CenterVertically,
         horizontalArrangement = Arrangement.spacedBy(StreamTokens.spacingXs),
@@ -78,7 +78,7 @@ internal fun MessageComposerInputCenterBottomContent(
 @Composable
 private fun SelectedPreview() {
     ChatTheme {
-        MessageComposerInputCenterBottomContent(
+        MessageComposerInputBottomContent(
             alsoSendToChannel = true,
             onAlsoSendToChannelChange = {},
         )
@@ -89,7 +89,7 @@ private fun SelectedPreview() {
 @Composable
 private fun UnselectedPreview() {
     ChatTheme {
-        MessageComposerInputCenterBottomContent(
+        MessageComposerInputBottomContent(
             alsoSendToChannel = false,
             onAlsoSendToChannelChange = {},
         )

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/theme/ChatComponentFactory.kt

@@ -1465,19 +1465,22 @@ public interface ChatComponentFactory {
     }
 
     /**
-     * The default center bottom content of the message composer input.
-     * Shown at the bottom of the composer input.
+     * The default bottom content of the message composer input.
+     * Shown at the bottom of the composer input, below the text field.
      *
      * Used as part of [MessageComposerInput].
      *
      * @param params Parameters for this component.
      */
     @Composable
-    public fun MessageComposerInputCenterBottomContent(params: MessageComposerInputCenterBottomContentParams) {
+    public fun MessageComposerInputBottomContent(params: MessageComposerInputBottomContentParams) {
         val inThreadMode = params.state.messageMode is MessageMode.MessageThread
-        AnimatedContent(targetState = inThreadMode) { visible ->
+        AnimatedContent(
+            modifier = params.modifier,
+            targetState = inThreadMode,
+        ) { visible ->
             if (visible) {
-                io.getstream.chat.android.compose.ui.messages.composer.internal.MessageComposerInputCenterBottomContent(
+                io.getstream.chat.android.compose.ui.messages.composer.internal.MessageComposerInputBottomContent(
                     alsoSendToChannel = params.state.alsoSendToChannel,
                     onAlsoSendToChannelChange = params.onAlsoSendToChannelChange,
                 )

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/theme/ChatComponentFactoryParams.kt

@@ -1115,13 +1115,13 @@ public data class MessageComposerInputCenterContentParams(
 )
 
 /**
- * Parameters for [ChatComponentFactory.MessageComposerInputCenterBottomContent].
+ * Parameters for [ChatComponentFactory.MessageComposerInputBottomContent].
  *
  * @param state The current state of the message composer.
  * @param onAlsoSendToChannelChange Action invoked when also-send-to-channel is changed.
  * @param modifier Modifier for styling.
  */
-public data class MessageComposerInputCenterBottomContentParams(
+public data class MessageComposerInputBottomContentParams(
     val state: MessageComposerState,
     val onAlsoSendToChannelChange: (Boolean) -> Unit,
     val modifier: Modifier = Modifier,