refactor: update EditListPreference

app/src/main/java/com/geeksville/mesh/ui/components/EditListPreference.kt

@@ -0,0 +1,95 @@
+package com.geeksville.mesh.ui.components
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentSize
+import androidx.compose.foundation.text.KeyboardActions
+import androidx.compose.material.ButtonDefaults
+import androidx.compose.material.ContentAlpha
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.OutlinedButton
+import androidx.compose.material.Text
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.twotone.Close
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateListOf
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.geeksville.mesh.R
+
+@Composable
+fun EditListPreference(
+    title: String,
+    list: List<Int>,
+    maxCount: Int,
+    enabled: Boolean,
+    keyboardActions: KeyboardActions,
+    onValuesChanged: (List<Int>) -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    val listState = remember(list) { mutableStateListOf<Int>().apply { addAll(list) } }
+
+    Column(modifier = modifier) {
+        Text(
+            modifier = modifier.padding(16.dp),
+            text = title,
+            style = MaterialTheme.typography.body2,
+            color = if (!enabled) MaterialTheme.colors.onSurface.copy(alpha = ContentAlpha.disabled) else Color.Unspecified,
+        )
+        listState.forEachIndexed { index, value ->
+            EditTextPreference(
+                title = "${index + 1}/$maxCount",
+                value = value,
+                enabled = enabled,
+                keyboardActions = keyboardActions,
+                onValueChanged = {
+                    listState[index] = it
+                    onValuesChanged(listState)
+                },
+                modifier = modifier.fillMaxWidth(),
+                trailingIcon = {
+                    IconButton(
+                        onClick = {
+                            listState.removeAt(index)
+                            onValuesChanged(listState)
+                        }
+                    ) {
+                        Icon(
+                            Icons.TwoTone.Close,
+                            stringResource(R.string.delete),
+                            modifier = Modifier.wrapContentSize(),
+                        )
+                    }
+                }
+            )
+        }
+        OutlinedButton(
+            modifier = Modifier.fillMaxWidth(),
+            onClick = { listState.add(listState.size, 0) },
+            enabled = maxCount > listState.size,
+            colors = ButtonDefaults.buttonColors(
+                disabledContentColor = MaterialTheme.colors.onSurface.copy(alpha = ContentAlpha.disabled)
+            )
+        ) { Text(text = stringResource(R.string.add)) }
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun EditListPreferencePreview() {
+    EditListPreference(
+        title = "Ignore incoming",
+        list = listOf(12345,67890),
+        maxCount = 4,
+        enabled = true,
+        keyboardActions = KeyboardActions {},
+        onValuesChanged = { },
+    )
+}

app/src/main/java/com/geeksville/mesh/ui/components/EditTextPreference.kt

@@ -14,7 +14,6 @@ import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.twotone.Info
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateListOf
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
@@ -35,6 +34,7 @@ fun EditTextPreference(
     keyboardActions: KeyboardActions,
     onValueChanged: (Int) -> Unit,
     modifier: Modifier = Modifier,
+    trailingIcon: (@Composable () -> Unit)? = null,
 ) {
     var valueState by remember(value) { mutableStateOf(value.toUInt().toString()) }
 
@@ -55,7 +55,8 @@ fun EditTextPreference(
             }
         },
         onFocusChanged = {},
-        modifier = modifier
+        modifier = modifier,
+        trailingIcon = trailingIcon
     )
 }
 
@@ -165,36 +166,6 @@ fun EditIPv4Preference(
     )
 }
 
-@Composable
-fun EditListPreference(
-    title: String,
-    list: List<Int>,
-    maxCount: Int,
-    enabled: Boolean,
-    keyboardActions: KeyboardActions,
-    onValuesChanged: (List<Int>) -> Unit,
-    modifier: Modifier = Modifier,
-) {
-    val listState = remember(list) { mutableStateListOf<Int>().apply { addAll(list) } }
-
-    Column(modifier = modifier) {
-        for (i in 0..list.size.coerceAtMost(maxCount - 1)) {
-            val value = listState.getOrNull(i)
-            EditTextPreference(
-                title = "$title ${i + 1}/$maxCount",
-                value = value ?: 0,
-                enabled = enabled,
-                keyboardActions = keyboardActions,
-                onValueChanged = {
-                    if (value == null) listState.add(it) else listState[i] = it
-                    onValuesChanged(listState)
-                },
-                modifier = modifier.fillMaxWidth()
-            )
-        }
-    }
-}
-
 @Composable
 fun EditTextPreference(
     title: String,
@@ -205,34 +176,9 @@ fun EditTextPreference(
     keyboardActions: KeyboardActions,
     onValueChanged: (String) -> Unit,
     modifier: Modifier = Modifier,
-    maxSize: Int // max_size - 1 (in bytes)
-) {
-    EditTextPreference(
-        title = title,
-        value = value,
-        maxSize = maxSize,
-        enabled = enabled,
-        isError = isError,
-        keyboardOptions = keyboardOptions,
-        keyboardActions = keyboardActions,
-        onValueChanged = onValueChanged,
-        onFocusChanged = {},
-        modifier = modifier,
-    )
-}
-
-@Composable
-fun EditTextPreference(
-    title: String,
-    value: String,
-    enabled: Boolean,
-    isError: Boolean,
-    keyboardOptions: KeyboardOptions,
-    keyboardActions: KeyboardActions,
-    onValueChanged: (String) -> Unit,
-    onFocusChanged: (FocusState) -> Unit,
-    modifier: Modifier = Modifier,
     maxSize: Int = 0, // max_size - 1 (in bytes)
+    onFocusChanged: (FocusState) -> Unit = {},
+    trailingIcon: (@Composable () -> Unit)? = null,
 ) {
     var isFocused by remember { mutableStateOf(false) }
 
@@ -255,7 +201,11 @@ fun EditTextPreference(
         keyboardOptions = keyboardOptions,
         keyboardActions = keyboardActions,
         trailingIcon = {
-            if (isError) Icon(Icons.TwoTone.Info, "Error", tint = MaterialTheme.colors.error)
+            if (trailingIcon != null) {
+                trailingIcon()
+            } else {
+                if (isError) Icon(Icons.TwoTone.Info, "Error", tint = MaterialTheme.colors.error)
+            }
         }
     )