fix(android): better card layout for statistic widget errors

autoreleasefool · Jun 21, 2024 · 725c59d · 725c59d
1 parent a44ccdb
commit 725c59d
Showing 1 changed file with 65 additions and 47 deletions.
diff --git a/...a/josephroque/bowlingcompanion/feature/statisticswidget/ui/error/StatisticsWidgetError.kt b/...a/josephroque/bowlingcompanion/feature/statisticswidget/ui/error/StatisticsWidgetError.kt
@@ -6,11 +6,13 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.widthIn
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
+import androidx.compose.material3.Card
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import ca.josephroque.bowlingcompanion.core.statistics.StatisticID
 import ca.josephroque.bowlingcompanion.core.statistics.models.StatisticChartContent
@@ -20,65 +22,81 @@ import ca.josephroque.bowlingcompanion.feature.statisticswidget.ui.widget.Statis
 @Composable
 fun StatisticsWidgetError(state: StatisticsWidgetErrorUiState, modifier: Modifier = Modifier) {
 	Column(
-		verticalArrangement = Arrangement.spacedBy(8.dp),
+		verticalArrangement = Arrangement.spacedBy(16.dp),
 		modifier = modifier
 			.verticalScroll(rememberScrollState())
 			.padding(horizontal = 16.dp),
 	) {
-		StatisticsWidgetCard(
-			widget = state.widget,
-			chart = StatisticChartContent.DataMissing(StatisticID.GAME_AVERAGE),
-			chartEntryModelProducer = state.widgetChart,
-			modifier = Modifier.widthIn(max = 200.dp),
-		)
+		Card {
+			Column(
+				verticalArrangement = Arrangement.spacedBy(8.dp),
+				modifier = Modifier.padding(16.dp),
+			) {
+				StatisticsWidgetCard(
+					widget = state.widget,
+					chart = StatisticChartContent.DataMissing(StatisticID.GAME_AVERAGE),
+					chartEntryModelProducer = state.widgetChart,
+					modifier = Modifier
+						.widthIn(max = 200.dp)
+						.padding(bottom = 8.dp),
+				)
 
-		Column(
-			verticalArrangement = Arrangement.spacedBy(4.dp),
-		) {
-			Text(
-				text = stringResource(R.string.statistics_widget_not_enough_data_error_title),
-				style = MaterialTheme.typography.titleMedium,
-			)
+				Text(
+					text = stringResource(R.string.statistics_widget_not_enough_data_error_title),
+					style = MaterialTheme.typography.titleMedium,
+				)
 
-			Text(
-				text = stringResource(R.string.statistics_widget_not_enough_data_error_description_1),
-				style = MaterialTheme.typography.bodyMedium,
-			)
+				Text(
+					text = stringResource(R.string.statistics_widget_not_enough_data_error_description_1),
+					style = MaterialTheme.typography.bodyMedium,
+				)
 
-			Text(
-				text = stringResource(R.string.statistics_widget_not_enough_data_error_description_2),
-				style = MaterialTheme.typography.bodyMedium,
-			)
+				Text(
+					text = stringResource(R.string.statistics_widget_not_enough_data_error_description_2),
+					style = MaterialTheme.typography.bodyMedium,
+				)
+			}
 		}
 
-		StatisticsWidgetCard(
-			widget = state.widget,
-			chart = StatisticChartContent.ChartUnavailable(StatisticID.GAME_AVERAGE),
-			chartEntryModelProducer = state.widgetChart,
-			modifier = Modifier
-				.widthIn(max = 200.dp)
-				.padding(top = 16.dp),
-		)
+		Card {
+			Column(
+				verticalArrangement = Arrangement.spacedBy(8.dp),
+				modifier = Modifier.padding(16.dp),
+			) {
+				StatisticsWidgetCard(
+					widget = state.widget,
+					chart = StatisticChartContent.ChartUnavailable(StatisticID.GAME_AVERAGE),
+					chartEntryModelProducer = state.widgetChart,
+					modifier = Modifier
+						.widthIn(max = 200.dp)
+						.padding(bottom = 8.dp),
+				)
 
-		Column(
-			verticalArrangement = Arrangement.spacedBy(4.dp),
-			// TODO: use safe area padding instead
-			modifier = Modifier.padding(bottom = 16.dp),
-		) {
-			Text(
-				text = stringResource(R.string.statistics_widget_unavailable_error_title),
-				style = MaterialTheme.typography.titleMedium,
-			)
+				Text(
+					text = stringResource(R.string.statistics_widget_unavailable_error_title),
+					style = MaterialTheme.typography.titleMedium,
+				)
 
-			Text(
-				text = stringResource(R.string.statistics_widget_unavailable_error_description_1),
-				style = MaterialTheme.typography.bodyMedium,
-			)
+				Text(
+					text = stringResource(R.string.statistics_widget_unavailable_error_description_1),
+					style = MaterialTheme.typography.bodyMedium,
+				)
 
-			Text(
-				text = stringResource(R.string.statistics_widget_unavailable_error_description_2),
-				style = MaterialTheme.typography.bodyMedium,
-			)
+				Text(
+					text = stringResource(R.string.statistics_widget_unavailable_error_description_2),
+					style = MaterialTheme.typography.bodyMedium,
+				)
+			}
 		}
 	}
 }
+
+@Preview
+@Composable
+private fun StatisticsWidgetEditorPreview() {
+	MaterialTheme {
+		StatisticsWidgetError(
+			state = StatisticsWidgetErrorUiState(),
+		)
+	}
+}