BAse Non Originating screen

Author: ThomasSession

app/src/main/java/org/thoughtcrime/securesms/preferences/prosettings/BaseProSettingsScreens.kt

@@ -1,7 +1,11 @@
 package org.thoughtcrime.securesms.preferences.prosettings
 
+import androidx.annotation.DrawableRes
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.WindowInsetsSides
@@ -11,17 +15,22 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.only
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.systemBars
 import androidx.compose.foundation.layout.widthIn
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment.Companion.Center
 import androidx.compose.ui.Alignment.Companion.CenterHorizontally
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
@@ -31,12 +40,16 @@ import org.thoughtcrime.securesms.ui.SessionProSettingsHeader
 import org.thoughtcrime.securesms.ui.components.AccentFillButtonRect
 import org.thoughtcrime.securesms.ui.components.BackAppBar
 import org.thoughtcrime.securesms.ui.components.DangerFillButtonRect
+import org.thoughtcrime.securesms.ui.components.annotatedStringResource
 import org.thoughtcrime.securesms.ui.theme.LocalColors
 import org.thoughtcrime.securesms.ui.theme.LocalDimensions
 import org.thoughtcrime.securesms.ui.theme.LocalType
 import org.thoughtcrime.securesms.ui.theme.PreviewTheme
 import org.thoughtcrime.securesms.ui.theme.SessionColorsParameterProvider
 import org.thoughtcrime.securesms.ui.theme.ThemeColors
