From 2f1b3519d38c99ded45c1a9d9e86f5d4dd961238 Mon Sep 17 00:00:00 2001
From: Nicolas Werner <nicolas.werner@hotmail.de>
Date: Sat, 27 May 2023 03:10:02 +0200
Subject: [PATCH] Render custom reactions

---
 resources/qml/Reactions.qml | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/resources/qml/Reactions.qml b/resources/qml/Reactions.qml
index 5b81d49c..cce8720a 100644
--- a/resources/qml/Reactions.qml
+++ b/resources/qml/Reactions.qml
@@ -26,8 +26,6 @@ Flow {
             id: reaction
 
             hoverEnabled: true
-            implicitWidth: contentItem.childrenRect.width + contentItem.leftPadding * 2
-            implicitHeight: contentItem.childrenRect.height
             ToolTip.visible: hovered
             ToolTip.delay: Nheko.tooltipDelay
             onClicked: {
@@ -42,12 +40,11 @@ Flow {
                     return modelData.displayKey + "\n" + modelData.users;
                 })
             }
+                leftPadding: textMetrics.height / 2
+                rightPadding: textMetrics.height / 2
 
             contentItem: Row {
-                anchors.centerIn: parent
-                spacing: reactionText.implicitHeight / 4
-                leftPadding: reactionText.implicitHeight / 2
-                rightPadding: reactionText.implicitHeight / 2
+                spacing: textMetrics.height / 4
 
                 TextMetrics {
                     id: textMetrics
@@ -74,6 +71,15 @@ Flow {
                     font.family: Settings.emojiFont
                     color: (reaction.hovered || modelData.selfReactedEvent !== '') ? Nheko.colors.highlightedText: Nheko.colors.text
                     maximumLineCount: 1
+                    visible: !modelData.key.startsWith("mxc://")
+                }
+                Image {
+                    anchors.verticalCenter: divider.verticalCenter
+                    height: textMetrics.height
+                    width: textMetrics.height
+                    source: modelData.key.startsWith("mxc://") ? (modelData.key.replace("mxc://", "image://MxcImage/") + "?scale") : ""
+                    visible: modelData.key.startsWith("mxc://")
+                    fillMode: Image.PreserveAspectFit
                 }
 
                 Rectangle {