feat: show community context menu on Community button

src/app/chat/views/communities.nim

@@ -273,18 +273,21 @@ QtObject:
       error "Error inviting to the community", msg = e.msg
       result = fmt"Error inviting to the community: {e.msg}"
 
-  proc inviteUsersToCommunity*(self: CommunitiesView, pubKeysJSON: string): string {.slot.} =
+  proc inviteUsersToCommunityById*(self: CommunitiesView, communityId: string, pubKeysJSON: string): string {.slot.} =
     try:
       let pubKeysParsed = pubKeysJSON.parseJson
       var pubKeys: seq[string] = @[]
       for pubKey in pubKeysParsed:
         pubKeys.add(pubKey.getStr)
 
-      self.status.chat.inviteUsersToCommunity(self.activeCommunity.id(), pubKeys)
+      self.status.chat.inviteUsersToCommunity(communityId, pubKeys)
     except Exception as e:
       error "Error inviting to the community", msg = e.msg
       result = fmt"Error inviting to the community: {e.msg}"
 
+  proc inviteUsersToCommunity*(self: CommunitiesView, pubKeysJSON: string): string {.slot.} =
+    self.inviteUsersToCommunityById(self.activeCommunity.id(), pubKeysJSON)
+
   proc exportComumnity*(self: CommunitiesView): string {.slot.} =
     try:
       result = self.status.chat.exportCommunity(self.activeCommunity.communityItem.id)

ui/app/AppLayouts/Chat/ChatLayout.qml

@@ -27,36 +27,6 @@ SplitView {
         chatColumn.onActivated()
     }
 
-    function openPopup(popupComponent, params = {}) {
-        const popup = popupComponent.createObject(chatView, params);
-        popup.open()
-        return popup
-    }
-
-    function getContactListObject(dataModel) {
-        const nbContacts = profileModel.contacts.list.rowCount()
-        const contacts = []
-        let contact
-        for (let i = 0; i < nbContacts; i++) {
-            contact = {
-                name: profileModel.contacts.list.rowData(i, "name"),
-                localNickname: profileModel.contacts.list.rowData(i, "localNickname"),
-                pubKey: profileModel.contacts.list.rowData(i, "pubKey"),
-                address: profileModel.contacts.list.rowData(i, "address"),
-                identicon: profileModel.contacts.list.rowData(i, "identicon"),
-                thumbnailImage: profileModel.contacts.list.rowData(i, "thumbnailImage"),
-                isUser: false,
-                isContact: profileModel.contacts.list.rowData(i, "isContact") !== "false"
-            }
-
-            contacts.push(contact)
-            if (dataModel) {
-                dataModel.append(contact);
-            }
-        }
-        return contacts
-    }
-
     Connections {
         target: appMain
         onSettingsLoaded: {

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

@@ -58,4 +58,18 @@ StatusIconTabButton {
             text: unviewedMessagesCount > 99 ? "99+" : unviewedMessagesCount
         }
     }
+
+    MouseArea {
+        anchors.fill: parent
+        cursorShape: Qt.PointingHandCursor
+        acceptedButtons: Qt.LeftButton | Qt.RightButton
+        onClicked: function (mouse) {
+            if (mouse.button === Qt.RightButton) {
+                commnunityMenu.communityId = communityButton.communityId
+                commnunityMenu.popup()
+                return
+            }
+            communityButton.clicked()
+        }
+    }
 }

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

@@ -23,4 +23,50 @@ ListView {
         iconColor: model.communityColor
         useLetterIdenticon: model.thumbnailImage === ""
     }
+
+    PopupMenu {
+        property string communityId
+
+        onAboutToShow: {
+            chatsModel.communities.setObservedCommunity(commnunityMenu.communityId)
+        }
+
+        id: commnunityMenu
+        Action {
+            text: qsTr("Invite People")
+            enabled: chatsModel.communities.observedCommunity.canManageUsers
+            icon.source: "../../../img/export.svg"
+            icon.width: 20
+            icon.height: 20
+            onTriggered: openPopup(inviteFriendsToCommunityPopup, {communityId: commnunityMenu.communityId})
+        }
+        Action {
+            text: qsTr("View Community")
+            icon.source: "../../../img/group.svg"
+            icon.width: 20
+            icon.height: 20
+            onTriggered: openPopup(communityMembersPopup, {community: chatsModel.communities.observedCommunity})
+        }
+        Separator  {
+            height: 10
+        }
+        Action {
+            text: qsTr("Edit Community")
+            // TODO reenable this option once the edit feature is done
+            enabled: false//chatsModel.communities.observedCommunity.admin
+            icon.source: "../../../img/edit.svg"
+            icon.width: 20
+            icon.height: 20
+            onTriggered: openPopup(editCommunityPopup, {community: chatsModel.communities.observedCommunity})
+        }
+        Action {
+            text: qsTr("Leave Community")
+            icon.source: "../../../img/edit.svg"
+            icon.width: 20
+            icon.height: 20
+            onTriggered: {
+                chatsModel.communities.leaveCommunity(commnunityMenu.communityId)
+            }
+        }
+    }
 }

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

