Fixes the clickable regions to open additional relay info on the relay list dialog.

2025-09-22 11:13:20 +02:00 · 2024-08-09 13:44:44 -04:00
parent 7eaa553ebe
commit 27d2e2309a
6 changed files with 116 additions and 122 deletions
--- 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,
--- 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,
--- 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,
+                        )
                    }
                }

--- 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() ?: "")
                        }
                    }
                }
--- 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
--- 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()