Try splitting messages into api and impl modules

features/messages/impl/src/androidTest/kotlin/io/element/android/features/messages/ExampleInstrumentedTest.kt

@@ -0,0 +1,38 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages
+
+import androidx.test.ext.junit.runners.AndroidJUnit4
+import androidx.test.platform.app.InstrumentationRegistry
+import org.junit.Assert.assertEquals
+import org.junit.Test
+import org.junit.runner.RunWith
+
+/**
+ * Instrumented test, which will execute on an Android device.
+ *
+ * See [testing documentation](http://d.android.com/tools/testing).
+ */
+@RunWith(AndroidJUnit4::class)
+class ExampleInstrumentedTest {
+    @Test
+    fun useAppContext() {
+        // Context of the app under test.
+        val appContext = InstrumentationRegistry.getInstrumentation().targetContext
+        assertEquals("io.element.android.features.messages.test", appContext.packageName)
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/DefaultMessagesEntryPoint.kt

@@ -0,0 +1,33 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl
+
+import com.bumble.appyx.core.modality.BuildContext
+import com.bumble.appyx.core.node.Node
+import com.bumble.appyx.core.plugin.Plugin
+import com.squareup.anvil.annotations.ContributesBinding
+import io.element.android.features.messages.api.MessagesEntryPoint
+import io.element.android.libraries.architecture.createNode
+import io.element.android.libraries.di.AppScope
+import javax.inject.Inject
+
+@ContributesBinding(AppScope::class)
+class DefaultMessagesEntryPoint @Inject constructor() : MessagesEntryPoint {
+    override fun node(parentNode: Node, buildContext: BuildContext, plugins: List<Plugin>): Node {
+        return parentNode.createNode<MessagesNode>(buildContext, plugins)
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesEvents.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl
+
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+
+sealed interface MessagesEvents {
+    data class HandleAction(val action: TimelineItemAction, val event: TimelineItem.Event) : MessagesEvents
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesNode.kt

@@ -0,0 +1,45 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import com.bumble.appyx.core.modality.BuildContext
+import com.bumble.appyx.core.node.Node
+import com.bumble.appyx.core.plugin.Plugin
+import dagger.assisted.Assisted
+import dagger.assisted.AssistedInject
+import io.element.android.anvilannotations.ContributesNode
+import io.element.android.libraries.di.RoomScope
+
+@ContributesNode(RoomScope::class)
+class MessagesNode @AssistedInject constructor(
+    @Assisted buildContext: BuildContext,
+    @Assisted plugins: List<Plugin>,
+    private val presenter: MessagesPresenter,
+) : Node(buildContext, plugins = plugins) {
+
+    @Composable
+    override fun View(modifier: Modifier) {
+        val state = presenter.present()
+        MessagesView(
+            state = state,
+            onBackPressed = this::navigateUp,
+            modifier = modifier
+        )
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesPresenter.kt

@@ -0,0 +1,137 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.saveable.rememberSaveable
+import io.element.android.features.messages.impl.actionlist.ActionListPresenter
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.impl.textcomposer.MessageComposerEvents
+import io.element.android.features.messages.impl.textcomposer.MessageComposerPresenter
+import io.element.android.features.messages.impl.textcomposer.MessageComposerState
+import io.element.android.features.messages.impl.timeline.TimelineEvents
+import io.element.android.features.messages.impl.timeline.TimelinePresenter
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextBasedContent
+import io.element.android.libraries.architecture.Presenter
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.designsystem.components.avatar.AvatarSize
+import io.element.android.libraries.matrix.room.MatrixRoom
+import io.element.android.libraries.textcomposer.MessageComposerMode
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.launch
+import timber.log.Timber
+import javax.inject.Inject
+
+class MessagesPresenter @Inject constructor(
+    private val room: MatrixRoom,
+    private val composerPresenter: MessageComposerPresenter,
+    private val timelinePresenter: TimelinePresenter,
+    private val actionListPresenter: ActionListPresenter,
+) : Presenter<MessagesState> {
+
+    @Composable
+    override fun present(): MessagesState {
+        val localCoroutineScope = rememberCoroutineScope()
+        val composerState = composerPresenter.present()
+        val timelineState = timelinePresenter.present()
+        val actionListState = actionListPresenter.present()
+
+        val syncUpdateFlow = room.syncUpdateFlow().collectAsState(0L)
+        val roomName: MutableState<String?> = rememberSaveable {
+            mutableStateOf(null)
+        }
+        val roomAvatar: MutableState<AvatarData?> = remember {
+            mutableStateOf(null)
+        }
+        LaunchedEffect(syncUpdateFlow) {
+            roomAvatar.value =
+                AvatarData(
+                    id = room.roomId.value,
+                    name = room.name,
+                    url = room.avatarUrl,
+                    size = AvatarSize.SMALL
+                )
+            roomName.value = room.name
+        }
+        LaunchedEffect(composerState.mode.relatedEventId) {
+            timelineState.eventSink(TimelineEvents.SetHighlightedEvent(composerState.mode.relatedEventId))
+        }
+        fun handleEvents(event: MessagesEvents) {
+            when (event) {
+                is MessagesEvents.HandleAction -> localCoroutineScope.handleTimelineAction(event.action, event.event, composerState)
+            }
+        }
+        return MessagesState(
+            roomId = room.roomId,
+            roomName = roomName.value,
+            roomAvatar = roomAvatar.value,
+            composerState = composerState,
+            timelineState = timelineState,
+            actionListState = actionListState,
+            eventSink = ::handleEvents
+        )
+    }
+
+    fun CoroutineScope.handleTimelineAction(
+        action: TimelineItemAction,
+        targetEvent: TimelineItem.Event,
+        composerState: MessageComposerState,
+    ) = launch {
+        when (action) {
+            TimelineItemAction.Copy -> notImplementedYet()
+            TimelineItemAction.Forward -> notImplementedYet()
+            TimelineItemAction.Redact -> handleActionRedact(targetEvent)
+            TimelineItemAction.Edit -> handleActionEdit(targetEvent, composerState)
+            TimelineItemAction.Reply -> handleActionReply(targetEvent, composerState)
+        }
+    }
+
+    private fun notImplementedYet() {
+        Timber.v("NotImplementedYet")
+    }
+
+    private suspend fun handleActionRedact(event: TimelineItem.Event) {
+        if (event.eventId == null) return
+        room.redactEvent(event.eventId)
+    }
+
+    private fun handleActionEdit(targetEvent: TimelineItem.Event, composerState: MessageComposerState) {
+        if (targetEvent.eventId == null) return
+        val composerMode = MessageComposerMode.Edit(
+            targetEvent.eventId,
+            (targetEvent.content as? TimelineItemTextBasedContent)?.body.orEmpty()
+        )
+        composerState.eventSink(
+            MessageComposerEvents.SetMode(composerMode)
+        )
+    }
+
+    private fun handleActionReply(targetEvent: TimelineItem.Event, composerState: MessageComposerState) {
+        if (targetEvent.eventId == null) return
+        val composerMode = MessageComposerMode.Reply(targetEvent.safeSenderName, targetEvent.eventId, "")
+        composerState.eventSink(
+            MessageComposerEvents.SetMode(composerMode)
+        )
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesState.kt

@@ -0,0 +1,35 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl
+
+import androidx.compose.runtime.Immutable
+import io.element.android.features.messages.impl.actionlist.ActionListState
+import io.element.android.features.messages.impl.textcomposer.MessageComposerState
+import io.element.android.features.messages.impl.timeline.TimelineState
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.matrix.core.RoomId
+
+@Immutable
+data class MessagesState(
+    val roomId: RoomId,
+    val roomName: String?,
+    val roomAvatar: AvatarData?,
+    val composerState: MessageComposerState,
+    val timelineState: TimelineState,
+    val actionListState: ActionListState,
+    val eventSink: (MessagesEvents) -> Unit
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesStateProvider.kt

@@ -0,0 +1,51 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+import io.element.android.features.messages.impl.actionlist.anActionListState
+import io.element.android.features.messages.impl.textcomposer.aMessageComposerState
+import io.element.android.features.messages.impl.timeline.aTimelineItemContent
+import io.element.android.features.messages.impl.timeline.aTimelineItemList
+import io.element.android.features.messages.impl.timeline.aTimelineState
+import io.element.android.libraries.core.data.StableCharSequence
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.matrix.core.RoomId
+import io.element.android.libraries.textcomposer.MessageComposerMode
+
+open class MessagesStateProvider : PreviewParameterProvider<MessagesState> {
+    override val values: Sequence<MessagesState>
+        get() = sequenceOf(
+            aMessagesState(),
+        )
+}
+
+fun aMessagesState() = MessagesState(
+    roomId = RoomId("!id"),
+    roomName = "Room name",
+    roomAvatar = AvatarData("!id", "Room name"),
+    composerState = aMessageComposerState().copy(
+        text = StableCharSequence("Hello"),
+        isFullScreen = false,
+        mode = MessageComposerMode.Normal("Hello"),
+    ),
+    timelineState = aTimelineState().copy(
+        timelineItems = aTimelineItemList(aTimelineItemContent()),
+    ),
+    actionListState = anActionListState(),
+    eventSink = {}
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesView.kt

@@ -0,0 +1,220 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@file:OptIn(
+    ExperimentalMaterial3Api::class,
+    ExperimentalMaterialApi::class, ExperimentalMaterial3Api::class,
+)
+
+package io.element.android.features.messages.impl
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.imePadding
+import androidx.compose.foundation.layout.navigationBarsPadding
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.statusBars
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.material.ExperimentalMaterialApi
+import androidx.compose.material.ModalBottomSheetValue
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.ArrowBack
+import androidx.compose.material.rememberModalBottomSheetState
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.SnackbarHost
+import androidx.compose.material3.SnackbarHostState
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalFocusManager
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import io.element.android.features.messages.impl.actionlist.ActionListEvents
+import io.element.android.features.messages.impl.actionlist.ActionListView
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.impl.textcomposer.MessageComposerView
+import io.element.android.features.messages.impl.timeline.TimelineView
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.libraries.designsystem.components.avatar.Avatar
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.components.Icon
+import io.element.android.libraries.designsystem.theme.components.IconButton
+import io.element.android.libraries.designsystem.theme.components.Scaffold
+import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.LogCompositions
+import kotlinx.coroutines.launch
+import timber.log.Timber
+
+@Composable
+fun MessagesView(
+    state: MessagesState,
+    modifier: Modifier = Modifier,
+    onBackPressed: () -> Unit = {},
+) {
+    LogCompositions(tag = "MessagesScreen", msg = "Root")
+    val itemActionsBottomSheetState = rememberModalBottomSheetState(
+        initialValue = ModalBottomSheetValue.Hidden,
+    )
+    val snackbarHostState = remember { SnackbarHostState() }
+    val focusManager = LocalFocusManager.current
+    val coroutineScope = rememberCoroutineScope()
+
+    LogCompositions(tag = "MessagesScreen", msg = "Content")
+
+    fun onMessageClicked(event: TimelineItem.Event) {
+        Timber.v("OnMessageClicked= ${event.id}")
+    }
+
+    fun onMessageLongClicked(event: TimelineItem.Event) {
+        Timber.v("OnMessageLongClicked= ${event.id}")
+        focusManager.clearFocus(force = true)
+        state.actionListState.eventSink(ActionListEvents.ComputeForMessage(event))
+        coroutineScope.launch {
+            itemActionsBottomSheetState.show()
+        }
+    }
+
+    fun onActionSelected(action: TimelineItemAction, event: TimelineItem.Event) {
+        state.eventSink(MessagesEvents.HandleAction(action, event))
+    }
+
+    Scaffold(
+        modifier = modifier,
+        contentWindowInsets = WindowInsets.statusBars,
+        topBar = {
+            MessagesViewTopBar(
+                roomTitle = state.roomName,
+                roomAvatar = state.roomAvatar,
+                onBackPressed = onBackPressed
+            )
+        },
+        content = { padding ->
+            MessagesViewContent(
+                state = state,
+                modifier = Modifier.padding(padding),
+                onMessageClicked = ::onMessageClicked,
+                onMessageLongClicked = ::onMessageLongClicked
+            )
+        },
+        snackbarHost = {
+            SnackbarHost(
+                snackbarHostState,
+                modifier = Modifier.navigationBarsPadding()
+            )
+        },
+    )
+
+    ActionListView(
+        state = state.actionListState,
+        modalBottomSheetState = itemActionsBottomSheetState,
+        onActionSelected = ::onActionSelected
+    )
+}
+
+@Composable
+fun MessagesViewContent(
+    state: MessagesState,
+    modifier: Modifier = Modifier,
+    onMessageClicked: (TimelineItem.Event) -> Unit = {},
+    onMessageLongClicked: (TimelineItem.Event) -> Unit = {},
+) {
+    Column(
+        modifier = modifier
+            .fillMaxSize()
+            .navigationBarsPadding()
+            .imePadding()
+    ) {
+        // Hide timeline if composer is full screen
+        if (!state.composerState.isFullScreen) {
+            TimelineView(
+                state = state.timelineState,
+                modifier = Modifier.weight(1f),
+                onMessageClicked = onMessageClicked,
+                onMessageLongClicked = onMessageLongClicked
+            )
+        }
+        MessageComposerView(
+            state = state.composerState,
+            modifier = Modifier
+                .fillMaxWidth()
+                .wrapContentHeight(Alignment.Bottom)
+        )
+    }
+}
+
+@Composable
+fun MessagesViewTopBar(
+    roomTitle: String?,
+    roomAvatar: AvatarData?,
+    modifier: Modifier = Modifier,
+    onBackPressed: () -> Unit = {},
+) {
+    TopAppBar(
+        modifier = modifier,
+        navigationIcon = {
+            IconButton(onClick = onBackPressed) {
+                Icon(
+                    imageVector = Icons.Filled.ArrowBack,
+                    contentDescription = "Back"
+                )
+            }
+        },
+        title = {
+            Row(verticalAlignment = Alignment.CenterVertically) {
+                if (roomAvatar != null) {
+                    Avatar(roomAvatar)
+                    Spacer(modifier = Modifier.width(8.dp))
+                }
+                Text(
+                    fontSize = 16.sp,
+                    fontWeight = FontWeight.SemiBold,
+                    text = roomTitle ?: "Unknown room",
+                    maxLines = 1,
+                    overflow = TextOverflow.Ellipsis
+                )
+            }
+        }
+    )
+}
+
+@Preview
+@Composable
+internal fun MessagesViewLightPreview(@PreviewParameter(MessagesStateProvider::class) state: MessagesState) =
+    ElementPreviewLight { ContentToPreview(state) }
+
+@Preview
+@Composable
+internal fun MessagesViewDarkPreview(@PreviewParameter(MessagesStateProvider::class) state: MessagesState) =
+    ElementPreviewDark { ContentToPreview(state) }
+
+@Composable
+private fun ContentToPreview(state: MessagesState) {
+    MessagesView(state)
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListEvents.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.actionlist
+
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+
+sealed interface ActionListEvents {
+    object Clear : ActionListEvents
+    data class ComputeForMessage(val event: TimelineItem.Event) : ActionListEvents
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListPresenter.kt

@@ -0,0 +1,75 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.actionlist
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemRedactedContent
+import io.element.android.libraries.architecture.Presenter
+import kotlinx.collections.immutable.toImmutableList
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.launch
+import javax.inject.Inject
+
+class ActionListPresenter @Inject constructor() : Presenter<ActionListState> {
+
+    @Composable
+    override fun present(): ActionListState {
+        val localCoroutineScope = rememberCoroutineScope()
+
+        val target: MutableState<ActionListState.Target> = remember {
+            mutableStateOf(ActionListState.Target.None)
+        }
+
+        fun handleEvents(event: ActionListEvents) {
+            when (event) {
+                ActionListEvents.Clear -> target.value = ActionListState.Target.None
+                is ActionListEvents.ComputeForMessage -> localCoroutineScope.computeForMessage(event.event, target)
+            }
+        }
+
+        return ActionListState(
+            target = target.value,
+            eventSink = ::handleEvents
+        )
+    }
+
+    fun CoroutineScope.computeForMessage(timelineItem: TimelineItem.Event, target: MutableState<ActionListState.Target>) = launch {
+        target.value = ActionListState.Target.Loading(timelineItem)
+        val actions =
+            if (timelineItem.content is TimelineItemRedactedContent) {
+                emptyList()
+            } else {
+                mutableListOf(
+                    TimelineItemAction.Reply,
+                    TimelineItemAction.Forward,
+                    TimelineItemAction.Copy,
+                ).also {
+                    if (timelineItem.isMine) {
+                        it.add(TimelineItemAction.Edit)
+                        it.add(TimelineItemAction.Redact)
+                    }
+                }
+            }
+        target.value = ActionListState.Target.Success(timelineItem, actions.toImmutableList())
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListState.kt

@@ -0,0 +1,37 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.actionlist
+
+import androidx.compose.runtime.Immutable
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import kotlinx.collections.immutable.ImmutableList
+
+@Immutable
+data class ActionListState(
+    val target: Target,
+    val eventSink: (ActionListEvents) -> Unit,
+) {
+    sealed interface Target {
+        object None : Target
+        data class Loading(val event: TimelineItem.Event) : Target
+        data class Success(
+            val event: TimelineItem.Event,
+            val actions: ImmutableList<TimelineItemAction>,
+        ) : Target
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListStateProvider.kt

@@ -0,0 +1,47 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.actionlist
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.impl.timeline.aTimelineItemEvent
+import kotlinx.collections.immutable.persistentListOf
+
+open class ActionListStateProvider : PreviewParameterProvider<ActionListState> {
+    override val values: Sequence<ActionListState>
+        get() = sequenceOf(
+            anActionListState(),
+            anActionListState().copy(target = ActionListState.Target.Loading(aTimelineItemEvent())),
+            anActionListState().copy(
+                target = ActionListState.Target.Success(
+                    event = aTimelineItemEvent(),
+                    actions = persistentListOf(
+                        TimelineItemAction.Reply,
+                        TimelineItemAction.Forward,
+                        TimelineItemAction.Copy,
+                        TimelineItemAction.Edit,
+                        TimelineItemAction.Redact,
+                    )
+                )
+            )
+        )
+}
+
+fun anActionListState() = ActionListState(
+    target = ActionListState.Target.None,
+    eventSink = {}
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListView.kt

@@ -0,0 +1,150 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@file:OptIn(ExperimentalMaterialApi::class)
+
+package io.element.android.features.messages.impl.actionlist
+
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.imePadding
+import androidx.compose.foundation.layout.navigationBarsPadding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material.ExperimentalMaterialApi
+import androidx.compose.material.ListItem
+import androidx.compose.material.ModalBottomSheetState
+import androidx.compose.material.ModalBottomSheetValue
+import androidx.compose.material.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.snapshotFlow
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.components.Icon
+import io.element.android.libraries.designsystem.theme.components.ModalBottomSheetLayout
+import kotlinx.coroutines.flow.filter
+import kotlinx.coroutines.launch
+
+@Composable
+fun ActionListView(
+    state: ActionListState,
+    modalBottomSheetState: ModalBottomSheetState,
+    onActionSelected: (action: TimelineItemAction, TimelineItem.Event) -> Unit,
+    modifier: Modifier = Modifier
+) {
+    val coroutineScope = rememberCoroutineScope()
+    LaunchedEffect(modalBottomSheetState) {
+        snapshotFlow { modalBottomSheetState.currentValue }
+            .filter { it == ModalBottomSheetValue.Hidden }
+            .collect {
+                state.eventSink(ActionListEvents.Clear)
+            }
+    }
+
+    fun onItemActionClicked(
+        itemAction: TimelineItemAction,
+        targetItem: TimelineItem.Event
+    ) {
+        onActionSelected(itemAction, targetItem)
+        coroutineScope.launch {
+            modalBottomSheetState.hide()
+        }
+    }
+
+    ModalBottomSheetLayout(
+        modifier = modifier,
+        sheetState = modalBottomSheetState,
+        sheetContent = {
+            SheetContent(
+                state = state,
+                onActionClicked = ::onItemActionClicked,
+                modifier = Modifier
+                    .navigationBarsPadding()
+                    .imePadding()
+            )
+        }
+    )
+}
+
+@Composable
+private fun SheetContent(
+    state: ActionListState,
+    modifier: Modifier = Modifier,
+    onActionClicked: (TimelineItemAction, TimelineItem.Event) -> Unit = { _, _ -> },
+) {
+    when (val target = state.target) {
+        is ActionListState.Target.Loading,
+        ActionListState.Target.None -> {
+            // Crashes if sheetContent size is zero
+            Box(modifier = modifier.size(1.dp))
+        }
+        is ActionListState.Target.Success -> {
+            val actions = target.actions
+            LazyColumn(
+                modifier = modifier.fillMaxWidth()
+            ) {
+                items(
+                    items = actions,
+                ) { action ->
+                    ListItem(
+                        modifier = Modifier.clickable {
+                            onActionClicked(action, target.event)
+                        },
+                        text = {
+                            Text(
+                                text = action.title,
+                                color = if (action.destructive) MaterialTheme.colorScheme.error else MaterialTheme.colorScheme.primary,
+                            )
+                        },
+                        icon = {
+                            Icon(
+                                resourceId = action.icon,
+                                contentDescription = "",
+                                tint = if (action.destructive) MaterialTheme.colorScheme.error else MaterialTheme.colorScheme.primary,
+                            )
+                        }
+                    )
+                }
+            }
+        }
+    }
+}
+
+@Preview
+@Composable
+fun SheetContentLightPreview(@PreviewParameter(ActionListStateProvider::class) state: ActionListState) =
+    ElementPreviewLight { ContentToPreview(state) }
+
+@Preview
+@Composable
+fun SheetContentDarkPreview(@PreviewParameter(ActionListStateProvider::class) state: ActionListState) =
+    ElementPreviewDark { ContentToPreview(state) }
+
+@Composable
+private fun ContentToPreview(state: ActionListState) {
+    SheetContent(state)
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/model/TimelineItemAction.kt

@@ -0,0 +1,34 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.actionlist.model
+
+import androidx.annotation.DrawableRes
+import androidx.compose.runtime.Immutable
+import io.element.android.libraries.designsystem.VectorIcons
+
+@Immutable
+sealed class TimelineItemAction(
+    val title: String,
+    @DrawableRes val icon: Int,
+    val destructive: Boolean = false
+) {
+    object Forward : TimelineItemAction("Forward", VectorIcons.ArrowForward)
+    object Copy : TimelineItemAction("Copy", VectorIcons.Copy)
+    object Redact : TimelineItemAction("Redact", VectorIcons.Delete, destructive = true)
+    object Reply : TimelineItemAction("Reply", VectorIcons.Reply)
+    object Edit : TimelineItemAction("Edit", VectorIcons.Edit)
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/textcomposer/MessageComposerEvents.kt

@@ -0,0 +1,27 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.textcomposer
+
+import io.element.android.libraries.textcomposer.MessageComposerMode
+
+sealed interface MessageComposerEvents {
+    object ToggleFullScreenState : MessageComposerEvents
+    data class SendMessage(val message: String) : MessageComposerEvents
+    object CloseSpecialMode : MessageComposerEvents
+    data class SetMode(val composerMode: MessageComposerMode) : MessageComposerEvents
+    data class UpdateText(val text: CharSequence) : MessageComposerEvents
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/textcomposer/MessageComposerPresenter.kt

@@ -0,0 +1,102 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.textcomposer
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.saveable.rememberSaveable
+import io.element.android.libraries.architecture.Presenter
+import io.element.android.libraries.core.data.StableCharSequence
+import io.element.android.libraries.core.data.toStableCharSequence
+import io.element.android.libraries.matrix.room.MatrixRoom
+import io.element.android.libraries.textcomposer.MessageComposerMode
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.launch
+import javax.inject.Inject
+
+class MessageComposerPresenter @Inject constructor(
+    private val appCoroutineScope: CoroutineScope,
+    private val room: MatrixRoom
+) : Presenter<MessageComposerState> {
+
+    @Composable
+    override fun present(): MessageComposerState {
+        val isFullScreen = rememberSaveable {
+            mutableStateOf(false)
+        }
+        val text: MutableState<StableCharSequence> = remember {
+            mutableStateOf(StableCharSequence(""))
+        }
+        val composerMode: MutableState<MessageComposerMode> = rememberSaveable {
+            mutableStateOf(MessageComposerMode.Normal(""))
+        }
+
+        LaunchedEffect(composerMode.value) {
+            when (val modeValue = composerMode.value) {
+                is MessageComposerMode.Edit -> text.value = modeValue.defaultContent.toStableCharSequence()
+                else -> Unit
+            }
+        }
+
+        fun handleEvents(event: MessageComposerEvents) {
+            when (event) {
+                MessageComposerEvents.ToggleFullScreenState -> isFullScreen.value = !isFullScreen.value
+                is MessageComposerEvents.UpdateText -> text.value = event.text.toStableCharSequence()
+                MessageComposerEvents.CloseSpecialMode -> {
+                    text.value = "".toStableCharSequence()
+                    composerMode.setToNormal()
+                }
+                is MessageComposerEvents.SendMessage -> appCoroutineScope.sendMessage(event.message, composerMode, text)
+                is MessageComposerEvents.SetMode -> composerMode.value = event.composerMode
+            }
+        }
+
+        return MessageComposerState(
+            text = text.value,
+            isFullScreen = isFullScreen.value,
+            mode = composerMode.value,
+            eventSink = ::handleEvents
+        )
+    }
+
+    private fun MutableState<MessageComposerMode>.setToNormal() {
+        value = MessageComposerMode.Normal("")
+    }
+
+    private fun CoroutineScope.sendMessage(text: String, composerMode: MutableState<MessageComposerMode>, textState: MutableState<StableCharSequence>) =
+        launch {
+            val capturedMode = composerMode.value
+            // Reset composer right away
+            textState.value = "".toStableCharSequence()
+            composerMode.setToNormal()
+            when (capturedMode) {
+                is MessageComposerMode.Normal -> room.sendMessage(text)
+                is MessageComposerMode.Edit -> room.editMessage(
+                    capturedMode.eventId,
+                    text
+                )
+                is MessageComposerMode.Quote -> TODO()
+                is MessageComposerMode.Reply -> room.replyMessage(
+                    capturedMode.eventId,
+                    text
+                )
+            }
+        }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/textcomposer/MessageComposerState.kt

@@ -0,0 +1,31 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.textcomposer
+
+import androidx.compose.runtime.Immutable
+import io.element.android.libraries.core.data.StableCharSequence
+import io.element.android.libraries.textcomposer.MessageComposerMode
+
+@Immutable
+data class MessageComposerState(
+    val text: StableCharSequence?,
+    val isFullScreen: Boolean,
+    val mode: MessageComposerMode,
+    val eventSink: (MessageComposerEvents) -> Unit
+) {
+    val isSendButtonVisible: Boolean = text?.charSequence.isNullOrEmpty().not()
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/textcomposer/MessageComposerStateProvider.kt

@@ -0,0 +1,35 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.textcomposer
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+import io.element.android.libraries.core.data.StableCharSequence
+import io.element.android.libraries.textcomposer.MessageComposerMode
+
+open class MessageComposerStateProvider : PreviewParameterProvider<MessageComposerState> {
+    override val values: Sequence<MessageComposerState>
+        get() = sequenceOf(
+            aMessageComposerState(),
+        )
+}
+
+fun aMessageComposerState() = MessageComposerState(
+    text = StableCharSequence(""),
+    isFullScreen = false,
+    mode = MessageComposerMode.Normal(content = ""),
+    eventSink = {}
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/textcomposer/MessageComposerView.kt

@@ -0,0 +1,76 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.textcomposer
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.ElementTheme
+import io.element.android.libraries.textcomposer.TextComposer
+
+@Composable
+fun MessageComposerView(
+    state: MessageComposerState,
+    modifier: Modifier = Modifier,
+) {
+    fun onFullscreenToggle() {
+        state.eventSink(MessageComposerEvents.ToggleFullScreenState)
+    }
+
+    fun sendMessage(message: String) {
+        state.eventSink(MessageComposerEvents.SendMessage(message))
+    }
+
+    fun onCloseSpecialMode() {
+        state.eventSink(MessageComposerEvents.CloseSpecialMode)
+    }
+
+    fun onComposerTextChange(text: CharSequence) {
+        state.eventSink(MessageComposerEvents.UpdateText(text))
+    }
+
+    TextComposer(
+        onSendMessage = ::sendMessage,
+        fullscreen = state.isFullScreen,
+        onFullscreenToggle = ::onFullscreenToggle,
+        composerMode = state.mode,
+        onCloseSpecialMode = ::onCloseSpecialMode,
+        onComposerTextChange = ::onComposerTextChange,
+        composerCanSendMessage = state.isSendButtonVisible,
+        composerText = state.text?.charSequence?.toString(),
+        isInDarkMode = !ElementTheme.colors.isLight,
+        modifier = modifier
+    )
+}
+
+@Preview
+@Composable
+internal fun MessageComposerViewLightPreview(@PreviewParameter(MessageComposerStateProvider::class) state: MessageComposerState) =
+    ElementPreviewLight { ContentToPreview(state) }
+
+@Preview
+@Composable
+internal fun MessageComposerViewDarkPreview(@PreviewParameter(MessageComposerStateProvider::class) state: MessageComposerState) =
+    ElementPreviewDark { ContentToPreview(state) }
+
+@Composable
+private fun ContentToPreview(state: MessageComposerState) {
+    MessageComposerView(state)
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineEvents.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline
+
+import io.element.android.libraries.matrix.core.EventId
+
+sealed interface TimelineEvents {
+    object LoadMore : TimelineEvents
+    data class SetHighlightedEvent(val eventId: EventId?) : TimelineEvents
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelinePresenter.kt

@@ -0,0 +1,105 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.saveable.rememberSaveable
+import io.element.android.features.messages.impl.timeline.factories.TimelineItemsFactory
+import io.element.android.libraries.architecture.Presenter
+import io.element.android.libraries.matrix.core.EventId
+import io.element.android.libraries.matrix.room.MatrixRoom
+import io.element.android.libraries.matrix.timeline.MatrixTimeline
+import kotlinx.collections.immutable.toImmutableList
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.flow.launchIn
+import kotlinx.coroutines.flow.onEach
+import kotlinx.coroutines.launch
+import timber.log.Timber
+import javax.inject.Inject
+
+private const val backPaginationEventLimit = 20
+private const val backPaginationPageSize = 50
+
+class TimelinePresenter @Inject constructor(
+    private val timelineItemsFactory: TimelineItemsFactory,
+    room: MatrixRoom,
+) : Presenter<TimelineState> {
+
+    private val timeline = room.timeline()
+
+    @Composable
+    override fun present(): TimelineState {
+        val localCoroutineScope = rememberCoroutineScope()
+        val highlightedEventId: MutableState<EventId?> = rememberSaveable {
+            mutableStateOf(null)
+        }
+        val timelineItems = timelineItemsFactory
+            .flow()
+            .collectAsState()
+
+        val paginationState = timeline
+            .paginationState()
+            .collectAsState()
+
+        fun handleEvents(event: TimelineEvents) {
+            when (event) {
+                TimelineEvents.LoadMore -> localCoroutineScope.loadMore(paginationState.value)
+                is TimelineEvents.SetHighlightedEvent -> highlightedEventId.value = event.eventId
+            }
+        }
+
+        LaunchedEffect(Unit) {
+            timeline
+                .timelineItems()
+                .onEach(timelineItemsFactory::replaceWith)
+                .onEach { timelineItems ->
+                    if (timelineItems.isEmpty()) {
+                        loadMore(paginationState.value)
+                    }
+                }
+                .launchIn(this)
+        }
+
+        DisposableEffect(Unit) {
+            timeline.initialize()
+            onDispose {
+                timeline.dispose()
+            }
+        }
+
+        return TimelineState(
+            highlightedEventId = highlightedEventId.value,
+            paginationState = paginationState.value,
+            timelineItems = timelineItems.value.toImmutableList(),
+            eventSink = ::handleEvents
+        )
+    }
+
+    private fun CoroutineScope.loadMore(paginationState: MatrixTimeline.PaginationState) = launch {
+        if (paginationState.canBackPaginate && !paginationState.isBackPaginating) {
+            timeline.paginateBackwards(backPaginationEventLimit, backPaginationPageSize)
+        } else {
+            Timber.v("Can't back paginate as paginationState = $paginationState")
+        }
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineState.kt

@@ -0,0 +1,31 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline
+
+import androidx.compose.runtime.Immutable
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.libraries.matrix.core.EventId
+import io.element.android.libraries.matrix.timeline.MatrixTimeline
+import kotlinx.collections.immutable.ImmutableList
+
+@Immutable
+data class TimelineState(
+    val timelineItems: ImmutableList<TimelineItem>,
+    val highlightedEventId: EventId?,
+    val paginationState: MatrixTimeline.PaginationState,
+    val eventSink: (TimelineEvents) -> Unit
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineStateProvider.kt

@@ -0,0 +1,103 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline
+
+import io.element.android.features.messages.impl.timeline.model.AggregatedReaction
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.model.TimelineItemGroupPosition
+import io.element.android.features.messages.impl.timeline.model.TimelineItemReactions
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextContent
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.matrix.core.EventId
+import io.element.android.libraries.matrix.timeline.MatrixTimeline
+import kotlinx.collections.immutable.ImmutableList
+import kotlinx.collections.immutable.persistentListOf
+
+fun aTimelineState() = TimelineState(
+    timelineItems = persistentListOf(),
+    paginationState = MatrixTimeline.PaginationState(isBackPaginating = false, canBackPaginate = true),
+    highlightedEventId = null,
+    eventSink = {}
+)
+
+internal fun aTimelineItemList(content: TimelineItemEventContent): ImmutableList<TimelineItem> {
+    return persistentListOf(
+        // 3 items (First Middle Last) with isMine = false
+        aTimelineItemEvent(
+            isMine = false,
+            content = content,
+            groupPosition = TimelineItemGroupPosition.Last
+        ),
+        aTimelineItemEvent(
+            isMine = false,
+            content = content,
+            groupPosition = TimelineItemGroupPosition.Middle
+        ),
+        aTimelineItemEvent(
+            isMine = false,
+            content = content,
+            groupPosition = TimelineItemGroupPosition.First
+        ),
+        // 3 items (First Middle Last) with isMine = true
+        aTimelineItemEvent(
+            isMine = true,
+            content = content,
+            groupPosition = TimelineItemGroupPosition.Last
+        ),
+        aTimelineItemEvent(
+            isMine = true,
+            content = content,
+            groupPosition = TimelineItemGroupPosition.Middle
+        ),
+        aTimelineItemEvent(
+            isMine = true,
+            content = content,
+            groupPosition = TimelineItemGroupPosition.First
+        ),
+    )
+}
+
+internal fun aTimelineItemEvent(
+    isMine: Boolean = false,
+    content: TimelineItemEventContent = aTimelineItemContent(),
+    groupPosition: TimelineItemGroupPosition = TimelineItemGroupPosition.First
+): TimelineItem.Event {
+    val randomId = Math.random().toString()
+    return TimelineItem.Event(
+        id = randomId,
+        eventId = EventId(randomId),
+        senderId = "@senderId",
+        senderAvatar = AvatarData("@senderId", "sender"),
+        content = content,
+        reactionsState = TimelineItemReactions(
+            persistentListOf(
+                AggregatedReaction("👍", "1")
+            )
+        ),
+        isMine = isMine,
+        senderDisplayName = "sender",
+        groupPosition = groupPosition,
+    )
+}
+
+internal fun aTimelineItemContent(): TimelineItemEventContent {
+    return TimelineItemTextContent(
+        body = "Text",
+        htmlDocument = null
+    )
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineView.kt

@@ -0,0 +1,350 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline
+
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.BoxScope
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.offset
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.widthIn
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.LazyListState
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.ArrowDownward
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.derivedStateOf
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.snapshotFlow
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.layout.LastBaseline
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.zIndex
+import io.element.android.features.messages.impl.timeline.components.MessageEventBubble
+import io.element.android.features.messages.impl.timeline.components.TimelineItemReactionsView
+import io.element.android.features.messages.impl.timeline.components.event.TimelineItemEventContentView
+import io.element.android.features.messages.impl.timeline.components.virtual.TimelineItemDaySeparatorView
+import io.element.android.features.messages.impl.timeline.components.virtual.TimelineLoadingMoreIndicator
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.model.bubble.BubbleState
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContentProvider
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemDaySeparatorModel
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemLoadingModel
+import io.element.android.libraries.designsystem.components.avatar.Avatar
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.components.FloatingActionButton
+import io.element.android.libraries.designsystem.theme.components.Icon
+import io.element.android.libraries.designsystem.theme.components.Text
+import kotlinx.collections.immutable.ImmutableList
+import kotlinx.coroutines.flow.distinctUntilChanged
+import kotlinx.coroutines.launch
+
+@Composable
+fun TimelineView(
+    state: TimelineState,
+    modifier: Modifier = Modifier,
+    onMessageClicked: (TimelineItem.Event) -> Unit = {},
+    onMessageLongClicked: (TimelineItem.Event) -> Unit = {},
+) {
+
+    fun onReachedLoadMore() {
+        state.eventSink(TimelineEvents.LoadMore)
+    }
+
+    val lazyListState = rememberLazyListState()
+    Box(modifier = modifier) {
+        LazyColumn(
+            modifier = Modifier.fillMaxSize(),
+            state = lazyListState,
+            horizontalAlignment = Alignment.Start,
+            verticalArrangement = Arrangement.Bottom,
+            reverseLayout = true
+        ) {
+            itemsIndexed(
+                items = state.timelineItems,
+                contentType = { _, timelineItem -> timelineItem.contentType() },
+                key = { _, timelineItem -> timelineItem.key() },
+            ) { index, timelineItem ->
+                TimelineItemRow(
+                    timelineItem = timelineItem,
+                    isHighlighted = timelineItem.key() == state.highlightedEventId?.value,
+                    onClick = onMessageClicked,
+                    onLongClick = onMessageLongClicked
+                )
+                if (index == state.timelineItems.lastIndex) {
+                    onReachedLoadMore()
+                }
+            }
+        }
+
+        TimelineScrollHelper(
+            lazyListState = lazyListState,
+            timelineItems = state.timelineItems,
+            onLoadMore = ::onReachedLoadMore
+        )
+    }
+}
+
+private fun TimelineItem.key(): String {
+    return when (this) {
+        is TimelineItem.Event -> id
+        is TimelineItem.Virtual -> id
+    }
+}
+
+private fun TimelineItem.contentType(): Int {
+    // Todo optimize for each subtype
+    return when (this) {
+        is TimelineItem.Event -> 0
+        is TimelineItem.Virtual -> 1
+    }
+}
+
+@Composable
+fun TimelineItemRow(
+    timelineItem: TimelineItem,
+    isHighlighted: Boolean,
+    onClick: (TimelineItem.Event) -> Unit,
+    onLongClick: (TimelineItem.Event) -> Unit,
+) {
+    when (timelineItem) {
+        is TimelineItem.Virtual -> TimelineItemVirtualRow(
+            virtual = timelineItem
+        )
+        is TimelineItem.Event -> {
+
+            fun onClick() {
+                onClick(timelineItem)
+            }
+
+            fun onLongClick() {
+                onLongClick(timelineItem)
+            }
+
+            TimelineItemEventRow(
+                event = timelineItem,
+                isHighlighted = isHighlighted,
+                onClick = ::onClick,
+                onLongClick = ::onLongClick
+            )
+        }
+    }
+}
+
+@Composable
+fun TimelineItemVirtualRow(
+    virtual: TimelineItem.Virtual,
+    modifier: Modifier = Modifier
+) {
+    when (virtual.model) {
+        is TimelineItemLoadingModel -> TimelineLoadingMoreIndicator(modifier)
+        is TimelineItemDaySeparatorModel -> TimelineItemDaySeparatorView(virtual.model, modifier)
+        else -> return
+    }
+}
+
+@Composable
+fun TimelineItemEventRow(
+    event: TimelineItem.Event,
+    isHighlighted: Boolean,
+    onClick: () -> Unit,
+    onLongClick: () -> Unit,
+    modifier: Modifier = Modifier
+) {
+    val interactionSource = remember { MutableInteractionSource() }
+    val (parentAlignment, contentAlignment) = if (event.isMine) {
+        Pair(Alignment.CenterEnd, Alignment.End)
+    } else {
+        Pair(Alignment.CenterStart, Alignment.Start)
+    }
+    Box(
+        modifier = modifier
+            .fillMaxWidth()
+            .wrapContentHeight(),
+        contentAlignment = parentAlignment
+    ) {
+        Row {
+            if (!event.isMine) {
+                Spacer(modifier = Modifier.width(16.dp))
+            }
+            Column(horizontalAlignment = contentAlignment) {
+                if (event.showSenderInformation) {
+                    MessageSenderInformation(
+                        event.safeSenderName,
+                        event.senderAvatar,
+                        Modifier.zIndex(1f)
+                    )
+                }
+                MessageEventBubble(
+                    state = BubbleState(
+                        groupPosition = event.groupPosition,
+                        isMine = event.isMine,
+                        isHighlighted = isHighlighted,
+                    ),
+                    interactionSource = interactionSource,
+                    onClick = onClick,
+                    onLongClick = onLongClick,
+                    modifier = Modifier
+                        .zIndex(-1f)
+                        .widthIn(max = 320.dp)
+                ) {
+                    val contentModifier = Modifier.padding(horizontal = 12.dp, vertical = 6.dp)
+                    TimelineItemEventContentView(event.content, interactionSource, onClick, onLongClick, contentModifier)
+                }
+                TimelineItemReactionsView(
+                    reactionsState = event.reactionsState,
+                    modifier = Modifier
+                        .zIndex(1f)
+                        .offset(x = if (event.isMine) 0.dp else 20.dp, y = -(16.dp))
+                )
+            }
+            if (event.isMine) {
+                Spacer(modifier = Modifier.width(16.dp))
+            }
+        }
+    }
+    if (event.groupPosition.isNew()) {
+        Spacer(modifier = modifier.height(8.dp))
+    } else {
+        Spacer(modifier = modifier.height(2.dp))
+    }
+}
+
+@Composable
+private fun MessageSenderInformation(
+    sender: String,
+    senderAvatar: AvatarData?,
+    modifier: Modifier = Modifier
+) {
+    Row(modifier = modifier) {
+        if (senderAvatar != null) {
+            Avatar(senderAvatar)
+            Spacer(modifier = Modifier.width(4.dp))
+        }
+        Text(
+            text = sender,
+            style = MaterialTheme.typography.titleMedium,
+            modifier = Modifier
+                .alignBy(LastBaseline)
+        )
+    }
+}
+
+@Composable
+internal fun BoxScope.TimelineScrollHelper(
+    lazyListState: LazyListState,
+    timelineItems: ImmutableList<TimelineItem>,
+    onLoadMore: () -> Unit = {},
+) {
+    val coroutineScope = rememberCoroutineScope()
+    val firstVisibleItemIndex by remember { derivedStateOf { lazyListState.firstVisibleItemIndex } }
+
+    // Auto-scroll when new timeline items appear
+    LaunchedEffect(timelineItems, firstVisibleItemIndex) {
+        if (!lazyListState.isScrollInProgress &&
+            firstVisibleItemIndex < 2
+        ) coroutineScope.launch {
+            lazyListState.animateScrollToItem(0)
+        }
+    }
+
+    // Handle load more preloading
+    val loadMore by remember {
+        derivedStateOf {
+            val layoutInfo = lazyListState.layoutInfo
+            val totalItemsNumber = layoutInfo.totalItemsCount
+            val lastVisibleItemIndex = (layoutInfo.visibleItemsInfo.lastOrNull()?.index ?: 0) + 1
+            lastVisibleItemIndex > (totalItemsNumber - 30)
+        }
+    }
+
+    LaunchedEffect(loadMore) {
+        snapshotFlow { loadMore }
+            .distinctUntilChanged()
+            .collect {
+                onLoadMore()
+            }
+    }
+
+    // Jump to bottom button
+    if (firstVisibleItemIndex > 2) {
+        FloatingActionButton(
+            onClick = {
+                coroutineScope.launch {
+                    if (firstVisibleItemIndex > 10) {
+                        lazyListState.scrollToItem(0)
+                    } else {
+                        lazyListState.animateScrollToItem(0)
+                    }
+                }
+            },
+            shape = CircleShape,
+            modifier = Modifier
+                .align(Alignment.BottomCenter)
+                .size(40.dp),
+            containerColor = MaterialTheme.colorScheme.surfaceVariant,
+            contentColor = MaterialTheme.colorScheme.onSurfaceVariant
+        ) {
+            Icon(Icons.Default.ArrowDownward, "")
+        }
+    }
+}
+
+@Preview
+@Composable
+fun TimelineViewLightPreview(
+    @PreviewParameter(TimelineItemEventContentProvider::class) content: TimelineItemEventContent
+) = ElementPreviewLight { ContentToPreview(content) }
+
+@Preview
+@Composable
+fun TimelineViewDarkPreview(
+    @PreviewParameter(TimelineItemEventContentProvider::class) content: TimelineItemEventContent
+) = ElementPreviewDark { ContentToPreview(content) }
+
+@Composable
+private fun ContentToPreview(content: TimelineItemEventContent) {
+    val timelineItems = aTimelineItemList(content)
+    TimelineView(
+        state = aTimelineState().copy(
+            timelineItems = timelineItems,
+        )
+    )
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessageEventBubble.kt

@@ -0,0 +1,146 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components
+
+import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.combinedClickable
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.offset
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.widthIn
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.ripple.rememberRipple
+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.Shape
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import io.element.android.features.messages.impl.timeline.model.TimelineItemGroupPosition
+import io.element.android.features.messages.impl.timeline.model.bubble.BubbleState
+import io.element.android.features.messages.impl.timeline.model.bubble.BubbleStateProvider
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.ElementTheme
+import io.element.android.libraries.designsystem.theme.components.Surface
+
+private val BUBBLE_RADIUS = 16.dp
+
+@OptIn(ExperimentalFoundationApi::class)
+@Composable
+fun MessageEventBubble(
+    state: BubbleState,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onClick: () -> Unit = {},
+    onLongClick: () -> Unit = {},
+    content: @Composable () -> Unit = {},
+) {
+    fun bubbleShape(): Shape {
+        return when (state.groupPosition) {
+            TimelineItemGroupPosition.First -> if (state.isMine) {
+                RoundedCornerShape(BUBBLE_RADIUS, BUBBLE_RADIUS, 0.dp, BUBBLE_RADIUS)
+            } else {
+                RoundedCornerShape(BUBBLE_RADIUS, BUBBLE_RADIUS, BUBBLE_RADIUS, 0.dp)
+            }
+            TimelineItemGroupPosition.Middle -> if (state.isMine) {
+                RoundedCornerShape(BUBBLE_RADIUS, 0.dp, 0.dp, BUBBLE_RADIUS)
+            } else {
+                RoundedCornerShape(0.dp, BUBBLE_RADIUS, BUBBLE_RADIUS, 0.dp)
+            }
+            TimelineItemGroupPosition.Last -> if (state.isMine) {
+                RoundedCornerShape(BUBBLE_RADIUS, 0.dp, BUBBLE_RADIUS, BUBBLE_RADIUS)
+            } else {
+                RoundedCornerShape(0.dp, BUBBLE_RADIUS, BUBBLE_RADIUS, BUBBLE_RADIUS)
+            }
+            TimelineItemGroupPosition.None ->
+                RoundedCornerShape(
+                    BUBBLE_RADIUS,
+                    BUBBLE_RADIUS,
+                    BUBBLE_RADIUS,
+                    BUBBLE_RADIUS
+                )
+        }
+    }
+
+    fun Modifier.offsetForItem(): Modifier {
+        return if (state.isMine) {
+            offset(y = -(12.dp))
+        } else {
+            offset(x = 20.dp, y = -(12.dp))
+        }
+    }
+
+    val backgroundBubbleColor = if (state.isHighlighted) {
+        ElementTheme.colors.messageHighlightedBackground
+    } else {
+        if (state.isMine) {
+            ElementTheme.colors.messageFromMeBackground
+        } else {
+            ElementTheme.colors.messageFromOtherBackground
+        }
+    }
+    val bubbleShape = bubbleShape()
+    Surface(
+        modifier = modifier
+            .widthIn(min = 80.dp)
+            .offsetForItem()
+            .clip(bubbleShape)
+            .combinedClickable(
+                onClick = onClick,
+                onLongClick = onLongClick,
+                indication = rememberRipple(),
+                interactionSource = interactionSource
+            ),
+        color = backgroundBubbleColor,
+        shape = bubbleShape,
+        content = content
+    )
+}
+
+@Preview
+@Composable
+internal fun MessageEventBubbleLightPreview(@PreviewParameter(BubbleStateProvider::class) state: BubbleState) =
+    ElementPreviewLight { ContentToPreview(state) }
+
+@Preview
+@Composable
+internal fun MessageEventBubbleDarkPreview(@PreviewParameter(BubbleStateProvider::class) state: BubbleState) =
+    ElementPreviewDark { ContentToPreview(state) }
+
+@Composable
+private fun ContentToPreview(state: BubbleState) {
+    // Due to y offset, surround with a Box
+    Box(
+        modifier = Modifier
+            .size(width = 240.dp, height = 64.dp)
+            .padding(8.dp),
+        contentAlignment = Alignment.CenterStart,
+    ) {
+        MessageEventBubble(
+            state = state,
+            interactionSource = MutableInteractionSource(),
+        ) {
+            Spacer(modifier = Modifier.size(width = 120.dp, height = 32.dp))
+        }
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessagesReactionButton.kt

@@ -0,0 +1,74 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components
+
+import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.CornerSize
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import io.element.android.features.messages.impl.timeline.model.AggregatedReaction
+import io.element.android.features.messages.impl.timeline.model.AggregatedReactionProvider
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.components.Surface
+import io.element.android.libraries.designsystem.theme.components.Text
+
+@Composable
+fun MessagesReactionButton(reaction: AggregatedReaction, modifier: Modifier = Modifier) {
+    Surface(
+        modifier = modifier,
+        color = MaterialTheme.colorScheme.surfaceVariant,
+        border = BorderStroke(2.dp, MaterialTheme.colorScheme.background),
+        shape = RoundedCornerShape(corner = CornerSize(12.dp)),
+    ) {
+        Row(
+            modifier = Modifier.padding(vertical = 5.dp, horizontal = 8.dp),
+            verticalAlignment = Alignment.CenterVertically
+        ) {
+            // TODO `reaction.isHighlighted` is not used.
+            Text(text = reaction.key, fontSize = 12.sp)
+            Spacer(modifier = Modifier.width(4.dp))
+            Text(text = reaction.count, color = MaterialTheme.colorScheme.secondary, fontSize = 12.sp)
+        }
+    }
+}
+
+@Preview
+@Composable
+internal fun MessagesReactionButtonLightPreview(@PreviewParameter(AggregatedReactionProvider::class) reaction: AggregatedReaction) =
+    ElementPreviewLight { ContentToPreview(reaction) }
+
+@Preview
+@Composable
+internal fun MessagesReactionButtonDarkPreview(@PreviewParameter(AggregatedReactionProvider::class) reaction: AggregatedReaction) =
+    ElementPreviewDark { ContentToPreview(reaction) }
+
+@Composable
+private fun ContentToPreview(reaction: AggregatedReaction) {
+    MessagesReactionButton(reaction)
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemReactionsView.kt

@@ -0,0 +1,61 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.google.accompanist.flowlayout.FlowRow
+import io.element.android.features.messages.impl.timeline.model.TimelineItemReactions
+import io.element.android.features.messages.impl.timeline.model.aTimelineItemReactions
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+
+@Composable
+fun TimelineItemReactionsView(
+    reactionsState: TimelineItemReactions,
+    modifier: Modifier = Modifier,
+) {
+    if (reactionsState.reactions.isEmpty()) return
+    FlowRow(
+        modifier = modifier,
+        mainAxisSpacing = 2.dp,
+        crossAxisSpacing = 8.dp,
+    ) {
+        reactionsState.reactions.forEach { reaction ->
+            MessagesReactionButton(reaction = reaction)
+        }
+    }
+}
+
+@Preview
+@Composable
+internal fun TimelineItemReactionsViewLightPreview() =
+    ElementPreviewLight { ContentToPreview() }
+
+@Preview
+@Composable
+internal fun TimelineItemReactionsViewDarkPreview() =
+    ElementPreviewDark { ContentToPreview() }
+
+@Composable
+private fun ContentToPreview() {
+    TimelineItemReactionsView(
+        reactionsState = aTimelineItemReactions()
+    )
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemContentView.kt

@@ -0,0 +1,62 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.event
+
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEncryptedContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemImageContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemRedactedContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextBasedContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+
+@Composable
+fun TimelineItemEventContentView(
+    content: TimelineItemEventContent,
+    interactionSource: MutableInteractionSource,
+    onClick: () -> Unit,
+    onLongClick: () -> Unit,
+    modifier: Modifier = Modifier
+) {
+    when (content) {
+        is TimelineItemEncryptedContent -> TimelineItemEncryptedView(
+            content = content,
+            modifier = modifier
+        )
+        is TimelineItemRedactedContent -> TimelineItemRedactedView(
+            content = content,
+            modifier = modifier
+        )
+        is TimelineItemTextBasedContent -> TimelineItemTextView(
+            content = content,
+            interactionSource = interactionSource,
+            modifier = modifier,
+            onTextClicked = onClick,
+            onTextLongClicked = onLongClick
+        )
+        is TimelineItemUnknownContent -> TimelineItemUnknownView(
+            content = content,
+            modifier = modifier
+        )
+        is TimelineItemImageContent -> TimelineItemImageView(
+            content = content,
+            modifier = modifier
+        )
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemEncryptedView.kt

@@ -0,0 +1,59 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.event
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Warning
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEncryptedContent
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import org.matrix.rustcomponents.sdk.EncryptedMessage
+
+@Composable
+fun TimelineItemEncryptedView(
+    content: TimelineItemEncryptedContent,
+    modifier: Modifier = Modifier
+) {
+    TimelineItemInformativeView(
+        text = "Decryption error",
+        iconDescription = "Warning",
+        icon = Icons.Default.Warning,
+        modifier = modifier
+    )
+}
+
+@Preview
+@Composable
+internal fun TimelineItemEncryptedViewLightPreview() =
+    ElementPreviewLight { ContentToPreview() }
+
+@Preview
+@Composable
+internal fun TimelineItemEncryptedViewDarkPreview() =
+    ElementPreviewDark { ContentToPreview() }
+
+@Composable
+private fun ContentToPreview() {
+    TimelineItemEncryptedView(
+        content = TimelineItemEncryptedContent(
+            encryptedMessage = EncryptedMessage.Unknown,
+        )
+    )
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemImageView.kt

@@ -0,0 +1,86 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.event
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.painter.ColorPainter
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import coil.compose.AsyncImage
+import coil.request.ImageRequest
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemImageContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemImageContentProvider
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.preview.debugPlaceholderBackground
+
+@Composable
+fun TimelineItemImageView(
+    content: TimelineItemImageContent,
+    modifier: Modifier = Modifier
+) {
+    val widthPercent = if (content.aspectRatio > 1f) {
+        1f
+    } else {
+        0.7f
+    }
+    Box(
+        modifier = modifier
+            .fillMaxWidth(widthPercent)
+            .aspectRatio(content.aspectRatio),
+        contentAlignment = Alignment.Center,
+    ) {
+        val isLoading = rememberSaveable(content.imageMeta) { mutableStateOf(true) }
+        val context = LocalContext.current
+        val model = ImageRequest.Builder(context)
+            .data(content.imageMeta)
+            .build()
+
+        AsyncImage(
+            model = model,
+            contentDescription = null,
+            placeholder = debugPlaceholderBackground(ColorPainter(MaterialTheme.colorScheme.surfaceVariant)),
+            contentScale = ContentScale.Crop,
+            onSuccess = { isLoading.value = false },
+        )
+    }
+}
+
+@Preview
+@Composable
+internal fun TimelineItemImageViewLightPreview(@PreviewParameter(TimelineItemImageContentProvider::class) content: TimelineItemImageContent) =
+    ElementPreviewLight { ContentToPreview(content) }
+
+@Preview
+@Composable
+internal fun TimelineItemImageViewDarkPreview(@PreviewParameter(TimelineItemImageContentProvider::class) content: TimelineItemImageContent) =
+    ElementPreviewDark { ContentToPreview(content) }
+
+@Composable
+private fun ContentToPreview(content: TimelineItemImageContent) {
+    TimelineItemImageView(content)
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemInformativeView.kt

@@ -0,0 +1,81 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.event
+
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Delete
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.text.font.FontStyle
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.components.Icon
+import io.element.android.libraries.designsystem.theme.components.Text
+
+@Composable
+fun TimelineItemInformativeView(
+    text: String,
+    iconDescription: String,
+    icon: ImageVector,
+    modifier: Modifier = Modifier
+) {
+    Row(
+        modifier = modifier,
+        verticalAlignment = Alignment.CenterVertically
+    ) {
+        Icon(
+            imageVector = icon,
+            tint = MaterialTheme.colorScheme.secondary,
+            contentDescription = iconDescription,
+            modifier = Modifier.size(16.dp)
+        )
+        Spacer(modifier = Modifier.width(4.dp))
+        Text(
+            fontStyle = FontStyle.Italic,
+            color = MaterialTheme.colorScheme.secondary,
+            fontSize = 14.sp,
+            text = text
+        )
+    }
+}
+
+@Preview
+@Composable
+internal fun TimelineItemInformativeViewLightPreview() = ElementPreviewLight { ContentToPreview() }
+
+@Preview
+@Composable
+internal fun TimelineItemInformativeViewDarkPreview() = ElementPreviewDark { ContentToPreview() }
+
+@Composable
+private fun ContentToPreview() {
+    TimelineItemInformativeView(
+        text = "Info",
+        iconDescription = "",
+        icon = Icons.Default.Delete
+    )
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemRedactedView.kt

@@ -0,0 +1,54 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.event
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Delete
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemRedactedContent
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+
+@Composable
+fun TimelineItemRedactedView(
+    content: TimelineItemRedactedContent,
+    modifier: Modifier = Modifier
+) {
+    TimelineItemInformativeView(
+        text = "This message has been deleted",
+        iconDescription = "Delete",
+        icon = Icons.Default.Delete,
+        modifier = modifier
+    )
+}
+
+@Preview
+@Composable
+internal fun TimelineItemRedactedViewLightPreview() =
+    ElementPreviewLight { ContentToPreview() }
+
+@Preview
+@Composable
+internal fun TimelineItemRedactedViewDarkPreview() =
+    ElementPreviewDark { ContentToPreview() }
+
+@Composable
+private fun ContentToPreview() {
+    TimelineItemRedactedView(TimelineItemRedactedContent)
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemTextView.kt

@@ -0,0 +1,114 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.event
+
+import android.text.SpannableString
+import android.text.style.URLSpan
+import android.text.util.Linkify.PHONE_NUMBERS
+import android.text.util.Linkify.WEB_URLS
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.Box
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.SpanStyle
+import androidx.compose.ui.text.buildAnnotatedString
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.core.text.util.LinkifyCompat
+import io.element.android.features.messages.impl.timeline.components.html.HtmlDocument
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextBasedContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextBasedContentProvider
+import io.element.android.libraries.designsystem.LinkColor
+import io.element.android.libraries.designsystem.components.ClickableLinkText
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+
+@Composable
+fun TimelineItemTextView(
+    content: TimelineItemTextBasedContent,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    val htmlDocument = content.htmlDocument
+    if (htmlDocument != null) {
+        HtmlDocument(
+            document = htmlDocument,
+            modifier = modifier,
+            onTextClicked = onTextClicked,
+            onTextLongClicked = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+    } else {
+        Box(modifier) {
+            val linkStyle = SpanStyle(
+                color = LinkColor,
+            )
+            val styledText = remember(content.body) { content.body.linkify(linkStyle) }
+            ClickableLinkText(
+                text = styledText,
+                linkAnnotationTag = "URL",
+                onClick = onTextClicked,
+                onLongClick = onTextLongClicked,
+                interactionSource = interactionSource
+            )
+        }
+    }
+}
+
+private fun String.linkify(
+    linkStyle: SpanStyle,
+) = buildAnnotatedString {
+    append(this@linkify)
+    val spannable = SpannableString(this@linkify)
+    LinkifyCompat.addLinks(spannable, WEB_URLS or PHONE_NUMBERS)
+
+    val spans = spannable.getSpans(0, spannable.length, URLSpan::class.java)
+    for (span in spans) {
+        val start = spannable.getSpanStart(span)
+        val end = spannable.getSpanEnd(span)
+        addStyle(
+            start = start,
+            end = end,
+            style = linkStyle,
+        )
+        addStringAnnotation(
+            tag = "URL",
+            annotation = span.url,
+            start = start,
+            end = end
+        )
+    }
+}
+
+@Preview
+@Composable
+internal fun TimelineItemTextViewLightPreview(@PreviewParameter(TimelineItemTextBasedContentProvider::class) content: TimelineItemTextBasedContent) =
+    ElementPreviewLight { ContentToPreview(content) }
+
+@Preview
+@Composable
+internal fun TimelineItemTextViewDarkPreview(@PreviewParameter(TimelineItemTextBasedContentProvider::class) content: TimelineItemTextBasedContent) =
+    ElementPreviewDark { ContentToPreview(content) }
+
+@Composable
+fun ContentToPreview(content: TimelineItemTextBasedContent) {
+    TimelineItemTextView(content, MutableInteractionSource())
+}
+

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemUnknownView.kt

@@ -0,0 +1,54 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.event
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Info
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+
+@Composable
+fun TimelineItemUnknownView(
+    content: TimelineItemUnknownContent,
+    modifier: Modifier = Modifier
+) {
+    TimelineItemInformativeView(
+        text = "Event not handled by EAX",
+        iconDescription = "Info",
+        icon = Icons.Default.Info,
+        modifier = modifier
+    )
+}
+
+@Preview
+@Composable
+internal fun TimelineItemUnknownViewLightPreview() =
+    ElementPreviewLight { ContentToPreview() }
+
+@Preview
+@Composable
+internal fun TimelineItemUnknownViewDarkPreview() =
+    ElementPreviewDark { ContentToPreview() }
+
+@Composable
+private fun ContentToPreview() {
+    TimelineItemUnknownView(TimelineItemUnknownContent)
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/html/DocumentProvider.kt

@@ -0,0 +1,54 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.html
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+import org.jsoup.Jsoup
+import org.jsoup.nodes.Document
+
+open class DocumentProvider : PreviewParameterProvider<Document> {
+    override val values: Sequence<Document>
+        get() = sequenceOf(
+            "text",
+            "<strong>Strong</strong>",
+            "<b>Bold</b>",
+            "<i>Italic</i>",
+            // FIXME This does not work
+            "<b><i>Bold then italic</i></b>",
+            // FIXME This does not work
+            "<i><b>Italic then bold</b></i>",
+            "<em>em</em>",
+            "<unknown>unknown</unknown>",
+            // FIXME `br` is not rendered correctly in the Preview.
+            "Line 1<br/>Line 2",
+            "<code>code</code>",
+            "<del>del</del>",
+            "<h1>Heading 1</h1><h2>Heading 2</h2><h3>Heading 3</h3><h4>Heading 4</h4><h5>Heading 5</h5><h6>Heading 6</h6><h7>Heading 7</h7>",
+            "<a href=\"https://matrix.org\">link</a>",
+            "<p>paragraph</p>",
+            "<p>paragraph 1</p><p>paragraph 2</p>",
+            "<ol><li>ol item 1</li><li>ol item 2</li></ol>",
+            "<ol><li><i>ol item 1 italic</i></li><li><b>ol item 2 bold</b></li></ol>",
+            "<ul><li>ul item 1</li><li>ul item 2</li></ul>",
+            "<blockquote>blockquote</blockquote>",
+            // TODO Find a way to make is work with `pre`. For now there is an error with
+            // jsoup: java.lang.NoSuchMethodError: 'org.jsoup.nodes.Element org.jsoup.nodes.Element.firstElementChild()'
+            // "<pre>pre</pre>",
+            "<mx-reply><blockquote><a href=\\\"https://matrix.to/#/!roomId/\$eventId?via=matrix.org\\\">In reply to</a> " +
+                "<a href=\\\"https://matrix.to/#/@alice:matrix.org\\\">@alice:matrix.org</a><br>original message</blockquote></mx-reply>reply",
+        ).map { Jsoup.parse(it) }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/html/HtmlDocument.kt

@@ -0,0 +1,593 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.html
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.offset
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.InlineTextContent
+import androidx.compose.foundation.text.appendInlineContent
+import androidx.compose.material3.ColorScheme
+import androidx.compose.material3.LocalTextStyle
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.drawBehind
+import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.AnnotatedString
+import androidx.compose.ui.text.SpanStyle
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.buildAnnotatedString
+import androidx.compose.ui.text.font.FontFamily
+import androidx.compose.ui.text.font.FontStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextDecoration
+import androidx.compose.ui.text.withStyle
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.google.accompanist.flowlayout.FlowRow
+import io.element.android.libraries.designsystem.LinkColor
+import io.element.android.libraries.designsystem.components.ClickableLinkText
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.components.Surface
+import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.matrix.permalink.PermalinkData
+import io.element.android.libraries.matrix.permalink.PermalinkParser
+import kotlinx.collections.immutable.persistentMapOf
+import org.jsoup.nodes.Document
+import org.jsoup.nodes.Element
+import org.jsoup.nodes.Node
+import org.jsoup.nodes.TextNode
+
+private const val chipId = "chip"
+
+@Composable
+fun HtmlDocument(
+    document: Document,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    HtmlBody(
+        body = document.body(),
+        interactionSource = interactionSource,
+        modifier = modifier,
+        onTextClicked = onTextClicked,
+        onTextLongClicked = onTextLongClicked,
+    )
+}
+
+@Composable
+private fun HtmlBody(
+    body: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    @Composable
+    fun NodesFlowRode(
+        nodes: Iterator<Node>,
+        interactionSource: MutableInteractionSource,
+        onTextClicked: () -> Unit = {},
+        onTextLongClicked: () -> Unit = {},
+    ) = FlowRow(
+        mainAxisSpacing = 2.dp,
+        crossAxisSpacing = 8.dp,
+    ) {
+        var sameRow = true
+        while (sameRow && nodes.hasNext()) {
+            when (val node = nodes.next()) {
+                is TextNode -> {
+                    if (!node.isBlank) {
+                        Text(
+                            text = node.text(),
+                            color = MaterialTheme.colorScheme.primary,
+                        )
+                    }
+                }
+                is Element -> {
+                    if (node.isInline()) {
+                        HtmlInline(
+                            node,
+                            onTextClicked = onTextClicked,
+                            onTextLongClicked = onTextLongClicked,
+                            interactionSource = interactionSource
+                        )
+                    } else {
+                        HtmlBlock(
+                            element = node,
+                            onTextClicked = onTextClicked,
+                            onTextLongClicked = onTextLongClicked,
+                            interactionSource = interactionSource
+                        )
+                        sameRow = false
+                    }
+                }
+                else -> continue
+            }
+        }
+    }
+
+    Column(modifier = modifier) {
+        val nodesIterator = body.childNodes().iterator()
+        while (nodesIterator.hasNext()) {
+            NodesFlowRode(
+                nodes = nodesIterator,
+                interactionSource = interactionSource,
+                onTextClicked = onTextClicked,
+                onTextLongClicked = onTextLongClicked,
+            )
+        }
+    }
+}
+
+private fun Element.isInline(): Boolean {
+    return when (tagName().lowercase()) {
+        "del" -> true
+        "mx-reply" -> false
+        else -> !isBlock
+    }
+}
+
+@Composable
+private fun HtmlBlock(
+    element: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    val blockModifier = modifier
+        .padding(top = 4.dp)
+    when (element.tagName().lowercase()) {
+        "p" -> HtmlParagraph(
+            paragraph = element,
+            modifier = blockModifier,
+            onTextClicked = onTextClicked,
+            onTextLongClicked = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+        "h1", "h2", "h3", "h4", "h5", "h6" -> HtmlHeading(
+            heading = element,
+            modifier = blockModifier,
+            onTextClicked = onTextClicked,
+            onTextLongClicked = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+        "ol" -> HtmlOrderedList(
+            orderedList = element,
+            modifier = blockModifier,
+            onTextClicked = onTextClicked,
+            onTextLongClicked = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+        "ul" -> HtmlUnorderedList(
+            unorderedList = element,
+            modifier = blockModifier,
+            onTextClicked = onTextClicked,
+            onTextLongClicked = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+        "blockquote" -> HtmlBlockquote(
+            blockquote = element,
+            modifier = blockModifier,
+            onTextClicked = onTextClicked,
+            onTextLongClicked = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+        "pre" -> HtmlPreformatted(element, blockModifier)
+        "mx-reply" -> HtmlMxReply(
+            mxReply = element,
+            modifier = blockModifier,
+            onTextClicked = onTextClicked,
+            onTextLongClicked = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+        else -> return
+    }
+}
+
+@Composable
+private fun HtmlInline(
+    element: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    Box(modifier) {
+        val styledText = buildAnnotatedString {
+            appendInlineElement(element, MaterialTheme.colorScheme)
+        }
+        HtmlText(
+            text = styledText,
+            onClick = onTextClicked,
+            onLongClick = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+    }
+}
+
+@Composable
+private fun HtmlPreformatted(
+    pre: Element,
+    modifier: Modifier = Modifier
+) {
+    val isCode = pre.firstElementChild()?.tagName()?.lowercase() == "code"
+    val backgroundColor =
+        if (isCode) MaterialTheme.colorScheme.codeBackground() else Color.Unspecified
+    Box(
+        modifier
+            .background(color = backgroundColor)
+            .padding(horizontal = 8.dp)
+    ) {
+        Text(
+            text = pre.wholeText(),
+            style = TextStyle(fontFamily = FontFamily.Monospace),
+            color = MaterialTheme.colorScheme.primary,
+        )
+    }
+}
+
+@Composable
+private fun HtmlParagraph(
+    paragraph: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    Box(modifier) {
+        val styledText = buildAnnotatedString {
+            appendInlineChildrenElements(paragraph.childNodes(), MaterialTheme.colorScheme)
+        }
+        HtmlText(
+            text = styledText, onClick = onTextClicked,
+            onLongClick = onTextLongClicked, interactionSource = interactionSource
+        )
+    }
+}
+
+@Composable
+private fun HtmlBlockquote(
+    blockquote: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    val color = MaterialTheme.colorScheme.onBackground
+    Box(
+        modifier = modifier
+            .drawBehind {
+                drawLine(
+                    color = color,
+                    strokeWidth = 2f,
+                    start = Offset(12.dp.value, 0f),
+                    end = Offset(12.dp.value, size.height)
+                )
+            }
+            .padding(start = 8.dp, top = 4.dp, bottom = 4.dp)
+    ) {
+        val text = buildAnnotatedString {
+            withStyle(style = SpanStyle(fontStyle = FontStyle.Italic)) {
+                appendInlineChildrenElements(blockquote.childNodes(), MaterialTheme.colorScheme)
+            }
+        }
+        HtmlText(
+            text = text, onClick = onTextClicked,
+            onLongClick = onTextLongClicked, interactionSource = interactionSource
+        )
+    }
+}
+
+@Composable
+private fun HtmlHeading(
+    heading: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    val style = when (heading.tagName().lowercase()) {
+        "h1" -> MaterialTheme.typography.headlineLarge.copy(fontSize = 30.sp)
+        "h2" -> MaterialTheme.typography.headlineLarge.copy(fontSize = 26.sp)
+        "h3" -> MaterialTheme.typography.headlineMedium.copy(fontSize = 22.sp)
+        "h4" -> MaterialTheme.typography.headlineMedium.copy(fontSize = 18.sp)
+        "h5" -> MaterialTheme.typography.headlineSmall.copy(fontSize = 14.sp)
+        "h6" -> MaterialTheme.typography.headlineSmall.copy(fontSize = 12.sp)
+        else -> {
+            return
+        }
+    }
+    Box(modifier) {
+        val text = buildAnnotatedString {
+            appendInlineChildrenElements(heading.childNodes(), MaterialTheme.colorScheme)
+        }
+        HtmlText(
+            text = text,
+            style = style,
+            onClick = onTextClicked,
+            onLongClick = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+    }
+}
+
+@Composable
+private fun HtmlMxReply(
+    mxReply: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    val blockquote = mxReply.childNodes().firstOrNull() ?: return
+    val shape = RoundedCornerShape(12.dp)
+    Surface(
+        modifier = modifier
+            .padding(bottom = 4.dp)
+            .offset(x = -(8.dp)),
+        color = MaterialTheme.colorScheme.background,
+        shape = shape,
+    ) {
+        val text = buildAnnotatedString {
+            for (blockquoteNode in blockquote.childNodes()) {
+                when (blockquoteNode) {
+                    is TextNode -> {
+                        withStyle(
+                            style = SpanStyle(
+                                fontSize = 12.sp,
+                                color = MaterialTheme.colorScheme.secondary
+                            )
+                        ) {
+                            append(blockquoteNode.text())
+                        }
+                    }
+                    is Element -> {
+                        when (blockquoteNode.tagName().lowercase()) {
+                            "br" -> {
+                                append('\n')
+                            }
+                            "a" -> {
+                                append(blockquoteNode.ownText())
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        HtmlText(
+            text = text,
+            modifier = Modifier.padding(horizontal = 12.dp, vertical = 4.dp),
+            onClick = onTextClicked,
+            onLongClick = onTextLongClicked,
+            interactionSource = interactionSource
+        )
+    }
+}
+
+@Composable
+private fun HtmlOrderedList(
+    orderedList: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    var number = 1
+    val delimiter = "."
+    HtmlListItems(
+        list = orderedList,
+        modifier = modifier,
+        onTextClicked = onTextClicked, onTextLongClicked = onTextLongClicked,
+        interactionSource = interactionSource
+    ) {
+        val text = buildAnnotatedString {
+            append("${number++}$delimiter ${it.text()}")
+        }
+        HtmlText(
+            text = text, onClick = onTextClicked,
+            onLongClick = onTextLongClicked, interactionSource = interactionSource
+        )
+    }
+}
+
+@Composable
+private fun HtmlUnorderedList(
+    unorderedList: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+) {
+    val marker = "・"
+    HtmlListItems(
+        list = unorderedList,
+        modifier = modifier,
+        onTextClicked = onTextClicked, onTextLongClicked = onTextLongClicked,
+        interactionSource = interactionSource
+    ) {
+        val text = buildAnnotatedString {
+            append("$marker ${it.text()}")
+        }
+        HtmlText(
+            text = text, onClick = onTextClicked,
+            onLongClick = onTextLongClicked, interactionSource = interactionSource
+        )
+    }
+}
+
+@Composable
+private fun HtmlListItems(
+    list: Element,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    onTextClicked: () -> Unit = {},
+    onTextLongClicked: () -> Unit = {},
+    content: @Composable (node: TextNode) -> Unit = {}
+) {
+    Column(modifier = modifier) {
+        for (node in list.children()) {
+            for (innerNode in node.childNodes()) {
+                when (innerNode) {
+                    is TextNode -> {
+                        if (!innerNode.isBlank) content(innerNode)
+                    }
+                    is Element -> HtmlBlock(
+                        element = innerNode,
+                        modifier = Modifier.padding(start = 4.dp),
+                        onTextClicked = onTextClicked, onTextLongClicked = onTextLongClicked,
+                        interactionSource = interactionSource
+                    )
+                }
+            }
+        }
+    }
+}
+
+private fun ColorScheme.codeBackground(): Color {
+    return background.copy(alpha = 0.3f)
+}
+
+private fun AnnotatedString.Builder.appendInlineChildrenElements(
+    childNodes: List<Node>,
+    colors: ColorScheme
+) {
+    for (node in childNodes) {
+        when (node) {
+            is TextNode -> {
+                append(node.text())
+            }
+            is Element -> {
+                appendInlineElement(node, colors)
+            }
+        }
+    }
+}
+
+private fun AnnotatedString.Builder.appendInlineElement(element: Element, colors: ColorScheme) {
+    when (element.tagName().lowercase()) {
+        "br" -> {
+            append('\n')
+        }
+        "code" -> {
+            withStyle(
+                style = TextStyle(
+                    fontFamily = FontFamily.Monospace,
+                    background = colors.codeBackground()
+                ).toSpanStyle()
+            ) {
+                appendInlineChildrenElements(element.childNodes(), colors)
+            }
+        }
+        "del" -> {
+            withStyle(style = SpanStyle(textDecoration = TextDecoration.LineThrough)) {
+                appendInlineChildrenElements(element.childNodes(), colors)
+            }
+        }
+        "i",
+        "em" -> {
+            withStyle(style = SpanStyle(fontStyle = FontStyle.Italic)) {
+                appendInlineChildrenElements(element.childNodes(), colors)
+            }
+        }
+        "strong" -> {
+            withStyle(style = SpanStyle(fontWeight = FontWeight.Bold)) {
+                appendInlineChildrenElements(element.childNodes(), colors)
+            }
+        }
+        "a" -> {
+            appendLink(element)
+        }
+        else -> {
+            appendInlineChildrenElements(element.childNodes(), colors)
+        }
+    }
+}
+
+private fun AnnotatedString.Builder.appendLink(link: Element) {
+    val uriString = link.attr("href")
+    val permalinkData = PermalinkParser.parse(uriString)
+    when (permalinkData) {
+        is PermalinkData.FallbackLink -> {
+            pushStringAnnotation(tag = "URL", annotation = link.ownText())
+            withStyle(
+                style = SpanStyle(color = LinkColor)
+            ) {
+                append(link.ownText())
+            }
+            pop()
+        }
+        is PermalinkData.RoomEmailInviteLink -> {
+            appendInlineContent(chipId, link.ownText())
+        }
+        is PermalinkData.RoomLink -> {
+            appendInlineContent(chipId, link.ownText())
+        }
+        is PermalinkData.UserLink -> {
+            appendInlineContent(chipId, link.ownText())
+        }
+    }
+}
+
+@Composable
+private fun HtmlText(
+    text: AnnotatedString,
+    interactionSource: MutableInteractionSource,
+    modifier: Modifier = Modifier,
+    style: TextStyle = LocalTextStyle.current,
+    onClick: () -> Unit = {},
+    onLongClick: () -> Unit = {},
+) {
+    val inlineContentMap = persistentMapOf<String, InlineTextContent>()
+    ClickableLinkText(
+        text = text,
+        linkAnnotationTag = "URL",
+        style = style,
+        modifier = modifier,
+        inlineContent = inlineContentMap,
+        interactionSource = interactionSource,
+        onClick = onClick,
+        onLongClick = onLongClick
+    )
+}
+
+@Preview
+@Composable
+internal fun HtmlDocumentLightPreview(@PreviewParameter(DocumentProvider::class) document: Document) =
+    ElementPreviewLight { ContentToPreview(document) }
+
+@Preview
+@Composable
+internal fun HtmlDocumentDarkPreview(@PreviewParameter(DocumentProvider::class) document: Document) =
+    ElementPreviewDark { ContentToPreview(document) }
+
+@Composable
+private fun ContentToPreview(document: Document) {
+    HtmlDocument(document, MutableInteractionSource())
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/virtual/TimelineItemDaySeparatorView.kt

@@ -0,0 +1,74 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.virtual
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemDaySeparatorModel
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemDaySeparatorModelProvider
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.components.Text
+
+@Composable
+internal fun TimelineItemDaySeparatorView(
+    model: TimelineItemDaySeparatorModel,
+    modifier: Modifier = Modifier
+) {
+    Box(
+        modifier
+            .fillMaxWidth()
+            .wrapContentHeight()
+            .padding(8.dp),
+        contentAlignment = Alignment.Center,
+    ) {
+        Text(
+            text = model.formattedDate,
+            color = MaterialTheme.colorScheme.secondary,
+        )
+    }
+}
+
+@Preview
+@Composable
+internal fun TimelineItemDaySeparatorViewLightPreview(@PreviewParameter(
+    TimelineItemDaySeparatorModelProvider::class) model: TimelineItemDaySeparatorModel
+) =
+    ElementPreviewLight { ContentToPreview(model) }
+
+@Preview
+@Composable
+internal fun TimelineItemDaySeparatorViewDarkPreview(@PreviewParameter(
+    TimelineItemDaySeparatorModelProvider::class) model: TimelineItemDaySeparatorModel
+) =
+    ElementPreviewDark { ContentToPreview(model) }
+
+@Composable
+private fun ContentToPreview(model: TimelineItemDaySeparatorModel) {
+    TimelineItemDaySeparatorView(
+        model = model,
+    )
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/virtual/TimelineItemLoadingMoreIndicator.kt

@@ -0,0 +1,60 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.components.virtual
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
+
+@Composable
+internal fun TimelineLoadingMoreIndicator(modifier: Modifier = Modifier) {
+    Box(
+        modifier
+            .fillMaxWidth()
+            .wrapContentHeight()
+            .padding(8.dp),
+        contentAlignment = Alignment.Center,
+    ) {
+        CircularProgressIndicator(
+            strokeWidth = 2.dp,
+        )
+    }
+}
+
+@Preview
+@Composable
+internal fun TimelineLoadingMoreIndicatorLightPreview() =
+    ElementPreviewLight { ContentToPreview() }
+
+@Preview
+@Composable
+internal fun TimelineLoadingMoreIndicatorDarkPreview() =
+    ElementPreviewDark { ContentToPreview() }
+
+@Composable
+private fun ContentToPreview() {
+    TimelineLoadingMoreIndicator()
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/diff/CacheInvalidator.kt

@@ -0,0 +1,56 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.diff
+
+import androidx.recyclerview.widget.ListUpdateCallback
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.util.invalidateLast
+import timber.log.Timber
+
+internal class CacheInvalidator(private val itemStatesCache: MutableList<TimelineItem?>) :
+    ListUpdateCallback {
+
+    override fun onChanged(position: Int, count: Int, payload: Any?) {
+        Timber.v("onChanged(position= $position, count= $count")
+        (position until position + count).forEach {
+            // Invalidate cache
+            itemStatesCache[it] = null
+        }
+    }
+
+    override fun onMoved(fromPosition: Int, toPosition: Int) {
+        Timber.v("onMoved(fromPosition= $fromPosition, toPosition= $toPosition")
+        val model = itemStatesCache.removeAt(fromPosition)
+        itemStatesCache.add(toPosition, model)
+    }
+
+    override fun onInserted(position: Int, count: Int) {
+        Timber.v("onInserted(position= $position, count= $count")
+        itemStatesCache.invalidateLast()
+        repeat(count) {
+            itemStatesCache.add(position, null)
+        }
+    }
+
+    override fun onRemoved(position: Int, count: Int) {
+        Timber.v("onRemoved(position= $position, count= $count")
+        itemStatesCache.invalidateLast()
+        repeat(count) {
+            itemStatesCache.removeAt(position)
+        }
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/diff/MatrixTimelineItemsDiffCallback.kt

@@ -0,0 +1,50 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.diff
+
+import androidx.recyclerview.widget.DiffUtil
+import io.element.android.libraries.matrix.timeline.MatrixTimelineItem
+
+internal class MatrixTimelineItemsDiffCallback(
+    private val oldList: List<MatrixTimelineItem>,
+    private val newList: List<MatrixTimelineItem>
+) : DiffUtil.Callback() {
+
+    override fun getOldListSize(): Int {
+        return oldList.size
+    }
+
+    override fun getNewListSize(): Int {
+        return newList.size
+    }
+
+    override fun areItemsTheSame(oldItemPosition: Int, newItemPosition: Int): Boolean {
+        val oldItem = oldList.getOrNull(oldItemPosition)
+        val newItem = newList.getOrNull(newItemPosition)
+        return if (oldItem is MatrixTimelineItem.Event && newItem is MatrixTimelineItem.Event) {
+            oldItem.uniqueId == newItem.uniqueId
+        } else {
+            false
+        }
+    }
+
+    override fun areContentsTheSame(oldItemPosition: Int, newItemPosition: Int): Boolean {
+        val oldItem = oldList.getOrNull(oldItemPosition)
+        val newItem = newList.getOrNull(newItemPosition)
+        return oldItem == newItem
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/TimelineItemsFactory.kt

@@ -0,0 +1,105 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories
+
+import androidx.recyclerview.widget.DiffUtil
+import io.element.android.features.messages.impl.timeline.diff.CacheInvalidator
+import io.element.android.features.messages.impl.timeline.diff.MatrixTimelineItemsDiffCallback
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemEventFactory
+import io.element.android.features.messages.impl.timeline.factories.virtual.TimelineItemVirtualFactory
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.libraries.core.coroutine.CoroutineDispatchers
+import io.element.android.libraries.matrix.timeline.MatrixTimelineItem
+import kotlinx.coroutines.flow.MutableStateFlow
+import kotlinx.coroutines.flow.StateFlow
+import kotlinx.coroutines.flow.asStateFlow
+import kotlinx.coroutines.sync.Mutex
+import kotlinx.coroutines.sync.withLock
+import kotlinx.coroutines.withContext
+import timber.log.Timber
+import javax.inject.Inject
+import kotlin.system.measureTimeMillis
+
+class TimelineItemsFactory @Inject constructor(
+    private val dispatchers: CoroutineDispatchers,
+    private val eventItemFactory: TimelineItemEventFactory,
+    private val virtualItemFactory: TimelineItemVirtualFactory,
+) {
+
+    private val timelineItems = MutableStateFlow<List<TimelineItem>>(emptyList())
+    private val timelineItemsCache = arrayListOf<TimelineItem?>()
+
+    // Items from rust sdk, used for diffing
+    private var matrixTimelineItems: List<MatrixTimelineItem> = emptyList()
+
+    private val lock = Mutex()
+    private val cacheInvalidator = CacheInvalidator(timelineItemsCache)
+
+    fun flow(): StateFlow<List<TimelineItem>> = timelineItems.asStateFlow()
+
+    suspend fun replaceWith(
+        timelineItems: List<MatrixTimelineItem>,
+    ) = withContext(dispatchers.computation) {
+        lock.withLock {
+            calculateAndApplyDiff(timelineItems)
+            buildAndEmitTimelineItemStates(timelineItems)
+        }
+    }
+
+    private suspend fun buildAndEmitTimelineItemStates(timelineItems: List<MatrixTimelineItem>) {
+        val newTimelineItemStates = ArrayList<TimelineItem>()
+        for (index in timelineItemsCache.indices.reversed()) {
+            val cacheItem = timelineItemsCache[index]
+            if (cacheItem == null) {
+                buildAndCacheItem(timelineItems, index)?.also { timelineItemState ->
+                    newTimelineItemStates.add(timelineItemState)
+                }
+            } else {
+                newTimelineItemStates.add(cacheItem)
+            }
+        }
+        this.timelineItems.emit(newTimelineItemStates)
+    }
+
+    private fun calculateAndApplyDiff(newTimelineItems: List<MatrixTimelineItem>) {
+        val timeToDiff = measureTimeMillis {
+            val diffCallback =
+                MatrixTimelineItemsDiffCallback(
+                    oldList = matrixTimelineItems,
+                    newList = newTimelineItems
+                )
+            val diffResult = DiffUtil.calculateDiff(diffCallback, false)
+            matrixTimelineItems = newTimelineItems
+            diffResult.dispatchUpdatesTo(cacheInvalidator)
+        }
+        Timber.v("Time to apply diff on new list of ${newTimelineItems.size} items: $timeToDiff ms")
+    }
+
+    private suspend fun buildAndCacheItem(
+        timelineItems: List<MatrixTimelineItem>,
+        index: Int
+    ): TimelineItem? {
+        val timelineItemState =
+            when (val currentTimelineItem = timelineItems[index]) {
+                is MatrixTimelineItem.Event -> eventItemFactory.create(currentTimelineItem, index, timelineItems)
+                is MatrixTimelineItem.Virtual -> virtualItemFactory.create(currentTimelineItem, index, timelineItems)
+                MatrixTimelineItem.Other -> null
+            }
+        timelineItemsCache[index] = timelineItemState
+        return timelineItemState
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentFactory.kt

@@ -0,0 +1,50 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+typealias RustTimelineItemContent = org.matrix.rustcomponents.sdk.TimelineItemContent
+
+class TimelineItemContentFactory @Inject constructor(
+    private val messageFactory: TimelineItemContentMessageFactory,
+    private val redactedMessageFactory: TimelineItemContentRedactedFactory,
+    private val stickerFactory: TimelineItemContentStickerFactory,
+    private val utdFactory: TimelineItemContentUTDFactory,
+    private val roomMembershipFactory: TimelineItemContentRoomMembershipFactory,
+    private val profileChangeFactory: TimelineItemContentProfileChangeFactory,
+    private val stateFactory: TimelineItemContentStateFactory,
+    private val failedToParseMessageFactory: TimelineItemContentFailedToParseMessageFactory,
+    private val failedToParseStateFactory: TimelineItemContentFailedToParseStateFactory
+) {
+
+    fun create(itemContent: RustTimelineItemContent): TimelineItemEventContent {
+        return when (val kind = itemContent.kind()) {
+            is TimelineItemContentKind.Message -> messageFactory.create(itemContent.asMessage())
+            is TimelineItemContentKind.RedactedMessage -> redactedMessageFactory.create(kind)
+            is TimelineItemContentKind.Sticker -> stickerFactory.create(kind)
+            is TimelineItemContentKind.UnableToDecrypt -> utdFactory.create(kind)
+            is TimelineItemContentKind.RoomMembership -> roomMembershipFactory.create(kind)
+            is TimelineItemContentKind.ProfileChange -> profileChangeFactory.create(kind)
+            is TimelineItemContentKind.State -> stateFactory.create(kind)
+            is TimelineItemContentKind.FailedToParseMessageLike -> failedToParseMessageFactory.create(kind)
+            is TimelineItemContentKind.FailedToParseState -> failedToParseStateFactory.create(kind)
+        }
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentFailedToParseMessageFactory.kt

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+class TimelineItemContentFailedToParseMessageFactory @Inject constructor() {
+
+    fun create(kind: TimelineItemContentKind.FailedToParseMessageLike): TimelineItemEventContent {
+        return TimelineItemUnknownContent
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentFailedToParseStateFactory.kt

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+class TimelineItemContentFailedToParseStateFactory @Inject constructor() {
+
+    fun create(kind: TimelineItemContentKind.FailedToParseState): TimelineItemEventContent {
+        return TimelineItemUnknownContent
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentMessageFactory.kt

@@ -0,0 +1,68 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEmoteContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemImageContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemNoticeContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+import io.element.android.features.messages.impl.timeline.util.toHtmlDocument
+import io.element.android.libraries.matrix.media.MediaResolver
+import org.matrix.rustcomponents.sdk.Message
+import org.matrix.rustcomponents.sdk.MessageType
+import javax.inject.Inject
+
+class TimelineItemContentMessageFactory @Inject constructor() {
+
+    fun create(contentAsMessage: Message?): TimelineItemEventContent {
+        return when (val messageType = contentAsMessage?.msgtype()) {
+            is MessageType.Emote -> TimelineItemEmoteContent(
+                body = messageType.content.body,
+                htmlDocument = messageType.content.formatted?.toHtmlDocument()
+            )
+            is MessageType.Image -> {
+                val height = messageType.content.info?.height?.toFloat()
+                val width = messageType.content.info?.width?.toFloat()
+                val aspectRatio = if (height != null && width != null) {
+                    width / height
+                } else {
+                    0.7f
+                }
+                TimelineItemImageContent(
+                    body = messageType.content.body,
+                    imageMeta = MediaResolver.Meta(
+                        source = messageType.content.source,
+                        kind = MediaResolver.Kind.Content
+                    ),
+                    blurhash = messageType.content.info?.blurhash,
+                    aspectRatio = aspectRatio
+                )
+            }
+            is MessageType.Notice -> TimelineItemNoticeContent(
+                body = messageType.content.body,
+                htmlDocument = messageType.content.formatted?.toHtmlDocument()
+            )
+            is MessageType.Text -> TimelineItemTextContent(
+                body = messageType.content.body,
+                htmlDocument = messageType.content.formatted?.toHtmlDocument()
+            )
+            else -> TimelineItemUnknownContent
+        }
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentProfileChangeFactory.kt

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+class TimelineItemContentProfileChangeFactory @Inject constructor() {
+
+    fun create(kind: TimelineItemContentKind.ProfileChange): TimelineItemEventContent {
+        return TimelineItemUnknownContent
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentRedactedFactory.kt

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemRedactedContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+class TimelineItemContentRedactedFactory @Inject constructor() {
+
+    fun create(kind: TimelineItemContentKind.RedactedMessage): TimelineItemEventContent {
+        return TimelineItemRedactedContent
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentRoomMembershipFactory.kt

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+class TimelineItemContentRoomMembershipFactory @Inject constructor() {
+
+    fun create(kind: TimelineItemContentKind.RoomMembership): TimelineItemEventContent {
+        return TimelineItemUnknownContent
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentStateFactory.kt

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+class TimelineItemContentStateFactory @Inject constructor() {
+
+    fun create(kind: TimelineItemContentKind.State): TimelineItemEventContent {
+        return TimelineItemUnknownContent
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentStickerFactory.kt

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+class TimelineItemContentStickerFactory @Inject constructor() {
+
+    fun create(kind: TimelineItemContentKind.Sticker): TimelineItemEventContent {
+        return TimelineItemUnknownContent
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemContentUTDFactory.kt

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEncryptedContent
+import org.matrix.rustcomponents.sdk.TimelineItemContentKind
+import javax.inject.Inject
+
+class TimelineItemContentUTDFactory @Inject constructor() {
+
+    fun create(kind: TimelineItemContentKind.UnableToDecrypt): TimelineItemEventContent {
+        return TimelineItemEncryptedContent(kind.msg)
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/event/TimelineItemEventFactory.kt

@@ -0,0 +1,104 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.event
+
+import io.element.android.features.messages.impl.timeline.model.AggregatedReaction
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.model.TimelineItemGroupPosition
+import io.element.android.features.messages.impl.timeline.model.TimelineItemReactions
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.designsystem.components.avatar.AvatarSize
+import io.element.android.libraries.matrix.timeline.MatrixTimelineItem
+import kotlinx.collections.immutable.toImmutableList
+import org.matrix.rustcomponents.sdk.ProfileTimelineDetails
+import javax.inject.Inject
+
+class TimelineItemEventFactory @Inject constructor(
+    private val contentFactory: TimelineItemContentFactory,
+) {
+
+    fun create(
+        currentTimelineItem: MatrixTimelineItem.Event,
+        index: Int,
+        timelineItems: List<MatrixTimelineItem>,
+    ): TimelineItem.Event {
+        val currentSender = currentTimelineItem.event.sender()
+        val groupPosition =
+            computeGroupPosition(currentTimelineItem, timelineItems, index)
+        val senderDisplayName: String?
+        val senderAvatarUrl: String?
+
+        when (val senderProfile = currentTimelineItem.event.senderProfile()) {
+            ProfileTimelineDetails.Unavailable,
+            ProfileTimelineDetails.Pending,
+            is ProfileTimelineDetails.Error -> {
+                senderDisplayName = null
+                senderAvatarUrl = null
+            }
+            is ProfileTimelineDetails.Ready -> {
+                senderDisplayName = senderProfile.displayName
+                senderAvatarUrl = senderProfile.avatarUrl
+            }
+        }
+
+        val senderAvatarData = AvatarData(
+            id = currentSender,
+            name = senderDisplayName ?: currentSender,
+            url = senderAvatarUrl,
+            size = AvatarSize.SMALL
+        )
+        return TimelineItem.Event(
+            id = currentTimelineItem.uniqueId,
+            eventId = currentTimelineItem.eventId,
+            senderId = currentSender,
+            senderDisplayName = senderDisplayName,
+            senderAvatar = senderAvatarData,
+            content = contentFactory.create(currentTimelineItem.event.content()),
+            isMine = currentTimelineItem.event.isOwn(),
+            groupPosition = groupPosition,
+            reactionsState = currentTimelineItem.computeReactionsState()
+        )
+    }
+
+    private fun MatrixTimelineItem.Event.computeReactionsState(): TimelineItemReactions {
+        val aggregatedReactions = event.reactions().orEmpty().map {
+            AggregatedReaction(key = it.key, count = it.count.toString(), isHighlighted = false)
+        }
+        return TimelineItemReactions(aggregatedReactions.toImmutableList())
+    }
+
+    private fun computeGroupPosition(
+        currentTimelineItem: MatrixTimelineItem.Event,
+        timelineItems: List<MatrixTimelineItem>,
+        index: Int
+    ): TimelineItemGroupPosition {
+        val prevTimelineItem =
+            timelineItems.getOrNull(index - 1) as? MatrixTimelineItem.Event
+        val nextTimelineItem =
+            timelineItems.getOrNull(index + 1) as? MatrixTimelineItem.Event
+        val currentSender = currentTimelineItem.event.sender()
+        val previousSender = prevTimelineItem?.event?.sender()
+        val nextSender = nextTimelineItem?.event?.sender()
+
+        return when {
+            previousSender != currentSender && nextSender == currentSender -> TimelineItemGroupPosition.First
+            previousSender == currentSender && nextSender == currentSender -> TimelineItemGroupPosition.Middle
+            previousSender == currentSender && nextSender != currentSender -> TimelineItemGroupPosition.Last
+            else -> TimelineItemGroupPosition.None
+        }
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/virtual/TimelineItemDaySeparatorFactory.kt

@@ -0,0 +1,33 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.virtual
+
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemDaySeparatorModel
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemVirtualModel
+import io.element.android.libraries.dateformatter.DaySeparatorFormatter
+import org.matrix.rustcomponents.sdk.VirtualTimelineItem
+import javax.inject.Inject
+
+class TimelineItemDaySeparatorFactory @Inject constructor(private val daySeparatorFormatter: DaySeparatorFormatter) {
+
+    fun create(virtualItem: VirtualTimelineItem.DayDivider): TimelineItemVirtualModel {
+        val formattedDate = daySeparatorFormatter.format(virtualItem.ts.toLong())
+        return TimelineItemDaySeparatorModel(
+            formattedDate = formattedDate
+        )
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/factories/virtual/TimelineItemVirtualFactory.kt

@@ -0,0 +1,52 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.factories.virtual
+
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemLoadingModel
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemReadMarkerModel
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemUnknownVirtualModel
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemVirtualModel
+import io.element.android.libraries.matrix.timeline.MatrixTimelineItem
+import org.matrix.rustcomponents.sdk.VirtualTimelineItem
+import javax.inject.Inject
+
+class TimelineItemVirtualFactory @Inject constructor(
+    private val daySeparatorFactory: TimelineItemDaySeparatorFactory,
+) {
+
+    fun create(
+        currentTimelineItem: MatrixTimelineItem.Virtual,
+        index: Int,
+        timelineItems: List<MatrixTimelineItem>,
+    ): TimelineItem.Virtual {
+        return TimelineItem.Virtual(
+            id = "virtual_item_$index",
+            model = currentTimelineItem.computeModel(index)
+        )
+    }
+
+    private fun MatrixTimelineItem.Virtual.computeModel(index: Int): TimelineItemVirtualModel {
+        return when (val inner = virtual) {
+            is VirtualTimelineItem.DayDivider -> daySeparatorFactory.create(inner)
+            is VirtualTimelineItem.ReadMarker -> TimelineItemReadMarkerModel
+            is VirtualTimelineItem.LoadingIndicator -> TimelineItemLoadingModel
+            is VirtualTimelineItem.TimelineStart -> TimelineItemReadMarkerModel
+            else -> TimelineItemUnknownVirtualModel
+        }
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/AggregatedReaction.kt

@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model
+
+data class AggregatedReaction(
+    val key: String,
+    val count: String,
+    val isHighlighted: Boolean = false
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/AggregatedReactionProvider.kt

@@ -0,0 +1,35 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+
+open class AggregatedReactionProvider : PreviewParameterProvider<AggregatedReaction> {
+    override val values: Sequence<AggregatedReaction>
+        get() = sequenceOf(
+            anAggregatedReaction(),
+            anAggregatedReaction().copy(count = "88"),
+            anAggregatedReaction().copy(isHighlighted = true),
+            anAggregatedReaction().copy(count = "88", isHighlighted = true),
+        )
+}
+
+fun anAggregatedReaction() = AggregatedReaction(
+    key = "👍",
+    count = "1", // TODO Why is it a String?
+    isHighlighted = false,
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/TimelineItem.kt

@@ -0,0 +1,57 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model
+
+import androidx.compose.runtime.Immutable
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.virtual.TimelineItemVirtualModel
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.matrix.core.EventId
+
+@Immutable
+sealed interface TimelineItem {
+
+    fun identifier(): String = when(this){
+        is Event -> id
+        is Virtual -> id
+    }
+
+    @Immutable
+    data class Virtual(
+        val id: String,
+        val model: TimelineItemVirtualModel
+    ) : TimelineItem
+
+    @Immutable
+    data class Event(
+        val id: String,
+        val eventId: EventId? = null,
+        val senderId: String,
+        val senderDisplayName: String?,
+        val senderAvatar: AvatarData,
+        val content: TimelineItemEventContent,
+        val sentTime: String = "",
+        val isMine: Boolean = false,
+        val groupPosition: TimelineItemGroupPosition = TimelineItemGroupPosition.None,
+        val reactionsState: TimelineItemReactions
+    ) : TimelineItem {
+
+        val showSenderInformation = groupPosition.isNew() && !isMine
+
+        val safeSenderName: String = senderDisplayName ?: senderId
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/TimelineItemGroupPosition.kt

@@ -0,0 +1,33 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model
+
+import androidx.compose.runtime.Immutable
+
+@Immutable
+sealed interface TimelineItemGroupPosition {
+    object First : TimelineItemGroupPosition
+    object Middle : TimelineItemGroupPosition
+    object Last : TimelineItemGroupPosition
+    object None : TimelineItemGroupPosition
+
+    fun isNew(): Boolean = when (this) {
+        First, None -> true
+        else -> false
+    }
+}
+

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/TimelineItemGroupPositionProvider.kt

@@ -0,0 +1,28 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+
+internal class TimelineItemGroupPositionProvider : PreviewParameterProvider<TimelineItemGroupPosition> {
+    override val values = sequenceOf(
+        TimelineItemGroupPosition.First,
+        TimelineItemGroupPosition.Middle,
+        TimelineItemGroupPosition.Last,
+        TimelineItemGroupPosition.None,
+    )
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/TimelineItemReactions.kt

@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model
+
+import kotlinx.collections.immutable.ImmutableList
+
+data class TimelineItemReactions(
+    val reactions: ImmutableList<AggregatedReaction>
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/TimelineItemReactionsProvider.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model
+
+import kotlinx.collections.immutable.toPersistentList
+
+fun aTimelineItemReactions() = TimelineItemReactions(
+    // Use values from AggregatedReactionProvider
+    reactions = AggregatedReactionProvider().values.toPersistentList()
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/bubble/BubbleState.kt

@@ -0,0 +1,25 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.bubble
+
+import io.element.android.features.messages.impl.timeline.model.TimelineItemGroupPosition
+
+data class BubbleState(
+    val groupPosition: TimelineItemGroupPosition,
+    val isMine: Boolean,
+    val isHighlighted: Boolean,
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/bubble/BubbleStateProvider.kt

@@ -0,0 +1,43 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.bubble
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+import io.element.android.features.messages.impl.timeline.model.TimelineItemGroupPosition
+
+open class BubbleStateProvider : PreviewParameterProvider<BubbleState> {
+    override val values: Sequence<BubbleState>
+        get() = sequenceOf(
+            TimelineItemGroupPosition.First,
+            TimelineItemGroupPosition.Middle,
+            TimelineItemGroupPosition.Last,
+        ).map { groupPosition ->
+            sequenceOf(false, true).map { isMine ->
+                sequenceOf(false, true).map { isHighlighted ->
+                    BubbleState(groupPosition, isMine = isMine, isHighlighted = isHighlighted)
+                }
+            }
+                .flatten()
+        }
+            .flatten()
+}
+
+fun aBubbleState() = BubbleState(
+    groupPosition = TimelineItemGroupPosition.First,
+    isMine = false,
+    isHighlighted = false,
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemEmoteContent.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import org.jsoup.nodes.Document
+
+data class TimelineItemEmoteContent(
+    override val body: String,
+    override val htmlDocument: Document?
+) : TimelineItemTextBasedContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemEncryptedContent.kt

@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import org.matrix.rustcomponents.sdk.EncryptedMessage
+
+data class TimelineItemEncryptedContent(
+    val encryptedMessage: EncryptedMessage
+) : TimelineItemEventContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemEventContent.kt

@@ -0,0 +1,22 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import androidx.compose.runtime.Immutable
+
+@Immutable
+sealed interface TimelineItemEventContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemEventContentProvider.kt

@@ -0,0 +1,67 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+import org.jsoup.Jsoup
+import org.matrix.rustcomponents.sdk.EncryptedMessage
+
+class TimelineItemEventContentProvider : PreviewParameterProvider<TimelineItemEventContent> {
+    override val values = sequenceOf(
+        aTimelineItemEmoteContent(),
+        aTimelineItemEncryptedContent(),
+        // TODO MessagesTimelineItemImageContent(),
+        aTimelineItemNoticeContent(),
+        aTimelineItemRedactedContent(),
+        aTimelineItemTextContent(),
+        aTimelineItemUnknownContent(),
+    )
+}
+
+class TimelineItemTextBasedContentProvider : PreviewParameterProvider<TimelineItemTextBasedContent> {
+    override val values = sequenceOf(
+        aTimelineItemEmoteContent(),
+        aTimelineItemEmoteContent().copy(htmlDocument = Jsoup.parse("Emote")),
+        aTimelineItemNoticeContent(),
+        aTimelineItemNoticeContent().copy(htmlDocument = Jsoup.parse("Notice")),
+        aTimelineItemTextContent(),
+        aTimelineItemTextContent().copy(htmlDocument = Jsoup.parse("Text")),
+    )
+}
+
+fun aTimelineItemEmoteContent() = TimelineItemEmoteContent(
+    body = "Emote",
+    htmlDocument = null
+)
+
+fun aTimelineItemEncryptedContent() = TimelineItemEncryptedContent(
+    encryptedMessage = EncryptedMessage.Unknown
+)
+
+fun aTimelineItemNoticeContent() = TimelineItemNoticeContent(
+    body = "Notice",
+    htmlDocument = null
+)
+
+fun aTimelineItemRedactedContent() = TimelineItemRedactedContent
+
+fun aTimelineItemTextContent() = TimelineItemTextContent(
+    body = "Text",
+    htmlDocument = null
+)
+
+fun aTimelineItemUnknownContent() = TimelineItemUnknownContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemImageContent.kt

@@ -0,0 +1,26 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import io.element.android.libraries.matrix.media.MediaResolver
+
+data class TimelineItemImageContent(
+    val body: String,
+    val imageMeta: MediaResolver.Meta,
+    val blurhash: String?,
+    val aspectRatio: Float
+) : TimelineItemEventContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemImageContentProvider.kt

@@ -0,0 +1,36 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+import io.element.android.libraries.matrix.media.MediaResolver
+
+open class TimelineItemImageContentProvider : PreviewParameterProvider<TimelineItemImageContent> {
+    override val values: Sequence<TimelineItemImageContent>
+        get() = sequenceOf(
+            aTimelineItemImageContent(),
+            aTimelineItemImageContent().copy(aspectRatio = 1.0f),
+            aTimelineItemImageContent().copy(aspectRatio = 1.5f),
+        )
+}
+
+fun aTimelineItemImageContent() = TimelineItemImageContent(
+    body = "a body",
+    imageMeta = MediaResolver.Meta(source = null, kind = MediaResolver.Kind.Content),
+    blurhash = null,
+    aspectRatio = 0.5f,
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemNoticeContent.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import org.jsoup.nodes.Document
+
+data class TimelineItemNoticeContent(
+    override val body: String,
+    override val htmlDocument: Document?
+) : TimelineItemTextBasedContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemRedactedContent.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+object TimelineItemRedactedContent : TimelineItemEventContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemTextBasedContent.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import org.jsoup.nodes.Document
+
+sealed interface TimelineItemTextBasedContent : TimelineItemEventContent {
+    val body: String
+    val htmlDocument: Document?
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemTextContent.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+import org.jsoup.nodes.Document
+
+data class TimelineItemTextContent(
+    override val body: String,
+    override val htmlDocument: Document?
+) : TimelineItemTextBasedContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/event/TimelineItemUnknownContent.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.event
+
+object TimelineItemUnknownContent : TimelineItemEventContent

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/virtual/TimelineItemDaySeparatorModel.kt

@@ -0,0 +1,21 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.virtual
+
+data class TimelineItemDaySeparatorModel(
+    val formattedDate: String
+) : TimelineItemVirtualModel

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/virtual/TimelineItemDaySeparatorModelProvider.kt

@@ -0,0 +1,30 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.virtual
+
+import androidx.compose.ui.tooling.preview.PreviewParameterProvider
+
+class TimelineItemDaySeparatorModelProvider : PreviewParameterProvider<TimelineItemDaySeparatorModel> {
+    override val values = sequenceOf(
+        aTimelineItemDaySeparatorModel("Today"),
+        aTimelineItemDaySeparatorModel("March 6, 2023")
+    )
+}
+
+fun aTimelineItemDaySeparatorModel(formattedDate: String) = TimelineItemDaySeparatorModel(
+    formattedDate = formattedDate
+)

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/virtual/TimelineItemLoadingModel.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.virtual
+
+object TimelineItemLoadingModel : TimelineItemVirtualModel

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/virtual/TimelineItemReadMarkerModel.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.virtual
+
+object TimelineItemReadMarkerModel : TimelineItemVirtualModel

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/virtual/TimelineItemTimelineStartModel.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.virtual
+
+object TimelineItemTimelineStartModel : TimelineItemVirtualModel

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/virtual/TimelineItemUnknownVirtualModel.kt

@@ -0,0 +1,19 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.virtual
+
+object TimelineItemUnknownVirtualModel : TimelineItemVirtualModel

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/model/virtual/TimelineItemVirtualModel.kt

@@ -0,0 +1,22 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.model.virtual
+
+import androidx.compose.runtime.Immutable
+
+@Immutable
+sealed interface TimelineItemVirtualModel

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/util/MutableListExt.kt

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.util
+
+internal inline fun <reified T> MutableList<T?>.invalidateLast() {
+    val indexOfLast = size
+    if (indexOfLast > 0) {
+        set(indexOfLast - 1, null)
+    }
+}

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/util/toHtmlDocument.kt

@@ -0,0 +1,28 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.impl.timeline.util
+
+import org.jsoup.Jsoup
+import org.jsoup.nodes.Document
+import org.matrix.rustcomponents.sdk.FormattedBody
+import org.matrix.rustcomponents.sdk.MessageFormat
+
+fun FormattedBody.toHtmlDocument(): Document? {
+    return takeIf { it.format == MessageFormat.HTML }?.body?.let { formattedBody ->
+        Jsoup.parse(formattedBody)
+    }
+}

features/messages/impl/src/test/kotlin/io/element/android/features/messages/MessagesPresenterTest.kt

@@ -0,0 +1,147 @@
+/*
+ * Copyright (c) 2022 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@file:OptIn(ExperimentalCoroutinesApi::class)
+
+package io.element.android.features.messages
+
+import app.cash.molecule.RecompositionClock
+import app.cash.molecule.moleculeFlow
+import app.cash.turbine.test
+import com.google.common.truth.Truth.assertThat
+import io.element.android.features.messages.impl.actionlist.ActionListPresenter
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.fixtures.aMessageEvent
+import io.element.android.features.messages.fixtures.aTimelineItemsFactory
+import io.element.android.features.messages.impl.MessagesEvents
+import io.element.android.features.messages.impl.MessagesPresenter
+import io.element.android.features.messages.impl.textcomposer.MessageComposerPresenter
+import io.element.android.features.messages.impl.timeline.TimelinePresenter
+import io.element.android.libraries.matrix.room.MatrixRoom
+import io.element.android.libraries.matrixtest.AN_EVENT_ID
+import io.element.android.libraries.matrixtest.A_ROOM_ID
+import io.element.android.libraries.matrixtest.room.FakeMatrixRoom
+import io.element.android.libraries.textcomposer.MessageComposerMode
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.test.TestScope
+import kotlinx.coroutines.test.runTest
+import org.junit.Test
+
+class MessagesPresenterTest {
+    @Test
+    fun `present - initial state`() = runTest {
+        val presenter = createMessagePresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            skipItems(1)
+            val initialState = awaitItem()
+            assertThat(initialState.roomId).isEqualTo(A_ROOM_ID)
+        }
+    }
+
+    @Test
+    fun `present - handle action forward`() = runTest {
+        val presenter = createMessagePresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            skipItems(1)
+            val initialState = awaitItem()
+            initialState.eventSink.invoke(MessagesEvents.HandleAction(TimelineItemAction.Forward, aMessageEvent()))
+            // Still a TODO in the code
+        }
+    }
+
+    @Test
+    fun `present - handle action copy`() = runTest {
+        val presenter = createMessagePresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            skipItems(1)
+            val initialState = awaitItem()
+            initialState.eventSink.invoke(MessagesEvents.HandleAction(TimelineItemAction.Copy, aMessageEvent()))
+            // Still a TODO in the code
+        }
+    }
+
+    @Test
+    fun `present - handle action reply`() = runTest {
+        val presenter = createMessagePresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            skipItems(1)
+            val initialState = awaitItem()
+            initialState.eventSink.invoke(MessagesEvents.HandleAction(TimelineItemAction.Reply, aMessageEvent()))
+            skipItems(1)
+            val finalState = awaitItem()
+            assertThat(finalState.composerState.mode).isInstanceOf(MessageComposerMode.Reply::class.java)
+        }
+    }
+
+    @Test
+    fun `present - handle action edit`() = runTest {
+        val presenter = createMessagePresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            skipItems(1)
+            val initialState = awaitItem()
+            initialState.eventSink.invoke(MessagesEvents.HandleAction(TimelineItemAction.Edit, aMessageEvent()))
+            skipItems(1)
+            val finalState = awaitItem()
+            assertThat(finalState.composerState.mode).isInstanceOf(MessageComposerMode.Edit::class.java)
+        }
+    }
+
+    @Test
+    fun `present - handle action redact`() = runTest {
+        val matrixRoom = FakeMatrixRoom()
+        val presenter = createMessagePresenter(matrixRoom)
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            skipItems(1)
+            val initialState = awaitItem()
+            initialState.eventSink.invoke(MessagesEvents.HandleAction(TimelineItemAction.Redact, aMessageEvent()))
+            assertThat(matrixRoom.redactEventEventIdParam).isEqualTo(AN_EVENT_ID)
+        }
+    }
+
+    private fun TestScope.createMessagePresenter(
+        matrixRoom: MatrixRoom = FakeMatrixRoom()
+    ): MessagesPresenter {
+        val messageComposerPresenter = MessageComposerPresenter(
+            appCoroutineScope = this,
+            room = matrixRoom
+        )
+
+        val timelinePresenter = TimelinePresenter(
+            timelineItemsFactory = aTimelineItemsFactory(),
+            room = matrixRoom,
+        )
+        val actionListPresenter = ActionListPresenter()
+        return MessagesPresenter(
+            room = matrixRoom,
+            composerPresenter = messageComposerPresenter,
+            timelinePresenter = timelinePresenter,
+            actionListPresenter = actionListPresenter,
+        )
+    }
+}
+

features/messages/impl/src/test/kotlin/io/element/android/features/messages/actionlist/ActionListPresenterTest.kt

@@ -0,0 +1,180 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@file:OptIn(ExperimentalCoroutinesApi::class)
+
+package io.element.android.features.messages.actionlist
+
+import app.cash.molecule.RecompositionClock
+import app.cash.molecule.moleculeFlow
+import app.cash.turbine.test
+import com.google.common.truth.Truth.assertThat
+import io.element.android.features.messages.impl.actionlist.ActionListEvents
+import io.element.android.features.messages.impl.actionlist.model.TimelineItemAction
+import io.element.android.features.messages.impl.actionlist.ActionListPresenter
+import io.element.android.features.messages.impl.actionlist.ActionListState
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.model.TimelineItemReactions
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemRedactedContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextContent
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.matrixtest.AN_EVENT_ID
+import io.element.android.libraries.matrixtest.A_MESSAGE
+import io.element.android.libraries.matrixtest.A_USER_ID
+import io.element.android.libraries.matrixtest.A_USER_NAME
+import kotlinx.collections.immutable.persistentListOf
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.test.runTest
+import org.junit.Test
+
+class ActionListPresenterTest {
+    @Test
+    fun `present - initial state`() = runTest {
+        val presenter = ActionListPresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            assertThat(initialState.target).isEqualTo(ActionListState.Target.None)
+        }
+    }
+
+    @Test
+    fun `present - compute for message from me redacted`() = runTest {
+        val presenter = ActionListPresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            val messageEvent = aMessageEvent(true, TimelineItemRedactedContent)
+            initialState.eventSink.invoke(ActionListEvents.ComputeForMessage(messageEvent))
+            // val loadingState = awaitItem()
+            // assertThat(loadingState.target).isEqualTo(ActionListState.Target.Loading(messageEvent))
+            val successState = awaitItem()
+            assertThat(successState.target).isEqualTo(
+                ActionListState.Target.Success(
+                    messageEvent,
+                    persistentListOf(
+                    )
+                )
+            )
+            initialState.eventSink.invoke(ActionListEvents.Clear)
+            assertThat(awaitItem().target).isEqualTo(ActionListState.Target.None)
+        }
+    }
+
+    @Test
+    fun `present - compute for message from others redacted`() = runTest {
+        val presenter = ActionListPresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            val messageEvent = aMessageEvent(false, TimelineItemRedactedContent)
+            initialState.eventSink.invoke(ActionListEvents.ComputeForMessage(messageEvent))
+            // val loadingState = awaitItem()
+            // assertThat(loadingState.target).isEqualTo(ActionListState.Target.Loading(messageEvent))
+            val successState = awaitItem()
+            assertThat(successState.target).isEqualTo(
+                ActionListState.Target.Success(
+                    messageEvent,
+                    persistentListOf(
+                    )
+                )
+            )
+            initialState.eventSink.invoke(ActionListEvents.Clear)
+            assertThat(awaitItem().target).isEqualTo(ActionListState.Target.None)
+        }
+    }
+
+    @Test
+    fun `present - compute for others message`() = runTest {
+        val presenter = ActionListPresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            val messageEvent = aMessageEvent(
+                isMine = false,
+                content = TimelineItemTextContent(body = A_MESSAGE, htmlDocument = null)
+            )
+            initialState.eventSink.invoke(ActionListEvents.ComputeForMessage(messageEvent))
+            // val loadingState = awaitItem()
+            // assertThat(loadingState.target).isEqualTo(ActionListState.Target.Loading(messageEvent))
+            val successState = awaitItem()
+            assertThat(successState.target).isEqualTo(
+                ActionListState.Target.Success(
+                    messageEvent,
+                    persistentListOf(
+                        TimelineItemAction.Reply,
+                        TimelineItemAction.Forward,
+                        TimelineItemAction.Copy,
+                    )
+                )
+            )
+            initialState.eventSink.invoke(ActionListEvents.Clear)
+            assertThat(awaitItem().target).isEqualTo(ActionListState.Target.None)
+        }
+    }
+
+    @Test
+    fun `present - compute for my message`() = runTest {
+        val presenter = ActionListPresenter()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            val messageEvent = aMessageEvent(
+                isMine = true,
+                content = TimelineItemTextContent(body = A_MESSAGE, htmlDocument = null)
+            )
+            initialState.eventSink.invoke(ActionListEvents.ComputeForMessage(messageEvent))
+            // val loadingState = awaitItem()
+            // assertThat(loadingState.target).isEqualTo(ActionListState.Target.Loading(messageEvent))
+            val successState = awaitItem()
+            assertThat(successState.target).isEqualTo(
+                ActionListState.Target.Success(
+                    messageEvent,
+                    persistentListOf(
+                        TimelineItemAction.Reply,
+                        TimelineItemAction.Forward,
+                        TimelineItemAction.Copy,
+                        TimelineItemAction.Edit,
+                        TimelineItemAction.Redact,
+                    )
+                )
+            )
+            initialState.eventSink.invoke(ActionListEvents.Clear)
+            assertThat(awaitItem().target).isEqualTo(ActionListState.Target.None)
+        }
+    }
+}
+
+private fun aMessageEvent(
+    isMine: Boolean,
+    content: TimelineItemEventContent,
+) = TimelineItem.Event(
+    id = AN_EVENT_ID.value,
+    eventId = AN_EVENT_ID,
+    senderId = A_USER_ID.value,
+    senderDisplayName = A_USER_NAME,
+    senderAvatar = AvatarData(A_USER_ID.value, A_USER_NAME),
+    content = content,
+    sentTime = "",
+    isMine = isMine,
+    reactionsState = TimelineItemReactions(persistentListOf())
+)

features/messages/impl/src/test/kotlin/io/element/android/features/messages/fakes/FakeDaySeparatorFormatter.kt

@@ -0,0 +1,32 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.fakes
+
+import io.element.android.libraries.dateformatter.DaySeparatorFormatter
+
+class FakeDaySeparatorFormatter : DaySeparatorFormatter {
+
+    private var format = ""
+
+    fun givenFormat(format: String) {
+        this.format = format
+    }
+
+    override fun format(timestamp: Long): String {
+        return format
+    }
+}

features/messages/impl/src/test/kotlin/io/element/android/features/messages/fixtures/aMessageEvent.kt

@@ -0,0 +1,43 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.fixtures
+
+import io.element.android.features.messages.impl.timeline.model.TimelineItem
+import io.element.android.features.messages.impl.timeline.model.TimelineItemReactions
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemEventContent
+import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextContent
+import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.matrixtest.AN_EVENT_ID
+import io.element.android.libraries.matrixtest.A_MESSAGE
+import io.element.android.libraries.matrixtest.A_USER_ID
+import io.element.android.libraries.matrixtest.A_USER_NAME
+import kotlinx.collections.immutable.persistentListOf
+
+internal fun aMessageEvent(
+    isMine: Boolean = true,
+    content: TimelineItemEventContent = TimelineItemTextContent(body = A_MESSAGE, htmlDocument = null),
+) = TimelineItem.Event(
+    id = AN_EVENT_ID.value,
+    eventId = AN_EVENT_ID,
+    senderId = A_USER_ID.value,
+    senderDisplayName = A_USER_NAME,
+    senderAvatar = AvatarData(A_USER_ID.value, A_USER_NAME),
+    content = content,
+    sentTime = "",
+    isMine = isMine,
+    reactionsState = TimelineItemReactions(persistentListOf())
+)

features/messages/impl/src/test/kotlin/io/element/android/features/messages/fixtures/testCoroutineDispatchers.kt

@@ -0,0 +1,28 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.fixtures
+
+import io.element.android.libraries.core.coroutine.CoroutineDispatchers
+import kotlinx.coroutines.test.UnconfinedTestDispatcher
+
+// TODO Move to common module to reuse
+internal fun testCoroutineDispatchers() = CoroutineDispatchers(
+    io = UnconfinedTestDispatcher(),
+    computation = UnconfinedTestDispatcher(),
+    main = UnconfinedTestDispatcher(),
+    diffUpdateDispatcher = UnconfinedTestDispatcher(),
+)

features/messages/impl/src/test/kotlin/io/element/android/features/messages/fixtures/timelineItemsFactory.kt

@@ -0,0 +1,55 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.features.messages.fixtures
+
+import io.element.android.features.messages.fakes.FakeDaySeparatorFormatter
+import io.element.android.features.messages.impl.timeline.factories.TimelineItemsFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentFailedToParseMessageFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentFailedToParseStateFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentMessageFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentProfileChangeFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentRedactedFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentRoomMembershipFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentStateFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentStickerFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemContentUTDFactory
+import io.element.android.features.messages.impl.timeline.factories.event.TimelineItemEventFactory
+import io.element.android.features.messages.impl.timeline.factories.virtual.TimelineItemDaySeparatorFactory
+import io.element.android.features.messages.impl.timeline.factories.virtual.TimelineItemVirtualFactory
+
+internal fun aTimelineItemsFactory() = TimelineItemsFactory(
+    dispatchers = testCoroutineDispatchers(),
+    eventItemFactory = TimelineItemEventFactory(
+        TimelineItemContentFactory(
+            messageFactory = TimelineItemContentMessageFactory(),
+            redactedMessageFactory = TimelineItemContentRedactedFactory(),
+            stickerFactory = TimelineItemContentStickerFactory(),
+            utdFactory = TimelineItemContentUTDFactory(),
+            roomMembershipFactory = TimelineItemContentRoomMembershipFactory(),
+            profileChangeFactory = TimelineItemContentProfileChangeFactory(),
+            stateFactory = TimelineItemContentStateFactory(),
+            failedToParseMessageFactory = TimelineItemContentFailedToParseMessageFactory(),
+            failedToParseStateFactory = TimelineItemContentFailedToParseStateFactory()
+        )
+    ),
+    virtualItemFactory = TimelineItemVirtualFactory(
+        daySeparatorFactory = TimelineItemDaySeparatorFactory(
+            FakeDaySeparatorFormatter()
+        ),
+    )
+)

features/messages/impl/src/test/kotlin/io/element/android/features/messages/textcomposer/MessageComposerPresenterTest.kt

@@ -0,0 +1,255 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@file:OptIn(ExperimentalCoroutinesApi::class)
+
+package io.element.android.features.messages.textcomposer
+
+import app.cash.molecule.RecompositionClock
+import app.cash.molecule.moleculeFlow
+import app.cash.turbine.ReceiveTurbine
+import app.cash.turbine.test
+import com.google.common.truth.Truth.assertThat
+import io.element.android.features.messages.impl.textcomposer.MessageComposerEvents
+import io.element.android.features.messages.impl.textcomposer.MessageComposerPresenter
+import io.element.android.features.messages.impl.textcomposer.MessageComposerState
+import io.element.android.libraries.core.data.StableCharSequence
+import io.element.android.libraries.matrixtest.ANOTHER_MESSAGE
+import io.element.android.libraries.matrixtest.AN_EVENT_ID
+import io.element.android.libraries.matrixtest.A_MESSAGE
+import io.element.android.libraries.matrixtest.A_REPLY
+import io.element.android.libraries.matrixtest.A_USER_NAME
+import io.element.android.libraries.matrixtest.room.FakeMatrixRoom
+import io.element.android.libraries.textcomposer.MessageComposerMode
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.test.runTest
+import org.junit.Test
+
+class MessageComposerPresenterTest {
+    @Test
+    fun `present - initial state`() = runTest {
+        val presenter = MessageComposerPresenter(
+            this,
+            FakeMatrixRoom()
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            assertThat(initialState.isFullScreen).isFalse()
+            assertThat(initialState.text).isEqualTo(StableCharSequence(""))
+            assertThat(initialState.mode).isEqualTo(MessageComposerMode.Normal(""))
+            assertThat(initialState.isSendButtonVisible).isFalse()
+        }
+    }
+
+    @Test
+    fun `present - toggle fullscreen`() = runTest {
+        val presenter = MessageComposerPresenter(
+            this,
+            FakeMatrixRoom()
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            initialState.eventSink.invoke(MessageComposerEvents.ToggleFullScreenState)
+            val fullscreenState = awaitItem()
+            assertThat(fullscreenState.isFullScreen).isTrue()
+            fullscreenState.eventSink.invoke(MessageComposerEvents.ToggleFullScreenState)
+            val notFullscreenState = awaitItem()
+            assertThat(notFullscreenState.isFullScreen).isFalse()
+        }
+    }
+
+    @Test
+    fun `present - change message`() = runTest {
+        val presenter = MessageComposerPresenter(
+            this,
+            FakeMatrixRoom()
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            initialState.eventSink.invoke(MessageComposerEvents.UpdateText(A_MESSAGE))
+            val withMessageState = awaitItem()
+            assertThat(withMessageState.text).isEqualTo(StableCharSequence(A_MESSAGE))
+            assertThat(withMessageState.isSendButtonVisible).isTrue()
+            withMessageState.eventSink.invoke(MessageComposerEvents.UpdateText(""))
+            val withEmptyMessageState = awaitItem()
+            assertThat(withEmptyMessageState.text).isEqualTo(StableCharSequence(""))
+            assertThat(withEmptyMessageState.isSendButtonVisible).isFalse()
+        }
+    }
+
+    @Test
+    fun `present - change mode to edit`() = runTest {
+        val presenter = MessageComposerPresenter(
+            this,
+            FakeMatrixRoom()
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            var state = awaitItem()
+            val mode = anEditMode()
+            state.eventSink.invoke(MessageComposerEvents.SetMode(mode))
+            state = awaitItem()
+            assertThat(state.mode).isEqualTo(mode)
+            state = awaitItem()
+            assertThat(state.text).isEqualTo(StableCharSequence(A_MESSAGE))
+            assertThat(state.isSendButtonVisible).isTrue()
+            backToNormalMode(state, skipCount = 1)
+        }
+    }
+
+    private suspend fun ReceiveTurbine<MessageComposerState>.backToNormalMode(state: MessageComposerState, skipCount: Int = 0) {
+        state.eventSink.invoke(MessageComposerEvents.CloseSpecialMode)
+        skipItems(skipCount)
+        val normalState = awaitItem()
+        assertThat(normalState.mode).isEqualTo(MessageComposerMode.Normal(""))
+        assertThat(normalState.text).isEqualTo(StableCharSequence(""))
+        assertThat(normalState.isSendButtonVisible).isFalse()
+    }
+
+    @Test
+    fun `present - change mode to reply`() = runTest {
+        val presenter = MessageComposerPresenter(
+            this,
+            FakeMatrixRoom()
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            var state = awaitItem()
+            val mode = aReplyMode()
+            state.eventSink.invoke(MessageComposerEvents.SetMode(mode))
+            state = awaitItem()
+            assertThat(state.mode).isEqualTo(mode)
+            assertThat(state.text).isEqualTo(StableCharSequence(""))
+            assertThat(state.isSendButtonVisible).isFalse()
+            backToNormalMode(state)
+        }
+    }
+
+    @Test
+    fun `present - change mode to quote`() = runTest {
+        val presenter = MessageComposerPresenter(
+            this,
+            FakeMatrixRoom()
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            var state = awaitItem()
+            val mode = aQuoteMode()
+            state.eventSink.invoke(MessageComposerEvents.SetMode(mode))
+            state = awaitItem()
+            assertThat(state.mode).isEqualTo(mode)
+            assertThat(state.text).isEqualTo(StableCharSequence(""))
+            assertThat(state.isSendButtonVisible).isFalse()
+            backToNormalMode(state)
+        }
+    }
+
+    @Test
+    fun `present - send message`() = runTest {
+        val presenter = MessageComposerPresenter(
+            this,
+            FakeMatrixRoom()
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            initialState.eventSink.invoke(MessageComposerEvents.UpdateText(A_MESSAGE))
+            val withMessageState = awaitItem()
+            assertThat(withMessageState.text).isEqualTo(StableCharSequence(A_MESSAGE))
+            assertThat(withMessageState.isSendButtonVisible).isTrue()
+            withMessageState.eventSink.invoke(MessageComposerEvents.SendMessage(A_MESSAGE))
+            val messageSentState = awaitItem()
+            assertThat(messageSentState.text).isEqualTo(StableCharSequence(""))
+            assertThat(messageSentState.isSendButtonVisible).isFalse()
+        }
+    }
+
+    @Test
+    fun `present - edit message`() = runTest {
+        val fakeMatrixRoom = FakeMatrixRoom()
+        val presenter = MessageComposerPresenter(
+            this,
+            fakeMatrixRoom
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            assertThat(initialState.text).isEqualTo(StableCharSequence(""))
+            val mode = anEditMode()
+            initialState.eventSink.invoke(MessageComposerEvents.SetMode(mode))
+            skipItems(1)
+            val withMessageState = awaitItem()
+            assertThat(withMessageState.mode).isEqualTo(mode)
+            assertThat(withMessageState.text).isEqualTo(StableCharSequence(A_MESSAGE))
+            assertThat(withMessageState.isSendButtonVisible).isTrue()
+            withMessageState.eventSink.invoke(MessageComposerEvents.UpdateText(ANOTHER_MESSAGE))
+            val withEditedMessageState = awaitItem()
+            assertThat(withEditedMessageState.text).isEqualTo(StableCharSequence(ANOTHER_MESSAGE))
+            withEditedMessageState.eventSink.invoke(MessageComposerEvents.SendMessage(ANOTHER_MESSAGE))
+            skipItems(1)
+            val messageSentState = awaitItem()
+            assertThat(messageSentState.text).isEqualTo(StableCharSequence(""))
+            assertThat(messageSentState.isSendButtonVisible).isFalse()
+            assertThat(fakeMatrixRoom.editMessageParameter).isEqualTo(ANOTHER_MESSAGE)
+        }
+    }
+
+    @Test
+    fun `present - reply message`() = runTest {
+        val fakeMatrixRoom = FakeMatrixRoom()
+        val presenter = MessageComposerPresenter(
+            this,
+            fakeMatrixRoom
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            assertThat(initialState.text).isEqualTo(StableCharSequence(""))
+            val mode = aReplyMode()
+            initialState.eventSink.invoke(MessageComposerEvents.SetMode(mode))
+            val state = awaitItem()
+            assertThat(state.mode).isEqualTo(mode)
+            assertThat(state.text).isEqualTo(StableCharSequence(""))
+            assertThat(state.isSendButtonVisible).isFalse()
+            initialState.eventSink.invoke(MessageComposerEvents.UpdateText(A_REPLY))
+            val withMessageState = awaitItem()
+            assertThat(withMessageState.text).isEqualTo(StableCharSequence(A_REPLY))
+            assertThat(withMessageState.isSendButtonVisible).isTrue()
+            withMessageState.eventSink.invoke(MessageComposerEvents.SendMessage(A_REPLY))
+            skipItems(1)
+            val messageSentState = awaitItem()
+            assertThat(messageSentState.text).isEqualTo(StableCharSequence(""))
+            assertThat(messageSentState.isSendButtonVisible).isFalse()
+            assertThat(fakeMatrixRoom.replyMessageParameter).isEqualTo(A_REPLY)
+        }
+    }
+}
+
+fun anEditMode() = MessageComposerMode.Edit(AN_EVENT_ID, A_MESSAGE)
+fun aReplyMode() = MessageComposerMode.Reply(A_USER_NAME, AN_EVENT_ID, A_MESSAGE)
+fun aQuoteMode() = MessageComposerMode.Quote(AN_EVENT_ID, A_MESSAGE)

features/messages/impl/src/test/kotlin/io/element/android/features/messages/timeline/TimelinePresenterTest.kt

@@ -0,0 +1,111 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@file:OptIn(ExperimentalCoroutinesApi::class)
+
+package io.element.android.features.messages.timeline
+
+import app.cash.molecule.RecompositionClock
+import app.cash.molecule.moleculeFlow
+import app.cash.turbine.test
+import com.google.common.truth.Truth.assertThat
+import io.element.android.features.messages.fixtures.aTimelineItemsFactory
+import io.element.android.features.messages.impl.timeline.TimelineEvents
+import io.element.android.features.messages.impl.timeline.TimelinePresenter
+import io.element.android.libraries.matrixtest.AN_EVENT_ID
+import io.element.android.libraries.matrixtest.room.FakeMatrixRoom
+import io.element.android.libraries.matrixtest.timeline.FakeMatrixTimeline
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.test.runTest
+import org.junit.Test
+
+class TimelinePresenterTest {
+    @Test
+    fun `present - initial state`() = runTest {
+        val presenter = TimelinePresenter(
+            timelineItemsFactory = aTimelineItemsFactory(),
+            room = FakeMatrixRoom(),
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            assertThat(initialState.timelineItems).isEmpty()
+            val loadedNoTimelineState = awaitItem()
+            assertThat(loadedNoTimelineState.timelineItems).isEmpty()
+        }
+    }
+
+    @Test
+    fun `present - makes sure timeline is initialized and disposed`() = runTest {
+        val fakeTimeline = FakeMatrixTimeline()
+        val presenter = TimelinePresenter(
+            timelineItemsFactory = aTimelineItemsFactory(),
+            room = FakeMatrixRoom(matrixTimeline = fakeTimeline),
+        )
+        assertThat(fakeTimeline.isInitialized).isFalse()
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            skipItems(2)
+            assertThat(fakeTimeline.isInitialized).isTrue()
+        }
+        assertThat(fakeTimeline.isInitialized).isFalse()
+    }
+
+    @Test
+    fun `present - load more`() = runTest {
+        val presenter = TimelinePresenter(
+            timelineItemsFactory = aTimelineItemsFactory(),
+            room = FakeMatrixRoom(),
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            assertThat(initialState.paginationState.canBackPaginate).isTrue()
+            assertThat(initialState.paginationState.isBackPaginating).isFalse()
+            initialState.eventSink.invoke(TimelineEvents.LoadMore)
+            val inPaginationState = awaitItem()
+            assertThat(inPaginationState.paginationState.isBackPaginating).isTrue()
+            assertThat(inPaginationState.paginationState.canBackPaginate).isTrue()
+            val postPaginationState = awaitItem()
+            assertThat(postPaginationState.paginationState.canBackPaginate).isTrue()
+            assertThat(postPaginationState.paginationState.isBackPaginating).isFalse()
+        }
+    }
+
+    @Test
+    fun `present - set highlighted event`() = runTest {
+        val presenter = TimelinePresenter(
+            timelineItemsFactory = aTimelineItemsFactory(),
+            room = FakeMatrixRoom(),
+        )
+        moleculeFlow(RecompositionClock.Immediate) {
+            presenter.present()
+        }.test {
+            val initialState = awaitItem()
+            skipItems(1)
+            assertThat(initialState.highlightedEventId).isNull()
+            initialState.eventSink.invoke(TimelineEvents.SetHighlightedEvent(AN_EVENT_ID))
+            val withHighlightedState = awaitItem()
+            assertThat(withHighlightedState.highlightedEventId).isEqualTo(AN_EVENT_ID)
+            initialState.eventSink.invoke(TimelineEvents.SetHighlightedEvent(null))
+            val withoutHighlightedState = awaitItem()
+            assertThat(withoutHighlightedState.highlightedEventId).isNull()
+        }
+    }
+}