Merge branch 'on-2' into pr/1451-buttons

app/src/main/java/org/thoughtcrime/securesms/conversation/newmessage/NewMessageFragment.kt

@@ -10,10 +10,12 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.pager.HorizontalPager
 import androidx.compose.foundation.pager.rememberPagerState
+import androidx.compose.material.LocalContentAlpha
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.material.primarySurface
@@ -47,11 +49,13 @@ import org.thoughtcrime.securesms.dependencies.DatabaseComponent
 import org.thoughtcrime.securesms.showOpenUrlDialog
 import org.thoughtcrime.securesms.ui.AppTheme
 import org.thoughtcrime.securesms.ui.LoadingArcOr
+import org.thoughtcrime.securesms.ui.LocalDimensions
 import org.thoughtcrime.securesms.ui.PreviewTheme
 import org.thoughtcrime.securesms.ui.ThemeResPreviewParameterProvider
 import org.thoughtcrime.securesms.ui.baseBold
+import org.thoughtcrime.securesms.ui.classicDarkColors
 import org.thoughtcrime.securesms.ui.components.AppBar
-import org.thoughtcrime.securesms.ui.components.BorderlessButtonSecondary
+import org.thoughtcrime.securesms.ui.components.BorderlessButtonWithIcon
 import org.thoughtcrime.securesms.ui.components.MaybeScanQrCode
 import org.thoughtcrime.securesms.ui.components.OutlineButton
 import org.thoughtcrime.securesms.ui.components.SessionButtonText
