From 3057d9c2d4949905e88ca640917a62e749f6dd57 Mon Sep 17 00:00:00 2001
From: beetzung <bee.tzung.jr@gmail.com>
Date: Mon, 6 Apr 2026 22:13:27 +0200
Subject: [PATCH] fix(map): clip chart sensor selector ripple to pill shape

Made-with: Cursor
---
 .../db3/airmq/features/map/MapUiComponents.kt | 39 ++++++++++++++++---
 1 file changed, 34 insertions(+), 5 deletions(-)

diff --git a/app/src/main/kotlin/org/db3/airmq/features/map/MapUiComponents.kt b/app/src/main/kotlin/org/db3/airmq/features/map/MapUiComponents.kt
index 9f59d96..0701e5d 100644
--- a/app/src/main/kotlin/org/db3/airmq/features/map/MapUiComponents.kt
+++ b/app/src/main/kotlin/org/db3/airmq/features/map/MapUiComponents.kt
@@ -23,6 +23,7 @@ import androidx.compose.foundation.verticalScroll
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.FilterChip
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Icon
@@ -61,8 +62,8 @@ import org.db3.airmq.features.common.AirMQButton
 import org.db3.airmq.features.common.AirMQButtonStyle
 import org.db3.airmq.features.common.chart.AirMQChart
 import org.db3.airmq.features.common.chart.ChartConfig
-import org.db3.airmq.features.common.chart.ChartDataset
-import org.db3.airmq.features.common.chart.generateSineWaveData
+import org.db3.airmq.features.common.metric.SensorType as MetricSensorType
+import org.db3.airmq.features.dashboard.DashboardChartMapper
 import org.db3.airmq.features.map.MapScreenContract.DevicePanelState
 import org.db3.airmq.features.map.MapScreenContract.DeviceSensorType
 import org.db3.airmq.features.map.MapScreenContract.SearchResult
@@ -520,7 +521,7 @@ fun MapDevicePanelContent(
                     .height(256.dp)
             ) {
                 AirMQChart(
-                    data = ChartDataset.Single(generateSineWaveData()),
+                    data = data.chartDataset,
                     config = chartConfigForSensor(
                         data.selectedSensor,
                         leftTimeLabel = stringResource(R.string.filter_hour),
@@ -533,6 +534,23 @@ fun MapDevicePanelContent(
                         .align(Alignment.TopCenter)
                 )
 
+                if (data.isChartLoading) {
+                    CircularProgressIndicator(
+                        modifier = Modifier.align(Alignment.Center)
+                    )
+                }
+
+                data.chartErrorMessage?.let { err ->
+                    Text(
+                        text = err,
+                        style = MaterialTheme.typography.bodySmall,
+                        color = Color(0xFFB00020),
+                        modifier = Modifier
+                            .align(Alignment.TopCenter)
+                            .padding(top = 4.dp)
+                    )
+                }
+
                 DeviceSensorDropdown(
                     selectedSensor = data.selectedSensor,
                     supportedSensors = data.supportedSensors,
@@ -696,6 +714,7 @@ private fun DeviceSensorDropdown(
                 modifier = Modifier
                     .fillMaxWidth()
                     .height(36.dp)
+                    .clip(triggerShape)
                     .clickable { isExpanded = !isExpanded },
                 shape = triggerShape,
                 shadowElevation = 10.dp,
@@ -858,7 +877,12 @@ private fun PreviewMapDevicePanelDust() {
                 status = "Online",
                 selectedRange = TimeRange.DAY,
                 displayedDateRange = "Today",
-                selectedSensor = DeviceSensorType.DUST
+                selectedSensor = DeviceSensorType.DUST,
+                chartDataset = DashboardChartMapper.chartDataset(
+                    DashboardChartMapper.previewStaticRows(),
+                    MetricSensorType.DUST
+                ),
+                isChartLoading = false
             ),
             onOpenDevice = {},
             onRangeSelected = {},
@@ -880,7 +904,12 @@ private fun PreviewMapDevicePanelRadioactivity() {
                 status = "Offline",
                 selectedRange = TimeRange.WEEK,
                 displayedDateRange = "Last 7 days",
-                selectedSensor = DeviceSensorType.RADIOACTIVITY
+                selectedSensor = DeviceSensorType.RADIOACTIVITY,
+                chartDataset = DashboardChartMapper.chartDataset(
+                    DashboardChartMapper.previewStaticRows(),
+                    MetricSensorType.RADIOACTIVITY
+                ),
+                isChartLoading = false
             ),
             onOpenDevice = {},
             onRangeSelected = {},