android: make clipboard values clickable and focusable (#483)

also, use Column isntead of LazyColumn since the Tailnet lock view is a short list and doesn't require lazy rendering

Fixes tailscale/corp#21737

Signed-off-by: kari-ts <kari@tailscale.com>
pull/486/head^2
kari-ts 1 year ago committed by GitHub
parent d94125e767
commit b4ca226eb7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -4,6 +4,7 @@
package com.tailscale.ipn.ui.util
import androidx.compose.foundation.clickable
import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
@ -20,16 +21,14 @@ import androidx.compose.ui.text.AnnotatedString
import androidx.compose.ui.unit.dp
import com.tailscale.ipn.R
import com.tailscale.ipn.ui.theme.titledListItem
import com.tailscale.ipn.ui.util.AndroidTVUtil.isAndroidTV
@Composable
fun ClipboardValueView(value: String, title: String? = null, subtitle: String? = null) {
val localClipboardManager = LocalClipboardManager.current
val modifier =
if (isAndroidTV()) {
Modifier
} else {
Modifier.clickable { localClipboardManager.setText(AnnotatedString(value)) }
Modifier.focusable()
.clickable {
localClipboardManager.setText(AnnotatedString(value))
}
ListItem(

@ -49,10 +49,16 @@ fun TailnetLockSetupView(
Scaffold(topBar = { Header(R.string.tailnet_lock, onBack = backToSettings) }) { innerPadding ->
LoadingIndicator.Wrap {
LazyColumn(modifier = Modifier.padding(innerPadding)) {
item(key = "header") { ExplainerView() }
Column(
modifier = Modifier
.padding(innerPadding)
.focusable()
.verticalScroll(rememberScrollState())
.fillMaxSize()
) {
ExplainerView()
items(items = statusItems, key = { "status_${it.title}" }) { statusItem ->
statusItems.forEach { statusItem ->
Lists.ItemDivider()
ListItem(
@ -60,28 +66,27 @@ fun TailnetLockSetupView(
Icon(
painter = painterResource(id = statusItem.icon),
contentDescription = null,
tint = MaterialTheme.colorScheme.onSurfaceVariant)
tint = MaterialTheme.colorScheme.onSurfaceVariant
)
},
headlineContent = { Text(stringResource(statusItem.title)) })
headlineContent = { Text(stringResource(statusItem.title)) }
)
}
item(key = "nodeKey") {
//Node key
Lists.SectionDivider()
ClipboardValueView(
value = nodeKey,
title = stringResource(R.string.node_key),
subtitle = stringResource(R.string.node_key_explainer))
}
subtitle = stringResource(R.string.node_key_explainer)
)
item(key = "tailnetLockKey") {
// Tailnet lock key
Lists.SectionDivider()
ClipboardValueView(
value = tailnetLockTlPubKey,
title = stringResource(R.string.tailnet_lock_key),
subtitle = stringResource(R.string.tailnet_lock_key_explainer))
}
subtitle = stringResource(R.string.tailnet_lock_key_explainer)
)
}
}
}
@ -95,7 +100,8 @@ private fun ExplainerView() {
ClickableText(
explainerText(),
onClick = { handler.openUri(Links.TAILNET_LOCK_KB_URL) },
style = MaterialTheme.typography.bodyMedium)
style = MaterialTheme.typography.bodyMedium
)
}
}
@ -109,10 +115,11 @@ fun explainerText(): AnnotatedString {
pushStringAnnotation(tag = "tailnetLockSupportURL", annotation = Links.TAILNET_LOCK_KB_URL)
withStyle(
style =
SpanStyle(
style = SpanStyle(
color = MaterialTheme.colorScheme.link,
textDecoration = TextDecoration.Underline)) {
textDecoration = TextDecoration.Underline
)
) {
append(stringResource(id = R.string.learn_more))
}
pop()

Loading…
Cancel
Save