Expose State to be used on Composable functions

stream-chat-android-ai-assistant/src/main/kotlin/io/getstream/chat/android/ai/assistant/AiMessagesScreen.kt

@@ -230,7 +230,7 @@ public fun AiMessagesScreen(
                 }
             },
         ) {
-            val currentState = listViewModel.currentMessagesState
+            val currentState by listViewModel.currentMessagesState
             val state = rememberMessageListState(parentMessageId = currentState.parentMessageId)
 
             LaunchedEffect(key1 = typingState) {

stream-chat-android-compose-sample/src/main/java/io/getstream/chat/android/compose/sample/ui/MessagesActivity.kt

@@ -209,7 +209,8 @@ class MessagesActivity : BaseConnectedActivity() {
     @Composable
     fun MyCustomUi() {
         val isShowingAttachments = attachmentsPickerViewModel.isShowingAttachments
-        val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+        val currentMessagesState by listViewModel.currentMessagesState
+        val selectedMessageState = currentMessagesState.selectedMessageState
         val user by listViewModel.user.collectAsState()
         val lazyListState = rememberMessageListState()
 

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

@@ -4586,7 +4586,7 @@ public final class io/getstream/chat/android/compose/viewmodel/messages/MessageL
 	public static synthetic fun flagUser$default (Lio/getstream/chat/android/compose/viewmodel/messages/MessageListViewModel;Ljava/lang/String;Ljava/lang/String;Ljava/util/Map;ILjava/lang/Object;)V
 	public final fun getChannel ()Lio/getstream/chat/android/models/Channel;
 	public final fun getConnectionState ()Lkotlinx/coroutines/flow/StateFlow;
-	public final fun getCurrentMessagesState ()Lio/getstream/chat/android/ui/common/state/messages/list/MessageListState;
+	public final fun getCurrentMessagesState ()Landroidx/compose/runtime/State;
 	public final fun getDeletedMessageVisibilityState ()Lio/getstream/chat/android/ui/common/state/messages/list/DeletedMessageVisibility;
 	public final fun getMessageActions ()Ljava/util/Set;
 	public final fun getMessageById (Ljava/lang/String;)Lio/getstream/chat/android/models/Message;

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

@@ -224,7 +224,7 @@ public fun MessagesScreen(
                 bottomBarContent()
             },
         ) {
-            val currentState = listViewModel.currentMessagesState
+            val currentState by listViewModel.currentMessagesState
 
             MessageList(
                 modifier = Modifier
@@ -406,7 +406,8 @@ public fun BoxScope.MessageMenus(
     skipPushNotification: Boolean,
     skipEnrichUrl: Boolean,
 ) {
-    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+    val messagesState by listViewModel.currentMessagesState
+    val selectedMessageState = messagesState.selectedMessageState
 
     val selectedMessage = selectedMessageState?.message ?: Message()
 
@@ -730,7 +731,8 @@ public fun MessageModerationDialog(
     skipPushNotification: Boolean,
     skipEnrichUrl: Boolean,
 ) {
-    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+    val currentMessagesState by listViewModel.currentMessagesState
+    val selectedMessageState = currentMessagesState.selectedMessageState
 
     val selectedMessage = selectedMessageState?.message ?: Message()
 

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

@@ -16,7 +16,6 @@
 
 package io.getstream.chat.android.compose.ui.messages.list
 
-import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.BoxScope
@@ -103,7 +102,7 @@ public fun MessageList(
     contentPadding: PaddingValues = PaddingValues(vertical = 16.dp),
     messageContentFactory: MessageContentFactory = ChatTheme.messageContentFactory,
     messagesLazyListState: MessagesLazyListState =
-        rememberMessageListState(parentMessageId = viewModel.currentMessagesState.parentMessageId),
+        rememberMessageListState(parentMessageId = viewModel.currentMessagesState.value.parentMessageId),
     verticalArrangement: Arrangement.Vertical = Arrangement.Top,
     threadsVerticalArrangement: Arrangement.Vertical = Arrangement.Bottom,
     threadMessagesStart: ThreadMessagesStart? = null,
@@ -178,7 +177,7 @@ public fun MessageList(
     helperContent: @Composable BoxScope.() -> Unit = {
         with(ChatTheme.componentFactory) {
             MessageListHelperContent(
-                messageListState = viewModel.currentMessagesState,
+                messageListState = viewModel.currentMessagesState.value,
                 messagesLazyListState = messagesLazyListState,
                 onScrollToBottomClick = onScrollToBottomClicked,
             )
@@ -220,7 +219,7 @@ public fun MessageList(
         modifier = modifier,
         messageContentFactory = messageContentFactory,
         contentPadding = contentPadding,
-        currentState = viewModel.currentMessagesState,
+        currentState = viewModel.currentMessagesState.value,
         messagesLazyListState = messagesLazyListState,
         onMessagesPageStartReached = onMessagesPageStartReached,
         verticalArrangement = verticalArrangement,

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/viewmodel/messages/MessageListViewModel.kt

@@ -16,6 +16,7 @@
 
 package io.getstream.chat.android.compose.viewmodel.messages
 
+import androidx.compose.runtime.State
 import androidx.compose.runtime.getValue
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewModelScope
@@ -44,6 +45,7 @@ import io.getstream.chat.android.ui.common.state.messages.poll.SelectedPoll
 import io.getstream.log.taggedLogger
 import kotlinx.coroutines.flow.Flow
 import kotlinx.coroutines.flow.StateFlow
+import kotlinx.coroutines.flow.combine
 import kotlinx.coroutines.flow.map
 import kotlinx.coroutines.launch
 
@@ -62,22 +64,12 @@ public class MessageListViewModel(
     /**
      * State handler for the UI, which holds all the information the UI needs to render messages.
      *
-     * It chooses between [threadMessagesState] and [messagesState] based on if we're in a thread or not.
+     * It chooses between threadListState and messageListState based on if we're in a thread or not.
      */
-    public val currentMessagesState: MessageListState
-        get() = if (isInThread) threadMessagesState else messagesState
-
-    /**
-     * State of the screen, for [MessageMode.Normal].
-     */
-    private val messagesState: MessageListState by messageListController.messageListState
-        .map { it.copy(messageItems = it.messageItems.reversed()) }
-        .asState(viewModelScope, MessageListState())
-
-    /**
-     * State of the screen, for [MessageMode.MessageThread].
-     */
-    private val threadMessagesState: MessageListState by messageListController.threadListState
+    public val currentMessagesState: State<MessageListState> = combine(
+        messageListController.messageListState,
+        messageListController.threadListState,
+    ) { messageListState, threadListState -> if (isInThread) threadListState else messageListState }
         .map { it.copy(messageItems = it.messageItems.reversed()) }
         .asState(viewModelScope, MessageListState())
 
@@ -122,7 +114,7 @@ public class MessageListViewModel(
      * Gives us information if we have selected a message.
      */
     public val isShowingOverlay: Boolean
-        get() = currentMessagesState.selectedMessageState != null
+        get() = currentMessagesState.value.selectedMessageState != null
 
     /**
      * Whether is the poll option details should be shown or not.

stream-chat-android-compose/src/test/kotlin/io/getstream/chat/android/compose/viewmodel/messages/MessageListViewModelTest.kt

@@ -69,7 +69,7 @@ internal class MessageListViewModelTest {
             .get()
 
         // Avoid counting date separators
-        val messageItemCount = viewModel.currentMessagesState
+        val messageItemCount = viewModel.currentMessagesState.value
             .messageItems
             .count { it is MessageItemState }
         messageItemCount `should be equal to` 2
@@ -86,7 +86,7 @@ internal class MessageListViewModelTest {
 
         viewModel.selectMessage(message1)
 
-        val selectedMessageState = viewModel.currentMessagesState.selectedMessageState
+        val selectedMessageState = viewModel.currentMessagesState.value.selectedMessageState
         selectedMessageState `should not be` null
         selectedMessageState?.message `should be equal to` message1
         viewModel.isShowingOverlay `should be equal to` true
@@ -104,7 +104,7 @@ internal class MessageListViewModelTest {
             .get()
 
         // Avoid counting date separators
-        val messageItemCount = viewModel.currentMessagesState
+        val messageItemCount = viewModel.currentMessagesState.value
             .messageItems
             .count { it is MessageItemState }
         messageItemCount `should be equal to` 2

stream-chat-android-docs/src/main/kotlin/io/getstream/chat/docs/kotlin/compose/messages/MessageList.kt

@@ -126,7 +126,7 @@ private object MessageListControllingScrollStateSnippet {
             setContent {
                 ChatTheme {
                     val state = listViewModel.currentMessagesState
-                    val myListState = rememberMessageListState(parentMessageId = state.parentMessageId)
+                    val myListState = rememberMessageListState(parentMessageId = state.value.parentMessageId)
 
                     MessageList(
                         viewModel = listViewModel,

stream-chat-android-docs/src/main/kotlin/io/getstream/chat/docs/kotlin/compose/messages/ReactionsPicker.kt

@@ -15,6 +15,7 @@ import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
@@ -45,7 +46,8 @@ private object ReactionsPickerUsageSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
 
                     Box(modifier = Modifier.fillMaxSize()) {
 
@@ -96,7 +98,8 @@ private object ReactionsPickerHandlingActionsSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
 
                     Box(modifier = Modifier.fillMaxSize()) {
 
@@ -148,7 +151,8 @@ private object ReactionsPickerCustomizationSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
 
                     Box(modifier = Modifier.fillMaxSize()) {
 

stream-chat-android-docs/src/main/kotlin/io/getstream/chat/docs/kotlin/compose/messages/SelectedMessageMenu.kt

@@ -45,7 +45,8 @@ private object SelectedMessageMenuUsageSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
                     val user by listViewModel.user.collectAsState()
 
                     Box(modifier = Modifier.fillMaxSize()) {
@@ -105,7 +106,8 @@ private object SelectedMessageMenuHandlingActionsSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
                     val user by listViewModel.user.collectAsState()
 
                     Box(modifier = Modifier.fillMaxSize()) {
@@ -164,7 +166,8 @@ private object SelectedMessageMenuCustomizationSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
                     val user by listViewModel.user.collectAsState()
 
                     Box(modifier = Modifier.fillMaxSize()) {

stream-chat-android-docs/src/main/kotlin/io/getstream/chat/docs/kotlin/compose/messages/SelectedReactionsMenu.kt

@@ -44,7 +44,8 @@ private object SelectedReactionsMenuUsageSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
                     val user by listViewModel.user.collectAsState()
 
                     Box(modifier = Modifier.fillMaxSize()) {
@@ -100,7 +101,8 @@ private object SelectedReactionsMenuHandlingActionsSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
                     val user by listViewModel.user.collectAsState()
 
                     Box(modifier = Modifier.fillMaxSize()) {
@@ -154,7 +156,8 @@ private object SelectedReactionsMenuCustomizationSnippet {
 
             setContent {
                 ChatTheme {
-                    val selectedMessageState = listViewModel.currentMessagesState.selectedMessageState
+                    val currentMessagesState by listViewModel.currentMessagesState
+                    val selectedMessageState = currentMessagesState.selectedMessageState
                     val user by listViewModel.user.collectAsState()
 
                     Box(modifier = Modifier.fillMaxSize()) {