fix(desktop): clip card ripples to card shape via Card(onClick = ...)

Material3 Card has a built-in onClick parameter that handles the
ripple with proper rounded-corner clipping. Using Modifier.clickable
on the Card's modifier bypasses that — the ripple renders as a
rectangle and gets awkwardly cut off at the card corners.

Converted to the onClick-parameter form on:
- LongFormCard (Reads)
- DraftCard (Drafts)
- RelayMetricCard (Relay Dashboard / Monitor tab)

NoteCard intentionally left unchanged: its inner clickable covers
only the header+text region (not the action-buttons row), so a
full-card onClick would conflict with the per-action handlers.

https://claude.ai/code/session_01NufduPfZvYQVYwLkbCjCUo
This commit is contained in:
Claude
2026-04-24 15:14:08 +00:00
parent d212b88103
commit cd4dd42bc4
3 changed files with 6 additions and 9 deletions
@@ -20,7 +20,6 @@
*/ */
package com.vitorpamplona.amethyst.desktop.ui package com.vitorpamplona.amethyst.desktop.ui
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.PaddingValues
@@ -152,7 +151,8 @@ private fun DraftCard(
onDelete: () -> Unit, onDelete: () -> Unit,
) { ) {
Card( Card(
modifier = Modifier.fillMaxWidth().clickable(onClick = onClick), onClick = onClick,
modifier = Modifier.fillMaxWidth(),
colors = colors =
CardDefaults.cardColors( CardDefaults.cardColors(
containerColor = MaterialTheme.colorScheme.surface, containerColor = MaterialTheme.colorScheme.surface,
@@ -98,10 +98,8 @@ fun LongFormCard(
val publishedAt = event.publishedAt() ?: event.createdAt val publishedAt = event.publishedAt() ?: event.createdAt
Card( Card(
modifier = onClick = onClick,
Modifier modifier = Modifier.fillMaxWidth(),
.fillMaxWidth()
.clickable(onClick = onClick),
colors = colors =
CardDefaults.cardColors( CardDefaults.cardColors(
containerColor = MaterialTheme.colorScheme.surface, containerColor = MaterialTheme.colorScheme.surface,
@@ -21,7 +21,6 @@
package com.vitorpamplona.amethyst.desktop.ui.relay package com.vitorpamplona.amethyst.desktop.ui.relay
import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
@@ -63,9 +62,9 @@ fun RelayMetricCard(
value = nip11Fetcher.fetch(status.url) value = nip11Fetcher.fetch(status.url)
} }
Card(modifier = modifier.fillMaxWidth()) { Card(onClick = onToggleExpand, modifier = modifier.fillMaxWidth()) {
Column( Column(
modifier = Modifier.clickable { onToggleExpand() }.padding(12.dp), modifier = Modifier.padding(12.dp),
) { ) {
Row( Row(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),