Added option to set if transactions should be grouped

composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/settings/UiSettings.kt

@@ -12,10 +12,14 @@ import net.codinux.banking.ui.forms.BooleanOption
 fun UiSettings(modifier: Modifier) {
     val uiSettings = DI.uiSettings
 
+    val groupTransactions by uiSettings.groupTransactions.collectAsState()
+
     val zebraStripes by uiSettings.zebraStripes.collectAsState()
 
 
     Column(modifier) {
+        BooleanOption("Umsätze gruppieren", groupTransactions) { uiSettings.groupTransactions.value = it }
+
         BooleanOption("Zebra Stripes", zebraStripes) { uiSettings.zebraStripes.value = it }
     }
 

composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionsList.kt

@@ -2,11 +2,15 @@ package net.codinux.banking.ui.composables.transactions
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.material.Divider
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import net.codinux.banking.ui.config.Colors
 import net.codinux.banking.ui.config.DI
@@ -35,6 +39,10 @@ fun TransactionsList(uiState: UiState, uiSettings: UiSettings) {
         derivedStateOf { filterService.filterAccounts(transactions, transactionsFilter) }
     }
 
+    val groupTransactions by uiSettings.groupTransactions.collectAsState()
+
+    val zebraStripes by uiSettings.zebraStripes.collectAsState()
+
     val transactionsListModifier = Modifier.fillMaxSize().padding(bottom = 12.dp) // padding bottom = add the space the FAB sticks into the content area (= 26 - the 16 we add at the bottom of the expenses line)
 
 
@@ -47,7 +55,20 @@ fun TransactionsList(uiState: UiState, uiSettings: UiSettings) {
             Text(formatUtil.formatAmount(balance, "EUR"), color = formatUtil.getColorForAmount(balance))
         }
 
-        GroupedTransactionsListItems(transactionsListModifier, transactionsToDisplay, userAccountsId, uiSettings)
+        if (groupTransactions) {
+            GroupedTransactionsListItems(transactionsListModifier, transactionsToDisplay, userAccountsId, uiSettings)
+        } else {
+            LazyColumn(transactionsListModifier.padding(top = 8.dp, bottom = 16.dp)) {
+                itemsIndexed(transactionsToDisplay) { index, transaction ->
+                    val backgroundColor = if (zebraStripes && index % 2 == 1) Colors.Zinc100_50 else Color.White // TODO: this is duplicated code from GroupedTransactionsListItems
+                    TransactionListItem(userAccountsId[transaction.userAccountId], transaction, backgroundColor)
+
+                    if (index < transactionsToDisplay.size - 1) { // TODO: this is duplicated code from GroupedTransactionsListItems
+                        Divider(color = Colors.Zinc200, thickness = 1.dp)
+                    }
+                }
+            }
+        }
     }
 }
 

composeApp/src/commonMain/kotlin/net/codinux/banking/ui/settings/UiSettings.kt

@@ -5,6 +5,8 @@ import kotlinx.coroutines.flow.MutableStateFlow
 
 class UiSettings : ViewModel() {
 
+    val groupTransactions = MutableStateFlow(true)
+
     val zebraStripes = MutableStateFlow(true)
 
 }