Add avatar with status icon componant

Will be used later for 1-to-1 user room delegates and room members pane

harmonyqml/components/base/Avatar.qml

@@ -4,30 +4,30 @@ import QtQuick.Layouts 1.4
 
 Item {
     property bool invisible: false
-    property string username: "?"
+    property string name: "?"
     property var imageSource: null
     property int dimmension: 48
 
-    id: root
+    id: "root"
     width: dimmension
     height: invisible ? 1 : dimmension
 
     Rectangle {
-        id: letterRectangle
+        id: "letterRectangle"
         anchors.fill: parent
         visible: ! invisible && imageSource === null
-        color: Qt.hsla(Backend.hueFromString(username), 0.22, 0.5, 1)
+        color: Qt.hsla(Backend.hueFromString(name), 0.22, 0.5, 1)
 
         HLabel {
             anchors.centerIn: parent
-            text: username.charAt(0)
+            text: name.charAt(0)
             color: "white"
             font.pixelSize: letterRectangle.height / 1.4
         }
     }
 
     Image {
-        id: avatarImage
+        id: "avatarImage"
         anchors.fill: parent
         visible: ! invisible && imageSource !== null
 

harmonyqml/components/base/StatusAvatar.qml

@@ -0,0 +1,14 @@
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+import QtQuick.Layouts 1.4
+
+Avatar {
+    Image {
+        id: "status"
+        anchors.right: parent.right
+        anchors.bottom: parent.bottom
+        source: "../../icons/status.svg"
+        asynchronous: true
+        sourceSize.width: 12
+    }
+}

harmonyqml/components/chat/MessageDelegate.qml

@@ -56,7 +56,7 @@ Column {
         layoutDirection: isOwn ? Qt.RightToLeft : Qt.LeftToRight
         anchors.right: isOwn ? parent.right : undefined
 
-        Base.Avatar { id: avatar; invisible: combine; username: displayName }
+        Base.Avatar { id: avatar; invisible: combine; name: displayName }
 
         ColumnLayout {
             spacing: 0

harmonyqml/components/chat/RoomHeader.qml

@@ -19,7 +19,7 @@ Rectangle {
             id: "avatar"
             Layout.alignment: Qt.AlignTop
             dimmension: root.Layout.minimumHeight
-            username: chatPage.room.display_name
+            name: chatPage.room.display_name
         }
 
         Base.HLabel {

harmonyqml/components/chat/SendBox.qml

@@ -20,7 +20,7 @@ Rectangle {
 
         Base.Avatar {
             id: "avatar"
-            username: chatPage.user.display_name
+            name: chatPage.user.display_name
             dimmension: root.Layout.minimumHeight
             //visible: textArea.text === ""
             visible: textArea.height <= root.Layout.minimumHeight

harmonyqml/components/side_pane/AccountDelegate.qml

@@ -12,7 +12,7 @@ ColumnLayout {
         id: "row"
         spacing: 0
 
-        Base.Avatar { id: "avatar"; username: display_name; dimmension: 36 }
+        Base.Avatar { id: "avatar"; name: display_name; dimmension: 36 }
 
         ColumnLayout {
             Layout.fillWidth: true

harmonyqml/components/side_pane/RoomDelegate.qml

@@ -18,7 +18,7 @@ MouseArea {
         id: row
         spacing: 1
 
-        Base.Avatar { id: avatar; username: display_name; dimmension: 36 }
+        Base.Avatar { id: avatar; name: display_name; dimmension: 36 }
 
         ColumnLayout {
             spacing: 0

harmonyqml/icons/status.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><circle cx="12" cy="12" r="12"/></svg>