Compute avatar color of users and apply foreground color to the sender displayname.

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemEventRow.kt

@@ -75,6 +75,7 @@ import io.element.android.features.messages.impl.timeline.model.event.TimelineIt
 import io.element.android.features.messages.impl.timeline.model.event.aTimelineItemImageContent
 import io.element.android.features.messages.impl.timeline.model.event.aTimelineItemPollContent
 import io.element.android.features.messages.impl.timeline.model.event.aTimelineItemTextContent
+import io.element.android.libraries.designsystem.colors.AvatarColor
 import io.element.android.libraries.designsystem.components.EqualWidthColumn
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
@@ -327,6 +328,7 @@ private fun MessageSenderInformation(
 ) {
     val avatarStrokeColor = MaterialTheme.colorScheme.background
     val avatarSize = senderAvatar.size.dp
+    val avatarColor = AvatarColor(senderAvatar.id)
     Box(
         modifier = modifier
     ) {
@@ -350,7 +352,7 @@ private fun MessageSenderInformation(
                 text = sender,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
-                color = MaterialTheme.colorScheme.primary,
+                color = avatarColor.foreground,
                 style = ElementTheme.typography.fontBodyMdMedium,
             )
         }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/colors/AvatarColor.kt

@@ -0,0 +1,47 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.libraries.designsystem.colors
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.graphics.Color
+import io.element.android.libraries.theme.ElementTheme
+import io.element.android.libraries.theme.colors.avatarColorsDark
+import io.element.android.libraries.theme.colors.avatarColorsLight
+
+data class AvatarColor(
+    val background: Color,
+    val foreground: Color,
+)
+
+@Composable
+fun AvatarColor(userId: String): AvatarColor {
+    val hash = userId.toHash()
+    val colors = if (ElementTheme.isLightTheme) {
+        avatarColorsLight[hash % avatarColorsLight.size]
+    } else {
+        avatarColorsDark[hash % avatarColorsDark.size]
+    }
+    return AvatarColor(
+        background = colors.first,
+        foreground = colors.second,
+    )
+}
+
+private fun String.toHash(): Int {
+    return toList().sumOf { it.code } % 8 + 1
+}
+

libraries/theme/src/main/kotlin/io/element/android/libraries/theme/colors/AvatarColorsDark.kt

@@ -0,0 +1,35 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.libraries.theme.colors
+
+import io.element.android.libraries.theme.compound.generated.internal.DarkDesignTokens
+
+/**
+ * Avatar colors are not yet part of SemanticColors, so create list here.
+ * DarkDesignTokens is internal to the module.
+ */
+
+val avatarColorsDark = listOf(
+    DarkDesignTokens.colorBlue300 to DarkDesignTokens.colorBlue1200,
+    DarkDesignTokens.colorFuchsia300 to DarkDesignTokens.colorFuchsia1200,
+    DarkDesignTokens.colorGreen300 to DarkDesignTokens.colorGreen1200,
+    DarkDesignTokens.colorPink300 to DarkDesignTokens.colorPink1200,
+    DarkDesignTokens.colorOrange300 to DarkDesignTokens.colorOrange1200,
+    DarkDesignTokens.colorCyan300 to DarkDesignTokens.colorCyan1200,
+    DarkDesignTokens.colorPurple300 to DarkDesignTokens.colorPurple1200,
+    DarkDesignTokens.colorLime300 to DarkDesignTokens.colorLime1200,
+)

libraries/theme/src/main/kotlin/io/element/android/libraries/theme/colors/AvatarColorsLight.kt

@@ -0,0 +1,35 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.libraries.theme.colors
+
+import io.element.android.libraries.theme.compound.generated.internal.LightDesignTokens
+
+/**
+ * Avatar colors are not yet part of SemanticColors, so create list here.
+ * LightDesignTokens is internal to the module.
+ */
+
+val avatarColorsLight = listOf(
+    LightDesignTokens.colorBlue300 to LightDesignTokens.colorBlue1200,
+    LightDesignTokens.colorFuchsia300 to LightDesignTokens.colorFuchsia1200,
+    LightDesignTokens.colorGreen300 to LightDesignTokens.colorGreen1200,
+    LightDesignTokens.colorPink300 to LightDesignTokens.colorPink1200,
+    LightDesignTokens.colorOrange300 to LightDesignTokens.colorOrange1200,
+    LightDesignTokens.colorCyan300 to LightDesignTokens.colorCyan1200,
+    LightDesignTokens.colorPurple300 to LightDesignTokens.colorPurple1200,
+    LightDesignTokens.colorLime300 to LightDesignTokens.colorLime1200,
+)