Merge pull request #979 from mannodermaus/fix/tag-outline-colors

Refactor TimetableItemTag API to use consistent colors
DroidKaigi · Sep 8, 2024 · 39f9d6d · 39f9d6d
2 parents 86e8139 + cdecf9b
commit 39f9d6d
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 27 deletions.
diff --git a/...mmonMain/kotlin/io/github/droidkaigi/confsched/droidkaigiui/component/TimetableItemTag.kt b/...mmonMain/kotlin/io/github/droidkaigi/confsched/droidkaigiui/component/TimetableItemTag.kt
@@ -19,17 +19,48 @@ import androidx.compose.ui.unit.dp
 import org.jetbrains.compose.resources.DrawableResource
 import org.jetbrains.compose.resources.vectorResource
 
+@Composable
+fun TimetableItemTag(
+    tagText: String,
+    modifier: Modifier = Modifier,
+) {
+    TimetableItemTag(
+        tagText = tagText,
+        contentColor = MaterialTheme.colorScheme.onSurfaceVariant,
+        borderColor = MaterialTheme.colorScheme.outline,
+        icon = null,
+        modifier = modifier,
+    )
+}
+
 @Composable
 fun TimetableItemTag(
     tagText: String,
     tagColor: Color,
+    icon: DrawableResource?,
+    modifier: Modifier = Modifier,
+) {
+    TimetableItemTag(
+        tagText = tagText,
+        contentColor = tagColor,
+        borderColor = tagColor,
+        icon = icon,
+        modifier = modifier,
+    )
+}
+
+@Composable
+private fun TimetableItemTag(
+    tagText: String,
+    contentColor: Color,
+    borderColor: Color,
+    icon: DrawableResource?,
     modifier: Modifier = Modifier,
-    icon: DrawableResource? = null,
 ) {
     Row(
         modifier = modifier
             .border(
-                border = BorderStroke(width = 1.dp, color = tagColor),
+                border = BorderStroke(width = 1.dp, color = borderColor),
                 shape = RoundedCornerShape(2.dp),
             )
             .padding(
@@ -44,11 +75,11 @@ fun TimetableItemTag(
                 modifier = Modifier.size(12.dp),
                 imageVector = vectorResource(ico),
                 contentDescription = "",
-                tint = tagColor,
+                tint = contentColor,
             )
         }
         Text(
-            color = tagColor,
+            color = contentColor,
             text = tagText,
             style = MaterialTheme.typography.labelMedium,
             maxLines = 1,

diff --git a/...es/src/commonMain/kotlin/io/github/droidkaigi/confsched/favorites/section/FavoriteList.kt b/...es/src/commonMain/kotlin/io/github/droidkaigi/confsched/favorites/section/FavoriteList.kt
@@ -17,7 +17,6 @@ import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.foundation.lazy.rememberLazyListState
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
 import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
@@ -131,16 +130,10 @@ fun FavoriteList(
                                             modifier = Modifier.background(LocalRoomTheme.current.containerColor),
                                         )
                                         timetableItem.language.labels.forEach { label ->
-                                            TimetableItemTag(
-                                                tagText = label,
-                                                tagColor = MaterialTheme.colorScheme.outline,
-                                            )
+                                            TimetableItemTag(tagText = label)
                                         }
                                         timetableItem.day?.let {
-                                            TimetableItemTag(
-                                                tagText = "9/${it.dayOfMonth}",
-                                                tagColor = MaterialTheme.colorScheme.outline,
-                                            )
+                                            TimetableItemTag(tagText = "9/${it.dayOfMonth}")
                                         }
                                     },
                                     timetableItem = timetableItem,

diff --git a/...n/kotlin/io/github/droidkaigi/confsched/sessions/component/TimetableItemDetailHeadline.kt b/...n/kotlin/io/github/droidkaigi/confsched/sessions/component/TimetableItemDetailHeadline.kt
@@ -47,6 +47,7 @@ import conference_app_2024.feature.sessions.generated.resources.select_language
 import io.github.droidkaigi.confsched.designsystem.theme.KaigiTheme
 import io.github.droidkaigi.confsched.designsystem.theme.LocalRoomTheme
 import io.github.droidkaigi.confsched.droidkaigiui.component.TimetableItemTag
+import io.github.droidkaigi.confsched.droidkaigiui.icon
 import io.github.droidkaigi.confsched.droidkaigiui.rememberAsyncImagePainter
 import io.github.droidkaigi.confsched.model.Lang
 import io.github.droidkaigi.confsched.model.TimetableItem
@@ -66,26 +67,27 @@ fun TimetableItemDetailHeadline(
     onLanguageSelect: (Lang) -> Unit,
     modifier: Modifier = Modifier,
 ) {
+    val roomTheme = LocalRoomTheme.current
     val currentLang = currentLang ?: timetableItem.language.toLang()
+
     Column(
         modifier = modifier
-            // FIXME: Implement and use a theme color instead of fixed colors like RoomColors.primary and RoomColors.primaryDim
-            .background(LocalRoomTheme.current.dimColor)
+            .background(roomTheme.dimColor)
             .padding(horizontal = 8.dp)
             .fillMaxWidth(),
     ) {
         FlowRow {
             TimetableItemTag(
                 modifier = Modifier.align(Alignment.CenterVertically),
                 tagText = timetableItem.room.name.currentLangTitle,
-                tagColor = LocalRoomTheme.current.primaryColor,
+                tagColor = roomTheme.primaryColor,
+                icon = timetableItem.room.icon,
             )
             timetableItem.language.labels.forEach { label ->
                 Spacer(modifier = Modifier.padding(4.dp))
                 TimetableItemTag(
                     modifier = Modifier.align(Alignment.CenterVertically),
                     tagText = label,
-                    tagColor = MaterialTheme.colorScheme.onSurfaceVariant,
                 )
             }
             Spacer(modifier = Modifier.weight(1f))

diff --git a/...sions/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/section/SearchList.kt b/...sions/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/section/SearchList.kt
@@ -2,7 +2,6 @@ package io.github.droidkaigi.confsched.sessions.section
 
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.lazy.rememberLazyListState
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import io.github.droidkaigi.confsched.droidkaigiui.component.TimetableItemTag
@@ -27,10 +26,7 @@ fun SearchList(
         modifier = modifier,
         timetableItemTagsContent = { timetableItem ->
             timetableItem.day?.monthAndDay()?.let { monthAndDay ->
-                TimetableItemTag(
-                    tagText = monthAndDay,
-                    tagColor = MaterialTheme.colorScheme.onSurfaceVariant,
-                )
+                TimetableItemTag(tagText = monthAndDay)
             }
         },
     )

diff --git a/...s/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/section/TimetableSheet.kt b/...s/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/section/TimetableSheet.kt
@@ -11,7 +11,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -112,10 +111,7 @@ fun Timetable(
                         ),
                         timetableItemTagsContent = { timetableItem ->
                             timetableItem.language.labels.forEach { label ->
-                                TimetableItemTag(
-                                    tagText = label,
-                                    tagColor = MaterialTheme.colorScheme.onSurfaceVariant,
-                                )
+                                TimetableItemTag(tagText = label)
                             }
                         },
                     )