Add User Feedback when hovering over a contact in groups

qml/panes/OverlayPane.qml

@@ -13,6 +13,7 @@ ColumnLayout {
 	id: overlay
 	property string name
 	property bool accepted
+	property bool inGroup
 
 
 	StackToolbar {
@@ -143,12 +144,14 @@ ColumnLayout {
 
 		onResetMessagePane: function() {
 			 overlayStack.overlay = overlayStack.chatOverlay
+			 overlay.inGroup = false
 		}
 
         onSupplyGroupSettings: function(gid, name, server, invite, accepted, addrbooknames, addrbookaddrs) {
             console.log("Supplied " + gid + " " + name + "Accepted " + accepted)
             overlay.name = name
             overlay.accepted = accepted
+            overlay.inGroup = true
         }
     }
 }

qml/widgets/ContactPicture.qml

@@ -16,55 +16,66 @@ Item {
 	property int status
 	property bool isGroup
 	property bool showStatus
-
+	property bool highlight
 
 	Rectangle {
+		id: mainImage
 		width: 48
 		height: 48
-		color: "#FFFFFF"
+		color:  highlight ? windowItem.cwtch_dark_color: "#FFFFFF"
 		radius: width / 2
 
+		Rectangle {
+			width: highlight ? 44 : 48
+			height: highlight ? 44 : 48
+			color:  "#FFFFFF"
+			radius: width / 2
+			anchors.centerIn:parent
 
-		Image { // PROFILE IMAGE
-			id: img
-			anchors.fill: parent
-			fillMode: Image.PreserveAspectFit
-			visible: false
-		}
 
-		Image { // CIRCLE MASK
-			id: mask
-			fillMode: Image.PreserveAspectFit
-			visible: false
-			source: "qrc:/qml/images/extra/clipcircle.png"
-		}
+			Image { // PROFILE IMAGE
+				id: img
+				anchors.fill: parent
+				fillMode: Image.PreserveAspectFit
+				visible: false
+			}
+
+			Image { // CIRCLE MASK
+				id: mask
+				fillMode: Image.PreserveAspectFit
+				visible: false
+				source: "qrc:/qml/images/extra/clipcircle.png"
+			}
+
+			OpacityMask {
+				anchors.fill: img
+				source: img
+				maskSource: mask
+			}
 
-		OpacityMask {
-			anchors.fill: img
-			source: img
-			maskSource: mask
 		}
 
 		Rectangle { // PRESENCE INDICATOR
-			visible: showStatus
-			color: "#FFFFFF"
-			width: 8
-			height: 8
-			radius: 2
-			anchors.right: parent.right
-			anchors.bottom: parent.bottom
-			anchors.margins: 4
+					visible: showStatus
+					color: "#FFFFFF"
+					width: 8
+					height: 8
+					radius: 2
+					anchors.right: parent.right
+					anchors.bottom: parent.bottom
+					anchors.margins: 4
 
 
-			Rectangle { //-2:WtfCodeError,-1:Untrusted,0:Disconnected,1:Connecting,2:Connected,3:Authenticated,4:Failed,5:Killed
-				color: status == 3 ? "green" : status == -1 ? "blue" : status == 1 ? "orange" : status == 2 ? "orange" : "red"
-				width: 5
-				height: 5
-				radius: 2
-				anchors.right: parent.right
-				anchors.bottom: parent.bottom
-				anchors.margins: 1.5
-			}
-		}
+					Rectangle { //-2:WtfCodeError,-1:Untrusted,0:Disconnected,1:Connecting,2:Connected,3:Authenticated,4:Failed,5:Killed
+						color: status == 3 ? "green" : status == -1 ? "blue" : status == 1 ? "orange" : status == 2 ? "orange" : "red"
+						width: 5
+						height: 5
+						radius: 2
+						anchors.right: parent.right
+						anchors.bottom: parent.bottom
+						anchors.margins: 1.5
+					}
+				}
+
 	}
 }

qml/widgets/Message.qml

@@ -48,9 +48,17 @@ RowLayout {
 		handle: root.from
 		visible: !fromMe
 		showStatus: false
+		highlight: ima.containsMouse
+
+		ToolTip.visible: ima.containsMouse
+		ToolTip.text: qsTr("Click to DM")
 
 		MouseArea {
+			id: ima
 			anchors.fill: parent
+			hoverEnabled: overlay.inGroup
+
+
 			onClicked: {
 				gcd.broadcast("ResetMessagePane")
 				theStack.pane = theStack.messagePane