+import org.thoughtcrime.securesms.ui.theme.bold
+import network.loki.messenger.R
+import org.thoughtcrime.securesms.ui.DialogBg
 
 /**
  * Base structure used in most Pro Settings screen
@@ -114,7 +127,14 @@ fun BaseCellButtonProSettingsScreen(
 
         Spacer(Modifier.height(LocalDimensions.current.smallSpacing))
 
-        Cell(content = content)
+        Cell {
+            Column(
+                modifier = Modifier.fillMaxWidth()
+                    .padding(LocalDimensions.current.smallSpacing)
+            ) {
+                content()
+            }
+        }
 
         Spacer(Modifier.height(LocalDimensions.current.smallSpacing))
 
@@ -170,20 +190,116 @@ fun BaseNonOriginatingProSettingsScreen(
     buttonText: String,
     dangerButton: Boolean,
     onButtonClick: () -> Unit,
-    title: String? = null,
-    content: @Composable () -> Unit
+    headerTitle: String?,
+    contentTitle: String?,
+    contentDescription: CharSequence?,
+    linkCellsInfo: String?,
+    linkCells: List<NonOriginatingLinkCellData> = emptyList(),
 ) {
     BaseCellButtonProSettingsScreen(
         disabled = disabled,
         onBack = onBack,
         buttonText = buttonText,
         dangerButton = dangerButton,
         onButtonClick = onButtonClick,
-        title = title,
-        content = content
-    )
+        title = headerTitle,
+    ){
+        if (contentTitle != null) {
+            Text(
+                text = contentTitle,
+                style = LocalType.current.h7,
+                color = LocalColors.current.text,
+            )
+        }
+
+        if (contentDescription != null) {
+            Spacer(Modifier.height(LocalDimensions.current.xxxsSpacing))
+            Text(
+                text = annotatedStringResource(contentDescription),
+                style = LocalType.current.base,
+                color = LocalColors.current.text,
+            )
+        }
+
+        if (linkCellsInfo != null) {
+            Spacer(Modifier.height(LocalDimensions.current.smallSpacing))
+            Text(
+                text = linkCellsInfo,
+                style = LocalType.current.base,
+                color = LocalColors.current.textSecondary,
+            )
+        }
+
+        Spacer(Modifier.height(LocalDimensions.current.xsSpacing))
+
+        linkCells.forEachIndexed { index, data ->
+            if (index > 0) {
+                Spacer(Modifier.height(LocalDimensions.current.xsSpacing))
+            }
+            NonOriginatingLinkCell(data)
+        }
+    }
+}
+
+@Composable
+fun NonOriginatingLinkCell(
+    data: NonOriginatingLinkCellData
+) {
+    DialogBg(
+        bgColor = LocalColors.current.backgroundTertiary
+    ) {
+        Row(
+            modifier = Modifier.fillMaxWidth()
+                .padding(LocalDimensions.current.smallSpacing),
+            horizontalArrangement = Arrangement.spacedBy(LocalDimensions.current.smallSpacing)
+        ) {
+            // icon
+            Box(modifier = Modifier
+                .background(
+                    color = LocalColors.current.accent.copy(alpha = 0.2f),
+                    shape = MaterialTheme.shapes.small
+                )
+                .padding(10.dp)
+            ){
+                Icon(
+                    modifier = Modifier.align(Center)
+                        .size(LocalDimensions.current.iconMedium),
+                    painter = painterResource(id = data.iconRes),
+                    tint = LocalColors.current.accent,
+                    contentDescription = null
+                )
+            }
+
+            // text content
+            Column(
+                modifier = Modifier.weight(1f)
+            ) {
+                Text(
+                    text = annotatedStringResource(data.title),
+                    style = LocalType.current.base.bold(),
+                    color = LocalColors.current.text,
+                )
+
+                Spacer(Modifier.height(LocalDimensions.current.xxxsSpacing))
+
+                Text(
+                    text = annotatedStringResource(data.info),
+                    style = LocalType.current.base,
+                    color = LocalColors.current.text,
+                )
+            }
+        }
+    }
 }
 
+
+data class NonOriginatingLinkCellData(
+    val title: CharSequence,
+    val info: CharSequence,
+    @DrawableRes val iconRes: Int,
+    val onClick: (() -> Unit)? = null
+)
+
 @Preview
 @Composable
 private fun PreviewBaseNonOrig(
@@ -193,17 +309,26 @@ private fun PreviewBaseNonOrig(
         BaseNonOriginatingProSettingsScreen(
             disabled = false,
             onBack = {},
-            title = "This is a title",
+            headerTitle = "This is a title",
             buttonText = "This is a button",
-            dangerButton = true,
+            dangerButton = false,
             onButtonClick = {},
-            content = {
-                Box(
-                    modifier = Modifier.padding(LocalDimensions.current.smallSpacing)
-                ) {
-                    Text("This is a cell button content screen~")
-                }
-            }
+            contentTitle = "This is a content title",
+            contentDescription = "This is a content description",
+            linkCellsInfo = "This is a link cells info",
+            linkCells = listOf(
+                NonOriginatingLinkCellData(
+                    title = "This is a title",
+                    info = "This is some info",
+                    iconRes = R.drawable.ic_globe
+                ),
+                NonOriginatingLinkCellData(
+                    title = "This is another title",
+                    info = "This is some different info",
+                    iconRes = R.drawable.ic_phone
+                )
+            )
+
         )
     }
 }

app/src/main/java/org/thoughtcrime/securesms/preferences/prosettings/PlanConfirmationScreen.kt

@@ -149,7 +149,7 @@ fun PlanConfirmation(
                 color = LocalColors.current.text,
             )
 
-            Spacer(Modifier.height(LocalDimensions.current.smallSpacing))
+            Spacer(Modifier.height(LocalDimensions.current.spacing))
 
             //todo PRO the button text can change if the user was renewing vs expiring and/or/auto-renew
             AccentFillButtonRect(

app/src/main/java/org/thoughtcrime/securesms/preferences/prosettings/ProSettingsNavHost.kt

@@ -64,7 +64,7 @@ fun ProSettingsNavHost(
             }
         }
 
-        NavHost(navController = navController, startDestination = PlanConfirmation) {
+        NavHost(navController = navController, startDestination = Home) {
             // Home
             horizontalSlideComposable<Home> {
                 ProSettingsHomeScreen(

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

@@ -292,12 +292,13 @@ fun DialogButton(
 @Composable
 fun DialogBg(
     modifier: Modifier = Modifier,
+    bgColor: Color = LocalColors.current.backgroundSecondary,
     content: @Composable BoxScope.() -> Unit
 ){
     Box(
         modifier = modifier
             .background(
-                color = LocalColors.current.backgroundSecondary,
+                color = bgColor,
                 shape = MaterialTheme.shapes.small
             )
             .border(