AddCategory Working but Still no Icons :/

Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt

@@ -19,6 +19,7 @@ import androidx.compose.foundation.layout.wrapContentWidth
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.DateRange
+import androidx.compose.material.icons.rounded.ShoppingCart
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.DatePicker
@@ -50,6 +51,7 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.em
 import androidx.compose.ui.unit.sp
 import at.xaxa.ledger.data.Entry
+import at.xaxa.ledger.ui.category.icons
 import java.util.Date
 import java.util.Locale
 
@@ -142,7 +144,12 @@ fun HorizontalCard(modifier: Modifier = Modifier, name: String, date: String, am
 }
 
 @Composable
-fun CategoryCard(modifier: Modifier = Modifier, name: String, icon : Int, onClick: () -> Unit ) {
+fun CategoryCard(
+    modifier: Modifier = Modifier,
+    name: String,
+    iconid: Int,
+    onClick: () -> Unit
+) {
     Surface(
         onClick = onClick,
         shape = RoundedCornerShape(12.dp),
@@ -154,9 +161,16 @@ fun CategoryCard(modifier: Modifier = Modifier, name: String, icon : Int, onClic
         Row(
             modifier = Modifier
                 .fillMaxSize()
-                .padding(16.dp)
+                .padding(16.dp),
+            verticalAlignment = Alignment.CenterVertically,
+            horizontalArrangement = Arrangement.SpaceBetween
         ) {
-            LayoutMediaText(modifier, name, icon)
+            LayoutMediaText(modifier, name)
+
+            Icon(
+                icons[iconid],
+                contentDescription = "$name Icon"
+            )
         }
     }
 }
@@ -210,7 +224,7 @@ fun LayoutMediaText(modifier: Modifier = Modifier, name: String, date: String, a
     }
 }
 @Composable
-fun LayoutMediaText(modifier: Modifier = Modifier, name: String, icon: Int) {
+fun LayoutMediaText(modifier: Modifier = Modifier, name: String) {
     Row(
         verticalAlignment = Alignment.CenterVertically,
         modifier = modifier
@@ -233,19 +247,6 @@ fun LayoutMediaText(modifier: Modifier = Modifier, name: String, icon: Int) {
             )
 
         }
-        Box(
-            modifier = Modifier
-                .fillMaxHeight()
-                .wrapContentWidth() // Allow the Box to wrap its content width
-                .padding(start = 16.dp), // Add some padding to separate from the Column
-            contentAlignment = Alignment.Center
-        ) {
-            Text(
-                text = icon.toString(),
-                fontSize = 30.sp, // Set the desired font size
-                modifier = Modifier.wrapContentSize() // Ensure the text wraps its content
-            )
-        }
     }
 }
 

Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddViewModel.kt

@@ -21,7 +21,6 @@ import kotlinx.coroutines.flow.flow
 import kotlinx.coroutines.flow.flowOf
 import kotlinx.coroutines.launch
 import kotlinx.coroutines.withContext
-import kotlin.math.log
 
 data class CategoryListUIState(val categories: Flow<List<CategoryEntity>> = flowOf(emptyList()))
 
@@ -86,8 +85,6 @@ class AddViewModel(
                 repository.getAllCategories()
             }
             categoryUiState = CategoryListUIState(categories)
-
         }
-
     }
 }

Ledger/app/src/main/java/at/xaxa/ledger/ui/category/CategoryIcons.kt

@@ -0,0 +1,37 @@
+package at.xaxa.ledger.ui.category
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.AccountBox
+import androidx.compose.material.icons.filled.Build
+import androidx.compose.material.icons.filled.Call
+import androidx.compose.material.icons.filled.Check
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.material.icons.filled.Delete
+import androidx.compose.material.icons.filled.Home
+import androidx.compose.material.icons.filled.Info
+import androidx.compose.material.icons.filled.LocationOn
+import androidx.compose.material.icons.filled.Lock
+import androidx.compose.material.icons.filled.Notifications
+import androidx.compose.material.icons.filled.ShoppingCart
+import androidx.compose.material.icons.filled.Warning
+
+val icons = listOf(
+    Icons.Filled.Call,
+    Icons.Filled.Home,
+    Icons.Filled.Build,
+    Icons.Filled.ShoppingCart,
+    Icons.Filled.Notifications,
+    Icons.Filled.LocationOn,
+    Icons.Filled.Delete,
+    Icons.Filled.Lock,
+    Icons.Filled.Info,
+    Icons.Filled.Warning,
+    Icons.Filled.Check,
+    Icons.Filled.Close,
+    Icons.Filled.AccountBox
+)
+
+val iconNames = listOf( // For displaying icon names in the dropdown
+    "Call", "Home", "Build", "ShoppingCart", "Notifications", "LocationOn",
+    "Delete", "Lock", "Info", "Warning", "Check", "Close", "AccountBox"
+)

