From d0253d3131b54e72ab08e71ad155e7a2749500dc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20K=C3=BCrten?= <sebastian@mobanisto.de>
Date: Wed, 12 Jan 2022 09:27:41 +0100
Subject: [PATCH] Display special screen when pending contacts are selected

---
 .../conversation/PrivateMessageScreen.kt      | 37 +++++++++++++++----
 .../briar/desktop/ui/Constants.kt             |  1 +
 .../resources/strings/BriarDesktop.properties |  2 +
 3 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/src/main/kotlin/org/briarproject/briar/desktop/conversation/PrivateMessageScreen.kt b/src/main/kotlin/org/briarproject/briar/desktop/conversation/PrivateMessageScreen.kt
index e73b89b036..952e28a1ee 100644
--- a/src/main/kotlin/org/briarproject/briar/desktop/conversation/PrivateMessageScreen.kt
+++ b/src/main/kotlin/org/briarproject/briar/desktop/conversation/PrivateMessageScreen.kt
@@ -9,17 +9,21 @@ 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.layout.widthIn
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Surface
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import org.briarproject.briar.desktop.contact.ContactList
 import org.briarproject.briar.desktop.contact.ContactListViewModel
+import org.briarproject.briar.desktop.contact.PendingContactIdWrapper
 import org.briarproject.briar.desktop.contact.RealContactIdWrapper
 import org.briarproject.briar.desktop.ui.BriarLogo
+import org.briarproject.briar.desktop.ui.Constants.PARAGRAPH_WIDTH
 import org.briarproject.briar.desktop.ui.VerticalDivider
 import org.briarproject.briar.desktop.utils.InternationalizationUtils.i18n
 import org.briarproject.briar.desktop.viewmodel.viewModel
@@ -39,17 +43,34 @@ fun PrivateMessageScreen(
         VerticalDivider()
         Column(modifier = Modifier.weight(1f).fillMaxHeight()) {
             val id = viewModel.selectedContactId.value
-            if (id != null && id is RealContactIdWrapper) {
-                ConversationScreen(id.contactId)
-            } else {
+            if (id == null) {
                 NoContactSelected()
+            } else when (id) {
+                is RealContactIdWrapper -> {
+                    ConversationScreen(id.contactId)
+                }
+                is PendingContactIdWrapper -> {
+                    PendingContactSelected()
+                }
             }
         }
     }
 }
 
 @Composable
-fun NoContactSelected() = Surface(color = MaterialTheme.colors.background) {
+fun NoContactSelected() = Explainer(
+    headline = i18n("contacts.none_selected.title"),
+    content = i18n("contacts.none_selected.hint"),
+)
+
+@Composable
+fun PendingContactSelected() = Explainer(
+    headline = i18n("contacts.pending_selected.title"),
+    content = i18n("contacts.pending_selected.hint"),
+)
+
+@Composable
+fun Explainer(headline: String, content: String) = Surface(color = MaterialTheme.colors.background) {
     Column(
         modifier = Modifier.padding(16.dp).fillMaxSize(),
         verticalArrangement = Arrangement.Center,
@@ -57,14 +78,14 @@ fun NoContactSelected() = Surface(color = MaterialTheme.colors.background) {
     ) {
         BriarLogo(modifier = Modifier.size(200.dp))
         Text(
-            text = i18n("contacts.none_selected.title"),
+            text = headline,
             modifier = Modifier.padding(PaddingValues(top = 15.dp, bottom = 5.dp)),
             style = MaterialTheme.typography.h5
         )
         Text(
-            text = i18n("contacts.none_selected.hint"),
-            modifier = Modifier.padding(PaddingValues(top = 5.dp, bottom = 15.dp)),
-            style = MaterialTheme.typography.body2
+            text = content,
+            modifier = Modifier.padding(PaddingValues(top = 5.dp, bottom = 15.dp)).widthIn(max = PARAGRAPH_WIDTH),
+            style = MaterialTheme.typography.body2.copy(textAlign = TextAlign.Center)
         )
     }
 }
diff --git a/src/main/kotlin/org/briarproject/briar/desktop/ui/Constants.kt b/src/main/kotlin/org/briarproject/briar/desktop/ui/Constants.kt
index ed1606d68e..abd377d359 100644
--- a/src/main/kotlin/org/briarproject/briar/desktop/ui/Constants.kt
+++ b/src/main/kotlin/org/briarproject/briar/desktop/ui/Constants.kt
@@ -5,4 +5,5 @@ import androidx.compose.ui.unit.dp
 object Constants {
     val HEADER_SIZE = 56.dp
     val COLUMN_WIDTH = 275.dp
+    val PARAGRAPH_WIDTH = 540.dp
 }
diff --git a/src/main/resources/strings/BriarDesktop.properties b/src/main/resources/strings/BriarDesktop.properties
index 6ff5ede4db..c122151cba 100644
--- a/src/main/resources/strings/BriarDesktop.properties
+++ b/src/main/resources/strings/BriarDesktop.properties
@@ -16,6 +16,8 @@ access.swap=Icon showing errors between two contacts
 # Contacts
 contacts.none_selected.title=No contact selected
 contacts.none_selected.hint=Select a contact to start chatting
+contacts.pending_selected.title=Pending contact selected
+contacts.pending_selected.hint=You need to wait until the process of adding each other as contacts has finished before you can start chatting.
 contacts.card.nothing=No messages.
 contacts.dropdown.connections=Connections
 contacts.dropdown.connections.title=Connections
-- 
GitLab