Also replaced account.xml with an icon from Material Design Icons Extended

composeApp/src/commonMain/composeResources/drawable/account.xml

@@ -1,10 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:viewportWidth="24"
-    android:viewportHeight="24">
-  <path
-      android:pathData="M12,24C18.6274,24 24,18.6274 24,12C24,5.3726 18.6274,0 12,0C5.3726,0 0,5.3726 0,12C0,18.6274 5.3726,24 12,24ZM6,7.5C6,6.9477 6.4477,6.5 7,6.5H17C17.5523,6.5 18,6.9477 18,7.5V16.5C18,17.0523 17.5523,17.5 17,17.5H7C6.4477,17.5 6,17.0523 6,16.5V7.5ZM7.5,12.9C7.5,12.6791 7.6791,12.5 7.9,12.5H16.1C16.3209,12.5 16.5,12.6791 16.5,12.9V13.1C16.5,13.3209 16.3209,13.5 16.1,13.5H7.9C7.6791,13.5 7.5,13.3209 7.5,13.1V12.9ZM13.9,8.5C13.6791,8.5 13.5,8.6791 13.5,8.9V9.3C13.5,9.5209 13.6791,9.7 13.9,9.7H16.1C16.3209,9.7 16.5,9.5209 16.5,9.3V8.9C16.5,8.6791 16.3209,8.5 16.1,8.5H13.9ZM7.5,14.9C7.5,14.6791 7.6791,14.5 7.9,14.5H16.1C16.3209,14.5 16.5,14.6791 16.5,14.9V15.1C16.5,15.3209 16.3209,15.5 16.1,15.5H7.9C7.6791,15.5 7.5,15.3209 7.5,15.1V14.9Z"
-      android:fillColor="#989792"
-      android:fillType="evenOdd"/>
-</vector>

composeApp/src/commonMain/kotlin/net/codinux/banking/ui/appskeleton/SideMenuContent.kt

