fix(communities): Right click inside the community pane does not open context menu

Fixes: #2547

ui/app/AppLayouts/Chat/CommunityColumn.qml

@@ -41,47 +41,20 @@ Rectangle {
         TransferOwnershipPopup {}
     }
 
-    Item {
+    CommunityProfilePopup {
-        id: communityHeader
+        id: communityProfilePopup
-        width: parent.width
+        communityId: chatsModel.communities.activeCommunity.id
-        height: communityHeaderButton.height
+        name: chatsModel.communities.activeCommunity.name
-        anchors.left: parent.left
+        description: chatsModel.communities.activeCommunity.description
-        anchors.leftMargin: 12
+        access: chatsModel.communities.activeCommunity.access
-        anchors.top: parent.top
+        nbMembers: chatsModel.communities.activeCommunity.nbMembers
-        anchors.topMargin: Style.current.padding
+        isAdmin: chatsModel.communities.activeCommunity.admin
-
+        source: chatsModel.communities.activeCommunity.thumbnailImage
-        CommunityHeaderButton {
+        communityColor: chatsModel.communities.activeCommunity.communityColor
-            id: communityHeaderButton
-            anchors.left: parent.left
-            anchors.top: parent.top
-            anchors.topMargin: -4
-            width: parent.width - optionsBtn.width - optionsBtn.anchors.rightMargin
-        }
-
-        StatusRoundButton {
-            id: optionsBtn
-            pressedIconRotation: 45
-            icon.name: "plusSign"
-            size: "medium"
-            type: "secondary"
-            width: 36
-            height: 36
-            anchors.right: parent.right
-            anchors.rightMargin: Style.current.bigPadding
-            anchors.top: parent.top
-            anchors.topMargin: 8
-            visible: chatsModel.communities.activeCommunity.admin
-
-            onClicked: {
-                optionsBtn.state = "pressed"
-                let x = optionsBtn.iconX + optionsBtn.icon.width / 2 - optionsMenu.width / 2
-                optionsMenu.popup(x, optionsBtn.icon.height + 14)
     }
 
     PopupMenu {
         id: optionsMenu
-                x: optionsBtn.x + optionsBtn.width / 2 - optionsMenu.width / 2
-                y: optionsBtn.height
 
         Action {
             enabled: chatsModel.communities.activeCommunity.admin
@@ -117,6 +90,48 @@ Rectangle {
             optionsBtn.state = "default"
         }
     }
+
+    Item {
+        id: communityHeader
+        width: parent.width
+        height: communityHeaderButton.height
+        anchors.left: parent.left
+        anchors.leftMargin: 12
+        anchors.top: parent.top
+        anchors.topMargin: Style.current.padding
+
+        CommunityHeaderButton {
+            id: communityHeaderButton
+            anchors.left: parent.left
+            anchors.top: parent.top
+            anchors.topMargin: -4
+            width: parent.width - optionsBtn.width - optionsBtn.anchors.rightMargin
+        }
+
+        StatusRoundButton {
+            id: optionsBtn
+            pressedIconRotation: 45
+            icon.name: "plusSign"
+            size: "medium"
+            type: "secondary"
+            width: 36
+            height: 36
+            anchors.right: parent.right
+            anchors.rightMargin: Style.current.bigPadding
+            anchors.top: parent.top
+            anchors.topMargin: 8
+            visible: chatsModel.communities.activeCommunity.admin
+
+            onClicked: {
+                optionsBtn.state = "pressed"
+
+                let x = optionsBtn.iconX + optionsBtn.icon.width / 2 - optionsMenu.width / 2
+                let y = optionsBtn.height + 4
+
+                let point = optionsBtn.mapToItem(root, x, y)
+
+                optionsMenu.popup(point.x, point.y)
+            }
         }
     }
 
@@ -174,9 +189,31 @@ Rectangle {
         leftPadding: Style.current.halfPadding
         rightPadding: Style.current.halfPadding
         ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
-        contentHeight: categoryList.height + channelList.height + emptyViewAndSuggestionsLoader.height + backUpBannerLoader.height + 2 * Style.current.padding
+        contentHeight: categoryList.height
+                       + channelList.height
+                       + emptyViewAndSuggestionsLoader.height
+                       + backUpBannerLoader.height
+                       + 2 * Style.current.padding
         clip: true
 
+        background: Item {
+            anchors.fill: parent
+
+            MouseArea {
+                anchors.fill: parent
+                acceptedButtons: Qt.RightButton
+
+                onClicked: {
+                    let x = mouse.x + 4
+                    let y = mouse.y + 4
+
+                    let point = chatGroupsContainer.mapToItem(root, x, y)
+
+                    optionsMenu.popup(point.x, point.y)
+                }
+            }
+        }
+
         ChannelList {
             id: channelList
             searchStr: ""
@@ -212,18 +249,6 @@ Rectangle {
                 BackUpCommuntyBanner {}
             }
         }
-
-        CommunityProfilePopup {
-            id: communityProfilePopup
-            communityId: chatsModel.communities.activeCommunity.id
-            name: chatsModel.communities.activeCommunity.name
-            description: chatsModel.communities.activeCommunity.description
-            access: chatsModel.communities.activeCommunity.access
-            nbMembers: chatsModel.communities.activeCommunity.nbMembers
-            isAdmin: chatsModel.communities.activeCommunity.admin
-            source: chatsModel.communities.activeCommunity.thumbnailImage
-            communityColor: chatsModel.communities.activeCommunity.communityColor
-        }
     }
 }
 

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

@@ -15,6 +15,16 @@ Rectangle {
     radius: 16
     color: Style.current.transparent
 
+    MouseArea {
+        anchors.fill: parent
+        acceptedButtons: Qt.RightButton
+        onClicked: {
+            /* Prevents sending events to the component beneath
+               if Right Mouse Button is clicked. */
+            mouse.accepted = false;
+        }
+    }
+
     Rectangle {
         width: 66
         height: 4

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

@@ -37,6 +37,16 @@ Column {
                 height: 40
                 width:  categoryListContent.width
 
+                MouseArea {
+                    anchors.fill: parent
+                    acceptedButtons: Qt.RightButton
+                    onClicked: {
+                        /* Prevents sending events to the component beneath
+                           if Right Mouse Button is clicked. */
+                        mouse.accepted = false;
+                    }
+                }
+
                 StyledText {
                     text: model.name
                     elide: Text.ElideRight

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

@@ -17,6 +17,16 @@ Rectangle {
     radius: 16
     color: Style.current.transparent
 
+    MouseArea {
+        anchors.fill: parent
+        acceptedButtons: Qt.RightButton
+        onClicked: {
+            /* Prevents sending events to the component beneath
+               if Right Mouse Button is clicked. */
+            mouse.accepted = false;
+        }
+    }
+
     SVGImage {
         anchors.top: parent.top
         anchors.topMargin: -6