Align shared header divider and height across screens (#6412)

* Replace header/composer dropshadow with borderCoreSubtle divider

ChannelHeader (used by message view + thread view) and MessageComposer
(non-floating mode) now draw a 1.dp border/core/subtle divider at the
boundary with the adjacent surface, matching the Figma "Mobile / Message
List" tokens. ListHeader (used by Channel List + Thread List) is updated
from borderCoreDefault to borderCoreSubtle for a single divider treatment
across all four screens, fulfilling the ticket's "consistent across the
app" goal.

Snapshot baselines refreshed for ChannelHeaderTest, MessageComposerTest,
ChannelListHeaderTest, and ThreadListHeaderTest.

* Standardise message-view header min-height with list screens

The default top-bar wired by ChannelScreen constrained ChannelHeader to a
hardcoded 56.dp, while ListHeader (used by Channel List and Thread List)
renders intrinsically taller (avatar 48.dp + 12.dp top + 12.dp bottom =
72.dp). The mismatch caused the layout to jump when navigating between
list screens and the message/thread view.

Replace the rigid Modifier.height(56.dp) with
Modifier.defaultMinSize(minHeight = 72.dp) so the message-view header
matches the list-header height while still letting custom leading
content (e.g. a back arrow that's larger than 48.dp) drive a taller
header if needed.

* Extract HeaderScaffold from ListHeader; compose ChannelHeader on top

Renames the internal ListHeader composable to HeaderScaffold and lifts the
shared header chrome (Surface + inset row + bottom divider) into a single
building block. ChannelHeader, ChannelListHeader, and ThreadListHeader all
delegate the chrome to HeaderScaffold and only own their domain slots.

Drops the unused color/shape/elevation parameters from the previous
ListHeader signature; both list-header callers used the defaults. Bakes the
design-system padding (spacingSm) and inter-slot gap (spacingXs) into
HeaderScaffold so the four screen-level headers can no longer drift apart on
those values.

ChannelHeader's Row gains 4.dp horizontal padding and an 8.dp inter-slot
gap, matching what the list headers already used. Snapshot baselines for
ChannelHeaderTest re-recorded.

Author: andremion

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

@@ -6181,8 +6181,8 @@ public final class io/getstream/chat/android/compose/ui/threads/ComposableSingle
 public final class io/getstream/chat/android/compose/ui/threads/ComposableSingletons$ThreadListHeaderKt {
 	public static final field INSTANCE Lio/getstream/chat/android/compose/ui/threads/ComposableSingletons$ThreadListHeaderKt;
 	public fun <init> ()V
+	public final fun getLambda$-1025604936$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function3;
 	public final fun getLambda$-798078767$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
-	public final fun getLambda$1850390573$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function3;
 	public final fun getLambda$381085544$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
 }
 

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/channels/header/ChannelListHeader.kt

@@ -25,7 +25,7 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import io.getstream.chat.android.compose.R
-import io.getstream.chat.android.compose.ui.components.ListHeader
+import io.getstream.chat.android.compose.ui.components.HeaderScaffold
 import io.getstream.chat.android.compose.ui.components.button.StreamButton
 import io.getstream.chat.android.compose.ui.theme.ChannelListHeaderCenterContentParams
 import io.getstream.chat.android.compose.ui.theme.ChannelListHeaderLeadingContentParams
@@ -91,7 +91,7 @@ public fun ChannelListHeader(
         }
     },
 ) {
-    ListHeader(
+    HeaderScaffold(
         modifier = modifier,
         leadingContent = leadingContent,
         centerContent = centerContent,

…roid/compose/ui/components/ListHeader.kt …/compose/ui/components/HeaderScaffold.ktstream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/components/ListHeader.kt renamed to stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/components/HeaderScaffold.kt stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/components/ListHeader.kt renamed to stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/components/HeaderScaffold.kt

@@ -34,12 +34,8 @@ import androidx.compose.runtime.Composable
 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.RectangleShape
-import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import io.getstream.chat.android.compose.R
 import io.getstream.chat.android.compose.ui.components.avatar.AvatarSize
@@ -51,36 +47,28 @@ import io.getstream.chat.android.models.ConnectionState
 import io.getstream.chat.android.models.User
 
 /**
- * Common header layout.
+ * Three-slot header layout with leading, center, and trailing slots laid out horizontally and a
+ * bottom divider.
  *
  * @param modifier Modifier for styling.
- * @param color The background color of the header.
- * @param shape The shape of the header.
- * @param elevation The elevation of the header.
- * @param leadingContent Composable for the leading slot (e.g. user avatar).
- * @param centerContent Composable for the center slot (e.g. title or loading indicator).
- * @param trailingContent Composable for the trailing slot (e.g. action button or spacer).
+ * @param leadingContent Slot rendered at the start of the row (e.g. avatar, back button).
+ * @param centerContent Slot rendered in the center of the row (e.g. title, loading indicator).
+ * @param trailingContent Slot rendered at the end of the row (e.g. action button, channel avatar).
  */
 @Composable
-internal fun ListHeader(
+internal fun HeaderScaffold(
     modifier: Modifier = Modifier,
-    color: Color = ChatTheme.colors.backgroundCoreElevation1,
-    shape: Shape = RectangleShape,
-    elevation: Dp = 0.dp,
     leadingContent: @Composable RowScope.() -> Unit,
     centerContent: @Composable RowScope.() -> Unit,
     trailingContent: @Composable RowScope.() -> Unit,
 ) {
     Surface(
-        modifier = modifier
-            .fillMaxWidth(),
-        shadowElevation = elevation,
-        color = color,
-        shape = shape,
+        modifier = modifier.fillMaxWidth(),
+        color = ChatTheme.colors.backgroundCoreElevation1,
     ) {
         Column {
             Row(
-                Modifier
+                modifier = Modifier
                     .fillMaxWidth()
                     .padding(StreamTokens.spacingSm),
                 verticalAlignment = Alignment.CenterVertically,
@@ -94,15 +82,15 @@ internal fun ListHeader(
             }
             HorizontalDivider(
                 thickness = 1.dp,
-                color = ChatTheme.colors.borderCoreDefault,
+                color = ChatTheme.colors.borderCoreSubtle,
             )
         }
     }
 }
 
 /**
- * Default leading content for a [ListHeader].
- * Shows the user avatar if available, otherwise a spacer to preserve alignment.
+ * Default list-header leading content. Shows the user avatar if available, otherwise a spacer to
+ * preserve alignment.
  *
  * @param currentUser The currently logged in user.
  * @param onAvatarClick Action invoked when the avatar is clicked.
@@ -135,8 +123,8 @@ internal fun DefaultListHeaderLeadingContent(
 }
 
 /**
- * Default center content for a [ListHeader].
- * Shows a title when connected, a loading indicator when connecting, or "Disconnected" when offline.
+ * Default list-header center content. Shows a title when connected, a loading indicator when
+ * connecting, or "Disconnected" when offline.
  *
  * @param connectionState The state of WebSocket connection.
  * @param title The title to show.

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

@@ -25,9 +25,9 @@ import androidx.compose.foundation.layout.BoxScope
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.consumeWindowInsets
+import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.ime
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.safeDrawingPadding
@@ -349,7 +349,7 @@ internal fun DefaultTopBarContent(
             onBackPressed = backAction,
             onHeaderTitleClick = onHeaderTitleClick,
             onChannelAvatarClick = onChannelAvatarClick,
-            modifier = Modifier.height(56.dp),
+            modifier = Modifier.defaultMinSize(minHeight = 72.dp),
         ),
     )
 }

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

@@ -25,6 +25,7 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.SnackbarDuration
 import androidx.compose.material3.SnackbarHostState
 import androidx.compose.material3.Surface
@@ -374,10 +375,13 @@ private fun MessageComposerSurface(
     } else {
         Surface(
             modifier = modifier,
-            shadowElevation = 24.dp,
             color = ChatTheme.colors.backgroundCoreElevation1,
         ) {
             Column(modifier = Modifier.animateContentSize(alignment = Alignment.BottomCenter)) {
+                HorizontalDivider(
+                    thickness = 1.dp,
+                    color = ChatTheme.colors.borderCoreSubtle,
+                )
                 content()
             }
         }

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/messages/header/ChannelHeader.kt

@@ -19,14 +19,11 @@ package io.getstream.chat.android.compose.ui.messages.header
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.IntrinsicSize
-import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.wrapContentHeight
-import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -40,13 +37,13 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.getstream.chat.android.compose.R
 import io.getstream.chat.android.compose.ui.components.BackButton
+import io.getstream.chat.android.compose.ui.components.HeaderScaffold
 import io.getstream.chat.android.compose.ui.components.NetworkLoadingIndicator
 import io.getstream.chat.android.compose.ui.theme.ChannelAvatarParams
 import io.getstream.chat.android.compose.ui.theme.ChannelHeaderCenterContentParams
 import io.getstream.chat.android.compose.ui.theme.ChannelHeaderLeadingContentParams
 import io.getstream.chat.android.compose.ui.theme.ChannelHeaderTrailingContentParams
 import io.getstream.chat.android.compose.ui.theme.ChatTheme
-import io.getstream.chat.android.compose.ui.theme.StreamTokens
 import io.getstream.chat.android.compose.ui.util.clickable
 import io.getstream.chat.android.compose.ui.util.getMembersStatusText
 import io.getstream.chat.android.compose.ui.util.ifNotNull
@@ -123,24 +120,12 @@ public fun ChannelHeader(
         }
     },
 ) {
-    Surface(
-        modifier = modifier.fillMaxWidth(),
-        shadowElevation = StreamTokens.elevation3,
-        color = ChatTheme.colors.backgroundCoreElevation1,
-    ) {
-        Row(
-            modifier = Modifier
-                .fillMaxWidth()
-                .padding(8.dp),
-            verticalAlignment = Alignment.CenterVertically,
-        ) {
-            leadingContent()
-
-            centerContent()
-
-            trailingContent()
-        }
-    }
+    HeaderScaffold(
+        modifier = modifier,
+        leadingContent = leadingContent,
+        centerContent = centerContent,
+        trailingContent = trailingContent,
+    )
 }
 
 /**

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/threads/ThreadListHeader.kt

@@ -25,7 +25,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import io.getstream.chat.android.compose.R
 import io.getstream.chat.android.compose.ui.components.DefaultListHeaderCenterContent
 import io.getstream.chat.android.compose.ui.components.DefaultListHeaderLeadingContent
-import io.getstream.chat.android.compose.ui.components.ListHeader
+import io.getstream.chat.android.compose.ui.components.HeaderScaffold
 import io.getstream.chat.android.compose.ui.components.avatar.AvatarSize
 import io.getstream.chat.android.compose.ui.theme.ChatTheme
 import io.getstream.chat.android.models.ConnectionState
@@ -50,7 +50,7 @@ public fun ThreadListHeader(
     connectionState: ConnectionState = ConnectionState.Connected,
     onAvatarClick: (User?) -> Unit = {},
 ) {
-    ListHeader(
+    HeaderScaffold(
         modifier = modifier,
         leadingContent = {
             DefaultListHeaderLeadingContent(