Make user clickable and improve button cursor look

resources/qml/ImageButton.qml

@@ -0,0 +1,34 @@
+import QtQuick 2.3
+import QtQuick.Controls 2.3
+import QtGraphicalEffects 1.0
+
+Button {
+	property alias image: buttonImg.source
+
+	id: button
+
+	flat: true
+
+	// disable background, because we don't want a border on hover
+	background: Item {
+	}
+
+	Image {
+		id: buttonImg
+		// Workaround, can't get icon.source working for now...
+		anchors.fill: parent
+	}
+	ColorOverlay {
+		anchors.fill: buttonImg
+		source: buttonImg
+		color: button.hovered ? colors.highlight : colors.buttonText
+	}
+
+	MouseArea
+	{
+		id: mouseArea
+		anchors.fill: parent
+		onPressed:  mouse.accepted = false
+		cursorShape: Qt.PointingHandCursor
+	}
+}

resources/qml/TimelineRow.qml

@@ -1,7 +1,6 @@
 import QtQuick 2.6
 import QtQuick.Controls 2.3
 import QtQuick.Layouts 1.2
-import QtGraphicalEffects 1.0
 import QtQuick.Window 2.2
 
 import com.github.nheko 1.0
@@ -35,64 +34,32 @@ RowLayout {
 		Layout.preferredHeight: 16
 	}
 
-	Button {
+	ImageButton {
 		Layout.alignment: Qt.AlignRight | Qt.AlignTop
-		id: replyButton
-		flat: true
 		Layout.preferredHeight: 16
+		id: replyButton
 
+		image: "qrc:/icons/icons/ui/mail-reply.png"
 		ToolTip {
 			visible: replyButton.hovered
 			text: qsTr("Reply")
 			palette: colors
 		}
 
-		// disable background, because we don't want a border on hover
-		background: Item {
-		}
-
-		Image {
-			id: replyButtonImg
-			// Workaround, can't get icon.source working for now...
-			anchors.fill: parent
-			source: "qrc:/icons/icons/ui/mail-reply.png"
-		}
-		ColorOverlay {
-			anchors.fill: replyButtonImg
-			source: replyButtonImg
-			color: replyButton.hovered ? colors.highlight : colors.buttonText
-		}
-
 		onClicked: view.model.replyAction(model.id)
 	}
-	Button {
+	ImageButton {
 		Layout.alignment: Qt.AlignRight | Qt.AlignTop
-		id: optionsButton
-		flat: true
 		Layout.preferredHeight: 16
+		id: optionsButton
 
+		image: "qrc:/icons/icons/ui/vertical-ellipsis.png"
 		ToolTip {
 			visible: optionsButton.hovered
 			text: qsTr("Options")
 			palette: colors
 		}
 
-		// disable background, because we don't want a border on hover
-		background: Item {
-		}
-
-		Image {
-			id: optionsButtonImg
-			// Workaround, can't get icon.source working for now...
-			anchors.fill: parent
-			source: "qrc:/icons/icons/ui/vertical-ellipsis.png"
-		}
-		ColorOverlay {
-			anchors.fill: optionsButtonImg
-			source: optionsButtonImg
-			color: optionsButton.hovered ? colors.highlight : colors.buttonText
-		}
-
 		onClicked: contextMenu.open()
 
 		Menu {

resources/qml/TimelineView.qml

@@ -135,6 +135,12 @@ Rectangle {
 						height: avatarSize
 						url: chat.model.avatarUrl(section.split(" ")[0]).replace("mxc://", "image://MxcImage/")
 						displayName: chat.model.displayName(section.split(" ")[0])
+
+						MouseArea {
+							anchors.fill: parent
+							onClicked: chat.model.openUserProfile(section.split(" ")[0])
+							cursorShape: Qt.PointingHandCursor
+						}
 					}
 
 					Text { 
@@ -142,6 +148,12 @@ Rectangle {
 						text: chat.model.escapeEmoji(chat.model.displayName(section.split(" ")[0]))
 						color: chat.model.userColor(section.split(" ")[0], colors.window)
 						textFormat: Text.RichText
+
+						MouseArea {
+							anchors.fill: parent
+							onClicked: chat.model.openUserProfile(section.split(" ")[0])
+							cursorShape: Qt.PointingHandCursor
+						}
 					}
 				}
 			}

resources/res.qrc

@@ -117,6 +117,7 @@
     <qresource prefix="/">
         <file>qml/TimelineView.qml</file>
         <file>qml/Avatar.qml</file>
+        <file>qml/ImageButton.qml</file>
         <file>qml/StatusIndicator.qml</file>
         <file>qml/EncryptionIndicator.qml</file>
         <file>qml/TimelineRow.qml</file>

src/timeline2/TimelineModel.cpp

@@ -713,6 +713,13 @@ TimelineModel::viewRawMessage(QString id) const
         Q_UNUSED(dialog);
 }
 
+void
+
+TimelineModel::openUserProfile(QString userid) const
+{
+        MainWindow::instance()->openUserProfile(userid, room_id_);
+}
+
 DecryptionResult
 TimelineModel::decryptEvent(const mtx::events::EncryptedEvent<mtx::events::msg::Encrypted> &e) const
 {

src/timeline2/TimelineModel.h

@@ -152,6 +152,7 @@ public:
 
         Q_INVOKABLE QString escapeEmoji(QString str) const;
         Q_INVOKABLE void viewRawMessage(QString id) const;
+        Q_INVOKABLE void openUserProfile(QString userid) const;
         Q_INVOKABLE void replyAction(QString id);
         Q_INVOKABLE void readReceiptsAction(QString id) const;
         Q_INVOKABLE void redactEvent(QString id);