From 1488c9c4632efcc86429d2410bdf1df086456bba Mon Sep 17 00:00:00 2001 From: dankito Date: Thu, 5 Sep 2024 03:25:18 +0200 Subject: [PATCH] Moved decision about zebraStripes and Divider to TransactionListItem --- .../transactions/GroupedTransactionsListItems.kt | 15 ++------------- .../transactions/TransactionListItem.kt | 16 +++++++++++++++- .../composables/transactions/TransactionsList.kt | 13 ++----------- 3 files changed, 19 insertions(+), 25 deletions(-) diff --git a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/GroupedTransactionsListItems.kt b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/GroupedTransactionsListItems.kt index 74eb00a..aa62330 100644 --- a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/GroupedTransactionsListItems.kt +++ b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/GroupedTransactionsListItems.kt @@ -4,7 +4,6 @@ import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.items -import androidx.compose.material.Divider import androidx.compose.material.Text import androidx.compose.runtime.* import androidx.compose.ui.Alignment @@ -16,11 +15,9 @@ import androidx.compose.ui.unit.sp import kotlinx.datetime.LocalDate import net.codinux.banking.client.model.Amount import net.codinux.banking.dataaccess.entities.UserAccountEntity -import net.codinux.banking.ui.config.Colors import net.codinux.banking.ui.config.DI import net.codinux.banking.ui.forms.RoundedCornersCard import net.codinux.banking.ui.model.AccountTransactionViewModel -import net.codinux.banking.ui.settings.UiSettings private val calculator = DI.calculator @@ -30,16 +27,13 @@ private val formatUtil = DI.formatUtil fun GroupedTransactionsListItems( modifier: Modifier, transactionsToDisplay: List, - userAccountsId: Map, - uiSettings: UiSettings + userAccountsId: Map ) { val groupedByMonth by remember(transactionsToDisplay) { derivedStateOf { transactionsToDisplay.groupBy { LocalDate(it.valueDate.year, it.valueDate.monthNumber, 1) } } } - val zebraStripes by uiSettings.zebraStripes.collectAsState() - LazyColumn(modifier) { items(groupedByMonth.keys.sortedDescending()) { month -> @@ -59,12 +53,7 @@ fun GroupedTransactionsListItems( RoundedCornersCard { Column(Modifier.background(Color.White)) { // LazyColumn inside LazyColumn is not allowed monthTransactions.forEachIndexed { index, transaction -> - val backgroundColor = if (zebraStripes && index % 2 == 1) Colors.Zinc100_50 else Color.Transparent - TransactionListItem(userAccountsId[transaction.userAccountId], transaction, backgroundColor) - - if (index < monthTransactions.size - 1) { - Divider(color = Colors.Zinc200, thickness = 1.dp) - } + TransactionListItem(userAccountsId[transaction.userAccountId], transaction, index, monthTransactions.size) } } } diff --git a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionListItem.kt b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionListItem.kt index 7c9e207..c586dd4 100644 --- a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionListItem.kt +++ b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionListItem.kt @@ -2,8 +2,11 @@ package net.codinux.banking.ui.composables.transactions import androidx.compose.foundation.background import androidx.compose.foundation.layout.* +import androidx.compose.material.Divider import androidx.compose.material.Text import androidx.compose.runtime.Composable +import androidx.compose.runtime.collectAsState +import androidx.compose.runtime.getValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color @@ -11,13 +14,20 @@ import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp import net.codinux.banking.client.model.UserAccount import net.codinux.banking.ui.composables.BankIcon +import net.codinux.banking.ui.config.Colors import net.codinux.banking.ui.config.DI import net.codinux.banking.ui.model.AccountTransactionViewModel +private val uiSettings = DI.uiSettings + private val formatUtil = DI.formatUtil @Composable -fun TransactionListItem(userAccount: UserAccount?, transaction: AccountTransactionViewModel, backgroundColor: Color) { +fun TransactionListItem(userAccount: UserAccount?, transaction: AccountTransactionViewModel, itemIndex: Int, countItems: Int) { + val zebraStripes by uiSettings.zebraStripes.collectAsState() + + val backgroundColor = if (zebraStripes && itemIndex % 2 == 1) Colors.Zinc100_50 else Color.White + Row( modifier = Modifier.fillMaxWidth() .background(color = backgroundColor) @@ -60,4 +70,8 @@ fun TransactionListItem(userAccount: UserAccount?, transaction: AccountTransacti ) } } + + if (itemIndex < countItems - 1) { + Divider(color = Colors.Zinc200, thickness = 1.dp) + } } \ No newline at end of file diff --git a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionsList.kt b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionsList.kt index 216b687..d0de310 100644 --- a/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionsList.kt +++ b/composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/transactions/TransactionsList.kt @@ -4,13 +4,11 @@ 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 @@ -41,8 +39,6 @@ fun TransactionsList(uiState: UiState, uiSettings: UiSettings) { 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) @@ -56,16 +52,11 @@ fun TransactionsList(uiState: UiState, uiSettings: UiSettings) { } if (groupTransactions) { - GroupedTransactionsListItems(transactionsListModifier, transactionsToDisplay, userAccountsId, uiSettings) + GroupedTransactionsListItems(transactionsListModifier, transactionsToDisplay, userAccountsId) } 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) - } + TransactionListItem(userAccountsId[transaction.userAccountId], transaction, index, transactionsToDisplay.size) } } }