From 161c38f8eeddb9186b807e86c964995c21eae6fb Mon Sep 17 00:00:00 2001 From: Phil Oliver <3497406+poliver@users.noreply.github.com> Date: Thu, 4 Sep 2025 22:53:44 -0400 Subject: [PATCH] Align syle of admin settings (#2969) --- .../geeksville/mesh/navigation/NavGraph.kt | 16 +++- .../ui/settings/components/SettingsItem.kt | 24 ++++- .../mesh/ui/settings/radio/RadioConfig.kt | 94 +++++-------------- .../radio/components/WarningDialog.kt | 63 +++++++++++++ 4 files changed, 118 insertions(+), 79 deletions(-) create mode 100644 app/src/main/java/com/geeksville/mesh/ui/settings/radio/components/WarningDialog.kt diff --git a/app/src/main/java/com/geeksville/mesh/navigation/NavGraph.kt b/app/src/main/java/com/geeksville/mesh/navigation/NavGraph.kt index e8ed81e1e..32da5d844 100644 --- a/app/src/main/java/com/geeksville/mesh/navigation/NavGraph.kt +++ b/app/src/main/java/com/geeksville/mesh/navigation/NavGraph.kt @@ -18,8 +18,14 @@ package com.geeksville.mesh.navigation import androidx.annotation.StringRes +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.rounded.PowerSettingsNew +import androidx.compose.material.icons.rounded.RestartAlt +import androidx.compose.material.icons.rounded.Restore +import androidx.compose.material.icons.rounded.Storage import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.vector.ImageVector import androidx.hilt.navigation.compose.hiltViewModel import androidx.navigation.NavDestination import androidx.navigation.NavDestination.Companion.hasRoute @@ -33,11 +39,11 @@ import com.geeksville.mesh.ui.TopLevelDestination.Companion.isTopLevel import com.geeksville.mesh.ui.map.MapViewModel import kotlinx.serialization.Serializable -enum class AdminRoute(@StringRes val title: Int) { - REBOOT(R.string.reboot), - SHUTDOWN(R.string.shutdown), - FACTORY_RESET(R.string.factory_reset), - NODEDB_RESET(R.string.nodedb_reset), +enum class AdminRoute(val icon: ImageVector, @StringRes val title: Int) { + REBOOT(Icons.Rounded.RestartAlt, R.string.reboot), + SHUTDOWN(Icons.Rounded.PowerSettingsNew, R.string.shutdown), + FACTORY_RESET(Icons.Rounded.Restore, R.string.factory_reset), + NODEDB_RESET(Icons.Rounded.Storage, R.string.nodedb_reset), } const val DEEP_LINK_BASE_URI = "meshtastic://meshtastic" diff --git a/app/src/main/java/com/geeksville/mesh/ui/settings/components/SettingsItem.kt b/app/src/main/java/com/geeksville/mesh/ui/settings/components/SettingsItem.kt index ea0369072..964e2830f 100644 --- a/app/src/main/java/com/geeksville/mesh/ui/settings/components/SettingsItem.kt +++ b/app/src/main/java/com/geeksville/mesh/ui/settings/components/SettingsItem.kt @@ -44,6 +44,7 @@ import com.geeksville.mesh.ui.common.theme.AppTheme @Composable fun SettingsItem( text: String, + textColor: Color = LocalContentColor.current, enabled: Boolean = true, leadingIcon: ImageVector? = null, leadingIconTint: Color = LocalContentColor.current, @@ -53,6 +54,7 @@ fun SettingsItem( ) { SettingsItem( text = text, + textColor = textColor, enabled = enabled, leadingIcon = leadingIcon, leadingIconTint = leadingIconTint, @@ -65,6 +67,7 @@ fun SettingsItem( @Composable fun SettingsItem( text: String, + textColor: Color = LocalContentColor.current, enabled: Boolean = true, leadingIcon: ImageVector? = null, leadingIconTint: Color = LocalContentColor.current, @@ -72,7 +75,12 @@ fun SettingsItem( onClick: () -> Unit, ) { ClickableWrapper(enabled = enabled, onClick = onClick) { - Content(leading = { leadingIcon.Icon(leadingIconTint) }, text = text, trailing = trailingContent) + Content( + leading = { leadingIcon.Icon(leadingIconTint) }, + text = text, + textColor = textColor, + trailing = trailingContent, + ) } } @@ -81,6 +89,7 @@ fun SettingsItem( fun SettingsItemSwitch( checked: Boolean, text: String, + textColor: Color = LocalContentColor.current, enabled: Boolean = true, leadingIcon: ImageVector? = null, leadingIconTint: Color = LocalContentColor.current, @@ -90,6 +99,7 @@ fun SettingsItemSwitch( Content( leading = { leadingIcon.Icon(leadingIconTint) }, text = text, + textColor = textColor, trailing = { Switch(checked = checked, enabled = enabled, onCheckedChange = null) }, ) } @@ -99,6 +109,7 @@ fun SettingsItemSwitch( @Composable fun SettingsItemDetail( text: String, + textColor: Color = LocalContentColor.current, icon: ImageVector? = null, iconTint: Color = LocalContentColor.current, trailingText: String? = null, @@ -106,7 +117,12 @@ fun SettingsItemDetail( onClick: (() -> Unit)? = null, ) { val content: @Composable ColumnScope.() -> Unit = { - Content(leading = { icon.Icon(iconTint) }, text = text, trailing = { trailingText?.let { Text(text = it) } }) + Content( + leading = { icon.Icon(iconTint) }, + text = text, + textColor = textColor, + trailing = { trailingText?.let { Text(text = it) } }, + ) } if (onClick != null) { @@ -130,11 +146,11 @@ private fun ClickableWrapper(enabled: Boolean, onClick: () -> Unit, content: @Co /** The row content to display for a settings item. */ @Composable -private fun Content(leading: @Composable () -> Unit, text: String, trailing: @Composable () -> Unit) { +private fun Content(leading: @Composable () -> Unit, text: String, textColor: Color, trailing: @Composable () -> Unit) { ListItem( modifier = Modifier.padding(horizontal = 8.dp), colors = ListItemDefaults.colors(containerColor = Color.Transparent), - headlineContent = { Text(text) }, + headlineContent = { Text(text = text, color = textColor) }, leadingContent = { leading() }, trailingContent = { trailing() }, ) diff --git a/app/src/main/java/com/geeksville/mesh/ui/settings/radio/RadioConfig.kt b/app/src/main/java/com/geeksville/mesh/ui/settings/radio/RadioConfig.kt index e6e213bc8..e61ebe5b6 100644 --- a/app/src/main/java/com/geeksville/mesh/ui/settings/radio/RadioConfig.kt +++ b/app/src/main/java/com/geeksville/mesh/ui/settings/radio/RadioConfig.kt @@ -18,27 +18,16 @@ package com.geeksville.mesh.ui.settings.radio import android.widget.Toast -import androidx.annotation.StringRes -import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.Row -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.shape.RoundedCornerShape import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Download import androidx.compose.material.icons.filled.Upload import androidx.compose.material.icons.rounded.BugReport -import androidx.compose.material.icons.twotone.Warning -import androidx.compose.material3.AlertDialog -import androidx.compose.material3.Button -import androidx.compose.material3.Icon +import androidx.compose.material.icons.rounded.CleaningServices import androidx.compose.material3.IconButton import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text -import androidx.compose.material3.TextButton import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.getValue @@ -46,7 +35,6 @@ import androidx.compose.runtime.mutableIntStateOf import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue -import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.stringResource @@ -64,64 +52,11 @@ import com.geeksville.mesh.ui.common.components.TitledCard import com.geeksville.mesh.ui.common.theme.AppTheme import com.geeksville.mesh.ui.common.theme.StatusColors.StatusRed import com.geeksville.mesh.ui.settings.components.SettingsItem +import com.geeksville.mesh.ui.settings.radio.components.WarningDialog import kotlinx.coroutines.delay import kotlin.time.Duration.Companion.seconds -@Suppress("LongMethod") -@Composable -private fun NavButton(@StringRes title: Int, enabled: Boolean, onClick: () -> Unit) { - var showDialog by remember { mutableStateOf(false) } - if (showDialog) { - AlertDialog( - onDismissRequest = {}, - shape = RoundedCornerShape(16.dp), - title = { - Row(modifier = Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.Center) { - Icon( - imageVector = Icons.TwoTone.Warning, - contentDescription = stringResource(id = R.string.warning), - modifier = Modifier.padding(end = 8.dp), - ) - Text(text = "${stringResource(title)}?\n") - Icon( - imageVector = Icons.TwoTone.Warning, - contentDescription = stringResource(id = R.string.warning), - modifier = Modifier.padding(start = 8.dp), - ) - } - }, - confirmButton = { - Row( - modifier = Modifier.fillMaxWidth().padding(start = 16.dp, end = 16.dp, bottom = 16.dp), - horizontalArrangement = Arrangement.spacedBy(8.dp), - verticalAlignment = Alignment.CenterVertically, - ) { - TextButton(modifier = Modifier.weight(1f), onClick = { showDialog = false }) { - Text(stringResource(R.string.cancel)) - } - Button( - modifier = Modifier.weight(1f), - onClick = { - showDialog = false - onClick() - }, - ) { - Text(stringResource(R.string.send)) - } - } - }, - ) - } - - Column { - Spacer(modifier = Modifier.height(4.dp)) - Button(modifier = Modifier.fillMaxWidth().height(48.dp), enabled = enabled, onClick = { showDialog = true }) { - Text(text = stringResource(title)) - } - } -} - -@Suppress("LongMethod") +@Suppress("LongMethod", "CyclomaticComplexMethod") @Composable fun RadioConfigItemList( state: RadioConfigState, @@ -190,8 +125,26 @@ fun RadioConfigItemList( } } - Column(modifier = Modifier.padding(top = 16.dp)) { - AdminRoute.entries.forEach { NavButton(it.title, enabled) { onRouteClick(it) } } + TitledCard(title = stringResource(R.string.administration), modifier = Modifier.padding(top = 16.dp)) { + AdminRoute.entries.forEach { route -> + var showDialog by remember { mutableStateOf(false) } + if (showDialog) { + WarningDialog( + title = "${stringResource(route.title)}?", + onDismiss = { showDialog = false }, + onConfirm = { onRouteClick(route) }, + ) + } + + SettingsItem( + enabled = enabled, + text = stringResource(route.title), + leadingIcon = route.icon, + trailingIcon = null, + ) { + showDialog = true + } + } } TitledCard(title = stringResource(R.string.advanced_title), modifier = Modifier.padding(top = 16.dp)) { @@ -201,6 +154,7 @@ fun RadioConfigItemList( SettingsItem( text = stringResource(R.string.clean_node_database_title), + leadingIcon = Icons.Rounded.CleaningServices, enabled = enabled, onClick = { onNavigate(SettingsRoutes.CleanNodeDb) }, ) diff --git a/app/src/main/java/com/geeksville/mesh/ui/settings/radio/components/WarningDialog.kt b/app/src/main/java/com/geeksville/mesh/ui/settings/radio/components/WarningDialog.kt new file mode 100644 index 000000000..a2efa92e5 --- /dev/null +++ b/app/src/main/java/com/geeksville/mesh/ui/settings/radio/components/WarningDialog.kt @@ -0,0 +1,63 @@ +/* + * Copyright (c) 2025 Meshtastic LLC + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ + +package com.geeksville.mesh.ui.settings.radio.components + +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.rounded.Warning +import androidx.compose.material3.AlertDialog +import androidx.compose.material3.Button +import androidx.compose.material3.Icon +import androidx.compose.material3.Text +import androidx.compose.material3.TextButton +import androidx.compose.runtime.Composable +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.tooling.preview.Preview +import com.geeksville.mesh.R +import com.geeksville.mesh.ui.common.theme.AppTheme + +@Composable +fun WarningDialog( + icon: ImageVector? = Icons.Rounded.Warning, + title: String, + onDismiss: () -> Unit, + onConfirm: () -> Unit, +) { + AlertDialog( + onDismissRequest = {}, + icon = { icon?.let { Icon(imageVector = it, contentDescription = null) } }, + title = { Text(text = title) }, + dismissButton = { TextButton(onClick = { onDismiss() }) { Text(stringResource(R.string.cancel)) } }, + confirmButton = { + Button( + onClick = { + onDismiss() + onConfirm() + }, + ) { + Text(stringResource(R.string.send)) + } + }, + ) +} + +@Preview +@Composable +private fun WarningDialogPreview() { + AppTheme { WarningDialog(title = "Factory Reset?", onDismiss = {}, onConfirm = {}) } +}