@@ -99,7 +99,7 @@ fun SideMenuContent() {
                 Spacer(Modifier.height(VerticalSpacing))
 
                 NavigationMenuItem(itemModifier, "Neue Überweisung", textColor, horizontalPadding = ItemHorizontalPadding,
-                    icon = { Icon(Icons.Filled.Add, "Konto hinzufügen", Modifier.size(iconSize), tint = textColor) }) {
+                    icon = { Icon(Icons.Filled.Add, "Neue Überweisung", Modifier.size(iconSize), tint = textColor) }) {
                     uiState.showTransferMoneyDialogData.value = ShowTransferMoneyDialogData()
 
                     coroutineScope.launch {

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

@@ -1,56 +1,58 @@
 package net.codinux.banking.ui.composables
 
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.size
+import androidx.compose.material.Icon
+import androidx.compose.material.LocalContentAlpha
+import androidx.compose.material.LocalContentColor
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.unit.dp
 import net.codinux.banking.client.model.User
 import net.codinux.banking.client.model.BankViewInfo
 import net.codinux.banking.ui.config.DI
 import net.codinux.banking.ui.model.BankInfo
 import net.dankito.banking.banklistcreator.prettifier.BankingGroupMapper
-import org.jetbrains.compose.resources.DrawableResource
-import org.jetbrains.compose.resources.vectorResource
 
 private val bankIconService = DI.bankIconService
 
 private val DefaultIconModifier: Modifier = Modifier.size(16.dp)
 
 @Composable
-fun BankIcon(user: User?, modifier: Modifier = Modifier, iconModifier: Modifier = DefaultIconModifier, iconResource: DrawableResource? = null) {
+fun BankIcon(user: User?, modifier: Modifier = Modifier, iconModifier: Modifier = DefaultIconModifier, fallbackIcon: ImageVector? = null, fallbackIconTintColor: Color? = null) {
     val iconUrl by remember(user?.bic) { mutableStateOf(user?.let { bankIconService.findIconForBank(it) }) }
 
-    BankIcon(iconUrl, modifier, iconModifier, iconResource = iconResource)
+    BankIcon(iconUrl, modifier, iconModifier, fallbackIcon = fallbackIcon, fallbackIconTintColor = fallbackIconTintColor)
 }
 
 private val bankingGroupMapper = BankingGroupMapper()
 
 @Composable
-fun BankIcon(bank: BankInfo, modifier: Modifier = Modifier, iconModifier: Modifier = DefaultIconModifier, iconResource: DrawableResource? = null) {
+fun BankIcon(bank: BankInfo, modifier: Modifier = Modifier, iconModifier: Modifier = DefaultIconModifier, fallbackIcon: ImageVector? = null) {
     val iconUrl by remember(bank.bic) { mutableStateOf(bankIconService.findIconForBank(bank.name, bankingGroupMapper.getBankingGroup(bank.name, bank.bic))) }
 
-    BankIcon(iconUrl, modifier, iconModifier, iconResource = iconResource)
+    BankIcon(iconUrl, modifier, iconModifier, fallbackIcon = fallbackIcon)
 }
 
 @Composable
-fun BankIcon(user: BankViewInfo?, modifier: Modifier = Modifier, iconModifier: Modifier = DefaultIconModifier, iconResource: DrawableResource? = null) {
+fun BankIcon(user: BankViewInfo?, modifier: Modifier = Modifier, iconModifier: Modifier = DefaultIconModifier, fallbackIcon: ImageVector? = null) {
     val iconUrl = user?.let { bankIconService.findIconForBank(it.bankName, it.bankingGroup) }
 
-    BankIcon(iconUrl, modifier, iconModifier, iconResource = iconResource)
+    BankIcon(iconUrl, modifier, iconModifier, fallbackIcon = fallbackIcon)
 }
 
 @Composable
-fun BankIcon(iconUrl: String?, modifier: Modifier = Modifier, iconModifier: Modifier = DefaultIconModifier, contentDescription: String = "Favicon of this bank", iconResource: DrawableResource? = null) {
+fun BankIcon(iconUrl: String?, modifier: Modifier = Modifier, iconModifier: Modifier = DefaultIconModifier, contentDescription: String = "Favicon of this bank", fallbackIcon: ImageVector? = null, fallbackIconTintColor: Color? = null) {
     Column(modifier) {
         if (iconUrl != null) {
             IconForUrl(iconUrl, contentDescription, modifier = iconModifier)
-        } else if (iconResource != null) {
+        } else if (fallbackIcon != null) {
-            Image(vectorResource(iconResource), contentDescription, iconModifier)
+            Icon(fallbackIcon, contentDescription, iconModifier, tint = fallbackIconTintColor ?: LocalContentColor.current.copy(alpha = LocalContentAlpha.current))
         } else {
             Column(iconModifier) { } // show a placeholder for consistent layout
         }

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

@@ -1,14 +1,15 @@
 package net.codinux.banking.ui.composables
 
 import androidx.compose.foundation.layout.*
+import androidx.compose.material.Icon
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.outlined.AccountBalance
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import bankmeister.composeapp.generated.resources.Res
-import bankmeister.composeapp.generated.resources.account
 import net.codinux.banking.dataaccess.entities.BankAccountEntity
 import net.codinux.banking.dataaccess.entities.UserEntity
 import net.codinux.banking.ui.config.DI
@@ -17,6 +18,8 @@ private val uiState = DI.uiState
 
 private val IconTextSpacing = 24.dp
 
+private val defaultBankIcon = Icons.Outlined.AccountBalance
+
 @Composable
 fun BanksList(
     modifier: Modifier = Modifier,
@@ -30,14 +33,14 @@ fun BanksList(
 
 
     Column(modifier) {
-        NavigationMenuItem(itemModifier, "Alle Konten", textColor, iconSize, IconTextSpacing, itemHorizontalPadding, iconResource = Res.drawable.account) {
+        NavigationMenuItem(itemModifier, "Alle Konten", textColor, iconSize, IconTextSpacing, itemHorizontalPadding, icon = { Icon(defaultBankIcon, "Alle Konten", Modifier.size(iconSize), tint = textColor) }) {
             accountSelected?.invoke(null, null)
         }
 
         users.value.sortedBy { it.displayIndex }.forEach { user ->
             Spacer(Modifier.fillMaxWidth().height(12.dp))
 
-            NavigationMenuItem(itemModifier, user.displayName, textColor, iconSize, IconTextSpacing, itemHorizontalPadding, user, iconResource = Res.drawable.account) {
+            NavigationMenuItem(itemModifier, user.displayName, textColor, iconSize, IconTextSpacing, itemHorizontalPadding, user, fallbackIcon = defaultBankIcon) {
                 accountSelected?.invoke(user, null)
             }
 

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

@@ -14,6 +14,7 @@ import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
@@ -21,7 +22,6 @@ import net.codinux.banking.dataaccess.entities.BankAccountEntity
 import net.codinux.banking.dataaccess.entities.UserEntity
 import net.codinux.banking.ui.config.Colors
 import net.codinux.banking.ui.config.DI
-import org.jetbrains.compose.resources.DrawableResource
 
 private val filterService = DI.accountTransactionsFilterService
 
@@ -39,7 +39,7 @@ fun NavigationMenuItem(
     horizontalPadding: Dp = 8.dp,
     user: UserEntity? = null,
     bankAccount: BankAccountEntity? = null,
-    iconResource: DrawableResource? = null,
+    fallbackIcon: ImageVector? = null,
     icon: (@Composable () -> Unit)? = null,
     onClick: (() -> Unit)? = null
 ) {
@@ -68,7 +68,7 @@ fun NavigationMenuItem(
                 icon()
             }
         } else {
-            BankIcon(user, Modifier.padding(end = iconTextSpacing), Modifier.size(iconSize), iconResource = iconResource)
+            BankIcon(user, Modifier.padding(end = iconTextSpacing), Modifier.size(iconSize), fallbackIcon = fallbackIcon, fallbackIconTintColor = textColor)
         }
 
         Text(text, color = textColor, modifier = Modifier.weight(1f), maxLines = 1, overflow = TextOverflow.Ellipsis)