From 562d135ceb673d40dc1aa4404d5a5c1257e7b6e4 Mon Sep 17 00:00:00 2001 From: Antoine Robiez Date: Tue, 16 Apr 2024 11:30:12 +0200 Subject: [PATCH] Fix the weird ripple on Agenda --- .../androidmakers/ui/agenda/AgendaColumn.kt | 21 ++++-- .../com/androidmakers/ui/agenda/AgendaRow.kt | 64 ++++++++++++++----- 2 files changed, 63 insertions(+), 22 deletions(-) diff --git a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/agenda/AgendaColumn.kt b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/agenda/AgendaColumn.kt index 5ceda81f..55ec3307 100644 --- a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/agenda/AgendaColumn.kt +++ b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/agenda/AgendaColumn.kt @@ -62,13 +62,20 @@ fun AgendaColumn( shape = RoundedCornerShape(16.dp), ) { sessions.forEach { uiSession -> - AgendaRow( - modifier = Modifier.animateItemPlacement(), - uiSession = uiSession, - onSessionClicked = onSessionClicked, - onSessionBookmarked = onSessionBookmarked, - onApplyForAppClinic = onApplyForAppClinicClicked - ) + if (uiSession.isServiceSession) { + ServiceSessionRow( + uiSession, + modifier = Modifier.animateItemPlacement() + ) + } else { + SessionRow( + modifier = Modifier.animateItemPlacement(), + uiSession = uiSession, + onSessionClicked = onSessionClicked, + onSessionBookmarked = onSessionBookmarked, + onApplyForAppClinic = onApplyForAppClinicClicked + ) + } } } } diff --git a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/agenda/AgendaRow.kt b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/agenda/AgendaRow.kt index 2dc162d9..dcc1c54d 100644 --- a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/agenda/AgendaRow.kt +++ b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/agenda/AgendaRow.kt @@ -6,6 +6,7 @@ import androidx.compose.foundation.interaction.MutableInteractionSource import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size import androidx.compose.material.icons.Icons import androidx.compose.material.icons.rounded.BookmarkAdd import androidx.compose.material.icons.rounded.BookmarkRemove @@ -23,18 +24,14 @@ import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color -import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp import com.androidmakers.ui.common.EmojiUtils import com.androidmakers.ui.model.UISession import com.androidmakers.ui.theme.AMColor import dev.icerock.moko.resources.compose.stringResource -import fr.androidmakers.domain.model.Session import fr.paug.androidmakers.ui.MR import kotlinx.datetime.Instant -import kotlinx.datetime.toInstant import org.jetbrains.compose.ui.tooling.preview.Preview -import kotlin.time.Duration import kotlin.time.Duration.Companion.hours @Composable @@ -62,15 +59,52 @@ fun backgroundColor(uiSession: UISession): Color { } @Composable -fun AgendaRow( - uiSession: UISession, - modifier: Modifier = Modifier, - onSessionClicked: (UISession) -> Unit, - onSessionBookmarked: (UISession, Boolean) -> Unit, - onApplyForAppClinic: () -> Unit, +internal fun ServiceSessionRow( + session: UISession, + modifier: Modifier = Modifier, ) { ListItem( - modifier = modifier, + modifier = modifier, + colors = ListItemDefaults.colors( + containerColor = MaterialTheme.colorScheme.surface, + ), + headlineContent = { + Text( + text = session.title, + style = MaterialTheme.typography.titleMedium, + ) + }, + supportingContent = { + Column( + modifier = Modifier.padding(top = 12.dp), + horizontalAlignment = Alignment.Start, + ) { + Text( + text = session.subtitle(), + style = MaterialTheme.typography.bodyMedium, + modifier = Modifier.padding(top = 4.dp) + ) + } + }, + trailingContent = {}, + overlineContent = {}, + ) +} + +@Composable +internal fun SessionRow( + uiSession: UISession, + modifier: Modifier = Modifier, + onSessionClicked: (UISession) -> Unit, + onSessionBookmarked: (UISession, Boolean) -> Unit, + onApplyForAppClinic: () -> Unit, +) { + ListItem( + modifier = modifier.clickable( + onClick = { + onSessionClicked.invoke(uiSession) + } + ), colors = ListItemDefaults.colors( containerColor = backgroundColor(uiSession), ), @@ -78,16 +112,15 @@ fun AgendaRow( Text( text = uiSession.title, style = MaterialTheme.typography.titleMedium, - modifier = maybeClickable(uiSession, onSessionClicked) ) }, supportingContent = { Column( - modifier = maybeClickable(uiSession, onSessionClicked).padding(top = 12.dp), + modifier = Modifier.padding(top = 12.dp), horizontalAlignment = Alignment.Start, ) { - if(uiSession.isAppClinic) { + if (uiSession.isAppClinic) { Button( onClick = onApplyForAppClinic, modifier = Modifier.padding(bottom = 8.dp) @@ -127,6 +160,7 @@ fun AgendaRow( ) IconToggleButton( + modifier = Modifier.size(48.dp), checked = isBookmarked, onCheckedChange = { onSessionBookmarked(uiSession, it) @@ -173,7 +207,7 @@ fun UISession.formattedDuration(): String { @Preview @Composable private fun AgendaRowPreview() { - AgendaRow(fakeUiSession, onSessionClicked = {}, onSessionBookmarked = { _,_ -> }, onApplyForAppClinic = {}) + SessionRow(fakeUiSession, onSessionClicked = {}, onSessionBookmarked = { _,_ -> }, onApplyForAppClinic = {}) } private val fakeUiSession = UISession(