From 27d2e2309a1dbcb657e69c29d8ccc58666d42f40 Mon Sep 17 00:00:00 2001 From: Vitor Pamplona Date: Fri, 9 Aug 2024 13:44:44 -0400 Subject: [PATCH] Fixes the clickable regions to open additional relay info on the relay list dialog. --- .../relays/BasicRelaySetupInfoClickableRow.kt | 37 ++++--- .../ui/actions/relays/Kind3RelayListView.kt | 34 +++---- .../relays/Kind3RelaySetupInfoProposalRow.kt | 63 ++++++------ .../actions/relays/RelayInformationDialog.kt | 6 +- .../ui/actions/relays/RelayStatusRow.kt | 97 ++++++++++--------- .../vitorpamplona/amethyst/ui/theme/Shape.kt | 1 + 6 files changed, 116 insertions(+), 122 deletions(-) diff --git a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/BasicRelaySetupInfoClickableRow.kt b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/BasicRelaySetupInfoClickableRow.kt index 89f40a14c..eed6048c6 100644 --- a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/BasicRelaySetupInfoClickableRow.kt +++ b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/BasicRelaySetupInfoClickableRow.kt @@ -25,21 +25,20 @@ import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.padding import androidx.compose.material3.HorizontalDivider import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier -import androidx.compose.ui.unit.dp import com.vitorpamplona.amethyst.service.Nip11CachedRetriever import com.vitorpamplona.amethyst.ui.note.RenderRelayIcon import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel import com.vitorpamplona.amethyst.ui.theme.DividerThickness import com.vitorpamplona.amethyst.ui.theme.HalfHorzPadding import com.vitorpamplona.amethyst.ui.theme.HalfStartPadding -import com.vitorpamplona.amethyst.ui.theme.ReactionRowHeightChat +import com.vitorpamplona.amethyst.ui.theme.HalfVertPadding +import com.vitorpamplona.amethyst.ui.theme.ReactionRowHeightChatMaxWidth import com.vitorpamplona.amethyst.ui.theme.largeRelayIconModifier @Composable @@ -51,25 +50,23 @@ fun BasicRelaySetupInfoClickableRow( onClick: () -> Unit, accountViewModel: AccountViewModel, ) { - Column(Modifier.fillMaxWidth()) { + Column(Modifier.fillMaxWidth().clickable(onClick = onClick)) { Row( verticalAlignment = Alignment.CenterVertically, - modifier = Modifier.padding(vertical = 5.dp), + modifier = HalfVertPadding, ) { - Column(Modifier.clickable(onClick = onClick)) { - val iconUrlFromRelayInfoDoc = - remember(item) { - Nip11CachedRetriever.getFromCache(item.url)?.icon - } + val iconUrlFromRelayInfoDoc = + remember(item) { + Nip11CachedRetriever.getFromCache(item.url)?.icon + } - RenderRelayIcon( - item.briefInfo.displayUrl, - iconUrlFromRelayInfoDoc ?: item.briefInfo.favIcon, - loadProfilePicture, - loadRobohash, - MaterialTheme.colorScheme.largeRelayIconModifier, - ) - } + RenderRelayIcon( + item.briefInfo.displayUrl, + iconUrlFromRelayInfoDoc ?: item.briefInfo.favIcon, + loadProfilePicture, + loadRobohash, + MaterialTheme.colorScheme.largeRelayIconModifier, + ) Spacer(modifier = HalfHorzPadding) @@ -78,12 +75,12 @@ fun BasicRelaySetupInfoClickableRow( item, onClick, onDelete, - ReactionRowHeightChat.fillMaxWidth(), + ReactionRowHeightChatMaxWidth, ) Row( verticalAlignment = Alignment.CenterVertically, - modifier = ReactionRowHeightChat.fillMaxWidth(), + modifier = ReactionRowHeightChatMaxWidth, ) { RelayStatusRow( item = item, diff --git a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/Kind3RelayListView.kt b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/Kind3RelayListView.kt index e2831107a..60b3f6ae5 100644 --- a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/Kind3RelayListView.kt +++ b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/Kind3RelayListView.kt @@ -78,7 +78,7 @@ import com.vitorpamplona.amethyst.ui.theme.DividerThickness import com.vitorpamplona.amethyst.ui.theme.FeedPadding import com.vitorpamplona.amethyst.ui.theme.HalfHorzPadding import com.vitorpamplona.amethyst.ui.theme.HalfStartPadding -import com.vitorpamplona.amethyst.ui.theme.ReactionRowHeightChat +import com.vitorpamplona.amethyst.ui.theme.ReactionRowHeightChatMaxWidth import com.vitorpamplona.amethyst.ui.theme.Size30Modifier import com.vitorpamplona.amethyst.ui.theme.Size35dp import com.vitorpamplona.amethyst.ui.theme.StdVertSpacer @@ -307,34 +307,32 @@ fun ClickableRelayItem( onDelete: (Kind3BasicRelaySetupInfo) -> Unit, onClick: () -> Unit, ) { - Column(Modifier.fillMaxWidth()) { + Column(Modifier.fillMaxWidth().clickable(onClick = onClick)) { Row( verticalAlignment = Alignment.CenterVertically, modifier = Modifier.padding(vertical = 5.dp), ) { - Column(Modifier.clickable(onClick = onClick)) { - val iconUrlFromRelayInfoDoc = - remember(item) { - Nip11CachedRetriever.getFromCache(item.url)?.icon - } + val iconUrlFromRelayInfoDoc = + remember(item) { + Nip11CachedRetriever.getFromCache(item.url)?.icon + } - RenderRelayIcon( - item.briefInfo.displayUrl, - iconUrlFromRelayInfoDoc ?: item.briefInfo.favIcon, - loadProfilePicture, - loadRobohash, - MaterialTheme.colorScheme.largeRelayIconModifier, - ) - } + RenderRelayIcon( + item.briefInfo.displayUrl, + iconUrlFromRelayInfoDoc ?: item.briefInfo.favIcon, + loadProfilePicture, + loadRobohash, + MaterialTheme.colorScheme.largeRelayIconModifier, + ) Spacer(modifier = HalfHorzPadding) Column(Modifier.weight(1f)) { - FirstLine(item, onClick, onDelete, ReactionRowHeightChat.fillMaxWidth()) + FirstLine(item, onClick, onDelete, ReactionRowHeightChatMaxWidth) Row( verticalAlignment = Alignment.CenterVertically, - modifier = ReactionRowHeightChat.fillMaxWidth(), + modifier = ReactionRowHeightChatMaxWidth, ) { ActiveToggles( item = item, @@ -347,7 +345,7 @@ fun ClickableRelayItem( Row( verticalAlignment = Alignment.CenterVertically, - modifier = ReactionRowHeightChat.fillMaxWidth(), + modifier = ReactionRowHeightChatMaxWidth, ) { StatusRow( item = item, diff --git a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/Kind3RelaySetupInfoProposalRow.kt b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/Kind3RelaySetupInfoProposalRow.kt index 048a82c52..a37c9f23d 100644 --- a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/Kind3RelaySetupInfoProposalRow.kt +++ b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/Kind3RelaySetupInfoProposalRow.kt @@ -49,7 +49,7 @@ import com.vitorpamplona.amethyst.ui.note.UserPicture import com.vitorpamplona.amethyst.ui.screen.loggedIn.AccountViewModel import com.vitorpamplona.amethyst.ui.theme.DividerThickness import com.vitorpamplona.amethyst.ui.theme.HalfHorzPadding -import com.vitorpamplona.amethyst.ui.theme.ReactionRowHeightChat +import com.vitorpamplona.amethyst.ui.theme.ReactionRowHeightChatMaxWidth import com.vitorpamplona.amethyst.ui.theme.Size25dp import com.vitorpamplona.amethyst.ui.theme.allGoodColor import com.vitorpamplona.amethyst.ui.theme.largeRelayIconModifier @@ -65,49 +65,44 @@ fun Kind3RelaySetupInfoProposalRow( accountViewModel: AccountViewModel, nav: (String) -> Unit, ) { - Column(Modifier.fillMaxWidth()) { + Column(Modifier.fillMaxWidth().clickable(onClick = onClick)) { Row( verticalAlignment = Alignment.CenterVertically, modifier = Modifier.padding(vertical = 5.dp), ) { - Column(Modifier.clickable(onClick = onClick)) { - val iconUrlFromRelayInfoDoc = - remember(item) { - Nip11CachedRetriever.getFromCache(item.url)?.icon - } + val iconUrlFromRelayInfoDoc = + remember(item) { + Nip11CachedRetriever.getFromCache(item.url)?.icon + } - RenderRelayIcon( - item.briefInfo.displayUrl, - iconUrlFromRelayInfoDoc ?: item.briefInfo.favIcon, - loadProfilePicture, - loadRobohash, - MaterialTheme.colorScheme.largeRelayIconModifier, - ) - } + RenderRelayIcon( + item.briefInfo.displayUrl, + iconUrlFromRelayInfoDoc ?: item.briefInfo.favIcon, + loadProfilePicture, + loadRobohash, + MaterialTheme.colorScheme.largeRelayIconModifier, + ) Spacer(modifier = HalfHorzPadding) Column(Modifier.weight(1f)) { - Row(verticalAlignment = Alignment.CenterVertically, modifier = ReactionRowHeightChat.fillMaxWidth()) { - Row(Modifier.weight(1f), verticalAlignment = Alignment.CenterVertically) { - Text( - text = item.briefInfo.displayUrl, - modifier = Modifier.clickable(onClick = onClick), - maxLines = 1, - overflow = TextOverflow.Ellipsis, - ) + Row(ReactionRowHeightChatMaxWidth, verticalAlignment = Alignment.CenterVertically) { + Text( + text = item.briefInfo.displayUrl, + maxLines = 1, + overflow = TextOverflow.Ellipsis, + ) - if (item.paidRelay) { - Icon( - imageVector = Icons.Default.Paid, - null, - modifier = - Modifier - .padding(start = 5.dp, top = 1.dp) - .size(14.dp), - tint = MaterialTheme.colorScheme.allGoodColor, - ) - } + if (item.paidRelay) { + Icon( + imageVector = Icons.Default.Paid, + null, + modifier = + Modifier + .padding(start = 5.dp, top = 1.dp) + .size(14.dp), + tint = MaterialTheme.colorScheme.allGoodColor, + ) } } diff --git a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/RelayInformationDialog.kt b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/RelayInformationDialog.kt index efbbe4c8c..5085d6d5c 100644 --- a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/RelayInformationDialog.kt +++ b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/RelayInformationDialog.kt @@ -32,6 +32,7 @@ import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.items +import androidx.compose.foundation.text.selection.SelectionContainer import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.material3.Text @@ -141,9 +142,8 @@ fun RelayInformationDialog( Spacer(modifier = DoubleHorzSpacer) Column(horizontalAlignment = Alignment.CenterHorizontally) { - Row { Title(relayInfo.name?.trim() ?: "") } - - Row { SubtitleContent(relayInfo.description?.trim() ?: "") } + Title(relayInfo.name?.trim() ?: "") + SubtitleContent(relayInfo.description?.trim() ?: "") } } } diff --git a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/RelayStatusRow.kt b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/RelayStatusRow.kt index 8ebf04afa..cc962f34e 100644 --- a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/RelayStatusRow.kt +++ b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/actions/relays/RelayStatusRow.kt @@ -21,8 +21,7 @@ package com.vitorpamplona.amethyst.ui.actions.relays import android.widget.Toast -import androidx.compose.foundation.ExperimentalFoundationApi -import androidx.compose.foundation.combinedClickable +import androidx.compose.foundation.gestures.detectTapGestures import androidx.compose.foundation.layout.size import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.DeleteSweep @@ -35,6 +34,7 @@ import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.rememberCoroutineScope import androidx.compose.ui.Modifier +import androidx.compose.ui.input.pointer.pointerInput import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp @@ -47,7 +47,6 @@ import com.vitorpamplona.amethyst.ui.theme.warningColor import kotlinx.coroutines.launch @Composable -@OptIn(ExperimentalFoundationApi::class) fun RelayStatusRow( item: BasicRelaySetupInfo, modifier: Modifier, @@ -62,15 +61,16 @@ fun RelayStatusRow( modifier = Modifier .size(15.dp) - .combinedClickable( - onClick = {}, - onLongClick = { - accountViewModel.toast( - R.string.read_from_relay, - R.string.read_from_relay_description, - ) - }, - ), + .pointerInput(Unit) { + detectTapGestures( + onLongPress = { + accountViewModel.toast( + R.string.read_from_relay, + R.string.read_from_relay_description, + ) + }, + ) + }, tint = MaterialTheme.colorScheme.allGoodColor, ) @@ -88,15 +88,16 @@ fun RelayStatusRow( modifier = Modifier .size(15.dp) - .combinedClickable( - onClick = { }, - onLongClick = { - accountViewModel.toast( - R.string.write_to_relay, - R.string.write_to_relay_description, - ) - }, - ), + .pointerInput(Unit) { + detectTapGestures( + onLongPress = { + accountViewModel.toast( + R.string.write_to_relay, + R.string.write_to_relay_description, + ) + }, + ) + }, tint = MaterialTheme.colorScheme.allGoodColor, ) @@ -114,15 +115,16 @@ fun RelayStatusRow( modifier = Modifier .size(15.dp) - .combinedClickable( - onClick = {}, - onLongClick = { - accountViewModel.toast( - R.string.errors, - R.string.errors_description, - ) - }, - ), + .pointerInput(Unit) { + detectTapGestures( + onLongPress = { + accountViewModel.toast( + R.string.errors, + R.string.errors_description, + ) + }, + ) + }, tint = if (item.relayStat.errorCounter > 0) { MaterialTheme.colorScheme.warningColor @@ -145,23 +147,24 @@ fun RelayStatusRow( modifier = Modifier .size(15.dp) - .combinedClickable( - onClick = {}, - onLongClick = { - accountViewModel.toast( - R.string.spam, - R.string.spam_description, - ) - scope.launch { - Toast - .makeText( - context, - stringRes(context, R.string.spam), - Toast.LENGTH_SHORT, - ).show() - } - }, - ), + .pointerInput(Unit) { + detectTapGestures( + onLongPress = { + accountViewModel.toast( + R.string.spam, + R.string.spam_description, + ) + scope.launch { + Toast + .makeText( + context, + stringRes(context, R.string.spam), + Toast.LENGTH_SHORT, + ).show() + } + }, + ) + }, tint = if (item.relayStat.spamCounter > 0) { MaterialTheme.colorScheme.warningColor diff --git a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/theme/Shape.kt b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/theme/Shape.kt index 5be0b6d44..8866d48d0 100644 --- a/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/theme/Shape.kt +++ b/amethyst/src/main/java/com/vitorpamplona/amethyst/ui/theme/Shape.kt @@ -164,6 +164,7 @@ val DividerThickness = 0.25.dp val ReactionRowHeight = Modifier.padding(vertical = 7.dp).height(24.dp) val ReactionRowHeightWithPadding = Modifier.padding(vertical = 7.dp).height(24.dp).padding(horizontal = 10.dp) val ReactionRowHeightChat = Modifier.height(25.dp) +val ReactionRowHeightChatMaxWidth = Modifier.height(25.dp).fillMaxWidth() val UserNameRowHeight = Modifier.fillMaxWidth() val UserNameMaxRowHeight = Modifier.fillMaxWidth()