maplibre-compose allow customisation of location dot style (#929)

- And style it according to our designs.

Related to:
- element-hq/element-meta#1682

Author: Marco Romano

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

@@ -20,6 +20,7 @@ import android.Manifest
 import android.view.Gravity
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.ReadOnlyComposable
+import androidx.compose.ui.graphics.Color
 import com.mapbox.mapboxsdk.camera.CameraPosition
 import com.mapbox.mapboxsdk.geometry.LatLng
 import io.element.android.libraries.maplibre.compose.MapLocationSettings
@@ -53,6 +54,13 @@ object MapDefaults {
     val locationSettings: MapLocationSettings
         get() = MapLocationSettings(
             locationEnabled = false,
+            backgroundTintColor = Color.White,
+            foregroundTintColor = Color.Black,
+            backgroundStaleTintColor = Color.White,
+            foregroundStaleTintColor = Color.Black,
+            accuracyColor = Color.Black,
+            pulseEnabled = true,
+            pulseColor = Color.Black,
         )
 
     val centerCameraPosition = CameraPosition.Builder()

libraries/maplibre-compose/src/main/kotlin/io/element/android/libraries/maplibre/compose/MapLocationSettings.kt

@@ -18,6 +18,8 @@
 
 package io.element.android.libraries.maplibre.compose
 
+import androidx.compose.ui.graphics.Color
+
 internal val DefaultMapLocationSettings = MapLocationSettings()
 
 /**
@@ -28,4 +30,11 @@ internal val DefaultMapLocationSettings = MapLocationSettings()
  */
 public data class MapLocationSettings(
     public val locationEnabled: Boolean = false,
+    public val backgroundTintColor: Color = Color.Unspecified,
+    public val foregroundTintColor: Color = Color.Unspecified,
+    public val backgroundStaleTintColor: Color = Color.Unspecified,
+    public val foregroundStaleTintColor: Color = Color.Unspecified,
+    public val accuracyColor: Color = Color.Unspecified,
+    public val pulseEnabled: Boolean = false,
+    public val pulseColor: Color = Color.Unspecified
 )

libraries/maplibre-compose/src/main/kotlin/io/element/android/libraries/maplibre/compose/MapUpdater.kt

@@ -39,14 +39,21 @@ internal class MapPropertiesNode(
     style: Style,
     context: Context,
     cameraPositionState: CameraPositionState,
+    locationSettings: MapLocationSettings,
 ) : MapNode {
 
     init {
         map.locationComponent.activateLocationComponent(
             LocationComponentActivationOptions.Builder(context, style)
                 .locationComponentOptions(
                     LocationComponentOptions.builder(context)
-                        .pulseEnabled(true)
+                        .backgroundTintColor(locationSettings.backgroundTintColor.toArgb())
+                        .foregroundTintColor(locationSettings.foregroundTintColor.toArgb())
+                        .backgroundStaleTintColor(locationSettings.backgroundStaleTintColor.toArgb())
+                        .foregroundStaleTintColor(locationSettings.foregroundStaleTintColor.toArgb())
+                        .accuracyColor(locationSettings.accuracyColor.toArgb())
+                        .pulseEnabled(locationSettings.pulseEnabled)
+                        .pulseColor(locationSettings.pulseColor.toArgb())
                         .build()
                 )
                 .locationEngineRequest(
@@ -116,9 +123,9 @@ internal class MapPropertiesNode(
 @Composable
 internal inline fun MapUpdater(
     cameraPositionState: CameraPositionState,
-    mapLocationSettings: MapLocationSettings,
-    mapUiSettings: MapUiSettings,
-    mapSymbolManagerSettings: MapSymbolManagerSettings,
+    locationSettings: MapLocationSettings,
+    uiSettings: MapUiSettings,
+    symbolManagerSettings: MapSymbolManagerSettings,
 ) {
     val mapApplier = currentComposer.applier as MapApplier
     val map = mapApplier.map
@@ -132,21 +139,22 @@ internal inline fun MapUpdater(
                 style = style,
                 context = context,
                 cameraPositionState = cameraPositionState,
+                locationSettings = locationSettings,
             )
         },
         update = {
-            set(mapLocationSettings.locationEnabled) { map.locationComponent.isLocationComponentEnabled = it }
+            set(locationSettings.locationEnabled) { map.locationComponent.isLocationComponentEnabled = it }
 
-            set(mapUiSettings.compassEnabled) { map.uiSettings.isCompassEnabled = it }
-            set(mapUiSettings.rotationGesturesEnabled) { map.uiSettings.isRotateGesturesEnabled = it }
-            set(mapUiSettings.scrollGesturesEnabled) { map.uiSettings.isScrollGesturesEnabled = it }
-            set(mapUiSettings.tiltGesturesEnabled) { map.uiSettings.isTiltGesturesEnabled = it }
-            set(mapUiSettings.zoomGesturesEnabled) { map.uiSettings.isZoomGesturesEnabled = it }
-            set(mapUiSettings.logoGravity) { map.uiSettings.logoGravity = it }
-            set(mapUiSettings.attributionGravity) { map.uiSettings.attributionGravity = it }
-            set(mapUiSettings.attributionTintColor) { map.uiSettings.setAttributionTintColor(it.toArgb()) }
+            set(uiSettings.compassEnabled) { map.uiSettings.isCompassEnabled = it }
+            set(uiSettings.rotationGesturesEnabled) { map.uiSettings.isRotateGesturesEnabled = it }
+            set(uiSettings.scrollGesturesEnabled) { map.uiSettings.isScrollGesturesEnabled = it }
+            set(uiSettings.tiltGesturesEnabled) { map.uiSettings.isTiltGesturesEnabled = it }
+            set(uiSettings.zoomGesturesEnabled) { map.uiSettings.isZoomGesturesEnabled = it }
+            set(uiSettings.logoGravity) { map.uiSettings.logoGravity = it }
+            set(uiSettings.attributionGravity) { map.uiSettings.attributionGravity = it }
+            set(uiSettings.attributionTintColor) { map.uiSettings.setAttributionTintColor(it.toArgb()) }
 
-            set(mapSymbolManagerSettings.iconAllowOverlap) { symbolManager.iconAllowOverlap = it }
+            set(symbolManagerSettings.iconAllowOverlap) { symbolManager.iconAllowOverlap = it }
 
             update(cameraPositionState) { this.cameraPositionState = it }
         }

libraries/maplibre-compose/src/main/kotlin/io/element/android/libraries/maplibre/compose/MapboxMap.kt

@@ -124,9 +124,9 @@ public fun MapboxMap(
             ) {
                 MapUpdater(
                     cameraPositionState = currentCameraPositionState,
-                    mapUiSettings = currentUiSettings,
-                    mapLocationSettings = currentMapLocationSettings,
-                    mapSymbolManagerSettings = currentSymbolManagerSettings,
+                    uiSettings = currentUiSettings,
+                    locationSettings = currentMapLocationSettings,
+                    symbolManagerSettings = currentSymbolManagerSettings,
                 )
                 CompositionLocalProvider(
                     LocalCameraPositionState provides cameraPositionState,