diff --git a/appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomNodeView.kt b/appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomNodeView.kt index 394ed1223b..b684d21703 100644 --- a/appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomNodeView.kt +++ b/appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomNodeView.kt @@ -18,6 +18,7 @@ package io.element.android.appnav.room import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.WindowInsets @@ -36,9 +37,7 @@ 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.appnav.loggedin.LoggedInState -import io.element.android.appnav.loggedin.LoggedInStateProvider -import io.element.android.appnav.loggedin.LoggedInView +import io.element.android.features.networkmonitor.api.ui.ConnectivityIndicatorView import io.element.android.libraries.designsystem.atomic.atoms.PlaceholderAtom import io.element.android.libraries.designsystem.components.avatar.AvatarSize import io.element.android.libraries.designsystem.components.button.BackButton @@ -52,10 +51,10 @@ import io.element.android.libraries.designsystem.theme.placeholderBackground import io.element.android.libraries.theme.ElementTheme import io.element.android.libraries.ui.strings.CommonStrings -@OptIn(ExperimentalMaterial3Api::class) @Composable fun LoadingRoomNodeView( state: LoadingRoomState, + hasNetworkConnection: Boolean, onBackClicked: () -> Unit, modifier: Modifier = Modifier, ) { @@ -63,28 +62,10 @@ fun LoadingRoomNodeView( modifier = modifier, contentWindowInsets = WindowInsets.systemBars, topBar = { - TopAppBar( - modifier = Modifier, - navigationIcon = { - BackButton(onClick = onBackClicked) - }, - title = { - Row( - verticalAlignment = Alignment.CenterVertically - ) { - Box( - modifier = Modifier - .size(AvatarSize.TimelineRoom.dp) - .align(Alignment.CenterVertically) - .background(color = ElementTheme.colors.placeholderBackground, shape = CircleShape) - ) - Spacer(modifier = Modifier.width(8.dp)) - PlaceholderAtom(width = 20.dp, height = 7.dp) - Spacer(modifier = Modifier.width(7.dp)) - PlaceholderAtom(width = 45.dp, height = 7.dp) - } - }, - ) + Column { + ConnectivityIndicatorView(isOnline = hasNetworkConnection) + LoadingRoomTopBar(onBackClicked) + } }, content = { padding -> Box( @@ -107,6 +88,33 @@ fun LoadingRoomNodeView( ) } +@OptIn(ExperimentalMaterial3Api::class) +@Composable +private fun LoadingRoomTopBar(onBackClicked: () -> Unit) { + TopAppBar( + modifier = Modifier, + navigationIcon = { + BackButton(onClick = onBackClicked) + }, + title = { + Row( + verticalAlignment = Alignment.CenterVertically + ) { + Box( + modifier = Modifier + .size(AvatarSize.TimelineRoom.dp) + .align(Alignment.CenterVertically) + .background(color = ElementTheme.colors.placeholderBackground, shape = CircleShape) + ) + Spacer(modifier = Modifier.width(8.dp)) + PlaceholderAtom(width = 20.dp, height = 7.dp) + Spacer(modifier = Modifier.width(7.dp)) + PlaceholderAtom(width = 45.dp, height = 7.dp) + } + }, + ) +} + @Preview @Composable fun LoadingRoomNodeViewLightPreview(@PreviewParameter(LoadingRoomStateProvider::class) state: LoadingRoomState) = @@ -121,6 +129,7 @@ fun LoadingRoomNodeViewDarkPreview(@PreviewParameter(LoadingRoomStateProvider::c private fun ContentToPreview(state: LoadingRoomState) { LoadingRoomNodeView( state = state, - onBackClicked = {} + onBackClicked = {}, + hasNetworkConnection = false ) } diff --git a/appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomState.kt b/appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomState.kt index 9e96fadbc4..db4627c3b4 100644 --- a/appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomState.kt +++ b/appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomState.kt @@ -46,7 +46,7 @@ open class LoadingRoomStateProvider : PreviewParameterProvider } @SingleIn(SessionScope::class) -class AwaitRoomStateFlowFactory @Inject constructor(private val matrixClient: MatrixClient) { +class LoadingRoomStateFlowFactory @Inject constructor(private val matrixClient: MatrixClient) { fun create(lifecycleScope: CoroutineScope, roomId: RoomId): StateFlow = getRoomFlow(roomId) diff --git a/appnav/src/main/kotlin/io/element/android/appnav/room/RoomFlowNode.kt b/appnav/src/main/kotlin/io/element/android/appnav/room/RoomFlowNode.kt index a231664399..a03b6d61a2 100644 --- a/appnav/src/main/kotlin/io/element/android/appnav/room/RoomFlowNode.kt +++ b/appnav/src/main/kotlin/io/element/android/appnav/room/RoomFlowNode.kt @@ -37,6 +37,8 @@ import dagger.assisted.AssistedInject import io.element.android.anvilannotations.ContributesNode import io.element.android.appnav.NodeLifecycleCallback import io.element.android.appnav.safeRoot +import io.element.android.features.networkmonitor.api.NetworkMonitor +import io.element.android.features.networkmonitor.api.NetworkStatus import io.element.android.libraries.architecture.BackstackNode import io.element.android.libraries.architecture.NodeInputs import io.element.android.libraries.architecture.createNode @@ -53,7 +55,8 @@ import kotlinx.parcelize.Parcelize class RoomFlowNode @AssistedInject constructor( @Assisted val buildContext: BuildContext, @Assisted plugins: List, - awaitRoomStateFlowFactory: AwaitRoomStateFlowFactory, + loadingRoomStateFlowFactory: LoadingRoomStateFlowFactory, + private val networkMonitor: NetworkMonitor, ) : BackstackNode( backstack = BackStack( @@ -70,7 +73,7 @@ class RoomFlowNode @AssistedInject constructor( ) : NodeInputs private val inputs: Inputs = inputs() - private val loadingRoomStateStateFlow = awaitRoomStateFlowFactory.create(lifecycleScope, inputs.roomId) + private val loadingRoomStateStateFlow = loadingRoomStateFlowFactory.create(lifecycleScope, inputs.roomId) sealed interface NavTarget : Parcelable { @Parcelize @@ -117,8 +120,10 @@ class RoomFlowNode @AssistedInject constructor( private fun loadingNode(buildContext: BuildContext, onBackClicked: () -> Unit) = node(buildContext) { modifier -> val loadingRoomState by loadingRoomStateStateFlow.collectAsState() + val networkStatus by networkMonitor.connectivity.collectAsState() LoadingRoomNodeView( state = loadingRoomState, + hasNetworkConnection = networkStatus == NetworkStatus.Online, modifier = modifier, onBackClicked = onBackClicked )