From 61e74ac096e54c58f63953c7440359fae8d9fbaf Mon Sep 17 00:00:00 2001
From: Keyitdev <70140437+Keyitdev@users.noreply.github.com>
Date: Wed, 8 Jul 2026 23:13:43 +0200
Subject: [PATCH] Update: Added partial profile picture support.

---
 Components/Input.qml          | 17 ++++++++++-
 Components/LoginForm.qml      | 10 +++++-
 Components/ProfilePicture.qml | 57 +++++++++++++++++++++++++++++++++++
 3 files changed, 82 insertions(+), 2 deletions(-)
 create mode 100644 Components/ProfilePicture.qml

diff --git a/Components/Input.qml b/Components/Input.qml
index 28d8c51..0e2f2f0 100644
--- a/Components/Input.qml
+++ b/Components/Input.qml
@@ -15,6 +15,21 @@ Column {
     property ComboBox exposeSession: sessionSelect.exposeSession
     property bool failed
 
+    // Custom addition: exposes the face icon of the currently typed/selected
+    // user so it can be shown in ProfilePicture, above the login field
+    property url currentUserIcon: {
+        var typedUser = username.text
+        for (var i = 0; i < userRegistry.list.length; i++) {
+            var u = userRegistry.list[i]
+            if (typedUser === "") {
+                if (i === selectUser.currentIndex) return u.icon || ""
+            } else if (typedUser === u.realName || typedUser === u.name) {
+                return u.icon || ""
+            }
+        }
+        return ""
+    }
+
     function triggerLogin() {
         var typedUser = username.text
         var targetUser = typedUser
@@ -548,7 +563,7 @@ Column {
             Item {
                 Component.onCompleted: {
                     var currentList = userRegistry.list
-                    currentList.push({ "name": model.name, "realName": model.realName || "" })
+                    currentList.push({ "name": model.name, "realName": model.realName || "", "icon": model.icon || "" })
                     userRegistry.list = currentList
                 }
             }
diff --git a/Components/LoginForm.qml b/Components/LoginForm.qml
index 7c6f4eb..c19f958 100644
--- a/Components/LoginForm.qml
+++ b/Components/LoginForm.qml
@@ -16,13 +16,21 @@ ColumnLayout {
 
     Clock {
         id: clock
-
         Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
         // important
         Layout.preferredHeight: root.height / 3
         Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
     }
 
+    ProfilePicture {
+        id: profilePicture
+        visible: false
+        Layout.alignment: Qt.AlignHCenter
+        Layout.preferredWidth: root.height / 7
+        Layout.preferredHeight: root.height / 7
+        Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
+    }
+
     Input {
         id: input
 
diff --git a/Components/ProfilePicture.qml b/Components/ProfilePicture.qml
new file mode 100644
index 0000000..4db4b45
--- /dev/null
+++ b/Components/ProfilePicture.qml
@@ -0,0 +1,57 @@
+import QtQuick
+import QtQuick.Effects
+
+Item {
+    id: profilePicture
+    // visible: false
+    property url userIcon: input.currentUserIcon
+    property bool hasCustomIcon: userIcon != ""
+
+    Rectangle {
+        anchors.fill: avatarImage
+        radius: width / 2
+        color: config.LoginFieldBackgroundColor || "#000000"
+        opacity: 0.2
+        z: -1
+    }
+
+    Image {
+        id: avatarImage
+
+        anchors.fill: parent
+        anchors.margins: ringBorder.border.width
+        source: hasCustomIcon ? profilePicture.userIcon : Qt.resolvedUrl("../Assets/User.svg")
+        fillMode: hasCustomIcon ? Image.PreserveAspectCrop : Image.PreserveAspectFit
+        smooth: true
+        mipmap: true
+        asynchronous: true
+        visible: false
+
+    }
+
+    Rectangle {
+        id: circleMask
+
+        anchors.fill: avatarImage
+        radius: width / 2
+        visible: false
+        layer.enabled: true
+    }
+
+    MultiEffect {
+        anchors.fill: avatarImage
+        source: avatarImage
+        maskEnabled: true
+        maskSource: circleMask
+    }
+
+    Rectangle {
+        id: ringBorder
+
+        anchors.fill: parent
+        radius: width / 2
+        color: "transparent"
+        border.width: 3
+        border.color: config.DateTextColor || "#ffffff"
+    }
+}