fix(Communities): make invite popup push onto modal stackview

The popup to invite friends to communities has so far always been a brand new
popup that's opened on top of possible existing popups.

The design however, expects that the same section should be shown as part
of a wizard-like process inside of the existing community profile overview
popup, when entered from there.

This commit extracts the invite friends popup section into component that
can be reused as stack view, as well as modal content, to implement both
scenarios.

ui/app/AppLayouts/Chat/CommunityComponents/CommunityProfilePopup.qml

@@ -89,7 +89,7 @@ ModalPopup {
 
         Separator {
             anchors.top: headerDescription.bottom
-            anchors.topMargin: Style.current.padding
+            anchors.topMargin: modalHeader.description === "" ? 0 : Style.current.padding
             anchors.left: parent.left
             anchors.right: parent.right
             anchors.rightMargin: -Style.current.padding
@@ -108,6 +108,19 @@ ModalPopup {
         popEnter: Transition { enabled: false }
         popExit: Transition { enabled: false }
 
+        Component {
+            id: inviteFriendsView
+            CommunityProfilePopupInviteFriendsView {
+                headerTitle: qsTr("Invite friends")
+                contactListSearch.chatKey.text: ""
+                contactListSearch.pubKey: ""
+                contactListSearch.pubKeys: []
+                contactListSearch.ensUsername: ""
+                contactListSearch.existingContacts.visible: profileModel.contacts.list.hasAddedContacts()
+                contactListSearch.noContactsRect.visible: !contactListSearch.existingContacts.visible
+            }
+        }
+
         Component {
             id: membersList
             CommunityProfilePopupMembersList {
@@ -156,6 +169,16 @@ ModalPopup {
                 stack.pop()
             }
         }
+
+        StatusButton {
+            text: qsTr("Invite")
+            anchors.right: parent.right
+            enabled: stack.currentItem.contactListSearch !== undefined && stack.currentItem.contactListSearch.pubKeys.length > 0
+            onClicked: {
+                stack.currentItem.sendInvites(stack.currentItem.contactListSearch.pubKeys)
+                stack.pop()
+            }
+        }
     }
 }
 

ui/app/AppLayouts/Chat/CommunityComponents/CommunityProfilePopupInviteFriendsView.qml

@@ -0,0 +1,57 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12
+import QtQuick.Dialogs 1.3
+import QtQuick.Layouts 1.13
+import QtGraphicalEffects 1.13
+import "../../../../imports"
+import "../../../../shared"
+import "../../../../shared/status"
+
+Item {
+    id: root
+
+    property string headerTitle: ""
+    property string headerDescription: ""
+    property string headerImageSource: ""
+
+    property alias contactListSearch: contactFieldAndList
+
+    height: 400
+
+    function sendInvites(pubKeys) {
+        const error = chatsModel.communities.inviteUsersToCommunityById(popup.communityId, JSON.stringify(pubKeys))
+        if (error) {
+            console.error('Error inviting', error)
+            contactFieldAndList.validationError = error
+            return
+        }
+        contactFieldAndList.successMessage = qsTr("Invite successfully sent")
+    }
+
+    TextWithLabel {
+        id: shareCommunity
+        anchors.top: parent.top
+        anchors.topMargin: 0
+        //% "Share community"
+        label: qsTrId("share-community")
+        text: `${Constants.communityLinkPrefix}${communityId.substring(0, 4)}...${communityId.substring(communityId.length -2)}`
+        textToCopy: Constants.communityLinkPrefix + communityId
+    }
+
+    Separator {
+        id: sep
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: shareCommunity.bottom
+        anchors.topMargin: Style.current.smallPadding
+        anchors.leftMargin: -Style.current.padding
+        anchors.rightMargin: -Style.current.padding
+    }
+
+    ContactsListAndSearch {
+        id: contactFieldAndList
+        anchors.top: sep.bottom
+        anchors.topMargin: Style.current.smallPadding
+        showCheckbox: true
+    }
+}

ui/app/AppLayouts/Chat/CommunityComponents/CommunityProfilePopupMembersList.qml

@@ -21,7 +21,7 @@ Item {
         width: parent.width
         type: globalSettings.theme === Universal.Dark ? "secondary" : "primary"
         iconName: "invite"
-        onClicked: openPopup(inviteFriendsToCommunityPopup)
+        onClicked: stack.push(inviteFriendsView)
     }
 
     Separator {

ui/app/AppLayouts/Chat/CommunityComponents/InviteFriendsToCommunityPopup.qml

@@ -15,13 +15,13 @@ ModalPopup {
     property var goBack
 
     onOpened: {
-        contactFieldAndList.chatKey.text = ""
+        contactFieldAndList.contactListSearch.chatKey.text = ""
-        contactFieldAndList.pubKey = ""
+        contactFieldAndList.contactListSearch.pubKey = ""
-        contactFieldAndList.pubKeys = []
+        contactFieldAndList.contactListSearch.pubKeys = []
-        contactFieldAndList.ensUsername = ""
+        contactFieldAndList.contactListSearch.ensUsername = ""
-        contactFieldAndList.chatKey.forceActiveFocus(Qt.MouseFocusReason)
+        contactFieldAndList.contactListSearch.chatKey.forceActiveFocus(Qt.MouseFocusReason)
-        contactFieldAndList.existingContacts.visible = profileModel.contacts.list.hasAddedContacts()
+        contactFieldAndList.contactListSearch.existingContacts.visible = profileModel.contacts.list.hasAddedContacts()
-        contactFieldAndList.noContactsRect.visible = !contactFieldAndList.existingContacts.visible
+        contactFieldAndList.contactListSearch.noContactsRect.visible = !contactFieldAndList.contactListSearch.existingContacts.visible
     }
 
     //% "Invite friends"
@@ -29,51 +29,15 @@ ModalPopup {
 
     height: 630
 
-    function sendInvites(pubKeys) {
+    CommunityProfilePopupInviteFriendsView {
-        const error = chatsModel.communities.inviteUsersToCommunityById(popup.communityId, JSON.stringify(pubKeys))
-        if (error) {
-            console.error('Error inviting', error)
-            contactFieldAndList.validationError = error
-            return
-        }
-        contactFieldAndList.successMessage = qsTr("Invite successfully sent")
-    }
-
-    Item {
-        anchors.fill: parent
-
-        TextWithLabel {
-            id: shareCommunity
-            anchors.top: parent.top
-            //% "Share community"
-            label: qsTrId("share-community")
-            text: `${Constants.communityLinkPrefix}${communityId.substring(0, 4)}...${communityId.substring(communityId.length -2)}`
-            textToCopy: Constants.communityLinkPrefix + communityId
-        }
-
-        Separator {
-            id: sep
-            anchors.left: parent.left
-            anchors.right: parent.right
-            anchors.top: shareCommunity.bottom
-            anchors.topMargin: Style.current.smallPadding
-            anchors.leftMargin: -Style.current.padding
-            anchors.rightMargin: -Style.current.padding
-        }
-
-        ContactsListAndSearch {
         id: contactFieldAndList
-            anchors.top: sep.bottom
+        anchors.fill: parent
-            anchors.topMargin: Style.current.smallPadding
+        contactListSearch.onUserClicked: {
-            anchors.bottom: parent.bottom
-            showCheckbox: true
-            onUserClicked: function (isContact, pubKey, ensName) {
             if (isContact) {
                 // those are just added to the list to by added by the bunch
                 return
             }
-                sendInvites([pubKey])
+            contactFieldAndList.sendInvites([pubKey])
-            }
         }
     }
 
@@ -99,11 +63,11 @@ ModalPopup {
             id: inviteBtn
             anchors.bottom: parent.bottom
             anchors.right: parent.right
-            enabled: contactFieldAndList.pubKeys.length > 0
+            enabled: contactFieldAndList.contactListSearch.pubKeys.length > 0
             //% "Invite"
             text: qsTrId("invite-button")
             onClicked : {
-                sendInvites(contactFieldAndList.pubKeys)
+                contactFieldAndList.sendInvites(contactFieldAndList.contactListSearch.pubKeys)
             }
         }
     }