refactor: make use of StatusContextMenuButton

ui/app/AppLayouts/Chat/ChatColumn/TopBar.qml

@@ -69,99 +69,69 @@ Rectangle {
     }
 
 
-    Rectangle {
+    StatusContextMenuButton {
-        id: moreActionsBtnContainer
+        id: moreActionsBtn
-        width: 40
-        height: 40
-        radius: Style.current.radius
-        color: Style.current.transparent
         anchors.verticalCenter: parent.verticalCenter
         anchors.right: parent.right
         anchors.rightMargin: Style.current.smallPadding
 
-        StyledText {
+        onClicked: {
-            id: moreActionsBtn
+            var menu = chatContextMenu;
-            text: "..."
+            var isPrivateGroupChat = chatsModel.activeChannel.chatType === Constants.chatTypePrivateGroupChat
-            font.letterSpacing: 0.5
+            if(isPrivateGroupChat){
-            font.bold: true
+                menu = groupContextMenu
-            lineHeight: 1.4
+            }
-            anchors.verticalCenter: parent.verticalCenter
+
-            anchors.horizontalCenter: parent.horizontalCenter
+            if (menu.opened) {
-            font.pixelSize: 25
+                return menu.close()
+            }
+
+            if (isPrivateGroupChat) {
+                menu.popup(moreActionsBtn.x, moreActionsBtn.height)
+            } else {
+                menu.openMenu(chatsModel.activeChannel, chatsModel.getActiveChannelIdx(),
+                              moreActionsBtn.x - chatContextMenu.width + moreActionsBtn.width + 4,
+                              moreActionsBtn.height - 4)
+            }
         }
 
-        MouseArea {
+        ChannelContextMenu {
-            id: mouseArea
+            id: chatContextMenu
-            anchors.fill: parent
+        }
-            hoverEnabled: true
+
-            onEntered: {
+        PopupMenu {
-                parent.color = Style.current.border
+            id: groupContextMenu
+            closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
+            Action {
+                icon.source: "../../../img/group_chat.svg"
+                icon.width: chatTopBarContent.iconSize
+                icon.height: chatTopBarContent.iconSize
+                //% "Group Information"
+                text: qsTrId("group-information")
+                onTriggered: openPopup(groupInfoPopupComponent, {channel: chatsModel.activeChannel})
             }
-            onExited: {
+            Action {
-                parent.color = Style.current.transparent
+                icon.source: "../../../img/close.svg"
+                icon.width: chatTopBarContent.iconSize
+                icon.height: chatTopBarContent.iconSize
+                //% "Clear History"
+                text: qsTrId("clear-history")
+                onTriggered: chatsModel.clearChatHistory(chatsModel.activeChannel.id)
             }
-
+            Action {
-            onClicked: {
+                icon.source: "../../../img/leave_chat.svg"
-                var menu = chatContextMenu;
+                icon.width: chatTopBarContent.iconSize
-                var isPrivateGroupChat = chatsModel.activeChannel.chatType === Constants.chatTypePrivateGroupChat
+                icon.height: chatTopBarContent.iconSize
-                if(isPrivateGroupChat){
+                //% "Leave group"
-                    menu = groupContextMenu
+                text: qsTrId("leave-group")
-                }
+                onTriggered: {
-
+                  //% "Leave group"
-                if (menu.opened) {
+                  deleteChatConfirmationDialog.title = qsTrId("leave-group")
-                    return menu.close()
+                  //% "Leave group"
-                }
+                  deleteChatConfirmationDialog.confirmButtonLabel = qsTrId("leave-group")
-
+                  //% "Are you sure you want to leave this chat?"
-                if (isPrivateGroupChat) {
+                  deleteChatConfirmationDialog.confirmationText = qsTrId("are-you-sure-you-want-to-leave-this-chat-")
-                    menu.popup(moreActionsBtn.x, moreActionsBtn.height)
+                  deleteChatConfirmationDialog.open()
-                } else {
-                    menu.openMenu(chatsModel.activeChannel, chatsModel.getActiveChannelIdx(),
-                                  moreActionsBtn.x - chatContextMenu.width + moreActionsBtn.width + 4,
-                                  moreActionsBtn.height - 4)
-                }
-            }
-            cursorShape: Qt.PointingHandCursor
-            acceptedButtons: Qt.LeftButton | Qt.RightButton
-
-
-            ChannelContextMenu {
-                id: chatContextMenu
-            }
-
-            PopupMenu {
-                id: groupContextMenu
-                closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
-                Action {
-                    icon.source: "../../../img/group_chat.svg"
-                    icon.width: chatTopBarContent.iconSize
-                    icon.height: chatTopBarContent.iconSize
-                    //% "Group Information"
-                    text: qsTrId("group-information")
-                    onTriggered: openPopup(groupInfoPopupComponent, {channel: chatsModel.activeChannel})
-                }
-                Action {
-                    icon.source: "../../../img/close.svg"
-                    icon.width: chatTopBarContent.iconSize
-                    icon.height: chatTopBarContent.iconSize
-                    //% "Clear History"
-                    text: qsTrId("clear-history")
-                    onTriggered: chatsModel.clearChatHistory(chatsModel.activeChannel.id)
-                }
-                Action {
-                    icon.source: "../../../img/leave_chat.svg"
-                    icon.width: chatTopBarContent.iconSize
-                    icon.height: chatTopBarContent.iconSize
-                    //% "Leave group"
-                    text: qsTrId("leave-group")
-                    onTriggered: {
-                      //% "Leave group"
-                      deleteChatConfirmationDialog.title = qsTrId("leave-group")
-                      //% "Leave group"
-                      deleteChatConfirmationDialog.confirmButtonLabel = qsTrId("leave-group")
-                      //% "Are you sure you want to leave this chat?"
-                      deleteChatConfirmationDialog.confirmationText = qsTrId("are-you-sure-you-want-to-leave-this-chat-")
-                      deleteChatConfirmationDialog.open()
-                    }
                 }
             }
         }

ui/app/AppLayouts/Profile/Sections/Contacts/Contact.qml

@@ -67,26 +67,12 @@ Rectangle {
         }
     }
 
-    Rectangle {
+    StatusContextMenuButton {
         property int iconSize: 14
-        property bool isHovered: false
-        readonly property color hoveredBg: Utils.setColorAlpha(Style.current.black, 0.1)
         id: menuButton
-        height: 32
-        width: 32
         anchors.verticalCenter: parent.verticalCenter
         anchors.right: parent.right
         anchors.rightMargin: Style.current.padding
-        radius: 8
-        color: isHovered ? hoveredBg : Style.current.transparent
-
-        SVGImage {
-            source: "../../../../img/dots-icon.svg"
-            width: 18
-            height: 4
-            anchors.horizontalCenter: parent.horizontalCenter
-            anchors.verticalCenter: parent.verticalCenter
-        }
 
         MouseArea {
             id: mouseArea
@@ -95,11 +81,11 @@ Rectangle {
             hoverEnabled: true
             onExited: {
                 container.isHovered = false
-                menuButton.isHovered = false
+                menuButton.highlighted = false
             }
             onEntered: {
                 container.isHovered = true
-                menuButton.isHovered = true
+                menuButton.highlighted = true
             }
             onClicked: {
               contactContextMenu.popup()