ui/qml/widgets/ContactRow.qml

import QtGraphicalEffects 1.0
import QtQuick 2.7
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.0
import QtQuick.Layouts 1.3
import CustomQmlTypes 1.0

Item { // LOTS OF NESTING TO DEAL WITH QT WEIRDNESS, SORRY
	anchors.left: parent.left
	anchors.right: parent.right
	visible: !deleted
	height: 48 * logscale + 3
	implicitHeight: height

	property real logscale: 4 * Math.log10(gcd.themeScale + 1)
	property alias displayName: cn.text
	property alias image: imgProfile.source
	property string handle
	property int badge
	property bool isActive
	property bool isHover
	property bool trusted
	property bool deleted
	property alias status: imgProfile.status
	property string server
	property bool background: true


	Rectangle { // CONTACT ENTRY BACKGROUND COLOR
		id: crRect
		anchors.left: parent.left
		anchors.right: parent.right
		height: 48 * logscale + 3
		width: parent.width
		color: background ? (isHover ? "#D2D2F3" : (isActive ? "#D2D2F3" : "#D2C0DD")) :  windowItem.cwtch_background_color

        ContactPicture {
            id: imgProfile
            showStatus: true
        }

        Label { // CONTACT NAME
            id: cn
            leftPadding: 10
            rightPadding: 10
            //wrapMode: Text.WordWrap
            anchors.left: imgProfile.right
            anchors.right: rectUnread.left
            anchors.verticalCenter: parent.verticalCenter
            font.pixelSize: 16 * gcd.themeScale
            font.italic: !trusted
            textFormat: Text.PlainText
            //fontSizeMode: Text.HorizontalFit
            elide: Text.ElideRight
            color: "#000000"
        }

        Rectangle { // UNREAD MESSAGES?
            id: rectUnread
            height: txtmetric.tightBoundingRect.height + 8 * gcd.themeScale
            width: txtmetric.tightBoundingRect.width + 8 * gcd.themeScale
            radius: 8 * gcd.themeScale
            color: "#4B3557"
            visible: badge != 0
            anchors.verticalCenter: parent.verticalCenter
            anchors.right: parent.right
            anchors.rightMargin: 9 * gcd.themeScale

            Label {
                id: lblUnread
                anchors.verticalCenter: parent.verticalCenter
                anchors.horizontalCenter: parent.horizontalCenter
                color: "#FFFFFF"
                font.pixelSize: 12 * gcd.themeScale
                text: txtmetric.text
            }

            TextMetrics {
                id: txtmetric
                text: badge
                font: lblUnread.font
            }
        }
	}

	MouseArea {  // ONCLICK: LOAD CONVERSATION WITH THIS CONTACT
		anchors.fill: parent
		hoverEnabled: true

		onClicked: {
			gcd.broadcast("ResetMessagePane")
			isActive = true
			theStack.pane = theStack.messagePane
			gcd.loadMessagesPane(handle)
			if (handle.length == 32) {
				gcd.requestGroupSettings(handle)
			}
		}

		onEntered: {
			isHover = true
		}

		onExited: {
			isHover = false
		}
	}

	Connections { // UPDATE UNREAD MESSAGES COUNTER
		target: gcd

		onResetMessagePane: function() {
			isActive = false
		}

		onUpdateContact: function(_handle, _displayName, _image, _server, _badge, _status, _trusted) {
			if (handle == _handle) {
				displayName = _displayName
				image = _image
				server = _server
				badge = _badge
				status = _status
				trusted = _trusted
			}
		}
	}
}