Improve live location bottomsheet interaction with map

features/location/impl/src/main/kotlin/io/element/android/features/location/impl/common/ui/MapBottomSheetScaffold.kt

@@ -10,12 +10,14 @@ package io.element.android.features.location.impl.common.ui
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.BoxScope
 import androidx.compose.foundation.layout.BoxWithConstraints
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.WindowInsetsSides
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.navigationBars
 import androidx.compose.foundation.layout.only
 import androidx.compose.foundation.layout.safeDrawing
@@ -43,6 +45,7 @@ import androidx.compose.ui.unit.max
 import io.element.android.features.location.api.internal.rememberTileStyleUrl
 import io.element.android.features.location.impl.common.MapDefaults
 import io.element.android.libraries.core.data.tryOrNull
+import io.element.android.libraries.designsystem.text.toDp
 import io.element.android.libraries.designsystem.theme.components.BottomSheetScaffold
 import org.maplibre.compose.camera.CameraState
 import org.maplibre.compose.camera.rememberCameraState
@@ -112,8 +115,11 @@ fun MapBottomSheetScaffold(
             modifier = Modifier,
             sheetPeekHeight = sheetPeekHeight,
             sheetContent = {
-                sheetContent(sheetPadding)
+                val maxContentHeight = (layoutHeightPx * 0.5f).roundToInt().toDp()
-                Spacer(modifier = Modifier.windowInsetsBottomHeight(WindowInsets.navigationBars))
+                Column(modifier = Modifier.heightIn(max = maxContentHeight)) {
+                    sheetContent(sheetPadding)
+                    Spacer(modifier = Modifier.windowInsetsBottomHeight(WindowInsets.navigationBars))
+                }
             },
             scaffoldState = scaffoldState,
             sheetDragHandle = sheetDragHandle,

features/location/impl/src/main/kotlin/io/element/android/features/location/impl/show/ShowLocationView.kt

@@ -15,6 +15,8 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
 import androidx.compose.material3.BottomSheetDefaults
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.SheetValue
@@ -90,15 +92,13 @@ fun ShowLocationView(
 
     val userLocationState = rememberUserLocationState(state.hasLocationPermission)
     val scaffoldState = rememberBottomSheetScaffoldState(
-        bottomSheetState = rememberStandardBottomSheetState(
+        bottomSheetState = rememberStandardBottomSheetState(SheetValue.Expanded)
-            initialValue =
-                if (state.isSheetDraggable) {
-                    SheetValue.Expanded
-                } else {
-                    SheetValue.Expanded
-                }
-        )
     )
+    LaunchedEffect(state.isSheetDraggable) {
+        if (!state.isSheetDraggable) {
+            scaffoldState.bottomSheetState.expand()
+        }
+    }
     MapBottomSheetScaffold(
         sheetDragHandle = if (state.isSheetDraggable) {
             { BottomSheetDefaults.DragHandle() }
@@ -122,18 +122,19 @@ fun ShowLocationView(
         sheetContent = { sheetPaddings ->
             val coroutineScope = rememberCoroutineScope()
             if (!state.isSheetDraggable) {
+                // If sheet is draggable the DragHandle has already some padding
                 Spacer(Modifier.height(20.dp))
             }
             if (state.locationShares.isEmpty()) {
-                Spacer(Modifier.height(16.dp))
                 Text(
                     text = "Nobody is sharing their location",
                     style = ElementTheme.typography.fontBodyLgMedium,
                     color = ElementTheme.colors.textPrimary,
-                    modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp),
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .padding(all = 16.dp),
                     textAlign = TextAlign.Center,
                 )
-                Spacer(Modifier.height(16.dp))
             } else {
                 Text(
                     text = stringResource(CommonStrings.screen_static_location_sheet_title),
@@ -141,22 +142,24 @@ fun ShowLocationView(
                     color = ElementTheme.colors.textPrimary,
                     modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp),
                 )
-                state.locationShares.forEach { locationShare ->
+                LazyColumn {
-                    LocationShareRow(
+                    items(state.locationShares) { locationShare ->
-                        item = locationShare,
+                        LocationShareRow(
-                        onShareClick = { state.eventSink(ShowLocationEvent.Share(locationShare.location)) },
+                            item = locationShare,
-                        modifier = Modifier.clickable {
+                            onShareClick = { state.eventSink(ShowLocationEvent.Share(locationShare.location)) },
-                            state.eventSink(ShowLocationEvent.TrackMyLocation(false))
+                            modifier = Modifier.clickable {
-                            val position = CameraPosition(
+                                state.eventSink(ShowLocationEvent.TrackMyLocation(false))
-                                padding = sheetPaddings,
+                                val position = CameraPosition(
-                                target = Position(locationShare.location.lon, locationShare.location.lat),
+                                    padding = sheetPaddings,
-                                zoom = MapDefaults.DEFAULT_ZOOM
+                                    target = Position(locationShare.location.lon, locationShare.location.lat),
-                            )
+                                    zoom = MapDefaults.DEFAULT_ZOOM
-                            coroutineScope.launch {
+                                )
-                                cameraState.animateTo(finalPosition = position)
+                                coroutineScope.launch {
+                                    cameraState.animateTo(finalPosition = position)
+                                }
                             }
-                        }
+                        )
-                    )
+                    }
                 }
             }
         },