Ledger/app/src/main/java/at/xaxa/ledger/ui/category/add/CategoryUI.kt

@@ -24,7 +24,10 @@ import androidx.compose.material.icons.filled.Notifications
 import androidx.compose.material.icons.filled.Share
 import androidx.compose.material.icons.filled.ShoppingCart
 import androidx.compose.material.icons.filled.Warning
+import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ExposedDropdownMenuBox
+import androidx.compose.material3.ExposedDropdownMenuDefaults
 import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -42,6 +45,9 @@ import at.xaxa.ledger.ui.AppViewModelProvider
 import at.xaxa.ledger.ui.ButtonSuccess
 import at.xaxa.ledger.ui.CategoryCard
 import at.xaxa.ledger.ui.category.CategoryViewModel
+import at.xaxa.ledger.ui.category.iconNames
+import at.xaxa.ledger.ui.category.icons
+
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
@@ -51,28 +57,12 @@ fun addCategory(
     onCardClick: (Int) -> Unit,
     categoryViewModel: CategoryViewModel = viewModel(factory = AppViewModelProvider.Factory)
 ) {
-    val icons = listOf(
+
-        Icons.Filled.Call,
-        Icons.Filled.Home,
-        Icons.Filled.Build,
-        Icons.Filled.ShoppingCart,
-        Icons.Filled.Notifications,
-        Icons.Filled.LocationOn,
-        Icons.Filled.Delete,
-        Icons.Filled.Lock,
-        Icons.Filled.Info,
-        Icons.Filled.Warning,
-        Icons.Filled.Check,
-        Icons.Filled.Close,
-        Icons.Filled.AccountBox
-    )
     var name by remember { mutableStateOf("") }
-    var icon by remember { mutableStateOf(0) }
+    var selectedIconIndex by remember { mutableStateOf(0) } // Store index of selected icon
+    var expanded by remember { mutableStateOf(false) } // Controls dropdown visibility
 
     val categories by categoryViewModel.categoryUiState.categories.collectAsState(initial = emptyList())
-    val category = categoryViewModel.categoryUi.category
-    var expanded by remember { mutableStateOf(false) }
-
 
     Column(
         modifier = modifier
@@ -80,21 +70,53 @@ fun addCategory(
             .padding(16.dp, 0.dp),
         horizontalAlignment = Alignment.CenterHorizontally
     ) {
-
         OutlinedTextField(
             value = name,
             onValueChange = { name = it },
-            label = { Text("Name") },
+            label = { Text("Category Name") },
             modifier = Modifier
                 .fillMaxWidth()
         )
+
+        ExposedDropdownMenuBox(
+            expanded = expanded,
+            onExpandedChange = { expanded = it }
+        ) {
             OutlinedTextField(
-            value = category.icon.toString(),
+                value = iconNames[selectedIconIndex], // Show selected icon name
-            onValueChange = { category.copy(icon = it.toInt()) },
+                onValueChange = {},
                 label = { Text("Icon") },
+                readOnly = true,
+                trailingIcon = {
+                    ExposedDropdownMenuDefaults.TrailingIcon(expanded = expanded)
+                },
                 modifier = Modifier
+                    .menuAnchor()
                     .fillMaxWidth()
             )
+
+            ExposedDropdownMenu(
+                expanded = expanded,
+                onDismissRequest = { expanded = false }
+            ) {
+                icons.forEachIndexed { index, icon ->
+                    DropdownMenuItem(
+                        text = { Text(text = iconNames[index]) }, // Use name from iconNames
+                        onClick = {
+                            selectedIconIndex = index // Update selected index
+                            expanded = false
+                        },
+                        leadingIcon = {
+                            androidx.compose.material3.Icon(
+                                imageVector = icon,
+                                contentDescription = iconNames[index]
+                            )
+                        }
+                    )
+                }
+            }
+        }
+
         Box(
             modifier = Modifier
                 .fillMaxWidth(),
@@ -108,7 +130,7 @@ fun addCategory(
                         val newCategory = CategoryEntity(
                             _id = 0,
                             categoryName = name,
-                            icon = icon
+                            icon = selectedIconIndex // Save selected index as the icon ID
                         )
                         categoryViewModel.addCategory(newCategory)
                         onButtonClick()
@@ -120,16 +142,14 @@ fun addCategory(
         LazyColumn(
             Modifier.weight(1f)
         ) {
-
             items(categories) { item ->
                 Column(
                     modifier = Modifier.padding(vertical = 4.dp)
                 ) {
-                    Log.w("KRAUSI", item.categoryName )
                     CategoryCard(
                         modifier = modifier,
                         name = item.categoryName,
-                        icon = item.icon,
+                        iconid = item.icon,
                         onClick = { onCardClick(item._id) }
                     )
                 }