(android) Add link to duration FAQ in liquidity view

Also fixed an issue where the popup button could be squashed by its larger siblings and be invisible.
ACINQ · Mar 6, 2024 · 17e94a9 · 17e94a9
1 parent 594e0e3
commit 17e94a9
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 28 deletions.
diff --git a/phoenix-android/src/main/kotlin/fr/acinq/phoenix/android/components/Dialogs.kt b/phoenix-android/src/main/kotlin/fr/acinq/phoenix/android/components/Dialogs.kt
@@ -29,8 +29,8 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.requiredSize
+import androidx.compose.foundation.layout.requiredWidth
 import androidx.compose.foundation.layout.widthIn
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.RoundedCornerShape
@@ -182,25 +182,23 @@ fun RowScope.IconPopup(
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }
 ) {
     var showPopup by remember { mutableStateOf(false) }
-    spaceLeft?.let { Spacer(Modifier.width(it)) }
-    Box {
-        BorderButton(
-            icon = icon,
-            iconTint = if (showPopup) MaterialTheme.colors.onPrimary else colorAtRest,
-            backgroundColor = if (showPopup) MaterialTheme.colors.primary else MaterialTheme.colors.surface,
-            borderColor = if (showPopup) MaterialTheme.colors.primary else colorAtRest,
-            padding = PaddingValues(iconPadding),
-            modifier = modifier.size(iconSize),
-            interactionSource = interactionSource,
-            onClick = { showPopup = true }
-        )
-        if (showPopup) {
-            PopupDialog(onDismiss = { showPopup = false }, message = popupMessage, button = popupLink?.let { (text, link) ->
-                { WebLink(text = text, url = link, fontSize = 14.sp, modifier = Modifier.fillMaxWidth(), padding = PaddingValues(horizontal = 10.dp, vertical = 8.dp)) }
-            })
-        }
+    spaceLeft?.let { Spacer(Modifier.requiredWidth(it)) }
+    BorderButton(
+        icon = icon,
+        iconTint = if (showPopup) MaterialTheme.colors.onPrimary else colorAtRest,
+        backgroundColor = if (showPopup) MaterialTheme.colors.primary else MaterialTheme.colors.surface,
+        borderColor = if (showPopup) MaterialTheme.colors.primary else colorAtRest,
+        padding = PaddingValues(iconPadding),
+        modifier = modifier.requiredSize(iconSize),
+        interactionSource = interactionSource,
+        onClick = { showPopup = true }
+    )
+    if (showPopup) {
+        PopupDialog(onDismiss = { showPopup = false }, message = popupMessage, button = popupLink?.let { (text, link) ->
+            { WebLink(text = text, url = link, fontSize = 14.sp, modifier = Modifier.fillMaxWidth(), padding = PaddingValues(horizontal = 10.dp, vertical = 8.dp)) }
+        })
     }
-    spaceRight?.let { Spacer(Modifier.width(it)) }
+    spaceRight?.let { Spacer(Modifier.requiredWidth(it)) }
 }
 
 @Composable

diff --git a/phoenix-android/src/main/kotlin/fr/acinq/phoenix/android/components/SplashLayout.kt b/phoenix-android/src/main/kotlin/fr/acinq/phoenix/android/components/SplashLayout.kt
@@ -119,25 +119,25 @@ fun SplashLabelRow(
     @DrawableRes icon: Int? = null,
     iconTint: Color = MaterialTheme.typography.subtitle1.color,
     helpMessage: String? = null,
+    helpLink: Pair<String, String>? = null,
     content: @Composable ColumnScope.() -> Unit,
 ) {
     Row(
         modifier = Modifier.padding(vertical = 3.dp)
     ) {
-        Row(modifier = Modifier
-            .weight(1f)
-            .alignByBaseline(),
+        Row(
+            modifier = Modifier.weight(1f).alignByBaseline(),
+            horizontalArrangement = Arrangement.End
         ) {
-            Spacer(modifier = Modifier.weight(1f))
-
             Text(
                 text = label.uppercase(),
                 style = MaterialTheme.typography.subtitle1.copy(fontSize = 12.sp, textAlign = TextAlign.End),
                 maxLines = 2,
-                overflow = TextOverflow.Ellipsis
+                overflow = TextOverflow.Ellipsis,
+                modifier = Modifier.weight(1f)
             )
             if (helpMessage != null) {
-                IconPopup(modifier = Modifier.offset(y = (-3).dp), popupMessage = helpMessage, spaceLeft = 4.dp, spaceRight = 0.dp)
+                IconPopup(modifier = Modifier.offset(y = (-3).dp), popupMessage = helpMessage, popupLink = helpLink, spaceLeft = 4.dp, spaceRight = 0.dp)
             }
             if (icon != null) {
                 Spacer(modifier = Modifier.width(4.dp))

diff --git a/...droid/src/main/kotlin/fr/acinq/phoenix/android/payments/liquidity/RequestLiquidityView.kt b/...droid/src/main/kotlin/fr/acinq/phoenix/android/payments/liquidity/RequestLiquidityView.kt
@@ -39,6 +39,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.lifecycle.viewmodel.compose.viewModel
@@ -124,6 +125,7 @@ private fun RequestLiquidityTopSection(inboundLiquidity: MilliSatoshi?) {
             Text(
                 text = stringResource(id = R.string.liquidityads_header),
                 style = MaterialTheme.typography.h4,
+                textAlign = TextAlign.Center,
             )
             IconPopup(
                 popupMessage = stringResource(id = R.string.liquidityads_instructions),
@@ -274,7 +276,8 @@ private fun LeaseEstimationView(
     Spacer(modifier = Modifier.height(8.dp))
     SplashLabelRow(
         label = stringResource(id = R.string.liquidityads_estimate_details_duration),
-        helpMessage = stringResource(id = R.string.liquidityads_estimate_details_duration_help)
+        helpMessage = stringResource(id = R.string.liquidityads_estimate_details_duration_help),
+        helpLink = stringResource(id = R.string.liquidityads_faq_link) to "https://phoenix.acinq.co/faq#what-happens-after-a-year-of-reserving-liquidity",
     ) {
         Column {
             Text(