refactor: make use of StatusContextMenuButton

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

@@ -69,38 +69,12 @@ Rectangle {
     }
 
 
-    Rectangle {
-        id: moreActionsBtnContainer
-        width: 40
-        height: 40
-        radius: Style.current.radius
-        color: Style.current.transparent
+    StatusContextMenuButton {
+        id: moreActionsBtn
         anchors.verticalCenter: parent.verticalCenter
         anchors.right: parent.right
         anchors.rightMargin: Style.current.smallPadding
 
-        StyledText {
-            id: moreActionsBtn
-            text: "..."
-            font.letterSpacing: 0.5
-            font.bold: true
-            lineHeight: 1.4
-            anchors.verticalCenter: parent.verticalCenter
-            anchors.horizontalCenter: parent.horizontalCenter
-            font.pixelSize: 25
-        }
-
-        MouseArea {
-            id: mouseArea
-            anchors.fill: parent
-            hoverEnabled: true
-            onEntered: {
-                parent.color = Style.current.border
-            }
-            onExited: {
-                parent.color = Style.current.transparent
-            }
-
         onClicked: {
             var menu = chatContextMenu;
             var isPrivateGroupChat = chatsModel.activeChannel.chatType === Constants.chatTypePrivateGroupChat
@@ -120,9 +94,6 @@ Rectangle {
                               moreActionsBtn.height - 4)
             }
         }
-            cursorShape: Qt.PointingHandCursor
-            acceptedButtons: Qt.LeftButton | Qt.RightButton
-
 
         ChannelContextMenu {
             id: chatContextMenu
@@ -165,7 +136,6 @@ Rectangle {
             }
         }
     }
-    }
 
     ConfirmationDialog {
         id: deleteChatConfirmationDialog

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()