@@ -54,15 +54,7 @@ ModalPopup {
         label: qsTrId("invite-people")
         width: parent.width
         iconName: "invite"
-        onClicked: openPopup(inviteFriendsPopup)
+        onClicked: openPopup(inviteFriendsToCommunityPopup)
-        Component {
-            id: inviteFriendsPopup
-            InviteFriendsToCommunityPopup {
-                onClosed: {
-                    destroy()
-                }
-            }
-        }
     }
 
     Separator {

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

@@ -11,7 +11,7 @@ Item {
     property string headerTitle: ""
     property string headerDescription: ""
     property string headerImageSource: ""
-    height: childrenRect.height
+    height: 300
 
     CommunityPopupButton {
         id: inviteBtn
@@ -19,15 +19,7 @@ Item {
         label: qsTrId("invite-people")
         width: parent.width
         iconName: "invite"
-        onClicked: openPopup(inviteFriendsPopup)
+        onClicked: openPopup(inviteFriendsToCommunityPopup)
-        Component {
-            id: inviteFriendsPopup
-            InviteFriendsToCommunityPopup {
-                onClosed: {
-                    destroy()
-                }
-            }
-        }
     }
 
     Separator {
@@ -40,7 +32,6 @@ Item {
         anchors.rightMargin: -Style.current.padding
     }
 
-
     StatusSettingsLineButton {
         id: membershipRequestsBtn
         text: qsTr("Membership requests")

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

@@ -71,14 +71,8 @@ Item {
                     label: qsTr("Members")
                     iconName: "members"
                     txtColor: Style.current.textColor
-                    //onClicked: openPopup(communityMembersPopup)
                     onClicked: stack.push(membersList)
 
-                    Component {
-                        id: communityMembersPopup
-                        CommunityMembersPopup {}
-                    }
-
                     Item {
                         property int nbRequests: chatsModel.communities.activeCommunity.communityMembershipRequests.nbRequests
 
@@ -213,13 +207,6 @@ Item {
                 label: qsTrId("edit-community")
                 iconName: "edit"
                 onClicked: openPopup(editCommunityPopup)
-
-                Component {
-                    id: editCommunityPopup
-                    CreateCommunityPopup {
-                        isEdit: true
-                    }
-                }
             }
         }
 

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

@@ -17,15 +17,6 @@ Rectangle {
     radius: 16
     color: Style.current.transparent
 
-    Component {
-        id: inviteFriendsPopup
-        InviteFriendsToCommunityPopup {
-            onClosed: {
-                destroy()
-            }
-        }
-    }
-
     SVGImage {
         anchors.top: parent.top
         anchors.topMargin: -6
@@ -75,9 +66,7 @@ Rectangle {
         anchors.horizontalCenter: parent.horizontalCenter
         anchors.bottom: manageBtn.top
         anchors.bottomMargin: Style.current.halfPadding
-        onClicked: {
+        onClicked: openPopup(inviteFriendsToCommunityPopup)
-            openPopup(inviteFriendsPopup)
-        }
     }
 
     StatusButton {

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

@@ -20,7 +20,7 @@ ModalPopup {
         inviteBtn.enabled = false
         contactList.membersData.clear();
         // TODO remove friends that are already members
-        chatView.getContactListObject(contactList.membersData)
+        getContactListObject(contactList.membersData)
         noContactsRect.visible = !profileModel.contacts.list.hasAddedContacts();
         contactList.visible = !noContactsRect.visible;
     }
@@ -114,7 +114,7 @@ ModalPopup {
             //% "Invite"
             text: qsTrId("invite-button")
             onClicked : {
-                const error = chatsModel.communities.inviteUsersToCommunity(JSON.stringify(popup.pubKeys))
+                const error = chatsModel.communities.inviteUsersToCommunityById(popup.communityId, JSON.stringify(popup.pubKeys))
                 // TODO show error to user also should we show success?
                 if (error) {
                     console.error('Error inviting', error)

ui/app/AppLayouts/Chat/components/GroupChatPopup.qml

@@ -25,7 +25,7 @@ ModalPopup {
 
         contactList.membersData.clear();
 
-        chatView.getContactListObject(contactList.membersData)
+        getContactListObject(contactList.membersData)
 
         contactList.membersData.append({
             //% "(You)"

ui/app/AppLayouts/Chat/components/GroupInfoPopup.qml

@@ -22,7 +22,7 @@ ModalPopup {
         currMemberCount = memberCount;
         contactList.membersData.clear();
 
-        const contacts = chatView.getContactListObject()
+        const contacts = getContactListObject()
 
         contacts.forEach(function (contact) {
             if(popup.channel.contains(contact.pubKey) ||

ui/app/AppLayouts/Chat/components/NoFriendsRectangle.qml

@@ -11,7 +11,7 @@ Item {
     StyledText {
         id: noContacts
         text: noContactsRect.text
-        color: Style.current.darkGrey
+        color: Style.current.secondaryText
         anchors.top: parent.top
         anchors.topMargin: Style.current.padding
         anchors.left: parent.left

ui/app/AppMain.qml

@@ -49,6 +49,30 @@ RowLayout {
         return popup
     }
 
+    function getContactListObject(dataModel) {
+        const nbContacts = profileModel.contacts.list.rowCount()
+        const contacts = []
+        let contact
+        for (let i = 0; i < nbContacts; i++) {
+            contact = {
+                name: profileModel.contacts.list.rowData(i, "name"),
+                localNickname: profileModel.contacts.list.rowData(i, "localNickname"),
+                pubKey: profileModel.contacts.list.rowData(i, "pubKey"),
+                address: profileModel.contacts.list.rowData(i, "address"),
+                identicon: profileModel.contacts.list.rowData(i, "identicon"),
+                thumbnailImage: profileModel.contacts.list.rowData(i, "thumbnailImage"),
+                isUser: false,
+                isContact: profileModel.contacts.list.rowData(i, "isContact") !== "false"
+            }
+
+            contacts.push(contact)
+            if (dataModel) {
+                dataModel.append(contact);
+            }
+        }
+        return contacts
+    }
+
     function getUserNickname(pubKey) {
         // Get contact nickname
         const contactList = profileModel.contacts.list
@@ -226,6 +250,31 @@ RowLayout {
         }
     }
 
+    Component {
+        id: inviteFriendsToCommunityPopup
+        InviteFriendsToCommunityPopup {
+            onClosed: {
+                destroy()
+            }
+        }
+    }
+
+    Component {
+        id: communityMembersPopup
+        CommunityMembersPopup {
+            onClosed: {
+                destroy()
+            }
+        }
+    }
+
+    Component {
+        id: editCommunityPopup
+        CreateCommunityPopup {
+            isEdit: true
+        }
+    }
+
     ToastMessage {
         id: toastMessage
     }

ui/app/img/export.svg

@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.6666 7.16667C10.6666 7.44281 10.8921 7.6623 11.1645 7.7078C12.5844 7.94497 13.6666 9.17944 13.6666 10.6667C13.6666 12.3235 12.3234 13.6667 10.6666 13.6667H5.33325C3.6764 13.6667 2.33325 12.3235 2.33325 10.6667C2.33325 9.17944 3.41546 7.94497 4.83535 7.7078C5.10771 7.6623 5.33325 7.44281 5.33325 7.16667C5.33325 6.89052 5.10827 6.66339 4.83424 6.69749C2.86061 6.9431 1.33325 8.62652 1.33325 10.6667C1.33325 12.8758 3.12411 14.6667 5.33325 14.6667H10.6666C12.8757 14.6667 14.6666 12.8758 14.6666 10.6667C14.6666 8.62652 13.1392 6.9431 11.1656 6.69749C10.8916 6.66339 10.6666 6.89052 10.6666 7.16667Z" fill="#4360DF"/>
+<path d="M8.49992 4.01185C8.49992 3.71488 8.85897 3.56615 9.06895 3.77614L10.313 5.02022C10.5083 5.21548 10.8249 5.21548 11.0201 5.02022C11.2154 4.82496 11.2154 4.50838 11.0201 4.31311L8.35347 1.64645C8.15821 1.45118 7.84163 1.45118 7.64637 1.64645L4.9797 4.31311C4.78444 4.50838 4.78444 4.82496 4.9797 5.02022C5.17496 5.21548 5.49154 5.21548 5.68681 5.02022L6.93088 3.77614C7.14087 3.56615 7.49992 3.71488 7.49992 4.01185V10.6667C7.49992 10.9428 7.72378 11.1667 7.99992 11.1667C8.27606 11.1667 8.49992 10.9428 8.49992 10.6667V4.01185Z" fill="#4360DF"/>
+</svg>