♻️ Add a translate button to the session details screen.

app-ios/Modules/Sources/Session/SessionView.swift

@@ -65,12 +65,12 @@ public struct SessionView: View {
 
                 if let session = viewModel.timetableItem as? TimetableItem.Session {
                     VStack(alignment: .leading, spacing: 16) {
-                        Text(session.description_)
+                        Text(session.description_.currentLangTitle)
                             .textSelection(.enabled)
                             .lineLimit(isDescriptionExpanded ? nil : 5)
                             .background {
                                 ViewThatFits(in: .vertical) {
-                                    Text(session.description_)
+                                    Text(session.description_.currentLangTitle)
                                         .hidden()
                                     // Just for receiving onAppear event if the description exceeds its line limit
                                     Color.clear

core/data/src/commonMain/kotlin/io/github/droidkaigi/confsched2023/data/sessions/DefaultSessionsApiClient.kt

@@ -107,7 +107,17 @@ fun SessionsAllResponse.toTimetable(): Timetable {
                             isInterpretationTarget = apiSession.interpretationTarget,
                         ),
                         asset = apiSession.asset.toTimetableAsset(),
-                        description = apiSession.description ?: "",
+                        description = if (
+                            apiSession.i18nDesc?.ja == null &&
+                            apiSession.i18nDesc?.en == null
+                        ) {
+                            MultiLangText(
+                                jaTitle = apiSession.description ?: "",
+                                enTitle = apiSession.description ?: "",
+                            )
+                        } else {
+                            apiSession.i18nDesc.toMultiLangText()
+                        },
                         speakers = apiSession.speakers
                             .map { speakerIdToSpeaker[it]!! }
                             .toPersistentList(),
@@ -145,10 +155,12 @@ fun SessionsAllResponse.toTimetable(): Timetable {
     )
 }
 
-private fun LocaledResponse.toMultiLangText() = MultiLangText(jaTitle = ja, enTitle = en)
+private fun LocaledResponse.toMultiLangText() =
+    MultiLangText(jaTitle = ja ?: "", enTitle = en ?: "")
+
 private fun SessionMessageResponse.toMultiLangText() = MultiLangText(jaTitle = ja, enTitle = en)
 private fun SessionAssetResponse.toTimetableAsset() = TimetableAsset(videoUrl, slideUrl)
-private fun LocaledResponse.toRoomType() = when (en.lowercase()) {
+private fun LocaledResponse.toRoomType() = when (en?.lowercase()) {
     "arctic fox" -> RoomA
     "bumblebee" -> RoomB
     "chipmunk" -> RoomC

core/data/src/commonMain/kotlin/io/github/droidkaigi/confsched2023/data/sessions/FakeSessionsApiClient.kt

@@ -119,6 +119,12 @@ fun SessionsAllResponse.Companion.fake(): SessionsAllResponse {
                     speakers = listOf("1", "2"),
                     description = "これはディスクリプションです。\nこれはディスクリプションです。\nこれはディスクリプションです。\n" +
                         "これはディスクリプションです。\nこれはディスクリプションです。\nこれはディスクリプションです。\n",
+                    i18nDesc = LocaledResponse(
+                        ja = "これはディスクリプションです。\nこれはディスクリプションです。\nこれはディスクリプションです。\n" +
+                            "これはディスクリプションです。\nこれはディスクリプションです。\nこれはディスクリプションです。\n",
+                        en = "This is a description\nThis is a description\nThis is a description\n" +
+                            "This is a description\nThis is a description\nThis is a description\n",
+                    ),
                     startsAt = start.toString(),
                     endsAt = end.toString(),
                     language = "JAPANESE",

core/data/src/commonMain/kotlin/io/github/droidkaigi/confsched2023/data/sessions/response/LocaledResponse.kt

@@ -4,6 +4,6 @@ import kotlinx.serialization.Serializable
 
 @Serializable
 data class LocaledResponse(
-    val ja: String,
-    val en: String,
+    val ja: String?,
+    val en: String?,
 )

core/data/src/commonMain/kotlin/io/github/droidkaigi/confsched2023/data/sessions/response/SessionResponse.kt

@@ -8,7 +8,8 @@ data class SessionResponse(
     val isServiceSession: Boolean,
     val title: LocaledResponse,
     val speakers: List<String>,
-    val description: String?,
+    val description: String? = null,
+    val i18nDesc: LocaledResponse? = null,
     val startsAt: String,
     val endsAt: String,
     val language: String,

core/model/src/commonMain/kotlin/io/github/droidkaigi/confsched2023/model/TimetableItem.kt

@@ -41,7 +41,7 @@ public sealed class TimetableItem {
         override val asset: TimetableAsset,
         override val levels: PersistentList<String>,
         override val speakers: PersistentList<TimetableSpeaker>,
-        val description: String,
+        val description: MultiLangText,
         val message: MultiLangText?,
     ) : TimetableItem() {
         public companion object
@@ -154,7 +154,10 @@ public fun Session.Companion.fake(): Session {
                 tagLine = "iOS Engineer",
             ),
         ).toPersistentList(),
-        description = "これはディスクリプションです。\nこれはディスクリプションです。\nhttps://github.com/DroidKaigi/conference-app-2023 これはURLです。\nこれはディスクリプションです。",
+        description = MultiLangText(
+            jaTitle = "これはディスクリプションです。\nこれはディスクリプションです。\nhttps://github.com/DroidKaigi/conference-app-2023 これはURLです。\nこれはディスクリプションです。",
+            enTitle = "This is a description.\nThis is a description.\nhttps://github.com/DroidKaigi/conference-app-2023 This is a URL.\nThis is a description.",
+        ),
         message = MultiLangText(
             jaTitle = "このセッションは事情により中止となりました",
             enTitle = "This session has been cancelled due to circumstances.",

feature/sessions/src/main/java/io/github/droidkaigi/confsched2023/sessions/TimetableItemDetailScreen.kt

@@ -28,6 +28,7 @@ import io.github.droidkaigi.confsched2023.designsystem.component.LoadingText
 import io.github.droidkaigi.confsched2023.designsystem.preview.MultiLanguagePreviews
 import io.github.droidkaigi.confsched2023.designsystem.preview.MultiThemePreviews
 import io.github.droidkaigi.confsched2023.designsystem.theme.KaigiTheme
+import io.github.droidkaigi.confsched2023.model.Lang
 import io.github.droidkaigi.confsched2023.model.TimetableItem
 import io.github.droidkaigi.confsched2023.model.TimetableItem.Session
 import io.github.droidkaigi.confsched2023.model.fake
@@ -106,6 +107,7 @@ fun TimetableItemDetailScreen(
         onBookmarkClick = viewModel::onBookmarkClick,
         onLinkClick = onLinkClick,
         onCalendarRegistrationClick = onCalendarRegistrationClick,
+        onSelectedLanguage = viewModel::onSelectDescriptionLanguage,
         snackbarHostState = snackbarHostState,
     )
 }
@@ -117,6 +119,7 @@ sealed class TimetableItemDetailScreenUiState {
         val timetableItemDetailSectionUiState: TimetableItemDetailSectionUiState,
         val isBookmarked: Boolean,
         val viewBookmarkListRequestState: ViewBookmarkListRequestState,
+        val currentLang: Lang?,
     ) : TimetableItemDetailScreenUiState()
 
     val shouldNavigateToBookmarkList: Boolean
@@ -136,6 +139,7 @@ private fun TimetableItemDetailScreen(
     onBookmarkClick: (TimetableItem) -> Unit,
     onLinkClick: (url: String) -> Unit,
     onCalendarRegistrationClick: (TimetableItem) -> Unit,
+    onSelectedLanguage: (Lang) -> Unit,
     snackbarHostState: SnackbarHostState,
 ) {
     val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior()
@@ -146,6 +150,7 @@ private fun TimetableItemDetailScreen(
                 TimetableItemDetailScreenTopAppBar(
                     title = uiState.timetableItem.title,
                     onNavigationIconClick = onNavigationIconClick,
+                    onSelectedLanguage = onSelectedLanguage,
                     scrollBehavior = scrollBehavior,
                 )
             }
@@ -179,6 +184,7 @@ private fun TimetableItemDetailScreen(
                     TimetableItemDetail(
                         modifier = Modifier.fillMaxSize(),
                         uiState = it.timetableItemDetailSectionUiState,
+                        selectedLanguage = it.currentLang,
                         onLinkClick = onLinkClick,
                         contentPadding = innerPadding,
                     )
@@ -203,13 +209,15 @@ fun TimetableItemDetailScreenPreview() {
                     timetableItemDetailSectionUiState = TimetableItemDetailSectionUiState(fakeSession),
                     isBookmarked = isBookMarked,
                     viewBookmarkListRequestState = ViewBookmarkListRequestState.NotRequested,
+                    currentLang = Lang.JAPANESE,
                 ),
                 onNavigationIconClick = {},
                 onBookmarkClick = {
                     isBookMarked = !isBookMarked
                 },
                 onLinkClick = {},
                 onCalendarRegistrationClick = {},
+                onSelectedLanguage = {},
                 snackbarHostState = SnackbarHostState(),
             )
         }

feature/sessions/src/main/java/io/github/droidkaigi/confsched2023/sessions/TimetableItemDetailViewModel.kt

@@ -6,6 +6,7 @@ import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewModelScope
 import dagger.hilt.android.lifecycle.HiltViewModel
 import io.github.droidkaigi.confsched2023.designsystem.strings.AppStrings
+import io.github.droidkaigi.confsched2023.model.Lang
 import io.github.droidkaigi.confsched2023.model.SessionsRepository
 import io.github.droidkaigi.confsched2023.model.TimetableItem
 import io.github.droidkaigi.confsched2023.model.TimetableItemId
@@ -52,18 +53,28 @@ class TimetableItemDetailViewModel @Inject constructor(
             )
     private val viewBookmarkListRequestStateFlow =
         MutableStateFlow<ViewBookmarkListRequestState>(ViewBookmarkListRequestState.NotRequested)
+    private val selectedDescriptionLanguageStateFlow: MutableStateFlow<Lang?> =
+        MutableStateFlow(null)
 
     val uiState: StateFlow<TimetableItemDetailScreenUiState> =
-        buildUiState(timetableItemStateFlow, viewBookmarkListRequestStateFlow) { timetableItemAndBookmark, viewBookmarkListRequestState ->
+        buildUiState(
+            timetableItemStateFlow,
+            viewBookmarkListRequestStateFlow,
+            selectedDescriptionLanguageStateFlow,
+        ) { timetableItemAndBookmark, viewBookmarkListRequestState, selectedLang ->
             if (timetableItemAndBookmark == null) {
                 return@buildUiState TimetableItemDetailScreenUiState.Loading
             }
+            if (selectedLang == null) {
+                onSelectDescriptionLanguage(Lang.valueOf(timetableItemAndBookmark.first.language.langOfSpeaker))
+            }
             val (timetableItem, bookmarked) = timetableItemAndBookmark
             TimetableItemDetailScreenUiState.Loaded(
                 timetableItem = timetableItem,
                 timetableItemDetailSectionUiState = TimetableItemDetailSectionUiState(timetableItem),
                 isBookmarked = bookmarked,
                 viewBookmarkListRequestState = viewBookmarkListRequestState,
+                currentLang = selectedLang,
             )
         }
 
@@ -89,4 +100,10 @@ class TimetableItemDetailViewModel @Inject constructor(
             viewBookmarkListRequestStateFlow.update { ViewBookmarkListRequestState.NotRequested }
         }
     }
+
+    fun onSelectDescriptionLanguage(
+        language: Lang,
+    ) {
+        selectedDescriptionLanguageStateFlow.value = language
+    }
 }

feature/sessions/src/main/java/io/github/droidkaigi/confsched2023/sessions/component/TimetableItemDetailContent.kt

@@ -46,6 +46,7 @@ import io.github.droidkaigi.confsched2023.designsystem.preview.MultiLanguagePrev
 import io.github.droidkaigi.confsched2023.designsystem.preview.MultiThemePreviews
 import io.github.droidkaigi.confsched2023.designsystem.theme.KaigiTheme
 import io.github.droidkaigi.confsched2023.designsystem.theme.md_theme_light_outline
+import io.github.droidkaigi.confsched2023.model.Lang
 import io.github.droidkaigi.confsched2023.model.TimetableItem
 import io.github.droidkaigi.confsched2023.model.TimetableItem.Session
 import io.github.droidkaigi.confsched2023.model.TimetableItem.Special
@@ -61,14 +62,22 @@ const val TimetableItemDetailReadMoreButtonTestTag = "TimetableItemDetailReadMor
 @Composable
 fun TimetableItemDetailContent(
     uiState: TimetableItem,
+    selectedLanguage: Lang?,
     modifier: Modifier = Modifier,
     onLinkClick: (url: String) -> Unit,
 ) {
     Column(modifier = modifier) {
         when (uiState) {
             is Session -> {
+                val description = when (selectedLanguage) {
+                    Lang.JAPANESE -> uiState.description.jaTitle
+                    Lang.ENGLISH -> uiState.description.enTitle
+                    Lang.MIXED,
+                    null,
+                    -> ""
+                }
                 DescriptionSection(
-                    description = uiState.description,
+                    description = description,
                     onLinkClick = onLinkClick,
                 )
                 TargetAudienceSection(targetAudienceString = uiState.targetAudience)
@@ -336,7 +345,7 @@ fun DescriptionSectionPreview() {
     KaigiTheme {
         Surface {
             DescriptionSection(
-                description = Session.fake().description,
+                description = Session.fake().description.currentLangTitle,
                 onLinkClick = {},
             )
         }
@@ -351,6 +360,7 @@ fun TimetableItemDetailContentPreview() {
         Surface {
             TimetableItemDetailContent(
                 uiState = Session.fake(),
+                selectedLanguage = Lang.JAPANESE,
                 onLinkClick = {},
             )
         }

feature/sessions/src/main/java/io/github/droidkaigi/confsched2023/sessions/component/TimetableItemDetailScreenTopAppBar.kt

@@ -4,6 +4,9 @@ import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ArrowBack
+import androidx.compose.material.icons.outlined.GTranslate
+import androidx.compose.material3.DropdownMenu
+import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
@@ -20,11 +23,14 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalLifecycleOwner
+import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import io.github.droidkaigi.confsched2023.designsystem.preview.MultiLanguagePreviews
 import io.github.droidkaigi.confsched2023.designsystem.preview.MultiThemePreviews
+import io.github.droidkaigi.confsched2023.model.Lang
+import io.github.droidkaigi.confsched2023.model.Lang.MIXED
 import io.github.droidkaigi.confsched2023.model.MultiLangText
 import io.github.droidkaigi.confsched2023.ui.handleOnClickIfNotNavigating
 import kotlinx.collections.immutable.ImmutableList
@@ -35,6 +41,7 @@ import kotlinx.collections.immutable.persistentListOf
 fun TimetableItemDetailScreenTopAppBar(
     title: MultiLangText,
     onNavigationIconClick: () -> Unit,
+    onSelectedLanguage: (Lang) -> Unit,
     scrollBehavior: TopAppBarScrollBehavior,
     modifier: Modifier = Modifier,
 ) {
@@ -78,6 +85,42 @@ fun TimetableItemDetailScreenTopAppBar(
                 )
             }
         },
+        actions = {
+            var expanded by remember { mutableStateOf(false) }
+
+            val expandMenu = { expanded = true }
+            val shrinkMenu = { expanded = false }
+
+            IconButton(onClick = expandMenu) {
+                Icon(
+                    imageVector = Icons.Outlined.GTranslate,
+                    contentDescription = null,
+                )
+            }
+            DropdownMenu(
+                expanded = expanded,
+                onDismissRequest = shrinkMenu,
+            ) {
+                Lang.entries.forEach { lang ->
+                    if (lang != MIXED) {
+                        DropdownMenuItem(
+                            text = {
+                                Text(
+                                    text = lang.tagName,
+                                    style = MaterialTheme.typography.bodyLarge,
+                                    color = MaterialTheme.colorScheme.onSurfaceVariant,
+                                )
+                            },
+                            onClick = {
+                                onSelectedLanguage(lang)
+                                shrinkMenu()
+                            },
+                            modifier = Modifier.testTag(DropdownFilterChipItemTestTag),
+                        )
+                    }
+                }
+            }
+        },
         colors = TopAppBarDefaults.topAppBarColors(
             containerColor = MaterialTheme.colorScheme.surfaceVariant,
         ),
@@ -124,6 +167,7 @@ fun TimetableItemDetailScreenTopAppBarPreview() {
     TimetableItemDetailScreenTopAppBar(
         title = MultiLangText(jaTitle = "タイトル", enTitle = "title"),
         onNavigationIconClick = {},
+        onSelectedLanguage = {},
         scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior(),
     )
 }

feature/sessions/src/main/java/io/github/droidkaigi/confsched2023/sessions/section/TimetableItemDetail.kt

@@ -6,6 +6,7 @@ import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
+import io.github.droidkaigi.confsched2023.model.Lang
 import io.github.droidkaigi.confsched2023.model.TimetableItem
 import io.github.droidkaigi.confsched2023.sessions.component.TimetableItemDetailContent
 import io.github.droidkaigi.confsched2023.sessions.component.TimetableItemDetailSummaryCard
@@ -18,6 +19,7 @@ data class TimetableItemDetailSectionUiState(
 internal fun TimetableItemDetail(
     uiState: TimetableItemDetailSectionUiState,
     contentPadding: PaddingValues,
+    selectedLanguage: Lang?,
     onLinkClick: (String) -> Unit,
     modifier: Modifier = Modifier,
 ) {
@@ -35,6 +37,7 @@ internal fun TimetableItemDetail(
         item {
             TimetableItemDetailContent(
                 uiState = uiState.timetableItem,
+                selectedLanguage = selectedLanguage,
                 onLinkClick = onLinkClick,
             )
         }