From 7d85c0bfa3a96bb2ed2eaffc5c66d965f59a1426 Mon Sep 17 00:00:00 2001
From: Benoit Marty <benoit@matrix.org>
Date: Wed, 5 Mar 2025 11:42:05 +0100
Subject: [PATCH] Fix icon color. Leading icon should be iconSecondary Trailing
 icon should be iconPrimary See Figma
 https://www.figma.com/design/G1xy0HDZKJf5TCRFmKb5d5/Compound-Android-Components?node-id=628-25757

---
 .../libraries/designsystem/ColorUtil.kt        | 18 ++++++++++++++++++
 .../preferences/components/PreferenceIcon.kt   |  4 ++--
 .../designsystem/theme/components/ListItem.kt  | 11 ++++++-----
 3 files changed, 26 insertions(+), 7 deletions(-)

diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/ColorUtil.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/ColorUtil.kt
index 8b22e53ae6..debcd57c67 100644
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/ColorUtil.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/ColorUtil.kt
@@ -28,3 +28,21 @@ fun Boolean.toSecondaryEnabledColor(): Color {
         ElementTheme.colors.textDisabled
     }
 }
+
+@Composable
+fun Boolean.toIconEnabledColor(): Color {
+    return if (this) {
+        ElementTheme.colors.iconPrimary
+    } else {
+        ElementTheme.colors.iconDisabled
+    }
+}
+
+@Composable
+fun Boolean.toIconSecondaryEnabledColor(): Color {
+    return if (this) {
+        ElementTheme.colors.iconSecondary
+    } else {
+        ElementTheme.colors.iconDisabled
+    }
+}
diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/components/PreferenceIcon.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/components/PreferenceIcon.kt
index a174d0bea7..2e4fff1e92 100644
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/components/PreferenceIcon.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/components/PreferenceIcon.kt
@@ -25,7 +25,7 @@ import io.element.android.libraries.designsystem.components.list.ListItemContent
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Icon
-import io.element.android.libraries.designsystem.toSecondaryEnabledColor
+import io.element.android.libraries.designsystem.toIconSecondaryEnabledColor
 
 @Composable
 fun preferenceIcon(
@@ -68,7 +68,7 @@ private fun PreferenceIcon(
                 imageVector = icon,
                 resourceId = iconResourceId,
                 contentDescription = null,
-                tint = tintColor ?: enabled.toSecondaryEnabledColor(),
+                tint = tintColor ?: enabled.toIconSecondaryEnabledColor(),
                 modifier = Modifier
                     .size(24.dp),
             )
diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/ListItem.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/ListItem.kt
index 8cea5a0ef8..d43c312066 100644
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/ListItem.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/ListItem.kt
@@ -193,14 +193,14 @@ sealed interface ListItemStyle {
 
     @Composable
     fun leadingIconColor() = when (this) {
-        Default -> ListItemDefaultColors.icon
+        Default -> ListItemDefaultColors.leadingIcon
         Primary -> ElementTheme.colors.iconPrimary
         Destructive -> ElementTheme.colors.iconCriticalPrimary
     }
 
     @Composable
     fun trailingIconColor() = when (this) {
-        Default -> ListItemDefaultColors.icon
+        Default -> ListItemDefaultColors.trailingIcon
         Primary -> ElementTheme.colors.iconPrimary
         Destructive -> ElementTheme.colors.iconCriticalPrimary
     }
@@ -210,15 +210,16 @@ object ListItemDefaultColors {
     val headline: Color @Composable get() = ElementTheme.colors.textPrimary
     val headlineDisabled: Color @Composable get() = ElementTheme.colors.textDisabled
     val supportingText: Color @Composable get() = ElementTheme.materialColors.onSurfaceVariant
-    val icon: Color @Composable get() = ElementTheme.colors.iconTertiary
+    val leadingIcon: Color @Composable get() = ElementTheme.colors.iconSecondary
+    val trailingIcon: Color @Composable get() = ElementTheme.colors.iconPrimary
     val iconDisabled: Color @Composable get() = ElementTheme.colors.iconDisabled
 
     val colors: ListItemColors
         @Composable get() = ListItemDefaults.colors(
             headlineColor = headline,
             supportingColor = supportingText,
-            leadingIconColor = icon,
-            trailingIconColor = icon,
+            leadingIconColor = leadingIcon,
+            trailingIconColor = trailingIcon,
             disabledHeadlineColor = headlineDisabled,
             disabledLeadingIconColor = iconDisabled,
             disabledTrailingIconColor = iconDisabled,