@@ -154,7 +158,7 @@ fun EnterAccountId(
     ) {
         SessionOutlinedTextField(
             text = state.newMessageIdOrOns,
-            modifier = Modifier.padding(horizontal = 64.dp)
+            modifier = Modifier.padding(horizontal = LocalDimensions.current.marginSmall)
                 .contentDescription("Session id input box"),
             placeholder = stringResource(R.string.accountIdOrOnsEnter),
             onChange = callbacks::onChange,
@@ -164,15 +168,20 @@ fun EnterAccountId(
         if (state.error == null) {
             BorderlessButtonSecondary(
                 text = stringResource(R.string.messageNewDescription),
-                modifier = Modifier.contentDescription(R.string.AccessibilityId_help_desk_link)
+                iconRes = R.drawable.ic_circle_question_mark,
+                contentColor = classicDarkColors[5],
+                modifier = Modifier
+                    .contentDescription(R.string.AccessibilityId_help_desk_link)
+                    .fillMaxWidth()
+                    .padding(horizontal = LocalDimensions.current.marginMedium),
             ) { onHelp() }
         }
 
         OutlineButton(
             modifier = Modifier
                 .align(Alignment.CenterHorizontally)
-                .padding(horizontal = 64.dp)
-                .width(200.dp)
+                .padding(horizontal = LocalDimensions.current.marginLarge)
+                .fillMaxWidth()
                 .contentDescription(R.string.next),
             onClick = { callbacks.onContinue() }
         ) {

app/src/main/java/org/thoughtcrime/securesms/home/HomeActivity.kt

@@ -392,7 +392,7 @@ class HomeActivity : PassphraseRequiredActionBarActivity(),
                                 stringResource(R.string.save_your_recovery_password),
                                 style = MaterialTheme.typography.h8
                             )
-                            Spacer(Modifier.requiredWidth(LocalDimensions.current.itemSpacingSmall))
+                            Spacer(Modifier.requiredWidth(LocalDimensions.current.itemSpacingExtraSmall))
                             SessionShieldIcon()
                         }
                         Text(

app/src/main/java/org/thoughtcrime/securesms/onboarding/LandingActivity.kt

@@ -52,7 +52,6 @@ import org.thoughtcrime.securesms.ui.LocalDimensions
 import org.thoughtcrime.securesms.ui.PreviewTheme
 import org.thoughtcrime.securesms.ui.ThemeResPreviewParameterProvider
 import org.thoughtcrime.securesms.ui.classicDarkColors
-import org.thoughtcrime.securesms.ui.components.BorderlessButton
 import org.thoughtcrime.securesms.ui.components.BorderlessHtmlButton
 import org.thoughtcrime.securesms.ui.components.FilledButton
 import org.thoughtcrime.securesms.ui.components.OutlineButton

app/src/main/java/org/thoughtcrime/securesms/onboarding/LinkDeviceActivity.kt

@@ -32,8 +32,10 @@ import kotlinx.coroutines.launch
 import network.loki.messenger.R
 import org.session.libsession.utilities.TextSecurePreferences
 import org.thoughtcrime.securesms.BaseActionBarActivity
+import org.thoughtcrime.securesms.onboarding.messagenotifications.startMessageNotificationsActivity
 import org.thoughtcrime.securesms.ui.AppTheme
 import org.thoughtcrime.securesms.ui.LocalDimensions
+import org.thoughtcrime.securesms.ui.PreviewTheme
 import org.thoughtcrime.securesms.ui.base
 import org.thoughtcrime.securesms.ui.baseBold
 import org.thoughtcrime.securesms.ui.components.MaybeScanQrCode
@@ -41,6 +43,7 @@ import org.thoughtcrime.securesms.ui.components.OutlineButton
 import org.thoughtcrime.securesms.ui.components.SessionOutlinedTextField
 import org.thoughtcrime.securesms.ui.components.SessionTabRow
 import org.thoughtcrime.securesms.ui.contentDescription
+import org.thoughtcrime.securesms.util.start
 import javax.inject.Inject
 
 private const val TAG = "LinkDeviceActivity"
@@ -66,6 +69,7 @@ class LinkDeviceActivity : BaseActionBarActivity() {
 
         lifecycleScope.launch {
             viewModel.eventFlow.collect {
+                startMessageNotificationsActivity()
                 startLoadingActivity(it.mnemonic)
                 finish()
             }
@@ -110,7 +114,11 @@ class LinkDeviceActivity : BaseActionBarActivity() {
 
 @Preview
 @Composable
-fun PreviewRecoveryPassword() = RecoveryPassword(state = LinkDeviceState())
+fun PreviewRecoveryPassword() {
+    PreviewTheme(R.style.Classic_Dark) {
+        RecoveryPassword(state = LinkDeviceState())
+    }
+}
 
 @Composable
 fun RecoveryPassword(state: LinkDeviceState, onChange: (String) -> Unit = {}, onContinue: () -> Unit = {}) {
@@ -150,8 +158,8 @@ fun RecoveryPassword(state: LinkDeviceState, onChange: (String) -> Unit = {}, on
             textId = R.string.continue_2,
             modifier = Modifier
                 .align(Alignment.CenterHorizontally)
-                .padding(horizontal = LocalDimensions.current.marginLarge, vertical = 20.dp)
-                .width(200.dp),
+                .padding(vertical = 20.dp)
+                .fillMaxWidth(),
             onClick = onContinue
         )
     }

app/src/main/java/org/thoughtcrime/securesms/onboarding/LoadingActivity.kt

@@ -23,12 +23,10 @@ import androidx.lifecycle.lifecycleScope
 import dagger.hilt.android.AndroidEntryPoint
 import kotlinx.coroutines.launch
 import network.loki.messenger.R
-import org.session.libsession.utilities.AppTextSecurePreferences
 import org.session.libsession.utilities.TextSecurePreferences
 import org.thoughtcrime.securesms.ApplicationContext
 import org.thoughtcrime.securesms.BaseActionBarActivity
 import org.thoughtcrime.securesms.dependencies.ConfigFactory
-import org.thoughtcrime.securesms.onboarding.messagenotifications.MessageNotificationsActivity
 import org.thoughtcrime.securesms.onboarding.messagenotifications.startMessageNotificationsActivity
 import org.thoughtcrime.securesms.onboarding.pickname.startPickDisplayNameActivity
 import org.thoughtcrime.securesms.ui.AppTheme

app/src/main/java/org/thoughtcrime/securesms/onboarding/messagenotifications/MessageNotificationsActivity.kt

@@ -10,9 +10,9 @@ import androidx.compose.foundation.layout.Arrangement
 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.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.MaterialTheme
@@ -38,6 +38,7 @@ import org.thoughtcrime.securesms.BaseActionBarActivity
 import org.thoughtcrime.securesms.home.HomeActivity
 import org.thoughtcrime.securesms.notifications.PushRegistry
 import org.thoughtcrime.securesms.ui.AppTheme
+import org.thoughtcrime.securesms.ui.LocalDimensions
 import org.thoughtcrime.securesms.ui.PreviewTheme
 import org.thoughtcrime.securesms.ui.ThemeResPreviewParameterProvider
 import org.thoughtcrime.securesms.ui.base
@@ -103,12 +104,12 @@ fun MessageNotificationsScreen(
     setEnabled: (Boolean) -> Unit = {},
     onContinue: () -> Unit = {}
 ) {
-    Column(Modifier.padding(horizontal = 32.dp)) {
+    Column(Modifier.padding(horizontal = LocalDimensions.current.marginMedium)) {
         Spacer(Modifier.weight(1f))
         Text(stringResource(R.string.notificationsMessage), style = MaterialTheme.typography.h4)
-        Spacer(Modifier.height(16.dp))
+        Spacer(Modifier.height(LocalDimensions.current.marginExtraSmall))
         Text(stringResource(R.string.onboardingMessageNotificationExplaination), style = MaterialTheme.typography.base)
-        Spacer(Modifier.height(16.dp))
+        Spacer(Modifier.height(LocalDimensions.current.marginExtraSmall))
         NotificationRadioButton(
             R.string.activity_pn_mode_fast_mode,
             R.string.activity_pn_mode_fast_mode_explanation,
@@ -117,7 +118,7 @@ fun MessageNotificationsScreen(
             selected = state.pushEnabled,
             onClick = { setEnabled(true) }
         )
-        Spacer(Modifier.height(16.dp))
+        Spacer(Modifier.height(LocalDimensions.current.marginExtraSmall))
         NotificationRadioButton(
             R.string.activity_pn_mode_slow_mode,
             R.string.activity_pn_mode_slow_mode_explanation,
@@ -131,10 +132,10 @@ fun MessageNotificationsScreen(
             modifier = Modifier
                 .contentDescription(R.string.AccessibilityId_continue)
                 .align(Alignment.CenterHorizontally)
-                .width(262.dp),
+                .fillMaxWidth(),
             onClick = onContinue
         )
-        Spacer(modifier = Modifier.height(12.dp))
+        Spacer(modifier = Modifier.height(LocalDimensions.current.marginExtraExtraSmall))
     }
 }
 

app/src/main/java/org/thoughtcrime/securesms/onboarding/recoverypassword/RecoveryPasswordActivity.kt

@@ -227,6 +227,7 @@ private fun HideRecoveryPasswordCell(onHide: () -> Unit = {}) {
                     style = MaterialTheme.typography.base
                 )
             }
+            Spacer(modifier = Modifier.width(LocalDimensions.current.marginExtraExtraSmall))
             DestructiveButtons {
                 OutlineButton(
                     textId = R.string.hide,

app/src/main/java/org/thoughtcrime/securesms/preferences/SettingsActivity.kt

@@ -78,6 +78,7 @@ import org.thoughtcrime.securesms.ui.Cell
 import org.thoughtcrime.securesms.ui.Divider
 import org.thoughtcrime.securesms.ui.ItemButton
 import org.thoughtcrime.securesms.ui.ItemButtonWithDrawable
+import org.thoughtcrime.securesms.ui.LocalDimensions
 import org.thoughtcrime.securesms.ui.components.OutlineButton
 import org.thoughtcrime.securesms.ui.components.OutlineCopyButton
 import org.thoughtcrime.securesms.ui.destructiveButtonColors
@@ -387,9 +388,9 @@ class SettingsActivity : PassphraseRequiredActionBarActivity() {
         Column {
             Row(
                 modifier = Modifier
-                    .padding(horizontal = 24.dp)
-                    .padding(top = 8.dp),
-                horizontalArrangement = Arrangement.spacedBy(16.dp),
+                    .padding(horizontal = LocalDimensions.current.marginSmall)
+                    .padding(top = LocalDimensions.current.marginTiny),
+                horizontalArrangement = Arrangement.spacedBy(LocalDimensions.current.itemSpacingSmall),
             ) {
                 OutlineButton(
                     stringResource(R.string.share),

app/src/main/java/org/thoughtcrime/securesms/ui/Colors.kt

@@ -78,18 +78,34 @@ fun transparentButtonColors() = ButtonDefaults.buttonColors(backgroundColor = Co
 @Composable
 fun destructiveButtonColors() = ButtonDefaults.buttonColors(backgroundColor = Color.Transparent, contentColor = colorDestructive)
 
+@Preview @Composable fun ClassicLight() { Colors("classic light", classicLightColors) }
+@Preview @Composable fun ClassicDark() { Colors("classic dark", classicDarkColors) }
+@Preview @Composable fun OceanLight() { Colors("ocean light", oceanLightColors) }
+@Preview @Composable fun OceanDark() { Colors("ocean dark", oceanDarkColors) }
+
+@Composable
+fun Colors(name: String, colors: List<Color>) {
+    Column {
+        colors.forEachIndexed { i, it ->
+            Box(Modifier.background(it)) {
+                Text("$name: $i")
+            }
+        }
+    }
+}
+
 @Preview
 @Composable
-fun PreviewMessageDetails(
+fun PreviewThemeColors(
     @PreviewParameter(ThemeResPreviewParameterProvider::class) themeResId: Int
 ) {
     PreviewTheme(themeResId) {
-        Colors()
+        ThemeColors()
     }
 }
 
 @Composable
-private fun Colors() {
+private fun ThemeColors() {
     AppTheme {
         Column {
             Box(Modifier.background(MaterialTheme.colors.primary)) {

app/src/main/java/org/thoughtcrime/securesms/ui/components/Button.kt

@@ -1,9 +1,11 @@
 package org.thoughtcrime.securesms.ui.components
 
+import androidx.annotation.DrawableRes
 import androidx.annotation.StringRes
 import androidx.compose.animation.Crossfade
 import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.interaction.PressInteraction
 import androidx.compose.foundation.layout.Box
@@ -15,6 +17,7 @@ import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.ContentAlpha
+import androidx.compose.material.Icon
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.OutlinedButton
 import androidx.compose.material.Text
@@ -29,7 +32,9 @@ import androidx.compose.runtime.staticCompositionLocalOf
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import kotlinx.coroutines.delay
@@ -249,6 +254,26 @@ fun BorderlessButton(
     }
 }
 
+@Composable
+fun BorderlessButtonWithIcon(
+    text: String,
+    @DrawableRes iconRes: Int,
+    modifier: Modifier = Modifier,
+    style: TextStyle = MaterialTheme.typography.baseBold,
+    contentColor: Color = MaterialTheme.colors.onBackground,
+    backgroundColor: Color = Color.Transparent,
+    onClick: () -> Unit
+) {
+    BorderlessButton(
+        modifier = modifier,
+        contentColor = contentColor,
+        backgroundColor = backgroundColor,
+        onClick = onClick
+    ) {
+        AnnotatedTextWithIcon(text, iconRes, style = style)
+    }
+}
+
 @Composable
 fun BorderlessHtmlButton(
     textId: Int,

app/src/main/java/org/thoughtcrime/securesms/ui/components/QR.kt

@@ -17,6 +17,7 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.RoundedCornerShape
@@ -56,6 +57,7 @@ import kotlinx.coroutines.flow.buffer
 import kotlinx.coroutines.flow.filter
 import network.loki.messenger.R
 import org.session.libsignal.utilities.Log
+import org.thoughtcrime.securesms.ui.LocalDimensions
 import org.thoughtcrime.securesms.ui.base
 import java.util.concurrent.Executors
 
@@ -101,14 +103,18 @@ fun MaybeScanQrCode(
                 )
             }
         } else {
+            Box(modifier = Modifier.fillMaxSize().padding(LocalDimensions.current.marginLarge)) {
                 OutlineButton(
                     stringResource(R.string.cameraGrantAccess),
-                modifier = Modifier.align(Alignment.Center),
+                    modifier = Modifier
+                        .align(Alignment.Center)
+                        .fillMaxWidth(),
                     onClick = { cameraPermissionState.run { launchPermissionRequest() } }
                 )
             }
         }
     }
+}
 
 @Composable
 fun ScanQrCode(errors: Flow<String>, onScan: (String) -> Unit) {

app/src/main/java/org/thoughtcrime/securesms/ui/components/Text.kt

@@ -1,5 +1,6 @@
 package org.thoughtcrime.securesms.ui.components
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
@@ -16,8 +17,10 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.Placeholder
 import androidx.compose.ui.text.PlaceholderVerticalAlign
+import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.buildAnnotatedString
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.Dp
@@ -78,10 +81,7 @@ fun AnnotatedTextWithIcon(
     text: String,
     icon: ImageVector,
     modifier: Modifier = Modifier,
-    iconTint: Color = Color.Unspecified,
-    iconDescription: String = "",
-    iconSize: TextUnit = 12.sp,
-    textWidth: Dp = 100.dp
+    style: TextStyle = MaterialTheme.typography.base
 ) {
     val myId = "inlineContent"
     val annotatedText = buildAnnotatedString {
@@ -91,15 +91,59 @@ fun AnnotatedTextWithIcon(
 
     val inlineContent = mapOf(
         myId to Placeholder(
-            width = iconSize,
-            height = iconSize,
+            width = TextUnit.Unspecified,
+            height = TextUnit.Unspecified,
             placeholderVerticalAlign = PlaceholderVerticalAlign.AboveBaseline
-        ).let { InlineTextContent(it) { Icon(icon, iconDescription, tint = iconTint) } }
+        ).let { InlineTextContent(it) { Icon(icon, contentDescription = null) } }
     )
 
     Text(
         text = annotatedText,
-        modifier = modifier.width(textWidth),
+        modifier = modifier,
+        inlineContent = inlineContent,
+        style = style
+    )
+}
+
+@Composable
+fun AnnotatedTextWithIcon(
+    text: String,
+    @DrawableRes iconRes: Int,
+    modifier: Modifier = Modifier,
+    style: TextStyle = MaterialTheme.typography.base,
+    iconTint: Color = Color.Unspecified,
+    iconSize: TextUnit = 12.sp
+) {
+    val myId = "inlineContent"
+    val annotated = buildAnnotatedString {
+        append(text)
+        appendInlineContent(myId, "[icon]")
+    }
+
+    val inlineContent = mapOf(
+        Pair(
+            myId,
+            InlineTextContent(
+                Placeholder(
+                    width = iconSize,
+                    height = iconSize,
+                    placeholderVerticalAlign = PlaceholderVerticalAlign.AboveBaseline
+                )
+            ) {
+                Icon(
+                    painter = painterResource(id = iconRes),
+                    contentDescription = null,
+                    modifier = Modifier.padding(1.dp),
+                    tint = iconTint
+                )
+            }
+        )
+    )
+
+    Text(
+        text = annotated,
+        modifier = modifier.fillMaxWidth(),
+        style = style,
         inlineContent = inlineContent
     )
 }