Merge pull request #243 from DroidKaigi/yui/time_table_list_item

Apply strings of TimetableListItem design
DroidKaigi · Jul 15, 2023 · 7e9ad2a · 7e9ad2a
2 parents 9b1f3bd + 8e47e9b
commit 7e9ad2a
Show file tree

Hide file tree

Showing 2 changed files with 97 additions and 15 deletions.
diff --git a/core/model/src/commonMain/kotlin/io/github/droidkaigi/confsched2023/model/TimetableItem.kt b/core/model/src/commonMain/kotlin/io/github/droidkaigi/confsched2023/model/TimetableItem.kt
@@ -80,6 +80,10 @@ public sealed class TimetableItem {
             .toComponents { minutes, _, _ -> minutes }
         "${minutes}min"
     }
+
+    public val speakerString: String by lazy {
+        speakers.joinToString(", ") { it.name }
+    }
 }
 
 public fun Session.Companion.fake(): Session {

diff --git a/.../src/main/java/io/github/droidkaigi/confsched2023/sessions/component/TimetableListItem.kt b/.../src/main/java/io/github/droidkaigi/confsched2023/sessions/component/TimetableListItem.kt
@@ -1,12 +1,15 @@
 package io.github.droidkaigi.confsched2023.sessions.component
 
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
+import androidx.compose.material3.Divider
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.testTag
+import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import io.github.droidkaigi.confsched2023.designsystem.theme.KaigiTheme
 import io.github.droidkaigi.confsched2023.model.TimetableItem
@@ -23,29 +26,104 @@ fun TimetableListItem(
     onFavoriteClick: (Session) -> Unit,
     modifier: Modifier = Modifier,
 ) {
-    Row(
+    Column(
         modifier
             .testTag(TimetableListItemTestTag)
             .clickable { onTimetableItemClick(session) },
     ) {
+        Row {
+            SessionTime(
+                startAt = session.startsTimeString,
+                endAt = session.endsTimeString,
+            )
+            SessionDescription(session = session)
+            SessionBookmark(
+                session = session,
+                isBookmarked = isBookmarked,
+                onFavoriteClick = onFavoriteClick,
+            )
+        }
+
+        Divider()
+    }
+}
+
+@Composable
+fun SessionBookmark(
+    session: TimetableItem,
+    isBookmarked: Boolean,
+    modifier: Modifier = Modifier,
+    onFavoriteClick: (Session) -> Unit,
+) {
+    if (session is Session) {
+        if (isBookmarked) {
+            Text(
+                text = "★",
+                modifier = modifier.clickable {
+                    onFavoriteClick(session)
+                },
+            )
+        } else {
+            Text(
+                text = "☆",
+                modifier = modifier.clickable {
+                    onFavoriteClick(session)
+                },
+            )
+        }
+    }
+}
+
+@Composable
+fun SessionDescription(
+    session: TimetableItem,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        modifier,
+    ) {
+        // Chips
+        Row {
+            Text(session.room.name.currentLangTitle)
+            Text(session.language.langOfSpeaker)
+        }
+
+        // Title
         Text(session.title.currentLangTitle)
+
+        // Message
         if (session is Session) {
-            if (isBookmarked) {
-                Text(
-                    text = "★",
-                    modifier = Modifier.clickable {
-                        onFavoriteClick(session)
-                    },
-                )
-            } else {
-                Text(
-                    text = "☆",
-                    modifier = Modifier.clickable {
-                        onFavoriteClick(session)
-                    },
-                )
+            session.message?.let {
+                Text(it.currentLangTitle)
             }
         }
+
+        // Speaker
+        Row {
+            // TODO: Use Compose-image-loader to show image
+            // https://github.com/DroidKaigi/conference-app-2023/issues/239
+
+            Text(
+                text = session.speakerString,
+                overflow = TextOverflow.Ellipsis,
+                maxLines = 2,
+            )
+        }
+    }
+}
+
+@Composable
+fun SessionTime(
+    startAt: String,
+    endAt: String,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        modifier,
+    ) {
+        Text(startAt)
+        Text("    |")
+        Text(endAt)
     }
 }